:root {
  --bg: #F7F6F2;
  --surface: #FFFFFF;
  --primary: #5D7E45;
  --primary-dark: #4F7038;
  --primary-soft: #EAF0DF;
  --primary-soft-pressed: #DCE7CB;
  --text: #20241F;
  --text-2: #61665E;
  --border: #DDDFD8;
  --info: #285A8F;
  --info-soft: #DCE7F5;
  --info-text: #1F3E63;
  --warning: #996900;
  --sun: #E8B33A;
  --cloud: #9AA0A6;
  --off: #F1EFEF;
  --card-edge: #EDEBE3;
  --track: #E4E2DC;
  --progress-fill: #7F9E65;
  --primary-ink: #35502A;
  --black: #000000;
  --transparent: transparent;

  --font-family: -apple-system, "SF Pro Text", "Inter", "Helvetica Neue", system-ui, sans-serif;
  --font-body: 16px;
  --font-caption: 15px;
  --font-section: 22px;
  --font-temperature: 36px;
  --font-status: 16px;
  --font-brand: 30px;
  --font-greeting: 26.5px;
  --font-weather: 16.5px;
  --font-card-title: 17.5px;
  --font-gate-title: 19px;
  --font-card-subtitle: 13.5px;
  --font-button-small: 14.5px;
  --font-shutter: 16.5px;
  --font-airzone: 16px;
  --font-room: 16px;
  --font-room-temperature: 24.5px;
  --degree-scale: .78em;
  --font-off: 19px;
  --font-routine: 17px;
  --font-nav: 12.5px;
  --font-detail-title: 29px;
  --font-detail-sub: 18.5px;
  --font-shutter-name: 17px;
  --font-shutter-sub: 13.5px;
  --font-global: 18.5px;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;
  --weight-extrabold: 800;
  --line-tight: 1;
  --line-normal: 1.2;
  --tracking-brand: -0.9px;
  --tracking-greeting: -0.6px;
  --tracking-gate: 0.2px;
  --tracking-gate-none: 0px;
  --tracking-climate: 0.25px;

  --space-0: 0px;
  --space-1: 1px;
  --space-2: 2px;
  --space-3: 3px;
  --space-4: 4px;
  --space-5: 5px;
  --space-6: 6px;
  --space-7: 7px;
  --space-8: 8px;
  --space-9: 9px;
  --space-10: 10px;
  --space-11: 11px;
  --space-12: 12px;
  --space-13: 13px;
  --space-14: 14px;
  --space-15: 15px;
  --space-16: 16px;
  --space-17: 17px;
  --space-18: 18px;
  --space-19: 19px;
  --space-20: 20px;
  --space-21: 21px;
  --space-22: 22px;
  --space-24: 24px;
  --space-26: 26px;
  --space-27: 27px;
  --space-28: 28px;
  --space-30: 30px;
  --space-31: 31px;
  --space-32: 32px;
  --space-33: 33px;
  --space-34: 34px;
  --space-35: 35px;
  --space-36: 36px;
  --space-38: 38px;
  --space-54: 54px;
  --space-92: 92px;
  --space-105: 105px;
  --space-126: 126px;
  --space-180: 180px;
  --space-40: 40px;
  --space-42: 42px;
  --space-44: 44px;
  --space-45: 45px;
  --space-46: 46px;
  --space-48: 48px;
  --space-57: 57px;
  --space-66: 66px;
  --space-67: 67px;
  --space-68: 68px;
  --space-70: 70px;
  --space-72: 72px;
  --space-90: 90px;
  --space-104: 104px;
  --space-108: 108px;
  --space-134: 134px;
  --space-148: 148px;
  --space-174: 174px;
  --screen-width: 390px;
  --screen-height: 844px;
  --content-height: 696px;
  --content-width: 358px;
  --position-brand: 4.7px;
  --position-greeting: 66.6px;
  --position-weather: 63px;
  --position-gate: 118px;
  --position-security: 188px;
  --position-shutters: 308.3px;
  --position-climate: 411.4px;
  --position-room-grid: 13.7px;
  --position-routines: 636.5px;
  --position-nav: 742px;
  --position-indicator: 128px;
  --full: 100%;
  --grid-column: 1fr;
  --columns-two: 2;
  --columns-four: 4;
  --grid-two: repeat(2, 174px);
  --grid-four: repeat(4, 1fr);
  --angle-quarter: 45deg;
  --angle-half: 90deg;
  --angle-reverse: 180deg;
  --negative-one: -1;

  --radius-none: 0px;
  --radius-indicator: 3px;
  --radius-chip: 10px;
  --radius-action: 12px;
  --radius-home: 13px;
  --radius-button: 14px;
  --radius-pill: 15px;
  --radius-room: 16px;
  --radius-card: 18px;
  --radius-weather: 20px;
  --radius-track: 6px;
  --position-detail-head: 12px;
  --position-back: 8px;
  --position-shutter-globals: 104px;
  --position-shutter-list: 179px;
  --position-clim-rooms: 120px;

  --stroke-thin: 1px;
  --stroke-icon: 1.6px;
  --stroke-control: 2px;
  --stroke-battery: 1.2px;
  --stroke-chevron: 1.6px;
  --scale-pressed: .985;
  --scale-busy: .55;
  --opacity-hidden: 0;
  --opacity-visible: 1;
  --progress: 0%;
  --line-height-tight-name: 1.15;
  --duration-move: 120ms;
  --duration-fast: 120ms;
  --shadow-soft: 0px 3px 10px rgba(32, 36, 31, .08);
  --shadow-card: 0px 3px 10px rgba(32, 36, 31, .09);

  /* ===== Écrans complémentaires (clim, inscription, pièces, scénarios, réglages) ===== */
  --font-wordmark: 22px;
  --tracking-wordmark: 7.6px;
  --font-logo-sub: 14px;
  --font-welcome-title: 35px;
  --font-welcome-sub: 15px;
  --line-welcome: 1.29;
  --line-welcome-sub: 1.7;
  --font-onb-title: 30px;
  --font-onb-sub: 15px;
  --font-field: 15.5px;
  --font-field-label: 12.5px;
  --font-field-value: 17px;
  --font-check: 15px;
  --font-step: 14px;
  --font-zone-tab: 15px;
  --font-gauge-label: 16px;
  --font-gauge-value: 55px;
  --font-ambient: 16px;
  --font-stepper: 23px;
  --font-mode: 14.5px;
  --font-zone-row: 16.5px;
  --font-zone-value: 15px;
  --font-tab-title: 28px;
  --font-search: 15.5px;
  --font-scenario: 17.5px;
  --font-scenario-sub: 13.5px;
  --font-scenario-btn: 14px;
  --font-group-label: 12px;
  --font-setting: 16.5px;
  --font-setting-sub: 13.5px;
  --font-badge: 12px;
  --font-sheet-title: 21px;
  --font-note: 13px;
  --font-toggle: 17px;

  --space-52: 52px;
  --space-58: 58px;
  --space-60: 60px;
  --space-62: 62px;
  --space-80: 80px;
  --space-160: 160px;
  --space-196: 196px;
  --space-208: 208px;
  --space-230: 230px;
  --space-300: 300px;
  --space-430: 430px;
  --space-620: 620px;

  --field-height: 48px;
  --field-height-tall: 56px;
  --button-height: 50px;
  --step-dot: 34px;
  --step-line: 63px;
  --gauge-size: 244px;
  --gauge-ring-size: 280px;
  --gauge-ring-top: -10px;
  --gauge-stroke: 9px;
  --toggle-width: 51px;
  --toggle-height: 31px;
  --toggle-knob: 27px;
  --stepper-size: 36px;
  --mode-height: 66px;
  --zone-row: 50px;
  --zone-tab: 34px;
  --sheet-handle: 4px;
  --logo-size: 46px;

  --radius-field: 14px;
  --radius-input: 12px;
  --radius-toggle: 16px;
  --radius-sheet: 24px;
  --radius-code: 9px;
  --radius-search: 12px;
  --radius-badge: 7px;
  --radius-zone: 12px;

  --warning-soft: #F6EFDD;
  --danger: #8C3A2B;
  --danger-soft: #F4E4DF;
  --dot-off: #B7BCB4;
  --overlay: rgba(32, 36, 31, .40);
  --shadow-sheet: 0px -10px 34px rgba(32, 36, 31, .16);
  --shadow-field: 0px 1px 2px rgba(32, 36, 31, .04);

  --hero-leaf-2: #A9B896;

  /* Fond photo des écrans d'authentification */
  --auth-photo-focus: 50% 55%;
  --auth-photo-focus-form: 58% 50%;
  --auth-veil-top: linear-gradient(to bottom, var(--bg) 0%, rgba(247, 246, 242, .94) 20%, rgba(247, 246, 242, .62) 38%, rgba(247, 246, 242, .18) 52%, rgba(247, 246, 242, 0) 62%);
  --auth-veil-bottom: linear-gradient(to top, rgba(26, 30, 22, .60) 0%, rgba(26, 30, 22, .44) 14%, rgba(26, 30, 22, .26) 28%, rgba(26, 30, 22, .08) 42%, rgba(26, 30, 22, 0) 55%);
  /* Écran Inscription : le formulaire reste sur un fond quasi opaque, la photo tient le haut de l'écran */
  --auth-veil-form-top: linear-gradient(to bottom, var(--bg) 0%, rgba(247, 246, 242, .97) 12%, rgba(247, 246, 242, .94) 30%, rgba(247, 246, 242, .72) 50%, rgba(247, 246, 242, .66) 100%);
  --auth-veil-form-bottom: linear-gradient(to top, rgba(26, 30, 22, .10) 0%, rgba(26, 30, 22, 0) 18%);

  --icon-sm: 18px;
  --icon-md: 22px;
  --icon-lg: 26px;
  --dot-size: 8px;

  /* Positions des écrans complémentaires */
  --pos-welcome-logo: 44px;
  --pos-wordmark: 108px;
  --pos-logo-sub: 140px;
  --pos-welcome-title: 200px;
  --pos-welcome-sub: 306px;
  --pos-welcome-cta: 645px;

  --pos-onb-title: 105px;
  --pos-onb-sub: 155px;
  --pos-signup-fields: 241px;
  --pos-signup-check: 298px;
  --pos-signup-submit: 420px;

  --pos-verif-art: 296px;
  --pos-verif-label: 480px;
  --pos-verif-code: 521px;
  --pos-verif-submit: 655px;
  --pos-verif-resend: 727px;

  --pos-house-step: 83px;
  --pos-house-caption: 132px;
  --pos-house-title: 186px;
  --pos-house-sub: 233px;
  --pos-house-f1: 320px;
  --pos-house-f2: 400px;
  --pos-house-art: 500px;
  --pos-house-cta: 691px;

  --pos-equip-step: 68px;
  --pos-equip-caption: 108px;
  --pos-equip-title: 148px;
  --pos-equip-sub: 190px;
  --pos-equip-list: 256px;
  --pos-equip-note: 700px;
  --pos-equip-cta: 661px;
  --pos-equip-skip: 724px;


  --pos-clim-tabs: 88px;
  --pos-clim-gauge: 135px;
  --pos-clim-power: 417px;
  --pos-clim-modes: 478px;
  --pos-clim-zones: 563px;
  --pos-clim-steps: 165px;

  --pos-tab-head: 6px;
  --pos-tab-search: 88px;
  --pos-tab-list: 148px;
  --pos-tab-settings: 66px;
  --pos-tab-scenarios: 74px;
  --pos-scenario-note: 596px;
  --z-sheet: 20;
  --z-boot: 30;

  /* ===== PWA, états réseau et listes branchées sur l'API ===== */
  --scenario-list-max: 440px;
  --font-section-state: 13.5px;
  --font-state: 12px;
  --boot-gap: 10px;
  --prog-state-pad-x: 8px;
  --prog-state-pad-y: 3px;
  --weather-muted: 0.55;
}