:root {
  --bg:#0b2d24; --panel:#0e3a2e; --accent:#10b981; --accent2:#0aa56a;
  --text:#e6fff2; --muted:#b6d1c3; --input:#0c3329; --border:#145a48;
  --danger:#ef4444; --warning:#f59e0b;
  --radius:12px;
}
*{box-sizing:border-box}
html,body{height:100%}
body.bg{margin:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Inter,Arial}
.topbar{position:sticky;top:0;display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:linear-gradient(0deg,#0d3b2e,#0a2c23);border-bottom:1px solid var(--border);z-index:2}
.brand{font-weight:800;letter-spacing:.5px}
.topbar a{color:var(--text);opacity:.9;text-decoration:none;margin-left:12px}
.topbar a.btn{background:var(--accent);padding:8px 14px;border-radius:8px;color:#012d22;font-weight:700}
.page-center{min-height:calc(100vh - 64px);display:grid;place-items:center;padding:24px}
.card{width:min(920px,96vw);background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:18px 18px 22px;box-shadow:0 14px 40px rgba(0,0,0,.25)}
h1,h2{margin:6px 0 12px}
.muted{color:var(--muted);font-size:.95rem}
.grid{display:grid;grid-template-columns:1fr;gap:12px}
.row{display:grid;grid-template-columns:1fr;gap:12px}
@media(min-width:720px){.grid{grid-template-columns:1fr 1fr}.row{grid-template-columns:1fr 1fr}}
label{font-size:.95rem;margin:2px 4px 6px;display:block}
input,select,button,textarea{width:100%;padding:13px 12px;background:var(--input);border:1px solid var(--border);border-radius:10px;color:var(--text);outline:none;font-size:16px; /* prevent iOS zoom */}
input::placeholder{color:#93b2a4}
button.btn{background:var(--accent);border:0;color:#082b22;font-weight:800;cursor:pointer}
button.btn:hover{background:var(--accent2)}
.btn-secondary{background:#0d5a49}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.notice{padding:10px;border-radius:8px;background:#0b2f27;border:1px solid var(--border);margin-top:10px}
.error{color:#ffd0d0}
.success{color:#a7f3d0}
.center{text-align:center}
.site-footer{color:#8fafa1;padding:25px;text-align:center}
.kv{display:flex;gap:8px}
.prefix{background:#0a4a3b;border:1px solid var(--border);padding:13px 12px;border-radius:10px;color:#d7fff0;display:flex;align-items:center;white-space:nowrap}
.small{font-size:.9rem}
hr{border:0;border-top:1px solid var(--border);margin:10px 0}
a{color:#7ee9c3}
table{width:100%;border-collapse:collapse}
td,th{border-bottom:1px solid var(--border);padding:8px}