:root{color-scheme:dark;font-family:system-ui,-apple-system,sans-serif;color:#ecf8ff;background:#040b17}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 80% 20%,#14374788,transparent 55%);min-height:100vh}main{max-width:1100px;margin:auto;padding:22px 24px}nav{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:12px}nav span{color:#809aad;letter-spacing:.15em}a{color:#c7e5f5;text-decoration:none}button,select{font:inherit;border:1px solid #29475e;border-radius:12px;background:#102237;color:#ecf8ff;padding:12px 20px;min-height:46px}button{cursor:pointer;touch-action:manipulation}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #bef75d;outline-offset:4px}button:disabled{opacity:.4}header{display:flex;justify-content:space-between;align-items:center;padding:26px 0 22px}.eyebrow{color:#bef75d;font-size:10px;letter-spacing:.17em;font-weight:800}h1{font-size:clamp(38px,6vw,68px);line-height:1;margin:12px 0;letter-spacing:-.055em;font-style:italic}h1 span{color:#bef75d}p{line-height:1.6}.intro{font-size:13px;color:#93adbf}.hud{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid #223b50;border-radius:14px;margin-bottom:14px;background:#0a1728}.hud div{padding:14px 20px;border-right:1px solid #223b50}.hud div:last-child{border:0}small{display:block;font-size:9px;letter-spacing:.1em;color:#93adbf}b{display:block;font-size:24px;margin-top:3px}.stage{position:relative;overflow:hidden;border:1px solid #35526c;border-radius:18px;background:#081426}canvas{display:block;width:100%;aspect-ratio:960/460;touch-action:none}.overlay{position:absolute;inset:0;display:grid;place-items:center;background:#041021df;padding:20px;text-align:center}.overlay.hidden{display:none}.overlay>div{max-width:500px}h2{font-size:clamp(28px,4vw,44px);margin:0;letter-spacing:-.04em}.overlay p:not(.eyebrow){color:#b2c9d8;font-size:14px;margin:10px 0 16px}label{display:block;font-size:12px;color:#a7bdcc}select{padding:10px;margin:0 0 15px 8px}.primary{display:block;margin:auto;background:#bef75d;color:#12220b;border:0;font-weight:900;min-width:230px}.controls{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px}.controls button{min-height:76px;font-size:17px;font-weight:800;touch-action:none;user-select:none;-webkit-user-select:none}.controls button:first-child{border-color:#6a9139}.controls small{margin-top:5px;font-weight:400;letter-spacing:0}.controls button:active{background:#234059}footer{display:flex;justify-content:space-between;gap:16px;color:#7e99ac;font-size:11px;margin-top:18px}.save-note{color:#ffcb77;font-size:12px}@media(max-width:650px){main{padding:12px}nav span,.intro{display:none}header{padding:14px 0 8px}.hud div{padding:10px}b{font-size:20px}.stage canvas{aspect-ratio:1.25;object-fit:fill}.overlay{padding:12px}.overlay p:not(.eyebrow){font-size:12px;margin:6px 0}.overlay .eyebrow{display:none}select{display:block;margin:5px auto 10px;padding:7px}.controls{gap:8px}footer{flex-direction:column;gap:4px}.controls small{font-size:10px}}@media(max-height:600px) and (orientation:landscape){header{display:none}main{max-width:800px;padding:8px}.hud div{padding:4px 12px}.hud{margin:5px 0}.stage{max-width:650px;margin:auto}canvas{max-height:260px}.controls button{min-height:48px;padding:5px}.controls{margin-top:5px}footer{display:none}.overlay .eyebrow{display:none}h2{font-size:24px}.overlay p:not(.eyebrow){margin:4px 0}.overlay select{padding:5px;margin-bottom:6px}}

[hidden]{display:none!important}
