:root{color-scheme:dark;--bg:#102027;--bg2:#12292f;--card:#17323a;--line:#2c4650;--field:#0d2228;--fline:#3e5c66;--txt:#f6f3ea;--mut:#a9bfbd;--gold:#e6b35a;--green:#b7efc8;--red:#ffb4a8;--r:14px}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:radial-gradient(ellipse at top,#1a3941 0,var(--bg) 55%) fixed var(--bg);color:var(--txt);font:16px/1.55 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
a{color:var(--gold)}code{background:#0b161b;border:1px solid var(--line);border-radius:6px;padding:.1rem .4rem;font-size:.92em}
h1{font-size:1.5rem;margin:.2rem 0 1rem}h2{font-size:1.1rem;margin:.2rem 0 .8rem}
.wrap{max-width:1100px;margin:0 auto;padding:1rem 16px 3rem}
.top{display:flex;align-items:center;gap:.8rem;max-width:1100px;margin:0 auto;padding:.8rem 16px}
.brand{display:flex;align-items:center;gap:.5rem;text-decoration:none;color:var(--txt);font-weight:800;letter-spacing:.14em;font-size:1.05rem;margin-right:auto}.brand b{color:var(--gold)}.brand img{width:30px;height:30px}
.who{color:var(--mut);font-size:.88rem}
.tabs{max-width:1100px;margin:0 auto;padding:0 16px;display:flex;flex-wrap:wrap;gap:.3rem}
.tabs a{text-decoration:none;color:var(--mut);padding:.45rem .8rem;border-radius:999px;font-size:.92rem}.tabs a.on,.tabs a:hover{background:var(--card);color:var(--gold)}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:1.1rem 1.2rem;margin:0 0 1rem;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.narrow{max-width:520px}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}@media(max-width:800px){.grid2{grid-template-columns:1fr}}
label{display:block;font-size:.85rem;color:var(--mut);margin:.7rem 0 .2rem}
input,select,textarea{width:100%;background:#0b161b;color:var(--txt);border:1px solid var(--line);border-radius:10px;padding:.62rem .75rem;font:inherit}
input:focus,select:focus,textarea:focus{outline:2px solid var(--gold);outline-offset:1px}
form.inline{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;margin:.3rem 0}form.inline input,form.inline select{width:auto}
.btn{display:inline-block;background:linear-gradient(180deg,#f0c675,#d9a443);color:#2a1d04;border:0;border-radius:10px;padding:.65rem 1.1rem;font-weight:700;font:inherit;font-weight:700;cursor:pointer;text-decoration:none;margin-top:.8rem}
.btn.sm{padding:.35rem .7rem;font-size:.88rem;margin:0}.btn.ghost{background:transparent;color:var(--gold);border:1px solid var(--line)}.btn.danger{background:#7a2a22;color:#ffd9d3}
.alert{border-radius:10px;padding:.7rem .9rem;margin:0 0 1rem;border:1px solid var(--line);word-break:break-word}.alert.ok{background:#12372c;border-color:#245a47}.alert.err{background:#3a1f1c;border-color:#6d342d}.alert.warn{background:#3a3019;border-color:#6b5a2a}
.pill{display:inline-block;border-radius:999px;padding:.1rem .6rem;font-size:.78rem;font-weight:700;letter-spacing:.03em;border:1px solid}.pill.ok{color:var(--green);border-color:#2f6b55}.pill.warn{color:var(--gold);border-color:#6b5a2a}.pill.bad{color:var(--red);border-color:#7a3a33}
.muted{color:var(--mut)}.small{font-size:.85rem}.pos{color:var(--green)}.neg{color:var(--red)}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.8rem;margin-bottom:1rem}
.stat{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:.9rem 1rem}.stat span{display:block;color:var(--mut);font-size:.82rem}.stat strong{font-size:1.7rem}
.tablewrap{overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:.93rem}th,td{text-align:left;padding:.55rem .6rem;border-bottom:1px solid var(--line);vertical-align:top}th{color:var(--mut);font-weight:600;font-size:.8rem;text-transform:uppercase;letter-spacing:.05em}
.acts form{margin:.2rem 0}.foot{text-align:center;color:var(--mut);font-size:.85rem;padding:1.5rem}
/* landing */
.hero{max-width:1100px;margin:0 auto;padding:3.5rem 16px 2rem;text-align:center}.hero h1{font-size:clamp(2rem,6vw,3.4rem);line-height:1.1;margin:.6rem 0}.hero h1 b{color:var(--gold)}
.hero p.lead{max-width:640px;margin:0 auto 1.4rem;color:var(--mut);font-size:1.1rem}
.features{max-width:1100px;margin:0 auto;padding:1rem 16px;display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1rem}
.feat{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:1.1rem}.feat h3{margin:.2rem 0 .4rem;color:var(--gold);font-size:1.02rem}.feat p{margin:0;color:var(--mut);font-size:.93rem}
.steps{max-width:820px;margin:2rem auto;padding:0 16px;counter-reset:s}.steps li{list-style:none;counter-increment:s;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:.9rem 1rem .9rem 3.2rem;margin:.6rem 0;position:relative}
.steps li:before{content:counter(s);position:absolute;left:.9rem;top:.75rem;width:1.7rem;height:1.7rem;border-radius:50%;background:var(--gold);color:#2a1d04;font-weight:800;display:grid;place-items:center}
.cta{text-align:center;padding:2rem 16px 3rem}

/* device page */
.device-grid{align-items:stretch}
.device-card{display:flex;flex-direction:column;height:100%}
.device-form .btn{margin-top:1rem}
.meta-list{display:grid;grid-template-columns:1fr 1fr;gap:.55rem .9rem;margin:1.1rem 0 0;padding-top:1rem;border-top:1px solid var(--line)}
.meta-list dt{font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:var(--mut);margin:0}
.meta-list dd{margin:.1rem 0 0;font-size:.92rem;word-break:break-word}
.meta-list code{font-size:.85em}
.lic-summary{background:#0b161b;border:1px solid var(--line);border-radius:12px;padding:.85rem 1rem;margin:0 0 1rem}
.lic-summary-top{display:flex;flex-wrap:wrap;align-items:center;gap:.45rem;margin-bottom:.35rem}
.plan-badge{display:inline-block;background:linear-gradient(180deg,#f0c675,#d9a443);color:#2a1d04;border-radius:999px;padding:.18rem .7rem;font-size:.78rem;font-weight:800;letter-spacing:.02em}
.lic-expire{margin:0;font-size:.95rem;color:var(--txt)}
.lic-actions{display:flex;flex-direction:column;gap:.75rem;margin:0 0 1.1rem}
.lic-actions .btn{margin-top:0;width:100%;text-align:center}
.revoke-form label{margin-top:0}
.revoke-form .btn{margin-top:.55rem}
.lic-table{margin-top:.2rem}
.danger-zone{border-color:#6d342d;background:linear-gradient(180deg,#2a1a18 0%,var(--card) 55%)}
.danger-zone h2{color:var(--red)}
.danger-zone .btn{margin-top:.4rem}
@media(max-width:800px){
  .meta-list{grid-template-columns:1fr}
}
@media(min-width:801px){
  .lic-actions .btn{width:auto;align-self:flex-start}
  .revoke-form .btn{width:auto}
}

/* SIMPLY FI portal look (matches the router captive portal) */
body{line-height:1.5}
.top{border-bottom:1px solid rgba(164,197,195,.14)}
.brand{letter-spacing:.13em}.brand img{width:1.9rem;height:1.9rem}
.card,.stat,.feat,.steps li{background:rgba(23,50,58,.96);border:1px solid #2f515a;box-shadow:0 26px 64px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.035)}
.card.narrow{margin-left:auto;margin-right:auto;margin-top:6vh;border-radius:20px;padding:1.4rem}
.card h2,.feat h3{letter-spacing:.02em}
.stat{background:linear-gradient(160deg,#17363e,#12292f)}.stat span{font-size:.7rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.stat strong{font-variant-numeric:tabular-nums;color:var(--txt)}
input,select,textarea{background:var(--field);border-color:var(--fline);min-height:44px}textarea{min-height:88px}
.btn,button.btn{background:var(--gold);color:#1b1406;min-height:44px;transition:transform 120ms ease,filter 140ms ease;box-shadow:0 6px 18px rgba(230,179,90,.18)}
.btn:hover{filter:brightness(1.07)}.btn:active{transform:translateY(1px)}
.btn.sm{min-height:36px}.btn.ghost{background:rgba(230,179,90,.09);border:1px solid rgba(230,179,90,.24);box-shadow:none}
.btn.danger{background:rgba(255,180,168,.12);color:var(--red);border:1px solid rgba(255,180,168,.45);box-shadow:none}
.tabs a{border:1px solid transparent}.tabs a.on,.tabs a:hover{background:rgba(230,179,90,.09);border-color:rgba(230,179,90,.24);color:var(--gold)}
.pill{padding:.18rem .7rem;letter-spacing:.1em;text-transform:uppercase;font-size:.7rem}
.pill.ok{background:rgba(183,239,200,.1);border-color:currentColor}.pill.warn{background:rgba(230,179,90,.1);border-color:currentColor}.pill.bad{background:rgba(255,180,168,.1);border-color:currentColor}
.alert.ok{background:rgba(183,239,200,.08);border-color:rgba(183,239,200,.35);color:var(--green)}.alert.err{background:rgba(255,180,168,.08);border-color:rgba(255,180,168,.4);color:var(--red)}.alert.warn{background:rgba(230,179,90,.08);border-color:rgba(230,179,90,.35)}
th{color:var(--mut);font-size:.66rem;font-weight:800;letter-spacing:.1em}tbody tr:hover{background:rgba(16,39,46,.62)}td{font-variant-numeric:tabular-nums}
code,.lic-summary{background:var(--field)}
.hero h1 b,.feat h3{color:var(--gold)}
.steps li:before{color:#1b1406}
.plan-badge{background:var(--gold);color:#1b1406}
.foot{border-top:1px solid rgba(164,197,195,.1);margin-top:1rem}
