:root{
  --bg:#0f141b; --bg2:#141b24; --line:#222b36; --line2:#2e3946;
  --ink:#ffffff; --soft:#e7e3db; --mute:#8a939f; --ghost:#4a525e;
  --accent:#f0b44c; --ok:#8fdcaa; --bad:#ff6f61;
  --f-body:"Geist","Helvetica Neue",Arial,sans-serif;
  --f-mono:"Geist Mono",ui-monospace,"SF Mono",Menlo,monospace;
  --f-display:"Instrument Serif",Georgia,serif;
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{min-height:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased;
  background-image:radial-gradient(ellipse 70% 55% at 50% 30%, #18212c 0%, var(--bg) 70%);background-attachment:fixed}
[hidden]{display:none!important}
button,input,select{font:inherit;color:inherit}
a{color:var(--accent)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

.eyebrow{font-family:var(--f-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.btn{border:1px solid var(--line2);background:rgba(20,27,36,.7);border-radius:999px;padding:10px 20px;cursor:pointer;font-weight:500;white-space:nowrap}
.btn:hover{border-color:#4a586a}
.btn.main{background:var(--bad);border-color:var(--bad);color:#16090a}
.btn.main:hover{filter:brightness(1.08)}
.btn.small{padding:5px 12px;font-size:13px;font-weight:400}
.btn.danger{color:var(--bad)}
.btn[disabled]{opacity:.5;cursor:default}
.link{background:none;border:0;padding:0;color:var(--accent);cursor:pointer;text-decoration:underline;text-underline-offset:3px}

/* start page */
.start{min-height:100dvh;display:grid;place-items:center;padding:32px 16px}
.card{width:min(440px,100%);display:grid;gap:22px}
.hero{display:grid;gap:10px;text-align:center}
.hero h1{font-family:var(--f-display);font-weight:400;font-size:clamp(46px,9vw,68px);line-height:1;margin:0;text-wrap:balance}
.hero h1 em{font-style:italic;color:var(--bad)}
.hero p{margin:0;color:var(--soft);text-wrap:pretty}
.row{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.note{color:var(--mute);font-size:13px;text-align:center;margin:0}
form{display:grid;gap:14px;border:1px solid var(--line);background:rgba(20,27,36,.6);border-radius:14px;padding:22px}
form h2{font-family:var(--f-display);font-weight:400;font-size:28px;margin:0;line-height:1.1}
label{display:grid;gap:6px;font-size:13px;color:var(--mute)}
input,select{background:var(--bg);border:1px solid var(--line2);border-radius:9px;padding:10px 12px;color:var(--ink);min-width:0;width:100%}
input::placeholder{color:var(--ghost)}
.msg{font-size:14px;color:var(--bad);min-height:1.5em;margin:0}
.msg.ok{color:var(--ok)}
.bar{height:6px;border-radius:99px;background:var(--line);overflow:hidden}
.bar i{display:block;height:100%;width:0;background:var(--bad);transition:width .2s}

/* owner page */
.admin{max-width:1080px;margin:0 auto;padding:28px 16px 80px;display:grid;gap:34px}
.admin header{display:flex;justify-content:space-between;align-items:end;gap:16px;flex-wrap:wrap}
.admin h1{font-family:var(--f-display);font-weight:400;font-size:40px;margin:0;line-height:1}
.admin h2{font-family:var(--f-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);font-weight:500;margin:0 0 12px}
.box{border:1px solid var(--line);background:rgba(20,27,36,.6);border-radius:14px;padding:18px}
.line{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.line input,.line select{width:auto}
.scroll{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:14px}
th{font-family:var(--f-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--mute);font-weight:500;text-align:left;padding:8px 10px;border-bottom:1px solid var(--line2);white-space:nowrap}
td{padding:9px 10px;border-bottom:1px solid var(--line);vertical-align:middle}
td.acts{white-space:nowrap}
td .btn{margin-right:4px}
.code{font-family:var(--f-mono);letter-spacing:.04em}
.tag{font-family:var(--f-mono);font-size:11px;border:1px solid var(--line2);border-radius:99px;padding:2px 8px;color:var(--mute);white-space:nowrap}
.tag.ok{color:var(--ok);border-color:#2f5a40}
.tag.bad{color:var(--bad);border-color:#6a2f2a}
.sub{color:var(--mute);font-size:12px}
.empty{color:var(--mute);padding:14px 10px}