*{box-sizing:border-box}html{background:#f4f2ec;color:#222d2b;font-family:Arial,Helvetica,sans-serif}body{margin:0}button,input{font:inherit}button{cursor:pointer}button:disabled{opacity:.35;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #f08045;outline-offset:4px}button{transition:background .15s,transform .15s}button:not(:disabled):active{transform:translateY(1px)}.nav{height:80px;max-width:1360px;padding:0 64px;margin:auto;display:flex;align-items:center;gap:52px;border-bottom:1px solid #ddded4}.brand{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none;font-size:20px;font-weight:800;letter-spacing:-1px}.brand b{font-weight:400}.brandmark{background:#ed7648;color:#fff;width:34px;height:34px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-family:monospace;font-size:27px;letter-spacing:-5px;padding-right:4px}.brandmark span{font-size:19px}.nav-label,.nav-end,.eyebrow{font-size:10px;font-weight:700;letter-spacing:1.6px}.nav-label{color:#7f8880}.nav-end{margin-left:auto;display:flex;align-items:center;gap:9px;font-size:9px;color:#67746a}.status-dot,.live i{height:6px;width:6px;border-radius:50%;background:#5e8b65;display:inline-block}.prototype{border:1px solid #d6dacf;border-radius:4px;padding:6px 8px;margin-left:10px;font-size:8px}main{max-width:1232px;margin:auto;padding:35px 48px 20px}.intro{display:flex;justify-content:space-between;align-items:center;margin-bottom:27px}.eyebrow{color:#7c857b;font-size:9px}.eyebrow span{margin:0 9px;color:#c3c7be}h1{font-size:66px;line-height:1;letter-spacing:-4px;margin:13px 0 12px;font-weight:900}h1 em{font-style:normal;color:#e97547}.title-blocks{display:inline-block;font-size:51px;color:#98ae8d;transform:rotate(-12deg);margin-left:24px;vertical-align:8px}.intro p{color:#7a837a;font-size:13px;margin:0}.share{background:transparent;border:1px solid #ced4c7;border-radius:7px;padding:12px 16px;font-size:12px;font-weight:600}.share:hover{background:#e8ecdf}.layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:32px;align-items:start}.machine{background:#14251f;border-radius:14px;overflow:hidden;box-shadow:0 12px 28px #21372a16;border:1px solid #263d30}.hud{height:84px;display:flex;align-items:center;gap:38px;padding:0 30px;background:#192e25;border-bottom:1px solid #344235}.hud>div{display:flex;flex-direction:column;gap:6px}.hud span{font-size:9px;letter-spacing:2px;color:#8b9e8c;font-weight:700}.hud strong{font-family:monospace;color:#dae5c7;font-size:25px;letter-spacing:1px}.hud .score-stat{margin-right:auto}.hud .score-stat strong{color:#d6eea4;font-size:30px}.icon-button{border:1px solid #41513e;background:transparent;border-radius:5px;color:#b3c4a4;height:32px;min-width:32px;font-size:17px}.icon-button span{font-size:8px;letter-spacing:0}.hud .icon-button{margin-left:-17px}.stage{position:relative;max-width:600px;margin:auto;line-height:0}#game{width:100%;aspect-ratio:600/590}.stage canvas{display:block;width:100%;height:auto}.overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;line-height:1.4;background:linear-gradient(90deg,#14251f40,#14251f1a,#14251f40)}.overlay[hidden]{display:none}.overlay-card{width:280px;background:#f6f4eaf5;border-radius:9px;padding:25px 23px 18px;text-align:center;box-shadow:0 12px 60px #00170a55;border:1px solid #fdfaf0}.mini-block{font-size:39px;color:#ec7647;margin-bottom:12px;line-height:1}.overlay-card .eyebrow{font-size:8px;letter-spacing:1.25px}.overlay-card h2{font-size:36px;line-height:1.07;letter-spacing:-1.6px;margin:10px 0 14px}.overlay-card>p{font-size:12px;color:#74806d;line-height:1.5;margin:10px 0 20px}.primary{background:#e97547;color:#fff;border:0;border-radius:6px;padding:13px 16px;width:100%;font-weight:700;text-align:left;font-size:13px}.primary:hover{background:#cf633a}.primary span{float:right}.overlay-card .tiny{font-size:9px;margin:12px 0 0;color:#8a9181}#result-form{margin-top:20px;text-align:left}#result-form label{font-size:8px;letter-spacing:1.4px;color:#6d7967;font-weight:bold}.name-row{display:flex;gap:6px;margin-top:6px}.name-row input{min-width:0;width:100%;border:1px solid #cbd0bd;border-radius:4px;background:#fffef6;padding:9px 8px;font-size:12px}.name-row button{white-space:nowrap;border:0;background:#294b37;color:white;border-radius:4px;font-size:10px;font-weight:700;padding:8px}#save-status{font-size:10px;line-height:1.5;color:#456945;margin-bottom:0;min-height:14px}.machine-foot{display:flex;justify-content:space-between;align-items:center;padding:16px 26px;border-top:1px solid #344235;font-family:monospace;font-size:9px;color:#859c82;letter-spacing:1px}.machine-foot i{display:inline-block;width:5px;height:5px;background:#b1ce92;border-radius:50%;margin-right:7px}.machine-foot button{border:0;background:transparent;color:#b4c7a3;font-family:inherit;font-size:10px;letter-spacing:0}.controls{display:flex;justify-content:center;flex-wrap:wrap;gap:15px;padding:20px 0 4px}.controls>div{display:flex;align-items:center;gap:3px}.controls span{font-size:10px;color:#818779;margin-left:3px}kbd{font:10px monospace;border:1px solid #d3d9cc;border-bottom:2px solid #c9cfbf;background:#edeFE5;padding:4px 5px;border-radius:4px;min-width:22px;text-align:center}.notice{font-size:11px;color:#a35439;text-align:center;min-height:14px;margin:8px 0}.leaderboard-panel{border:1px solid #dce0d3;background:#fafaf3;border-radius:10px;padding:24px 21px 16px}.section-top h2{font-size:23px;letter-spacing:-.8px;margin:10px 0 24px}.section-top h2 span{float:right;font-size:24px;color:#e77547}.section-top .eyebrow{font-size:7px;letter-spacing:1.15px}.board-meta{display:flex;justify-content:space-between;font-size:8px;font-weight:bold;letter-spacing:1px;color:#8a927f;border-bottom:1px solid #e0e4d6;padding-bottom:14px}.live{color:#638563}.live i{height:5px;width:5px;margin-right:3px}#leaderboard{list-style:none;padding:0;margin:0;max-height:293px;overflow-y:auto}#leaderboard li{display:flex;gap:10px;align-items:center;border-bottom:1px solid #e6e9de;padding:16px 0;font-size:11px}#leaderboard li>span:first-child{font-family:monospace;color:#9aa58c;width:21px}#leaderboard li>span:nth-child(2){flex:1;overflow:hidden;text-overflow:ellipsis}#leaderboard li strong{font-family:monospace;font-size:12px;color:#4c6341}#leaderboard li:first-child>span:first-child{color:#da7849}#leaderboard .board-empty{color:#8a9380;line-height:1.8;display:block;text-align:center;padding:35px 14px;font-size:12px}.board-note{font-size:9px;line-height:1.8;color:#8d9585;padding-top:16px}.text-button{background:none;border:0;padding:12px 0 0;color:#557546;font-size:10px}.howto{padding:26px 8px 0}.howto h3{font-size:24px;line-height:1.15;letter-spacing:-.8px;margin:13px 0}.howto>p{font-size:12px;line-height:1.8;color:#7e8976}.tip{display:flex;gap:10px;margin-top:17px;background:#e9eddf;padding:12px;border-radius:7px}.tip>span{color:#769865;font-size:25px}.tip p{font-size:10px;line-height:1.7;color:#718263;margin:0}.built-with{padding:24px 8px 0}.built-with>span{font-size:8px;letter-spacing:1.6px;font-weight:bold;color:#8f9985}.built-with p{font-size:9px;color:#9ca491}footer{display:flex;justify-content:space-between;padding-top:21px;margin-top:15px;border-top:1px solid #dfe3d5;font-size:10px;color:#8c9684}footer>span:last-child{font-size:8px;letter-spacing:1px}.footer-dot{color:#d57e55;margin:0 7px}@media(min-width:1400px){main{max-width:1200px}}@media(max-width:1000px){main{padding:25px}.nav{padding:0 25px}.layout{grid-template-columns:minmax(0,1fr) 245px;gap:20px}.hud{gap:25px;padding:0 20px}.controls{gap:8px}.leaderboard-panel{padding:20px 15px}}@media(max-width:760px){.nav-label,.prototype{display:none}.nav{height:60px}.nav-end{font-size:8px}.layout{grid-template-columns:1fr}.intro{align-items:flex-end}h1{font-size:48px}.title-blocks{font-size:35px;margin-left:14px}.share{font-size:10px;padding:9px}.intro p{font-size:11px;max-width:230px}.intro .eyebrow{font-size:7px}main{padding:24px 16px}aside{display:grid;grid-template-columns:1fr 1fr;gap:15px}.howto{padding:8px}.built-with{display:none}.hud{height:72px}footer{gap:20px}.overlay-card{width:240px;padding:18px}.overlay-card h2{font-size:30px}}
@media(min-width:761px){.nav{height:64px}main{padding-top:25px}.intro{margin-bottom:20px}h1{font-size:54px}.hud{height:64px}.stage{max-width:clamp(340px,calc((100dvh - 410px)*1.017),560px)}.machine-foot{padding-top:13px;padding-bottom:13px}.controls{padding-top:14px}}
