:root{color-scheme:dark;--bg:#050816;--panel:#0b1020;--panel2:#10172a;--line:rgba(148,163,184,.25);--cyan:#22d3ee;--green:#39ff14;--pink:#f044ff;--orange:#ff8a00;--yellow:#facc15;--text:#e5f5ff;--muted:#91a4bc;--mono:"IBM Plex Mono","Cascadia Mono","Fira Code",ui-monospace,SFMono-Regular,Menlo,monospace}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 12% 10%,rgba(34,211,238,.22),transparent 28%),radial-gradient(circle at 90% 15%,rgba(240,68,255,.18),transparent 32%),linear-gradient(180deg,#030612,#07111f 45%,#050816);color:var(--text);font-family:var(--mono);min-height:100vh;overflow-x:hidden}body:before{content:"";position:fixed;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:28px 28px;mask-image:linear-gradient(#000,transparent 95%);pointer-events:none}body:after{content:"";position:fixed;inset:0;background:repeating-linear-gradient(0deg,rgba(255,255,255,.035) 0 1px,transparent 1px 4px);mix-blend-mode:screen;opacity:.2;pointer-events:none}.skip{position:absolute;left:-999px;top:auto}.skip:focus{left:1rem;top:1rem;z-index:20;background:#fff;color:#000;padding:.75rem}.progress{position:fixed;z-index:99;top:0;left:0;height:3px;background:linear-gradient(90deg,var(--cyan),var(--green),var(--pink));width:0}.statusbar{position:sticky;top:0;z-index:50;display:flex;gap:1rem;align-items:center;padding:.65rem clamp(.8rem,2vw,1.5rem);border-bottom:1px solid var(--line);background:rgba(5,8,22,.82);backdrop-filter:blur(16px)}.brand{display:flex;align-items:center;gap:.7rem;color:var(--text);text-decoration:none;font-weight:900;letter-spacing:.08em}.brand img{width:30px;height:30px;border-radius:9px}.live{margin-left:auto;color:var(--muted);font-size:.78rem}.live i{display:inline-block;width:9px;height:9px;background:var(--green);box-shadow:0 0 16px var(--green);border-radius:99px;margin-right:.5rem}.install,.toolbar button,.hero-actions button,.tabs button,.panel-head button,.button-link,.mobile-actions button{border:1px solid rgba(255,255,255,.28);background:#111827;color:var(--text);padding:.72rem .95rem;text-transform:uppercase;letter-spacing:.08em;font:800 .75rem var(--mono);cursor:pointer;box-shadow:0 0 0 1px rgba(0,0,0,.4),0 8px 22px rgba(0,0,0,.25)}button:hover,.button-link:hover{border-color:var(--cyan);color:#001018;background:var(--cyan)}.shell{width:min(1460px,calc(100% - 2rem));margin-inline:auto}.hero{display:grid;grid-template-columns:minmax(320px,1fr) minmax(320px,.9fr);gap:1.2rem;align-items:center;min-height:calc(100svh - 72px);padding:2rem 0}.orb-card,.panel{border:1px solid var(--line);background:linear-gradient(135deg,rgba(15,23,42,.9),rgba(8,13,30,.72));box-shadow:0 24px 80px rgba(0,0,0,.35),inset 0 0 0 1px rgba(255,255,255,.04)}.orb-card{position:relative;min-height:520px;overflow:hidden;border-radius:28px}.orb-card canvas{width:100%;height:100%;display:block;min-height:520px}.orb-caption{position:absolute;left:1.2rem;right:1.2rem;bottom:1.2rem;display:flex;justify-content:space-between;border:1px solid var(--line);padding:.8rem 1rem;background:rgba(0,0,0,.42);backdrop-filter:blur(12px)}.kicker{color:var(--orange);font-weight:900;letter-spacing:.24em;text-transform:uppercase;font-size:.8rem}.hero h1{font-size:clamp(3.2rem,8vw,9rem);line-height:.82;margin:.3rem 0;text-transform:uppercase;letter-spacing:-.08em;text-shadow:0 0 28px rgba(34,211,238,.22)}.hero h1 span{color:var(--green);text-shadow:0 0 24px rgba(57,255,20,.32)}.hero p{font-size:1rem;line-height:1.8;color:#c9d7ea;max-width:68ch}.hero-actions{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.4rem}.hero-actions button:first-child,.toolbar button:first-child,.panel-head button{background:linear-gradient(90deg,#22d3ee,#39ff14);color:#031018}.tabs{position:sticky;top:55px;z-index:20;display:flex;gap:.25rem;overflow-x:auto;padding:.35rem;background:rgba(3,6,18,.65);backdrop-filter:blur(16px);border:1px solid var(--line);border-radius:16px;margin-bottom:1rem}.tabs button{white-space:nowrap;background:#0b1020;color:#a8b7ce}.tabs button.active{background:var(--pink);color:#070712;border-color:var(--pink)}.panel{border-radius:24px;padding:clamp(1rem,2vw,1.5rem);margin-bottom:1.25rem}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1rem}.panel-head h2{font-size:clamp(1.8rem,4vw,4.2rem);margin:0;letter-spacing:-.06em;text-transform:uppercase}.status-pill{border:1px solid var(--green);color:var(--green);padding:.5rem .8rem;font-weight:900;background:rgba(57,255,20,.08)}.studio-grid{display:grid;grid-template-columns:230px minmax(360px,1fr) minmax(360px,.9fr);gap:1rem;min-height:640px}.files,.editor-wrap,.terminal-wrap{border:1px solid var(--line);background:rgba(0,0,0,.32);min-height:0}.files{padding:1rem;display:flex;flex-direction:column;gap:.55rem}.file{padding:.75rem;text-align:left;border:1px solid var(--line);background:#0f172a;color:var(--text);cursor:pointer;font:800 .78rem var(--mono)}.file.active{border-color:var(--cyan);box-shadow:0 0 24px rgba(34,211,238,.15);color:var(--cyan)}.mini-card{margin-top:.5rem;border:1px solid var(--line);padding:.75rem;display:grid;gap:.25rem}.mini-card span,.metrics span{color:var(--muted);font-size:.72rem;text-transform:uppercase}.mini-card b{color:var(--green)}.editor-title,.terminal-title{display:flex;justify-content:space-between;gap:.5rem;align-items:center;padding:.7rem .85rem;border-bottom:1px solid var(--line);background:#060b17;color:var(--yellow);font-weight:900}#editor{width:100%;height:calc(100% - 104px);min-height:510px;resize:vertical;border:0;outline:0;background:linear-gradient(180deg,#06140d,#030906);color:#7CFF9F;font:700 clamp(.82rem,1.2vw,1rem)/1.7 var(--mono);padding:1.1rem;tab-size:4;caret-color:var(--green)}.toolbar{display:flex;gap:.5rem;flex-wrap:wrap;padding:.7rem;border-top:1px solid var(--line);background:#080c16}.toolbar button{padding:.65rem .75rem}.terminal-wrap pre{margin:0;height:calc(100% - 42px);min-height:590px;overflow:auto;padding:1.1rem;background:radial-gradient(circle at 80% 120%,rgba(34,211,238,.14),transparent 40%),#020403;color:#e8ffff;font:800 clamp(.78rem,1.05vw,.95rem)/1.75 var(--mono);white-space:pre-wrap}.terminal-wrap{position:relative;overflow:hidden}.terminal-wrap:after{content:"BEAM";position:absolute;right:-.25em;bottom:-.32em;font-size:min(18vw,15rem);font-weight:900;color:rgba(255,255,255,.055);pointer-events:none;letter-spacing:-.08em}.metrics{display:grid;grid-template-columns:repeat(5,1fr);border:1px solid var(--line);border-top:0}.metrics div{padding:.85rem 1rem;border-right:1px solid var(--line);display:grid;gap:.4rem}.metrics div:last-child{border-right:0}.metrics b{color:var(--green);font-size:1.2rem}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}.cards article,.otp-source-box,.split-doc,.guide-grid>div{border:1px solid var(--line);background:rgba(0,0,0,.28);padding:1rem}.cards h3{color:var(--cyan);font-size:1.35rem;margin:.2rem 0;text-transform:uppercase}.cards code,.split-doc code{color:var(--green)}.tree{min-height:260px;display:grid;place-items:center;gap:1rem;background:linear-gradient(180deg,rgba(34,211,238,.08),rgba(249,115,22,.07));border:1px solid var(--line);padding:1.2rem;overflow:hidden}.node{border:2px solid var(--cyan);padding:1rem 1.2rem;text-align:center;box-shadow:0 0 30px rgba(34,211,238,.22);background:#07111f;font-weight:900}.node.sup{border-color:var(--pink);box-shadow:0 0 30px rgba(240,68,255,.2)}.node small{color:var(--muted)}.children{display:flex;gap:1rem;flex-wrap:wrap;justify-content:center}.tree-line{height:42px;width:2px;background:var(--line)}.timeline{display:grid;gap:.5rem;margin:1rem 0 0;padding-left:1.2rem}.timeline li{padding:.55rem .75rem;border-left:3px solid var(--green);background:rgba(57,255,20,.07)}.split-doc{display:grid;grid-template-columns:1.2fr .8fr;gap:1rem;align-items:center}.split-doc pre{margin:0;overflow:auto;background:#020403;border:1px solid var(--line);padding:1rem;color:#eaffff}.guide-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}.button-link{display:inline-block;text-decoration:none}.mobile-actions{display:none}.shake{animation:shake .45s ease}.restart{animation:pulse 1.2s ease}@keyframes shake{0%,100%{transform:translateX(0)}20%{transform:translateX(-8px)}40%{transform:translateX(8px)}60%{transform:translateX(-5px)}80%{transform:translateX(5px)}}@keyframes pulse{50%{box-shadow:0 0 50px var(--green);border-color:var(--green)}}@media(max-width:1120px){.hero,.studio-grid,.split-doc{grid-template-columns:1fr}.studio-grid{min-height:0}.files{display:grid;grid-template-columns:repeat(2,1fr)}#editor,.terminal-wrap pre{min-height:420px}.metrics{grid-template-columns:repeat(2,1fr)}.cards,.guide-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:700px){.statusbar{gap:.55rem;padding:.52rem}.brand span{font-size:.68rem}.live{display:none}.install{padding:.5rem;font-size:.62rem}.shell{width:calc(100% - .75rem)}.hero{min-height:auto;padding:1rem 0}.orb-card{min-height:290px;border-radius:18px}.orb-card canvas{min-height:290px}.orb-caption{font-size:.72rem}.hero h1{font-size:clamp(2.8rem,17vw,5.4rem)}.panel{border-radius:16px;padding:.75rem}.tabs{top:46px;border-radius:0}.files{grid-template-columns:1fr}.editor-wrap,.terminal-wrap{max-width:100%;overflow:hidden}#editor{min-height:380px;font-size:.78rem;line-height:1.55}.terminal-wrap pre{min-height:360px;font-size:.75rem;line-height:1.55}.toolbar{display:grid;grid-template-columns:repeat(2,1fr)}.toolbar button{font-size:.62rem}.metrics,.cards,.guide-grid{grid-template-columns:1fr}.panel-head{align-items:flex-start;flex-direction:column}.mobile-actions{position:sticky;bottom:0;z-index:80;display:grid;grid-template-columns:repeat(3,1fr);gap:.35rem;padding:.45rem;background:rgba(3,6,18,.85);backdrop-filter:blur(12px);border-top:1px solid var(--line)}.mobile-actions button{padding:.8rem .2rem;font-size:.67rem}}