:root{--brand:#0ea5e9;--ink:#111827;--ink-weak:#6b7280;--bg:#ffffff}
html,body{height:100%}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;margin:0;background:var(--bg);color:#111;padding-bottom:80px}
main{margin:2rem auto;max-width:720px;line-height:1.7;padding:0 1rem}
header{border-bottom:1px solid #eee;background:#fff;position:sticky;top:0;z-index:10}
header .wrap{max-width:720px;margin:0 auto;padding:.75rem 1rem;display:flex;gap:1rem;align-items:center}
nav a{color:var(--ink);text-decoration:none;margin-right:1rem}
nav a:hover{text-decoration:underline}
button.primary{background:var(--brand);color:#fff;border:none;border-radius:8px;padding:.6rem 1rem;font-size:1rem;cursor:pointer}
.banner{position:fixed;left:0;right:0;bottom:0;background:#111827;color:#fff;padding:.8rem 1rem;display:flex;gap:.8rem;align-items:center;box-shadow:0 -4px 20px rgba(0,0,0,.2);z-index:9999}
.banner b{font-weight:600}
.banner button{margin-left:auto;background:var(--brand);color:#fff;border:none;border-radius:8px;padding:.5rem .9rem;cursor:pointer}
.banner .close{background:transparent;color:#9ca3af;border:none;font-size:1.2rem;padding:0 .4rem;margin:0;cursor:pointer}
.toast{position:fixed;right:1rem;bottom:4.2rem;background:#111827;color:#fff;padding:.6rem .9rem;border-radius:8px;opacity:0;transition:opacity .2s ease}
.toast.show{opacity:1}