:root{--skw-bg:#050505;--skw-card:#111827;--skw-card2:#0b1020;--skw-text:#f8fafc;--skw-muted:#a3aab8;--skw-line:rgba(148,163,184,.24);--skw-blue:#0f62fe;--skw-cyan:#22d3ee;--skw-purple:#8b5cf6;--skw-green:#22c55e;--skw-amber:#f59e0b;--skw-red:#ef4444;--radius:24px;--shadow:0 24px 80px rgba(0,0,0,.32)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 18% 0,rgba(15,98,254,.28),transparent 30rem),radial-gradient(circle at 90% 8%,rgba(139,92,246,.2),transparent 28rem),var(--skw-bg);color:var(--skw-text);font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;line-height:1.55}.skip{position:absolute;left:-999px;top:10px;background:#fff;color:#000;padding:.7rem 1rem;border-radius:999px}.skip:focus{left:10px;z-index:20}.wrap{width:min(1240px,calc(100% - 32px));margin:0 auto}.hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr);gap:1.25rem;padding:5rem 0 2rem}.eyebrow{color:var(--skw-cyan);text-transform:uppercase;letter-spacing:.16em;font-size:.78rem;font-weight:900}.hero h1{font-size:clamp(2.6rem,7vw,5.7rem);line-height:.92;letter-spacing:-.075em;margin:.75rem 0 1rem}.lead{font-size:1.13rem;color:var(--skw-muted);max-width:840px}.panel,.workspace,.card,.locked-panel{border:1px solid var(--skw-line);border-radius:var(--radius);background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.035));box-shadow:var(--shadow)}.panel,.card,.locked-panel{padding:1.35rem}.actions,.tabs,.pills{display:flex;flex-wrap:wrap;gap:.7rem}.btn{appearance:none;border:1px solid var(--skw-line);background:rgba(255,255,255,.06);color:var(--skw-text);border-radius:999px;padding:.82rem 1rem;text-decoration:none;font-weight:800;cursor:pointer}.btn:hover,.btn:focus{outline:0;border-color:var(--skw-cyan)}.btn[disabled],.tab[disabled]{opacity:.45;cursor:not-allowed}.btn.primary{border:0;background:linear-gradient(135deg,var(--skw-blue),var(--skw-purple))}.btn.good{border-color:rgba(34,197,94,.5);background:rgba(34,197,94,.16)}.btn.small{font-size:.84rem;padding:.58rem .78rem}.banner{border:1px solid rgba(245,158,11,.4);background:rgba(245,158,11,.12);border-radius:18px;padding:1rem;margin-top:1rem;color:#fde68a}.dashboard{display:grid;gap:1rem}.access-state{border:1px solid var(--skw-line);border-radius:16px;padding:.85rem;background:rgba(0,0,0,.24);font-weight:900}.access-state.granted{border-color:rgba(34,197,94,.5);color:#86efac}.access-state.denied{border-color:rgba(245,158,11,.5);color:#fde68a}.meter{height:12px;background:rgba(255,255,255,.09);border-radius:999px;overflow:hidden}.bar{height:100%;width:0;background:linear-gradient(90deg,var(--skw-blue),var(--skw-cyan),var(--skw-green));transition:width .25s}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem}.metric{border:1px solid var(--skw-line);border-radius:18px;padding:.85rem;background:rgba(0,0,0,.22)}.metric strong{display:block;font-size:1.4rem}.metric span{font-size:.78rem;color:var(--skw-muted)}.facts{display:grid;gap:.55rem}.fact{display:flex;justify-content:space-between;gap:1rem;border-bottom:1px solid var(--skw-line);padding:.55rem 0}.fact span{color:var(--skw-muted);text-align:right}.public-overview{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin:1rem 0 2rem}.layout{display:grid;grid-template-columns:310px minmax(0,1fr);gap:1.2rem;align-items:start;padding:1rem 0 4rem}.sidebar{position:sticky;top:1rem;display:grid;gap:1rem}.tab{border:1px solid var(--skw-line);background:rgba(0,0,0,.26);color:var(--skw-text);border-radius:999px;padding:.7rem .9rem;font-weight:900;cursor:pointer}.tab[aria-selected=true]{background:linear-gradient(135deg,var(--skw-blue),var(--skw-purple));border-color:transparent}.nav{display:grid;gap:.55rem;max-height:58vh;overflow:auto;padding-right:.25rem}.nav button{width:100%;text-align:left;border:1px solid var(--skw-line);border-radius:16px;background:rgba(0,0,0,.28);color:var(--skw-text);padding:.8rem;cursor:pointer}.nav button:hover,.nav button[aria-current=true]{border-color:var(--skw-cyan);background:rgba(34,211,238,.08)}.nav small{display:block;color:var(--skw-muted);margin-top:.2rem}.workspace{padding:1.4rem;min-height:620px}.workspace h2,.locked-panel h2{font-size:clamp(2rem,4.5vw,4.3rem);line-height:.98;letter-spacing:-.055em;margin:.35rem 0 1rem}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.card h3{margin:.1rem 0 .5rem}.card p,.card li,.muted{color:var(--skw-muted)}.card ul{margin:.4rem 0 0;padding-left:1.2rem}.pill{border:1px solid var(--skw-line);border-radius:999px;padding:.45rem .75rem;color:var(--skw-muted);background:rgba(0,0,0,.22);font-size:.86rem}.section-title{margin-top:1.5rem}.question,.lab-detail{border:1px solid var(--skw-line);border-radius:18px;padding:1rem;background:rgba(0,0,0,.22);margin-top:1rem}.question fieldset{border:0;margin:0;padding:0}.question legend{font-weight:900;margin-bottom:.5rem}.question label{display:block;border:1px solid var(--skw-line);border-radius:14px;padding:.7rem;margin:.45rem 0;cursor:pointer}.question label:hover{border-color:var(--skw-cyan)}.feedback{min-height:1.4rem;font-weight:800;color:var(--skw-muted)}.feedback.ok{color:var(--skw-green)}.feedback.bad{color:var(--skw-red)}textarea,input[type=url]{width:100%;background:rgba(0,0,0,.36);border:1px solid var(--skw-line);border-radius:14px;color:var(--skw-text);font:inherit;padding:.85rem}textarea{min-height:140px}.code{border:1px solid var(--skw-line);border-radius:14px;background:#020617;padding:.85rem;overflow:auto;color:#dbeafe}.code code{white-space:pre-wrap}.lab-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.lab-card{border:1px solid var(--skw-line);border-radius:18px;background:rgba(0,0,0,.24);padding:1rem;display:grid;gap:.7rem}.lab-card p{color:var(--skw-muted);margin:0}.footer{border-top:1px solid var(--skw-line);padding:2rem 0;color:var(--skw-muted)}@media(max-width:980px){.hero,.layout,.public-overview{grid-template-columns:1fr}.sidebar{position:static}.grid,.lab-grid{grid-template-columns:1fr}.nav{max-height:none}}@media(max-width:620px){.wrap{width:min(100% - 22px,1240px)}.hero{padding-top:2rem}.metrics{grid-template-columns:1fr}.tabs{display:grid}.tab{width:100%}}
