@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
*{box-sizing:border-box}body{margin:0;background:#f3f1e8;color:#153a3e;font-family:'DM Sans',system-ui,sans-serif}main{max-width:1140px;margin:auto;padding:26px 42px 32px}header{display:flex;justify-content:space-between;align-items:center}.brand{display:flex;align-items:center;gap:10px;color:inherit;text-decoration:none;font-size:12px;letter-spacing:2px;font-weight:700}.mark{font:700 23px 'Space Grotesk',sans-serif;background:#173c40;color:#e9f0b1;border-radius:10px;padding:8px 10px}.tag{font-size:10px;letter-spacing:1.5px;border:1px solid #c5cec2;border-radius:30px;padding:8px 12px}.intro{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin:38px 0 25px}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:700;color:#687c71;margin:0 0 14px}h1{font:600 clamp(36px,5vw,62px)/1.03 'Space Grotesk',sans-serif;letter-spacing:-3px;margin:0}h1 span{color:#7b8d62}.description{font-size:14px;color:#61736b;line-height:1.7;margin-bottom:4px}.stage{position:relative;background:#d5e8df;border:1px solid #b9cfc3;border-radius:24px;overflow:hidden;box-shadow:0 12px 40px #1c453609}.stage-top,.stage-bottom{position:absolute;left:24px;right:24px;display:flex;justify-content:space-between;align-items:center;z-index:1;font-size:10px;letter-spacing:1.5px;font-weight:700;pointer-events:none}.stage-top{top:20px}.stage-top>span:last-child{background:#edf4dc;padding:7px 11px;border-radius:20px}.stage-top i{display:inline-block;background:#65875e;width:6px;height:6px;border-radius:50%;margin-right:7px}.stage-bottom{bottom:17px;color:#547466}.stage-bottom button{pointer-events:auto;border:0;background:transparent;color:#345a4b;font:inherit;cursor:pointer;letter-spacing:0}canvas{display:block;width:100%;aspect-ratio:960/500;outline-offset:-5px;touch-action:none}.controls{display:flex;justify-content:space-between;margin-top:18px;gap:12px;align-items:center}.move{display:flex;align-items:center;gap:8px}.controls button{border:1px solid #c8d1c2;border-bottom:3px solid #b9c6b3;border-radius:14px;height:53px;background:#fafbf2;color:#244b42;font:600 24px 'DM Sans',sans-serif;min-width:58px;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;cursor:pointer}.controls button:active,.controls button.pressed{transform:translateY(2px);border-bottom-width:1px;background:#dfe8bf}.move>span{font-size:10px;letter-spacing:1px;margin-left:8px;color:#6e7e70}.controls .jump{background:#193d3f;color:#f1f3d1;border-color:#102e30;font-size:14px;padding:0 21px;display:flex;align-items:center;gap:14px}.jump span{font-size:23px}.jump small{font-size:8px;letter-spacing:1px;opacity:.6}footer{display:flex;justify-content:space-between;gap:14px;margin-top:26px;font-size:10px;color:#7a897a}footer>div{display:flex;gap:6px;align-items:center}.live-dot{width:5px;height:5px;background:#6c8962;border-radius:50%}details{font-size:11px;color:#74816e;margin-top:18px;max-width:650px}summary{cursor:pointer}details p{line-height:1.6}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #b38a25;outline-offset:3px}@media(max-width:600px){main{padding:20px 16px max(24px,env(safe-area-inset-bottom))}.brand{font-size:9px;letter-spacing:1px}.tag{font-size:8px}.intro{margin-top:30px;display:block}h1{letter-spacing:-1.7px;font-size:42px}.description{font-size:12px;margin-top:17px}.eyebrow{font-size:8px}.stage{border-radius:18px}canvas{height:340px;aspect-ratio:auto}.stage-top,.stage-bottom{left:15px;right:15px;font-size:8px}.stage-bottom{bottom:12px}.controls button{height:58px;min-width:57px}.move>span{display:none}.controls .jump{padding:0 17px}.jump small{display:none}footer{font-size:9px;line-height:1.6}footer>span{max-width:115px;text-align:right}}