/* Design tokens (wedjat-cursor) */
:root {
  --wd-ink: #1D2B2A;
  --wd-ink-soft: #2C2421;
  --wd-muted: #4A524D;
  --wd-muted-soft: #5C645F;
  --wd-paper: #F5F0E6;
  --wd-paper-strong: #FFF9EE;
  --wd-paper-soft: #EFE8D5;
  --wd-line: rgba(29, 43, 42, .16);
  --wd-line-strong: rgba(29, 43, 42, .24);
  --wd-teal-light: #64CFCA;
  --wd-teal: #2BB3B1;
  --wd-teal-deep: #0F6F73;
  --wd-teal-dark: #083F42;
  --wd-gold-pale: #E4BF63;
  --wd-gold: #C4A051;
  --wd-gold-deep: #8C5F28;
  --wd-ochre: #A87522;
  --wd-gold-mid: #8C5F28;
  --wd-gold-soft: #C4A051;
  --wd-lapis-light: #5F8FD3;
  --wd-lapis: #2F68B7;
  --wd-lapis-deep: #184E9C;
  --wd-lapis-dark: #111E3B;
  --wd-night: #11181B;
  --wd-night-soft: #1D2B2A;
  --wd-night-hard: #131110;
  --wd-on-dark: #FFF9EE;
  --wd-on-dark-muted: rgba(255, 249, 238, .78);
  --wd-amethyst: #72699A;
  --wd-amethyst-dark: #3C2A45;
  --wd-plum: #72699A;
  --wd-shadow: 0 20px 60px rgba(29, 43, 42, .10);
  --wd-surface-shadow: 0 18px 46px rgba(29, 43, 42, .14), 0 5px 14px rgba(29, 43, 42, .07);
  --wd-surface-shadow-soft: 0 8px 24px rgba(29, 43, 42, .11), 0 3px 9px rgba(29, 43, 42, .06);
  --wd-radius: 22px;
  --wd-alert: #8C2C2D;
  --wd-alert-soft: #C77A56;
  --wd-alert-dark: #5B1C18;
  --wd-terracotta: #8C2C2D;
  --wd-terracotta-light: #C77A56;
  --wd-terracotta-dark: #5B1C18;
  --wd-btn-border-gold: rgba(228, 191, 99, .58);
  --wd-btn-border-gold-soft: rgba(228, 191, 99, .48);
  /* Primary actions: teal site-wide; lapis vars kept for nav chrome only */
  --wd-btn-bg-lapis: linear-gradient(145deg, var(--wd-teal-light) 0%, var(--wd-teal) 50%, var(--wd-teal-deep) 100%);
  --wd-btn-bg-lapis-hover: linear-gradient(145deg, #7dd9d5 0%, var(--wd-teal-light) 48%, var(--wd-teal) 100%);
  --wd-btn-bg-lapis-soft: linear-gradient(145deg, var(--wd-teal-light), var(--wd-teal-dark));
  --wd-btn-bg-lapis-soft-hover: linear-gradient(145deg, var(--wd-teal), var(--wd-teal-deep));
  --wd-btn-shadow: 0 8px 18px rgba(8, 63, 66, .16);
  --wd-btn-shadow-lg: 0 10px 26px rgba(8, 47, 50, .22);

  /* Typography */
  --wd-font-sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans", Verdana, Geneva, Arial, sans-serif;
  --wd-font-serif: var(--wd-font-sans);
  --wd-text-xs: .72rem;
  --wd-text-sm: .84rem;
  --wd-text-base: 1rem;
  --wd-text-lg: 1.08rem;
  --wd-text-xl: 1.25rem;
  --wd-text-2xl: clamp(1.65rem, 2.2vw, 2rem);
  --wd-text-3xl: clamp(2.1rem, 2.6vw, 3.1rem);
  --wd-leading-tight: 1.15;
  --wd-leading-normal: 1.65;
  --wd-leading-relaxed: 1.75;

  /* Spacing (4px base) */
  --wd-space-1: 4px;
  --wd-space-2: 8px;
  --wd-space-3: 12px;
  --wd-space-4: 16px;
  --wd-space-5: 20px;
  --wd-space-6: 24px;
  --wd-space-8: 32px;
  --wd-space-10: 40px;
  --wd-input-border: rgba(15, 111, 115, .18);
  --wd-input-border-focus: rgba(15, 111, 115, .46);
  --wd-input-bg: rgba(255, 255, 255, .78);
  --wd-input-bg-focus: #fff;
  --wd-input-shadow-inset: inset 0 1px rgba(255, 255, 255, .72);
  --wd-input-focus-ring: 0 0 0 3px rgba(43, 179, 177, .12);

  /* Form palette — teal/lapis shell, volumetric wells */
  --form-bg: rgba(244, 255, 254, .96);
  --form-bg-glow: rgba(100, 207, 202, .12);
  --form-paper: #F4FFFE;
  --form-surface: #FFFFFF;
  --form-surface-muted: #F0FAFA;
  --form-surface-warm: #E8F7F6;
  --form-text: var(--wd-ink);
  --form-heading: #0A4D52;
  --form-muted: var(--wd-muted);
  --form-input-border: rgba(140, 95, 40, .20);
  --form-input-focus: var(--wd-gold-deep);
  --form-primary: var(--wd-teal);
  --form-primary-dark: var(--wd-teal-deep);
  --form-primary-soft: rgba(174, 230, 229, .52);
  --form-dark: var(--wd-ink);
  --form-gold: var(--wd-gold);
  --form-gold-soft: var(--wd-gold-pale);
  --form-gold-dark: var(--wd-gold-deep);
  --form-success: #4FA845;
  --form-warning: #F39A20;
  --form-error: #D94335;
  --form-disabled: #DCE6E3;
  --form-disabled-text: #8CA4A0;
  --form-line: rgba(43, 179, 177, .12);
  --form-shadow: rgba(15, 111, 115, .14);
  --form-rim-light: rgba(255, 255, 255, .94);
  --form-rim: rgba(43, 179, 177, .26);
  --form-rim-deep: rgba(47, 104, 183, .18);
  --form-shell-top: #FFF9EE;
  --form-shell-mid: #FBF7ED;
  --form-shell-deep: #F5F0E6;
  --form-well-bg: #FFFFFF;
  --form-well-inset: inset 0 2px 4px rgba(29, 43, 42, .05), inset 0 1px 0 rgba(255, 255, 255, .8);
  --form-tray-bg: transparent;

  /* Page substrate — plain white, not form chrome */
  --panel-bg: #FFFFFF;
  --panel-border: rgba(29, 43, 42, .08);
  --panel-line: rgba(29, 43, 42, .09);
  --panel-shadow: 0 2px 14px rgba(29, 43, 42, .07);
}

:root[data-wd-theme="dark"] {
  --wd-ink: #F3E8C8;
  --wd-ink-soft: #E7D7AC;
  --wd-muted: rgba(243, 232, 200, .76);
  --wd-muted-soft: rgba(243, 232, 200, .64);
  --wd-paper: #151D20;
  --wd-paper-strong: #1D2B2A;
  --wd-paper-soft: #223532;
  --wd-line: rgba(228, 191, 99, .18);
  --wd-line-strong: rgba(228, 191, 99, .30);
  --wd-teal-light: #73DAD4;
  --wd-teal: #2BB3B1;
  --wd-teal-deep: #159096;
  --wd-teal-dark: #082E32;
  --wd-gold-pale: #F1D57E;
  --wd-gold: #C9A85B;
  --wd-gold-deep: #D8B96E;
  --wd-ochre: #C5974D;
  --wd-lapis-light: #789FDD;
  --wd-lapis: #416FBA;
  --wd-lapis-deep: #254F91;
  --wd-lapis-dark: #101A34;
  --wd-night: #090F12;
  --wd-night-soft: #111C1D;
  --wd-night-hard: #05080A;
  --wd-on-dark: #FFF9EE;
  --wd-on-dark-muted: rgba(255, 249, 238, .74);
  --wd-shadow: 0 22px 62px rgba(0, 0, 0, .34);
  --wd-surface-shadow: 0 0 24px rgba(255, 249, 238, .11), 0 14px 36px rgba(0, 0, 0, .30);
  --wd-surface-shadow-soft: 0 0 15px rgba(255, 249, 238, .09), 0 8px 22px rgba(0, 0, 0, .24);
  --wd-btn-border-gold: rgba(201, 162, 87, .54);
  --wd-btn-border-gold-soft: rgba(201, 162, 87, .42);
  --wd-btn-bg-lapis: linear-gradient(145deg, #1B8E91 0%, #0F6F73 48%, #082E32 100%);
  --wd-btn-bg-lapis-hover: linear-gradient(145deg, #239DA0 0%, #137E83 48%, #0A3B3F 100%);
  --wd-btn-bg-lapis-soft: linear-gradient(145deg, #1A777B 0%, #082E32 100%);
  --wd-btn-bg-lapis-soft-hover: linear-gradient(145deg, #218A8E 0%, #0B4448 100%);
  --wd-btn-shadow: 0 7px 16px rgba(0, 0, 0, .28);
  --wd-btn-shadow-lg: 0 9px 22px rgba(0, 0, 0, .34);
  --wd-input-border: rgba(228, 191, 99, .20);
  --wd-input-border-focus: rgba(115, 218, 212, .54);
  --wd-input-bg: rgba(9, 15, 18, .58);
  --wd-input-bg-focus: rgba(13, 26, 29, .92);
  --wd-input-shadow-inset: inset 0 1px rgba(255, 249, 238, .08);
  --wd-input-focus-ring: 0 0 0 3px rgba(43, 179, 177, .18);
  --form-bg: rgba(15, 26, 29, .96);
  --form-paper: #142225;
  --form-surface: #101C1F;
  --form-surface-muted: #17292B;
  --form-surface-warm: #1E2B2A;
  --form-text: var(--wd-ink);
  --form-heading: var(--wd-gold-pale);
  --form-muted: var(--wd-muted);
  --form-input-border: rgba(228, 191, 99, .20);
  --form-input-focus: var(--wd-teal-light);
  --form-primary: #137E83;
  --form-primary-dark: var(--wd-teal-dark);
  --form-primary-soft: rgba(43, 179, 177, .14);
  --form-line: rgba(228, 191, 99, .16);
  --form-shadow: rgba(0, 0, 0, .30);
  --form-shell-top: #152326;
  --form-shell-mid: #101C1F;
  --form-shell-deep: #0B1417;
  --form-well-bg: rgba(255, 249, 238, .06);
  --form-well-inset: inset 0 1px 0 rgba(255, 249, 238, .08), inset 0 2px 8px rgba(0, 0, 0, .18);
  --form-tray-bg: transparent;
  --panel-bg: rgba(13, 22, 25, .96);
  --panel-border: rgba(228, 191, 99, .16);
  --panel-line: rgba(228, 191, 99, .12);
  --panel-shadow: 0 18px 46px rgba(0, 0, 0, .34);
}