:root { color-scheme: dark; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; --bg:#030712; --surface:#070d1c; --line:rgb(148 163 184 / 16%); --blue-line:rgb(147 197 253 / 30%); --text:#f8fafc; --muted:#94a3b8; background:var(--bg); }
* { box-sizing:border-box; } html,body { min-height:100%; margin:0; } body { color:var(--text); background:linear-gradient(rgb(255 255 255 / 2%) 1px,transparent 1px),linear-gradient(90deg,rgb(255 255 255 / 2%) 1px,transparent 1px),var(--bg); background-size:72px 72px; }
body::before { position:fixed; z-index:-1; inset:0; content:""; background:radial-gradient(circle at 50% 6%,rgb(37 99 235 / 18%),transparent 38rem); }
a { color:inherit; } .skip-link { position:fixed; z-index:30; top:1rem; left:1rem; padding:.8rem 1rem; color:#030712; background:white; transform:translateY(-180%); } .skip-link:focus { transform:translateY(0); }
.site-header,footer { display:grid; width:min(100% - 3rem,1260px); min-height:88px; margin:auto; grid-template-columns:1fr auto 1fr; align-items:center; gap:2rem; border-bottom:1px solid var(--line); }
.site-header p,footer { color:var(--muted); font-size:.75rem; }.brand { display:inline-flex; width:max-content; align-items:center; gap:.7rem; font-weight:760; text-decoration:none; }.brand span { width:.55rem; height:.55rem; border-radius:50%; background:#93c5fd; box-shadow:0 0 1.2rem rgb(96 165 250 / 90%); }
.text-button { justify-self:end; border:0; color:#bfdbfe; background:transparent; font:inherit; font-size:.75rem; cursor:pointer; }
main { width:min(100% - 3rem,1260px); margin:auto; }.hero { min-height:48svh; display:grid; align-content:center; padding:7rem 0 4rem; border-bottom:1px solid var(--line); }.eyebrow { margin:0 0 1rem; color:#93c5fd; font-size:.67rem; font-weight:760; letter-spacing:.2em; text-transform:uppercase; }
h1,h2,h3,p { text-wrap:balance; }h1 { max-width:10ch; margin:0; font-size:clamp(3.7rem,9vw,8rem); font-weight:720; letter-spacing:-.065em; line-height:.9; }.hero>p:last-child { max-width:650px; color:var(--muted); line-height:1.75; }
.pulse-text { color:#dbeafe; background:linear-gradient(105deg,#2563eb 8%,#60a5fa 31%,#fff 50%,#93c5fd 69%,#2563eb 92%); background-size:240% 100%; background-clip:text; -webkit-background-clip:text; -webkit-text-fill-color:transparent; filter:drop-shadow(0 0 1.3rem rgb(59 130 246 / 24%)); animation:pulse 6s ease-in-out infinite; }
.gate { display:grid; min-height:540px; grid-template-columns:1fr .78fr; gap:5rem; align-items:center; margin:clamp(5rem,9vw,8rem) 0; padding:clamp(2rem,6vw,5rem); border:1px solid var(--blue-line); background:radial-gradient(circle at 5% 100%,rgb(37 99 235 / 20%),transparent 22rem),var(--surface); }.gate h2,.dashboard h2 { margin:0; font-size:clamp(2.7rem,6vw,5.3rem); letter-spacing:-.06em; line-height:.95; }.gate>div>p:last-of-type { max-width:540px; color:var(--muted); line-height:1.75; }
form { display:grid; gap:.6rem; padding:2rem; border:1px solid var(--line); background:rgb(3 7 18 / 65%); }label { margin-top:.5rem; color:#bfdbfe; font-size:.7rem; font-weight:720; letter-spacing:.08em; text-transform:uppercase; }input { min-height:52px; border:1px solid var(--blue-line); border-radius:0; padding:.8rem 1rem; color:white; background:#030712; font:inherit; }input:focus { outline:2px solid #60a5fa; outline-offset:2px; }
.form-actions,.card-actions,.filter-row { display:flex; flex-wrap:wrap; gap:.7rem; margin-top:1rem; }.button,.filter { display:inline-flex; min-height:44px; align-items:center; justify-content:center; padding:.7rem 1.05rem; border:1px solid transparent; border-radius:999px; font:inherit; font-size:.77rem; font-weight:720; cursor:pointer; }.button-primary { color:#07101d; background:white; }.button-secondary,.filter { border-color:var(--blue-line); color:#dbeafe; background:rgb(15 23 42 / 58%); }.form-status,.inventory-status { min-height:1.4rem; color:#bfdbfe; font-size:.78rem; }
#mfa-qr { display:block; width:min(100%,220px); margin:2rem 0 1rem; padding:.8rem; background:white; }#mfa-secret { display:block; max-width:100%; overflow-wrap:anywhere; color:#bfdbfe; }
.dashboard { padding:clamp(5rem,9vw,8rem) 0; }.dashboard-head { display:flex; align-items:end; justify-content:space-between; gap:3rem; margin-bottom:2rem; }.filter { color:var(--muted); }.filter.active { border-color:#93c5fd; color:#07101d; background:#dbeafe; }.filter b { margin-left:.5rem; }
.inventory { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-top:1px solid var(--line); border-left:1px solid var(--line); }.entity-card { display:flex; min-height:460px; flex-direction:column; padding:1.5rem; border-right:1px solid var(--line); border-bottom:1px solid var(--line); background:linear-gradient(145deg,rgb(255 255 255 / 2%),transparent); }.entity-card[hidden] { display:none; }.entity-top { display:flex; justify-content:space-between; gap:1rem; }.state,.visibility { font:.64rem ui-monospace,monospace; letter-spacing:.06em; text-transform:uppercase; }.state-live { color:#86efac; }.state-queued { color:#93c5fd; }.visibility { color:#64748b; }.entity-card h3 { margin:3.5rem 0 .5rem; font-size:1.55rem; letter-spacing:-.04em; }.host { margin:0 0 2rem; color:#93c5fd; font:.76rem ui-monospace,monospace; overflow-wrap:anywhere; }
dl { display:grid; grid-template-columns:7rem 1fr; gap:.6rem 1rem; margin:0; font-size:.73rem; }dt { color:#64748b; }dd { margin:0; color:#b8c2d1; overflow-wrap:anywhere; }.card-actions { margin-top:auto; padding-top:1.5rem; border-top:1px solid var(--line); }.card-actions a { color:#bfdbfe; font-size:.72rem; text-underline-offset:.3rem; }
footer { min-height:100px; border-top:1px solid var(--line); border-bottom:0; }footer a:nth-child(2) { justify-self:center; }footer a:last-child { justify-self:end; }
@keyframes pulse { 0%,100% { background-position:0 50%; filter:drop-shadow(0 0 .8rem rgb(37 99 235 / 18%)); } 50% { background-position:100% 50%; filter:drop-shadow(0 0 1.8rem rgb(147 197 253 / 42%)); } }
@media(max-width:900px){.gate{grid-template-columns:1fr;gap:2rem}.dashboard-head{display:block}.inventory{grid-template-columns:1fr 1fr}.filter-row{margin-top:2rem}}
@media(max-width:580px){.site-header,main,footer{width:min(100% - 2rem,1260px)}.site-header{grid-template-columns:1fr auto}.site-header p{display:none}h1{font-size:clamp(3.5rem,18vw,5.5rem)}.gate,form{padding:1.4rem}.inventory{grid-template-columns:1fr}.dashboard-head h2{font-size:3rem}footer{grid-template-columns:1fr auto}footer a:nth-child(2){display:none}}
@media(prefers-reduced-motion:reduce){.pulse-text{animation:none;background-position:50% 50%}*{transition-duration:.01ms!important}}