@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@700;800;900&family=DM+Mono:wght@400;500&family=DM+Sans:wght@400;500;700&display=swap');
:root{--paper:#f2efdf;--ink:#26382a;--orange:#ef5428;--line:#c9cbbb}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',sans-serif}button,a,input{touch-action:manipulation}button{cursor:pointer;color:inherit;font-family:'DM Mono',monospace}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--orange);outline-offset:4px}header{height:92px;border-bottom:1px solid var(--line);margin:0 4%;display:flex;align-items:center;justify-content:space-between}.brand{font-family:'Barlow Condensed',Impact,sans-serif;font-size:38px;font-weight:900;text-decoration:none;color:inherit;letter-spacing:-3px}.brand span{color:var(--orange);font-size:23px;margin-left:4px}.edition,.small,.eyebrow,.rule,.scorelabel,.stat,.hint,footer,.machine-head,.receipt{font-family:'DM Mono',monospace;font-size:10px;letter-spacing:1px}.small{background:transparent;border:1px solid var(--line);padding:12px}main{max-width:1510px;margin:44px auto 35px;padding:0 4%;display:grid;grid-template-columns:1fr 1.65fr .7fr;gap:4%}.intro{padding-top:10px}.eyebrow{font-weight:500;font-size:10px}.eyebrow i{display:inline-block;background:var(--orange);width:7px;height:7px;border-radius:50%;margin-right:8px}h1{font:900 clamp(70px,8.5vw,138px)/.79 'Barlow Condensed',Impact,sans-serif;letter-spacing:-3px;margin:40px 0 28px;position:relative}h1 span{color:var(--orange)}h1 sup{position:absolute;top:2px;font:16px 'DM Mono';margin-left:6px}.intro>p{font-size:22px;line-height:1.35;letter-spacing:-.7px}.rule{margin:42px 0;line-height:2.3;color:#6b7565}.receipt{border-top:1px solid var(--line);padding-top:24px;max-width:230px}.receipt strong{display:block;font-family:'Barlow Condensed',Impact;font-size:56px;margin:4px 0 16px}.receipt small{font-size:8px;line-height:1.8;color:#7b8070}.machine{background:#e3e5d6;border:1px solid #aeb5a1;padding:13px;box-shadow:5px 5px 0 #d5d7c7}.machine-head{display:flex;justify-content:space-between;font-size:8px;padding:3px 2px 13px;letter-spacing:.7px}.board{position:relative;background:#233a2d;border:7px solid #354a37;box-shadow:inset 0 0 0 1px #73806a;overflow:hidden}canvas{width:100%;display:block;aspect-ratio:700/760;cursor:crosshair;touch-action:none}#toast{position:absolute;top:16px;width:100%;text-align:center;font:9px 'DM Mono',monospace;letter-spacing:1.5px;color:#d2d8bd;pointer-events:none}.controls{display:flex;gap:8px;margin-top:13px}.controls button{border:0;font-size:11px;font-weight:500;padding:19px 15px;display:flex;align-items:center;justify-content:space-between;transition:transform .15s}.controls button:active{transform:translateY(2px)}#drop{background:var(--orange);color:#fff5de;flex:1}#drop span{font-size:19px}#herd{background:#d0d4bf;gap:16px}#herd span{font-size:13px}.hint{text-align:center;font-size:7px;color:#68715c;padding:13px 0 0;letter-spacing:.7px}aside{padding-top:12px}.scorelabel{font-size:9px}#score{font:800 66px 'Barlow Condensed',Impact;letter-spacing:-1px;overflow-wrap:anywhere}.divider{height:1px;background:var(--line);margin:23px 0}.stat{display:flex;justify-content:space-between;gap:8px;font-size:8px;margin:18px 0;letter-spacing:.3px}.stat b{font-size:12px}.horse-card{border:1px solid var(--line);margin-top:20px;padding:18px;text-align:center;background:#e9e7d6}.horse-card>div{font-size:64px;filter:sepia(.4);margin:12px 0 22px}.horse-card b{font:8px 'DM Mono',monospace;letter-spacing:.5px}.horse-card p{font-size:12px;color:#76806b;line-height:1.5}.toggle{display:flex;align-items:center;gap:8px;font:9px 'DM Mono';margin-top:29px;cursor:pointer}.toggle span{margin-left:auto;font-size:20px}input{accent-color:var(--orange)}.aside-note{font-size:11px;color:#7c8370}.reset{margin-top:28px;border:0;border-bottom:1px solid var(--line);background:none;font-size:8px;padding:10px 0}footer{border-top:1px solid var(--line);margin:0 4%;padding:22px 0;display:flex;justify-content:space-between;font-size:8px;color:#78816d}@media(min-width:1600px){main{max-width:1500px}}@media(max-width:1000px){main{grid-template-columns:.8fr 1.5fr;gap:5%}aside{grid-column:1/-1;display:flex;gap:20px;align-items:center;flex-wrap:wrap}aside .divider,aside .horse-card,aside>.eyebrow,.aside-note{display:none}#score{font-size:40px}.toggle,.reset{margin:0}.stat{gap:10px}.edition{font-size:8px}}@media(max-width:650px){header{height:65px}.edition{display:none}main{display:flex;flex-direction:column;margin-top:25px;gap:25px}.intro{display:grid;grid-template-columns:1fr 1fr}.intro>.eyebrow{grid-column:1/-1}h1{font-size:83px;margin:25px 0 0}.intro>p{align-self:end;font-size:18px;padding-left:20px}.rule,.receipt{display:none}.machine{padding:9px}.controls button{padding:17px 12px}.hint{font-size:6px}aside{gap:14px}.scorelabel{font-size:8px}.stat{font-size:7px}footer{font-size:6px;gap:12px}.small{font-size:8px}}

#horse-layer{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}#toast{top:4px;font-size:7px}

.machine{border:2px solid #344f44;border-radius:5px;background:#e1e5cc;box-shadow:8px 10px 0 #b1bba2,9px 11px 0 #344f44}.board{border:10px solid #2d5043;border-top-color:#80a284;border-left-color:#648f78;border-right-color:#17352e;border-bottom-color:#152f29;box-shadow:inset 0 0 0 3px #142e27,0 3px 0 #a2b795}.controls button{border:2px solid #293e32;border-radius:3px;box-shadow:0 4px 0 #293e32}.controls button:active{transform:translateY(3px);box-shadow:0 1px 0 #293e32}.horse-card{border:2px solid #a6b391;box-shadow:4px 4px 0 #d4d8bf}.intro h1{text-shadow:3px 3px 0 #d5d9bd}

.horse-card>div{margin:0 0 12px;filter:none}.horse-card svg{display:block;width:100%;max-width:180px;margin:auto}.intro h1 span{-webkit-text-stroke:.5px #26382a}#toast{color:#f3e1a3;letter-spacing:1.2px}
#board-layer{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.board{background:#201811;border-color:#513524}#game{position:relative}


.board{border:0;box-shadow:0 5px 0 #62412e}#board-layer{z-index:0}#game{z-index:2}#horse-layer{z-index:3}#toast{top:1.5%;z-index:4;text-shadow:0 1px 3px #000}.board-fire{position:absolute;z-index:1;left:8%;bottom:3%;width:84%;height:12%;object-fit:fill;mix-blend-mode:multiply;opacity:.8;pointer-events:none}
