/* base.css — tokens, reset, base elements, layout primitives, app shell */
@font-face{
  font-family:"Open Sans";
  src:url("/static/fonts/opensans-latin.woff2") format("woff2-variations");
  font-weight:300 800; font-style:normal; font-display:swap;
}
:root{
  --purple-900:#2a0f4f; --purple-800:#3d1a72; --purple-700:#6f2dbd; --purple-600:#7e3bd0;
  --purple-500:#9b51e0; --purple-300:#c39bee; --purple-100:#f1e6fb;
  --ink:#1f1a2c; --body:#4a4458; --muted:#7a7388; --line:#e6e2ee;
  --bg:#ffffff; --bg-soft:#f7f4fb; --bg-dark:#100823; --bg-darker:#07031a;
  --shadow-md:0 10px 30px rgba(36,12,80,.10); --shadow-lg:0 25px 60px rgba(36,12,80,.25);
  --t-fast:180ms cubic-bezier(.2,.7,.2,1); --t-med:320ms cubic-bezier(.2,.7,.2,1);
  --radius:10px; --radius-lg:14px;
  --color-bg:var(--bg-soft); --color-surface:#fff; --color-surface-2:var(--bg-soft);
  --color-text:var(--body); --color-heading:var(--ink); --color-muted:var(--muted);
  --color-border:var(--line);
  --color-primary:var(--purple-700); --color-primary-hover:var(--purple-800); --color-on-primary:#fff;
  --color-link:var(--purple-700); --shadow:var(--shadow-md);
  --focus-ring:0 0 0 3px rgba(111,45,189,.45);
  --ok:#0a7a2f; --ok-bg:#e7f5ec; --danger:#b00020; --danger-bg:#fdecef;
  --info:#3d1a72; --info-bg:var(--purple-100); --warn:#8a5a00; --warn-bg:#fbf0d9;
  --btn-danger-bg:#b00020; --btn-danger-fg:#fff;
}
@media (prefers-color-scheme:dark){
  :root{
    --color-bg:var(--bg-darker); --color-surface:var(--bg-dark); --color-surface-2:#1f1a2c;
    --color-text:rgba(255,255,255,.85); --color-heading:#fff; --color-muted:#b8b0c8;
    --color-border:rgba(255,255,255,.10);
    --color-primary:var(--purple-500); --color-primary-hover:var(--purple-300); --color-on-primary:#150a29;
    --color-link:var(--purple-300); --shadow:0 10px 30px rgba(0,0,0,.45);
    --focus-ring:0 0 0 3px rgba(155,81,224,.55);
    --ok:#5fd08a; --ok-bg:rgba(95,208,138,.12); --danger:#ff8ba0; --danger-bg:rgba(255,139,160,.12);
    --info:#c39bee; --info-bg:rgba(155,81,224,.14); --warn:#e6c07a; --warn-bg:rgba(230,192,122,.12);
    --btn-danger-bg:#c62a48; --btn-danger-fg:#fff;
  }
}
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{margin:0; font-family:"Open Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  font-size:1rem; line-height:1.55; color:var(--color-text); background:var(--color-bg); -webkit-font-smoothing:antialiased;}
h1,h2,h3,h4{color:var(--color-heading); line-height:1.2; margin:0 0 .5em; font-weight:800; letter-spacing:-.02em;}
h1{font-size:clamp(1.75rem,4vw,2.75rem);}
h2{font-size:clamp(1.4rem,3vw,2rem); font-weight:700;}
h3{font-size:clamp(1.15rem,2vw,1.4rem); font-weight:700;}
p{margin:0 0 1rem;}
a{color:var(--color-link); text-decoration:none;}
a:hover{text-decoration:underline;}
:focus-visible{outline:none; box-shadow:var(--focus-ring); border-radius:6px;}
img{max-width:100%; height:auto;}
.container{width:100%; max-width:1100px; margin-inline:auto; padding-inline:clamp(16px,4vw,32px);}
main.container{padding-top:1.75rem; padding-bottom:3rem;}
.stack>*+*{margin-top:1rem;} .stack--lg>*+*{margin-top:1.75rem;}
.cluster{display:flex; flex-wrap:wrap; gap:.75rem; align-items:center;}
.muted{color:var(--color-muted);} .num{font-variant-numeric:tabular-nums; text-align:right;}
.topbar{position:sticky; top:0; z-index:20; background:var(--color-surface); border-bottom:1px solid var(--color-border); box-shadow:var(--shadow);}
.topbar__inner{display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; max-width:1100px; margin-inline:auto; padding:.6rem clamp(16px,4vw,32px);}
.brand{display:flex; align-items:center; gap:.55rem; font-weight:800; color:var(--color-heading); letter-spacing:-.02em;}
.brand img{width:28px; height:28px;} .brand:hover{text-decoration:none;}
.nav{display:flex; flex-wrap:wrap; align-items:center; gap:.25rem .35rem;}
.nav a{padding:.4rem .7rem; border-radius:8px; color:var(--color-muted); font-weight:600; font-size:.95rem;}
.nav a:hover{color:var(--color-primary); background:var(--color-surface-2); text-decoration:none;}
.nav a.is-active{color:var(--color-primary);}
.error{color:var(--danger);} .ok{color:var(--ok);} .note{color:var(--color-muted); font-style:italic;}
.addr-suggest{position:absolute; z-index:30; left:0; right:0; background:var(--color-surface);
  border:1px solid var(--color-border); border-top:none; border-radius:0 0 var(--radius) var(--radius); box-shadow:var(--shadow); overflow:hidden;}
.addr-item{padding:.45rem .6rem; cursor:pointer; border-top:1px solid var(--color-border);}
.addr-item:hover{background:var(--color-surface-2);}
@media (prefers-reduced-motion:reduce){*{transition-duration:0ms !important;}}