
:root{color-scheme:dark;--paper:#f2eddb;--muted:#9ba9b0;--gold:#d5aa6c;--ink:#0a1219;--panel:#111d27;--line:#2a3a44}*{box-sizing:border-box}html,body{margin:0;height:100%;font-family:Inter,system-ui,Arial,sans-serif;background:#071016;color:var(--paper)}button,input{font:inherit}button{cursor:pointer;user-select:none}button:focus-visible,input:focus-visible{outline:2px solid var(--gold);outline-offset:3px}.app{min-height:100vh;max-width:1800px;margin:auto}.header{height:65px;border-bottom:1px solid #24333d;display:flex;align-items:center;justify-content:space-between;padding:0 40px}.eyebrow,.seed,.overline,.number,label,small,.viewer-overlay,.mechanism-note,footer,.morse,.manual span{font:500 11px/1.5 'DM Mono',monospace;letter-spacing:.10em}.eyebrow,.overline{color:var(--gold)}.seed{color:#8796a0}.sep{color:#46545a;margin:0 14px}main{min-height:calc(100vh - 124px);display:grid;grid-template-columns:minmax(0,1fr) minmax(355px,410px)}.visual{min-height:720px;position:relative;background:radial-gradient(ellipse at 55% 47%,#20313a 0%,#0a151d 70%,#071016 100%);overflow:hidden;padding:55px 50px}.visual:before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(#6d7d8807 1px,transparent 1px),linear-gradient(90deg,#6d7d8807 1px,transparent 1px);background-size:40px 40px}.overline{position:relative;z-index:1}.overline span{color:#53616b;margin:0 12px}.visual h1{position:relative;z-index:1;font-size:clamp(50px,6vw,98px);letter-spacing:-.068em;margin:17px 0 0;font-weight:900;line-height:1.05}.visual h1 i{font-style:normal;color:var(--gold)}.tagline{position:relative;z-index:1;margin:13px 0;color:#b9c4c8;font-size:16px}.dashboard{border-left:1px solid #24343e;background:var(--panel);padding:33px 31px;box-shadow:-10px 0 50px #0004}.panel-top{display:flex;justify-content:space-between;gap:8px}.number{color:#718793}h2{font-weight:700;font-size:30px;letter-spacing:-.045em;margin:30px 0 12px}.intro,.legal{color:#a9b7bf;font-size:13px;line-height:1.7;margin:0 0 29px}label{display:block;color:#a8b6bd;margin-bottom:10px}.message-row{display:flex;gap:6px}.message-row input{min-width:0;flex:1;border:1px solid #4b606e;background:#0d1720;color:#fff;outline:0;padding:11px 12px;border-radius:3px;font-family:'DM Mono',monospace;font-size:12px}.message-row button{flex-shrink:0;background:var(--gold);border:0;color:#17202a;padding:0 14px;border-radius:3px;font:700 11px 'DM Mono',monospace}.message-row button:hover{background:#eac184}.message-row button span{margin-left:7px}.button-grid{display:flex;gap:7px;margin:8px 0}.minor{flex:1;background:#182832;color:#e4ded0;border:1px solid #334953;border-radius:3px;height:40px;font:500 11px 'DM Mono',monospace}.minor:hover{background:#263b45}.morse{display:none}.manual{display:flex;justify-content:space-between;width:100%;align-items:center;background:#27363e;border:1px solid #57646a;color:#eadcc4;border-radius:4px;height:47px;padding:0 13px;font-weight:700;font-size:12px;margin-top:10px;touch-action:none}.manual span{color:#9daeb6}.manual:active,.manual.holding{background:#986b3a;color:#fff}.divider{height:1px;background:var(--line);margin:27px 0}.metric{margin:20px 0 25px}.metric>div{display:flex;justify-content:space-between;align-items:baseline;gap:8px}.metric output{color:var(--gold);font:500 12px 'DM Mono',monospace;white-space:nowrap}.metric input[type=range]{width:100%;margin:0;accent-color:var(--gold);cursor:pointer}.readouts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.readouts div{background:#0c1820;border:1px solid #26333c;border-radius:4px;padding:12px 9px}.readouts small{display:block;color:#8a9ba6;font-size:9px;height:28px}.readouts strong{display:block;margin-top:10px;font:500 16px 'DM Mono',monospace;color:#f1e1c2}.mechanism-note{font-size:10px;color:#8c9ca6;letter-spacing:0;line-height:1.65;margin:20px 0}.legal{border-top:1px solid #283942;margin:18px 0 0;padding-top:14px;font-size:11px;color:#7e939e}#canvas-container{position:absolute;inset:125px 0 24px;cursor:grab}#canvas-container:active{cursor:grabbing}#canvas-container canvas{display:block;width:100%;height:100%;outline:0}#loading{position:absolute;z-index:3;top:60%;left:50%;transform:translate(-50%,-50%);color:var(--gold);font:500 12px 'DM Mono',monospace;letter-spacing:.1em;white-space:nowrap}.viewer-overlay{position:absolute;left:40px;right:40px;bottom:26px;display:flex;justify-content:space-between;color:#8698a6;z-index:2;font-size:10px;pointer-events:none}.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#a9814f;margin-right:9px;box-shadow:0 0 10px #e5a74a66}.dot.on{background:#8be8b1;box-shadow:0 0 12px #6feeae88}footer{display:flex;justify-content:space-between;gap:20px;color:#80909b;padding:22px 40px;border-top:1px solid #24333d;font-size:10px;line-height:1.5}@media(max-width:1100px){main{grid-template-columns:minmax(0,1fr) 360px}.dashboard{padding:25px 22px}.visual{padding:43px 30px}.visual h1{font-size:64px}.viewer-overlay{left:20px;right:20px}}@media(max-width:820px){main{display:block}.visual{min-height:620px}.dashboard{border-left:0;border-top:1px solid #24343e}.header{padding:0 23px}.viewer-overlay{font-size:9px}footer{padding:20px 23px;font-size:9px}}@media(max-width:490px){.visual{min-height:480px;padding:25px 20px}.visual h1{font-size:51px}.tagline{font-size:13px}#canvas-container{inset:110px 0 24px}.header .seed{font-size:9px}.overline{font-size:9px}.viewer-overlay{left:14px;right:14px;bottom:12px}.viewer-overlay span:last-child{display:none}.dashboard{padding:25px 19px}.readouts strong{font-size:13px}footer span:last-child{display:none}}
