:root {
  --bg-base:        #0f0f0f;
  --bg-surface:     #161616;
  --bg-elevated:    #1e1e1e;
  --bg-overlay:     #252525;

  --border:         #2a2a2a;
  --border-subtle:  #1f1f1f;
  --border-focus:   #8a7a6a;

  --text-primary:   #f0ece6;
  --text-secondary: #9a9080;
  --text-muted:     #5a5248;
  --text-inverse:   #0f0f0f;

  --accent:         #c9a96e;
  --accent-dim:     #8a6f42;
  --accent-subtle:  #2a2016;

  --ok:             #4a9e6a;
  --ok-subtle:      #0f2318;
  --warn:           #c49a3a;
  --warn-subtle:    #251e08;
  --err:            #c45a4a;
  --err-subtle:     #25100e;
  --info:           #4a7ab5;
  --info-subtle:    #0e1825;

  --sp-1:  4px;
  --sp-2:  8px;
  --sp-3:  12px;
  --sp-4:  16px;
  --sp-5:  24px;
  --sp-6:  32px;
  --sp-7:  48px;
  --sp-8:  64px;

  --r-sm:  6px;
  --r-md:  10px;
  --r-lg:  16px;
  --r-xl:  24px;
  --r-pill: 999px;

  --shadow-card:   0 1px 3px rgba(0,0,0,0.4), 0 4px 16px rgba(0,0,0,0.3);
  --shadow-modal:  0 8px 40px rgba(0,0,0,0.7);
  --shadow-toast:  0 4px 20px rgba(0,0,0,0.5);

  --t-fast:   120ms;
  --t-base:   200ms;
  --t-slow:   350ms;

  --z-base:    1;
  --z-sticky:  100;
  --z-modal:   200;
  --z-toast:   300;
  --z-tooltip: 400;

  --safe-top:    env(safe-area-inset-top,    0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left:   env(safe-area-inset-left,   0px);
  --safe-right:  env(safe-area-inset-right,  0px);
  --nav-bottom-h: 56px;
  --touch-min: 44px;
  --shadow-bottom-nav: 0 -1px 0 var(--border), 0 -4px 16px rgba(0,0,0,0.3);
  --shadow-sheet: 0 -4px 32px rgba(0,0,0,0.5);
  --ptr-size: 36px;

  --fw-semibold: 600;
}

[data-theme="light"] {
  --bg-base:        #f4f1ec;
  --bg-surface:     #faf9f7;
  --bg-elevated:    #eeebe5;
  --bg-overlay:     #ffffff;

  --border:         #ddd9d1;
  --border-subtle:  #e8e4dc;
  --border-focus:   #8a7a6a;

  --text-primary:   #1a1714;
  --text-secondary: #6b6258;
  --text-muted:     #b0a89e;
  --text-inverse:   #f0ece6;

  --accent:         #a07840;
  --accent-dim:     #7a5a2a;
  --accent-subtle:  #f0e8d8;

  --ok:             #2e7a4a;
  --ok-subtle:      #eaf4ee;
  --warn:           #8a6a1a;
  --warn-subtle:    #faf3e0;
  --err:            #9a3a2a;
  --err-subtle:     #faeae8;
  --info:           #2a5a90;
  --info-subtle:    #e8f0fa;

  --shadow-card:   0 1px 3px rgba(0,0,0,0.08), 0 4px 16px rgba(0,0,0,0.06);
  --shadow-modal:  0 8px 40px rgba(0,0,0,0.2);
  --shadow-toast:  0 4px 20px rgba(0,0,0,0.15);
}