:root {
  
  --brand-500: #ff5a2c;
  --brand-600: #e6420f;
  --brand-050: #fff1ec;
  
  --ink-900: #14161a;
  --ink-700: #3a3f47;
  --ink-500: #6b7280;
  --ink-300: #b6bcc6;
  --line: #eceef1;
  --bg: #f6f7f9;
  --surface: #ffffff;
  
  --ok: #16a34a;
  --warn: #d97706;
  --danger: #dc2626;
  
  --r-sm: 8px; --r-md: 12px; --r-lg: 16px; --r-xl: 22px;
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 20px; --sp-6: 24px;
  --shadow-card: 0 1px 2px rgba(20,22,26,.04), 0 6px 20px rgba(20,22,26,.06);
  --shadow-bar: 0 -1px 0 var(--line);
  
  --fs-cap: 12px; --fs-sm: 13px; --fs-md: 15px; --fs-lg: 17px; --fs-xl: 22px; --fs-2xl: 28px;
  
  --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);
  
  --tabbar-h: 58px;
  
  --touch-min: 44px;
  
  --content-max: 680px;
  --content-max-wide: 1040px;
}
@media (prefers-color-scheme: dark) {
  :root { --bg:#0f1115; --surface:#171a20; --ink-900:#f2f4f7; --ink-700:#c4c9d2; --ink-500:#8b93a1; --line:#252a33; }
}