:root { color-scheme: light dark; --bg:#faf8f5; --fg:#1d1a20; --muted:#6a6470; --card:#fff; --line:#e6e0e8; --accent:#8e1b8a; --accent-fg:#fff; --ok:#12663a; --okbg:#e5f5ec; --err:#9b1c1c; --errbg:#fbe9e9; }
@media (prefers-color-scheme: dark) { :root { --bg:#16121a; --fg:#f1edf3; --muted:#a69fae; --card:#211b27; --line:#38303f; --accent:#d46ace; --accent-fg:#16121a; --ok:#7bdca3; --okbg:#173325; --err:#ff9d9d; --errbg:#3a1b1b; } }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--fg); font:16px/1.55 'IBM Plex Sans', system-ui, sans-serif; }
h1,h2 { font-family:'Bricolage Grotesque','IBM Plex Sans',sans-serif; line-height:1.15; }
h1 { font-size:clamp(1.7rem,4.5vw,2.6rem); margin:.2em 0 .4em; } h2 { font-size:1.25rem; }
a { color:var(--accent); }
.top { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; padding:10px 16px 0; max-width:1000px; margin:0 auto; }
.logo img { display:block; width:min(300px,52vw); height:auto; }
.top nav { display:flex; gap:16px; align-items:center; padding-top:10px; font-size:15px; } .top nav form { margin:0; }
.page { max-width:1000px; margin:0 auto; padding:16px; }
.narrow { max-width:460px; margin:24px auto; } .doc { max-width:700px; margin:24px auto; }
.hero { padding:28px 0 16px; max-width:720px; } .lead { font-size:1.15rem; }
.price { margin:18px 0 6px; } .amount { font:800 2.6rem 'Bricolage Grotesque',sans-serif; color:var(--accent); }
.muted { color:var(--muted); font-size:.92rem; }
.btn { display:inline-block; background:var(--accent); color:var(--accent-fg); border:0; border-radius:10px; padding:12px 20px; font:600 1rem 'IBM Plex Sans',sans-serif; text-decoration:none; cursor:pointer; min-height:44px; }
.btn-sm { padding:6px 14px; min-height:0; font-size:14px; }
.btn.ghost { background:transparent; color:var(--fg); border:1px solid var(--line); margin-left:6px; }
.top nav { flex-wrap:wrap; justify-content:flex-end; }
.linkbtn { font:inherit; background:none; border:0; color:var(--accent); text-decoration:underline; cursor:pointer; padding:0; }
.form { display:grid; gap:14px; margin:16px 0; } .form label { display:grid; gap:4px; font-weight:500; }
input { font:inherit; padding:11px 12px; border:1px solid var(--line); border-radius:10px; background:var(--card); color:var(--fg); min-height:44px; }
.cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px; margin:28px 0; }
.cards article, .notice { background:var(--card); border:1px solid var(--line); border-radius:14px; padding:16px 18px; } .cards h2 { margin:0 0 6px; }
.flash { padding:10px 14px; border-radius:10px; margin:12px 0; } .flash.ok { background:var(--okbg); color:var(--ok); } .flash.err { background:var(--errbg); color:var(--err); }
.tbl { width:100%; border-collapse:collapse; } .tbl th,.tbl td { text-align:left; padding:8px 6px; border-bottom:1px solid var(--line); }
.foot { max-width:1000px; margin:30px auto 20px; padding:0 16px; color:var(--muted); font-size:.85rem; }