:root {
  --bg: #f6f6f4;
  --surface: #ffffff;
  --surface-soft: #fbfbfa;
  --border: #e6e6e2;
  --border-soft: #efefec;
  --text: #18181b;
  --text-muted: #5c5c66;
  --text-faint: #8a8a93;
  --text-dim: #b0b0b8;
  --primary: #18181b;
  --primary-fg: #ffffff;
  --accent: #3b54d6;
  --accent-soft: rgba(59,84,214,.10);
  --success: #166534;
  --success-bg: #f0fdf4;
  --success-border: #bbf7d0;
  --warning: #92400e;
  --warning-bg: #fef3c7;
  --danger: #991b1b;
  --danger-bg: #fef2f2;
  --danger-border: #fecaca;
  --radius-sm: 8px;
  --radius: 12px;
  --radius-lg: 18px;
  --radius-xl: 22px;
  --shadow-sm: 0 1px 3px rgba(15,23,42,.04);
  --shadow: 0 8px 24px rgba(15,23,42,.06);
  --shadow-lg: 0 24px 60px rgba(15,23,42,.08);
  --ease: cubic-bezier(.22,1,.36,1);
}
@view-transition { navigation: auto; }
::view-transition-old(root){ animation: vt-out .30s cubic-bezier(.4,0,.2,1) both }
::view-transition-new(root){ animation: vt-in .42s var(--ease) both }
@keyframes vt-out{ to{ opacity:0; transform:scale(.992) } }
@keyframes vt-in{ from{ opacity:0; transform:scale(1.008) } }
*{margin:0;padding:0;box-sizing:border-box}
html,body{font-family:'Inter',sans-serif;background:var(--bg);color:var(--text)}
body{min-height:100vh;padding:20px 14px;opacity:0;transform:translateY(6px);transition:opacity .4s var(--ease),transform .4s var(--ease)}
body.page-ready{opacity:1;transform:none}
body.page-leaving{opacity:0;transform:translateY(-6px)}
.page{max-width:720px;margin:0 auto}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none}
input,textarea,select{font-family:inherit}
@media(max-width:600px){body{padding:14px 10px}}
@media (prefers-reduced-motion: reduce){
  ::view-transition-old(root),::view-transition-new(root){animation:none}
  body{transition:none;opacity:1;transform:none}
}