*{box-sizing:border-box} :root{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;color:#bcd7d1;background:#0b1419;color-scheme:dark}body{margin:0;background:radial-gradient(ellipse at 80% 0,#173031 0,transparent 55%),#0b1419}main{max-width:1000px;margin:auto;padding:40px 30px 24px}.eyebrow,small{font-size:10px;letter-spacing:2px;color:#91a9a1}.headline{display:flex;justify-content:space-between;align-items:center;gap:15px}h1{font-family:Georgia,serif;font-size:44px;line-height:1.02;font-weight:400;margin:18px 0 12px;color:#e4eee4}h1 span{display:block;font:11px ui-monospace,monospace;letter-spacing:6px;text-transform:uppercase;margin-top:12px;color:#8dbbb0}header p{font-size:12px;color:#91a9a1;margin:0 0 27px}.instruments{display:grid;grid-template-columns:1fr 2fr 1fr 1fr;border:1px solid #34504c;border-bottom:0;background:#12221f}.instruments>div{padding:15px 20px;border-right:1px solid #34504c}.instruments b{display:block;font-weight:400;font-size:13px;margin-top:7px;color:#d0dfbd}.viewport{border:1px solid #34504c;background:#142328;overflow:hidden}.viewtop,.viewbottom{display:flex;justify-content:space-between;font-size:10px;letter-spacing:1.5px;padding:12px 17px;background:#101f23}.viewtop strong{font-weight:400}.viewtop i{display:inline-block;background:#a5c88a;border-radius:50%;height:6px;width:6px;margin-right:9px;box-shadow:0 0 10px #b7dc87}.viewbottom{font-size:9px;color:#779992;border-top:1px solid #28413d}canvas{display:block;width:100%;height:auto;aspect-ratio:8/5;outline:none;touch-action:none}canvas:focus-visible{outline:2px solid #9fcdb8;outline-offset:-3px}.command{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 0;border-bottom:1px solid #34504c}.command p{font-size:12px;line-height:1.7;max-width:570px;margin:7px 0 0}button{font:11px ui-monospace,monospace;cursor:pointer;border:1px solid #3b5752;background:#162a2b;color:#c6ded5;border-radius:4px;padding:13px 17px;min-height:44px;touch-action:manipulation}button:hover{background:#234440;border-color:#80ae9a}button:focus-visible,a:focus-visible{outline:2px solid #ebd8a4;outline-offset:3px}.primary{background:#c5d8af;color:#142622;border-color:#c5d8af;white-space:nowrap}.primary:hover{background:#dfebcc}.ghost{background:transparent}.controls{display:flex;gap:25px;align-items:center;justify-content:space-between;padding:25px 0}.helm{display:flex;gap:6px;align-items:center}.helm>div{display:grid;gap:6px}.helm button{min-width:70px;font-size:21px;padding:8px}.helm small{display:block;font-size:8px;letter-spacing:0;margin-top:3px}.actions{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end;max-width:540px}.actions p{flex-basis:100%;font-size:10px;line-height:1.7;text-align:right;color:#7f9b91;margin:4px 0 0}footer{display:grid;gap:10px;border-top:1px solid #34504c;padding-top:18px;font-size:9px;color:#7d9e92;line-height:1.8}a{color:#aac3ac}dialog{background:#12262a;color:#c8ded5;border:1px solid #55766a;border-radius:8px;max-width:560px;width:calc(100% - 32px);padding:30px}dialog::backdrop{background:#020e12c9;backdrop-filter:blur(5px)}dialog h2{font:30px Georgia,serif;color:#e4eee4}dialog p{font-size:12px;line-height:1.9}dialog button{margin-top:10px}@media(max-width:650px){main{padding:22px 14px}h1{font-size:32px}h1 span{letter-spacing:3px}.headline{align-items:flex-start}.headline>.ghost{padding:10px;margin-top:20px;font-size:10px}.instruments>div{padding:12px 8px}.instruments b{font-size:10px}small{font-size:8px;letter-spacing:1px}.command{display:block;padding:16px 0}.command .primary{width:100%;margin-top:14px}.controls{gap:10px;align-items:flex-start}.helm button{min-width:46px;padding:8px 4px}.actions{max-width:180px}.actions button{font-size:9px;flex-grow:1;padding:10px}.actions p{font-size:9px}.viewbottom{font-size:7px;letter-spacing:0}footer{font-size:8px}dialog{padding:22px}}