:root{color-scheme:dark;--bg:#080d18;--panel:#101929;--line:#2d5269;--cyan:#8bf2ef;--red:#f77c78;--amber:#f6ba73;--text:#e4e9ec;--muted:#8a9daa;font-family:ui-sans-serif,system-ui,-apple-system,"PingFang SC",sans-serif}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 70% 0%,#18313b 0%,var(--bg) 45%);color:var(--text)}body:before{content:"";position:fixed;inset:0;z-index:10;pointer-events:none;background:repeating-linear-gradient(0deg,transparent 0px,transparent 3px,#0002 4px);opacity:.35}header{height:70px;display:flex;align-items:center;gap:35px;padding:0 4vw;border-bottom:1px solid #47718155;background:#080d18cf}a{color:inherit;text-decoration:none}.brand{font-size:19px;letter-spacing:.22em;font-weight:800}.brand span{color:var(--red);font-size:12px;letter-spacing:.13em}nav{display:flex;gap:24px;color:var(--muted);font-size:13px}nav a:hover{color:var(--cyan)}#identity{margin-left:auto;font:11px ui-monospace,monospace;letter-spacing:.15em;color:var(--cyan)}main{max-width:1600px;margin:auto;padding:0 4vw}.hero{min-height:440px;display:grid;grid-template-columns:40% 60%;position:relative;overflow:hidden;border-bottom:1px solid #48728566}.intro{z-index:2;padding:55px 0 52px}.eyebrow{font:11px ui-monospace,monospace;letter-spacing:.25em;color:var(--cyan)}h1{font-size:clamp(40px,5vw,77px);line-height:1.08;letter-spacing:-.055em;margin:22px 0}h1 em{font-style:normal;color:var(--red)}.intro>p:not(.eyebrow){max-width:430px;color:var(--muted);line-height:1.7;font-size:14px}.actions{display:flex;gap:10px;align-items:center;margin-top:28px;flex-wrap:wrap}button,.file{appearance:none;background:var(--cyan);color:#061419;border:1px solid var(--cyan);padding:12px 17px;cursor:pointer;font:700 12px ui-sans-serif,system-ui;letter-spacing:.08em}button:hover,.file:hover{filter:brightness(1.15)}button:disabled{opacity:.35;cursor:not-allowed}.ghost{background:#122332;color:var(--cyan)}#message{font:12px ui-monospace,monospace!important;color:var(--amber)!important;min-height:2em}canvas{width:100%;height:100%;min-height:440px}.hud{position:absolute;right:2%;bottom:17px;width:57%;display:flex;justify-content:space-between;color:var(--cyan);font:10px ui-monospace,monospace;letter-spacing:.16em;pointer-events:none}.work{display:grid;grid-template-columns:230px 1fr;min-height:620px}.rail{border-right:1px solid #48728566;padding:32px 16px 30px 0}.rail button{display:block;width:100%;text-align:left;background:transparent;border:0;border-left:2px solid transparent;color:var(--muted);padding:17px 12px;font:12px ui-monospace,monospace}.rail button.active{border-color:var(--red);background:#f77c7815;color:var(--text)}.rail p{color:#68808d;font:10px/1.8 ui-monospace,monospace;padding:25px 12px}.content{padding:32px 0 60px 38px;min-width:0}.pane{display:none}.pane.active{display:block}.section-head{border-bottom:1px solid #48728566;padding-bottom:8px;margin-bottom:26px}.section-head h2{font-size:32px;font-weight:500;margin:8px 0 20px}h3{font:12px ui-monospace,monospace;letter-spacing:.18em;color:var(--cyan);margin:32px 0 15px}.transport,.cards,.sliders{display:flex;gap:14px;flex-wrap:wrap;align-items:stretch}.transport{align-items:center}.cards>label,.transport>label,.sliders>label{background:#10202d;border:1px solid #34566a66;padding:13px;min-width:170px;flex:1;color:var(--muted);font:11px ui-monospace,monospace;letter-spacing:.12em}.sliders>label{min-width:180px}.sliders output{float:right;color:var(--cyan)}select,input[type=number]{display:block;width:100%;margin-top:12px;background:#0b1422;border:1px solid #456475;color:var(--text);padding:11px;font:14px ui-monospace,monospace}.transport input{width:90px}input[type=range]{display:block;width:100%;margin:20px 0 5px;accent-color:var(--red)}.toggle{display:flex;align-items:center;gap:15px}.toggle input{accent-color:var(--red)}.hint{font-size:13px;line-height:1.7;color:var(--muted);max-width:690px}.keyboard{display:flex;gap:2px;margin:23px 0;max-width:700px}.keyboard button{flex:1;height:90px;background:#d7e7e7;border:1px solid #4e777a;color:#18313b;padding:0 3px;align-self:start;font-size:10px}.keyboard button.black{background:#183240;color:var(--cyan);height:58px}.keyboard button:active{background:var(--red)}.steps{display:grid;grid-template-columns:repeat(16,minmax(25px,1fr));gap:5px;margin-top:24px}.steps button{aspect-ratio:1;border:1px solid #496579;background:#142b39;color:#96aab5;font:10px ui-monospace,monospace;padding:0}.steps button.on{border-color:var(--red);background:#e0717060;color:white;box-shadow:0 0 15px #eb615548}.file input{display:none}footer{text-align:center;padding:28px;color:#6d8592;font:10px ui-monospace,monospace;letter-spacing:.13em;border-top:1px solid #48728566}@media(max-width:900px){header{gap:15px}.hero{grid-template-columns:1fr}.intro{padding-bottom:5px}.hero canvas{height:300px;min-height:300px}.hud{width:90%}.work{grid-template-columns:1fr}.rail{display:flex;overflow-x:auto;border-right:0;border-bottom:1px solid #48728566;padding:10px 0}.rail button{white-space:nowrap}.rail p{display:none}.content{padding:25px 0}.steps{grid-template-columns:repeat(8,1fr)}}