
:root{color-scheme:dark;--bg:#05070b;--panel:#0b1018;--panel2:#111827;--ink:#eff6ff;--muted:#90a4b8;--line:rgba(255,255,255,.12);--line2:rgba(255,255,255,.07);--a:#78f7d1;--b:#7fb2ff;--warn:#ffcc66;--shadow:0 24px 80px rgba(0,0,0,.42);font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 20% 0,rgba(120,247,209,.15),transparent 30%),radial-gradient(circle at 80% 10%,rgba(127,178,255,.12),transparent 35%),var(--bg);color:var(--ink);min-height:100vh}.hero-os{display:grid;grid-template-columns:390px minmax(0,1fr);height:100vh;overflow:hidden}.hero-left{border-right:1px solid var(--line);background:linear-gradient(180deg,rgba(11,16,24,.96),rgba(5,7,11,.98));display:flex;flex-direction:column;min-height:0}.brand{padding:26px 24px 14px;border-bottom:1px solid var(--line2)}.eyebrow{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--a);font-weight:800}.brand h1{font-size:35px;line-height:.92;margin:10px 0 12px;letter-spacing:-.06em}.brand p{color:var(--muted);margin:0 0 18px;line-height:1.45}.launch-row{display:flex;gap:10px;flex-wrap:wrap}.launch-row a,.launch-row button{border:1px solid var(--line);background:#0d1420;color:var(--ink);padding:10px 12px;border-radius:14px;text-decoration:none;font-weight:700;cursor:pointer}.launch-row .primary{background:linear-gradient(135deg,var(--a),var(--b));color:#001318;border:0}.selector-tools{padding:14px 18px;border-bottom:1px solid var(--line2);display:flex;gap:10px}.selector-tools input{width:100%;border:1px solid var(--line);border-radius:14px;background:#060910;color:var(--ink);padding:12px 13px;font-size:14px}.surface-list{overflow:auto;padding:14px;display:grid;gap:11px}.surface-card{border:1px solid var(--line);background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025));border-radius:18px;padding:14px;display:grid;grid-template-columns:44px 1fr;gap:12px;cursor:pointer;text-align:left;color:var(--ink);box-shadow:0 10px 28px rgba(0,0,0,.18)}.surface-card:hover,.surface-card.active{border-color:var(--accent);background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.035))}.surface-card .num{height:44px;width:44px;border-radius:15px;background:var(--accent);color:#02040a;font-weight:900;display:grid;place-items:center}.surface-card strong{display:block;font-size:15px;margin-bottom:3px}.surface-card span{display:block;color:var(--muted);font-size:12px;line-height:1.35}.surface-card small{display:inline-flex;margin-top:8px;color:var(--accent);font:11px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.stage{display:grid;grid-template-rows:auto 1fr;min-width:0}.stage-head{height:68px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 18px 0 22px;background:rgba(5,7,11,.72);backdrop-filter:blur(18px)}.stage-title{min-width:0}.stage-title strong{display:block;font-size:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stage-title span{display:block;color:var(--muted);font-size:12px;margin-top:2px}.stage-actions{display:flex;gap:10px}.stage-actions a,.stage-actions button{border:1px solid var(--line);background:#0d1420;color:var(--ink);padding:10px 12px;border-radius:13px;text-decoration:none;font-weight:750;cursor:pointer}.stage-actions .primary{background:var(--a);color:#001318;border:0}.frame-wrap{position:relative;min-height:0;padding:14px}.browser-frame{height:100%;border:1px solid var(--line);border-radius:22px;overflow:hidden;background:#000;box-shadow:var(--shadow)}#hero-frame{width:100%;height:100%;border:0;background:#fff}.status-strip{position:absolute;left:32px;bottom:26px;z-index:2;display:flex;gap:8px;align-items:center;background:rgba(0,0,0,.7);border:1px solid var(--line);border-radius:999px;padding:8px 12px;color:#cde;font:11px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.pulse{width:8px;height:8px;border-radius:50%;background:var(--a);box-shadow:0 0 20px var(--a)}@media(max-width:980px){.hero-os{grid-template-columns:1fr;height:auto;overflow:visible}.hero-left{height:auto}.stage{height:78vh}.brand h1{font-size:30px}}
