:root{color-scheme:light dark;--bg:oklch(0.985 0.006 95);--surface:oklch(1 0 0);--surface-2:oklch(0.962 0.008 95);--line:oklch(0.892 0.01 95);--fg:oklch(0.22 0.015 95);--muted:oklch(0.505 0.014 95);--accent:oklch(0.575 0.19 28);--accent2:oklch(0.53 0.17 265);--accent-soft:oklch(0.945 0.04 28);--accent-fg:oklch(0.99 0 0)}
:root[data-theme="dark"]{--bg:oklch(0.19 0.012 95);--surface:oklch(0.232 0.012 95);--surface-2:oklch(0.275 0.012 95);--line:oklch(0.335 0.012 95);--fg:oklch(0.952 0.006 95);--muted:oklch(0.735 0.012 95);--accent:oklch(0.75 0.15 45);--accent2:oklch(0.76 0.12 265);--accent-soft:oklch(0.3 0.06 45);--accent-fg:oklch(0.17 0.01 95)}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,sans-serif;font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:var(--accent)}
a:hover{color:var(--accent2)}
:focus-visible{outline:3px solid var(--accent2);outline-offset:2px;border-radius:6px}
img{max-width:100%}
.gc:hover{border-color:var(--accent);background:var(--surface-2)}
.navlink:hover{background:var(--surface-2)}
.btn-ghost:hover{border-color:var(--fg)}
.btn-primary:hover{background:var(--accent2);color:var(--accent-fg)}
.btn-outline:hover{border-color:var(--fg)}
.box-link:hover{border-color:var(--accent)}
.faq summary{list-style:none;width:100%;min-height:60px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 20px;font-size:16px;font-weight:600;cursor:pointer;line-height:1.4}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:0 0 auto;font-size:22px;color:var(--muted);line-height:1}
.faq[open] summary::after{content:"\2212"}
.faq summary:hover{background:var(--surface-2)}
/* Each tile draws its own 1px ring; the 1px gap makes neighbouring rings
   overlap into a single divider, and a half-filled last row stays blank
   instead of showing a band of divider colour. */
.tiles{display:grid;gap:1px;padding:1px;border-radius:16px;overflow:hidden;background:var(--surface)}
.tiles>div{background:var(--surface);box-shadow:0 0 0 1px var(--line)}
.chip{min-height:44px;padding:0 16px;border-radius:999px;font-size:15px;font-weight:600;cursor:pointer;font-family:inherit;border:1px solid var(--line);background:var(--surface);color:var(--fg)}
.chip[aria-pressed="true"]{border-color:var(--accent);background:var(--accent);color:var(--accent-fg)}
.hidden{display:none!important}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}