*{box-sizing:border-box}:root{--barn:#8C2A1C;--barn-seam:#7C2418;--barn-deep:#5E1A10;--trim:#F6EBDD;--trim-dim:rgba(246, 235, 221, .72);--stall:#2B1E17;--stall-seam:#231812;--tag:#F2C12E;--hay:#D9A441;--ink:#2B1E17;--f-display:"Rye","Rockwell Extra Bold",Georgia,serif;--f-body:"Bricolage Grotesque","Segoe UI",system-ui,sans-serif;--f-mono:"Chivo Mono",ui-monospace,Consolas,monospace;--f-emoji:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;color-scheme:light}html{background:var(--barn)}body{margin:0;min-height:100vh;color:var(--trim);font-family:var(--f-body);font-size:15px;line-height:1.5;background-color:var(--barn);background-image:repeating-linear-gradient(90deg,var(--barn) 0 66px,var(--barn-seam) 66px 72px);padding-inline:max(16px,env(safe-area-inset-left)) max(16px,env(safe-area-inset-right));padding-block:max(20px,env(safe-area-inset-top)) max(40px,env(safe-area-inset-bottom));-webkit-tap-highlight-color:transparent}.wrap{max-width:860px;margin:0 auto}header{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 18px;margin-bottom:18px}h1{margin:0;font-family:var(--f-display);font-weight:400;font-size:clamp(34px, 6.4vw, 54px);line-height:1;letter-spacing:.01em;text-shadow:0 3px 0 var(--barn-deep);text-wrap:balance}header p{margin:0;max-width:38ch;color:var(--trim-dim)}.layout{display:grid;grid-template-columns:auto minmax(250px,300px);grid-template-areas:"board bar" "board book";grid-template-rows:auto 1fr;gap:22px 36px;justify-content:center;align-items:start}@media (max-width:760px){.layout{grid-template-columns:1fr;grid-template-areas:"bar" "board" "book";justify-items:center}}.board-col{grid-area:board;display:flex;flex-direction:column;gap:10px;align-items:center;max-width:100%}.frame{position:relative;max-width:100%;padding:7px;background:var(--trim);border-radius:6px;box-shadow:0 10px 0 var(--barn-deep),0 18px 30px rgba(30,8,4,.35)}.frame:has(.stage:focus-visible){box-shadow:0 10px 0 var(--barn-deep),0 0 0 4px var(--tag)}.stage{--cell:80px;position:relative;width:min(calc(100vw - 46px),430px,max(280px,calc((100svh - 160px) * .625)));max-width:100%;aspect-ratio:5/8;background-color:var(--stall);background-image:repeating-linear-gradient(90deg,transparent 0 calc(20% - 1px),rgba(246,235,221,.07) calc(20% - 1px) 20%),repeating-linear-gradient(0deg,var(--stall) 0 calc(var(--cell) * .5 - 2px),var(--stall-seam) calc(var(--cell) * .5 - 2px) calc(var(--cell) * .5));border-radius:2px;overflow:hidden;cursor:pointer;touch-action:manipulation;user-select:none;-webkit-user-select:none;outline:0}.chute{position:absolute;left:0;right:0;bottom:0;height:12.5%;background-color:var(--hay);background-image:repeating-linear-gradient(115deg,rgba(90,55,10,.16) 0 2px,transparent 2px 9px);border-top:4px solid var(--trim)}.aim{position:absolute;top:0;left:40%;width:20%;height:87.5%;background:linear-gradient(to top,rgba(242,193,46,.26),rgba(242,193,46,0) 85%);transition:left 120ms ease;pointer-events:none}.aim::after{content:"";position:absolute;left:50%;bottom:6px;width:0;height:0;margin-left:-7px;border:7px solid transparent;border-top:0;border-bottom:9px solid var(--tag)}.layer{position:absolute;inset:0;pointer-events:none}.tile{position:absolute;width:20%;height:12.5%;padding:calc(var(--cell) * .055);transition:top 170ms cubic-bezier(.2, .85, .35, 1),left 120ms ease,opacity 150ms ease,transform 150ms ease}.tile.absorb{opacity:0;transform:scale(.6)}.tile.shake{animation:shake 260ms ease}@keyframes shake{25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}.face{position:relative;display:grid;place-items:center;width:100%;height:100%;border-radius:calc(var(--cell) * .17);background:var(--bg);color:var(--tink);box-shadow:inset 0 calc(var(--cell) * -.05) 0 rgba(0,0,0,.2),inset 0 2px 0 rgba(255,255,255,.35)}.face .emo{margin-top:calc(var(--cell) * -.1);font-family:var(--f-emoji);font-size:calc(var(--cell) * .43);line-height:1}.face .nm{position:absolute;left:0;right:0;bottom:8%;text-align:center;white-space:nowrap;font-weight:800;font-size:calc(var(--cell) * .128);letter-spacing:-.01em;line-height:1}.face .lv{position:absolute;top:7%;left:9%;font-family:var(--f-mono);font-weight:700;font-size:calc(var(--cell) * .12);opacity:.55}.face .badge{position:absolute;top:5%;right:7%;font-family:var(--f-emoji);font-size:calc(var(--cell) * .17);line-height:1}.face.legend{box-shadow:inset 0 calc(var(--cell) * -.05) 0 rgba(0,0,0,.3),0 0 0 2px var(--tag),0 0 16px rgba(242,193,46,.55)}.toast{position:absolute;left:0;right:0;top:34%;padding-inline:12px;text-align:center;text-wrap:balance;font-family:var(--f-display);font-size:calc(var(--cell) * .36);line-height:1.1;color:var(--tag);text-shadow:0 3px 0 var(--barn-deep),0 0 18px rgba(0,0,0,.6);opacity:0;pointer-events:none}.over{position:absolute;inset:7px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:20px;text-align:center;background:rgba(43,30,23,.9);border-radius:2px}.over[hidden]{display:none}.over h2{margin:0;font-family:var(--f-display);font-weight:400;font-size:34px;line-height:1.1;color:var(--tag)}.over p{margin:0;max-width:26ch;color:var(--trim-dim)}.over .big{font-family:var(--f-emoji);font-size:56px;line-height:1.1}.hint{margin:0;max-width:44ch;font-size:13px;text-align:center;color:var(--trim-dim)}kbd{padding:1px 5px;font-family:var(--f-mono);font-size:11px;color:var(--trim);border:1px solid rgba(246,235,221,.35);border-radius:4px}.bar{grid-area:bar;display:flex;flex-wrap:wrap;gap:14px;align-items:stretch}@media (max-width:760px){.bar{justify-content:center}}.tag{position:relative;min-width:104px;padding:24px 14px 12px;text-align:center;color:var(--ink);background:var(--tag);border-radius:16px 16px 26px 26px/16px 16px 34px 34px;box-shadow:inset 0 -4px 0 rgba(90,60,0,.22),0 4px 0 var(--barn-deep)}.tag::before{content:"";position:absolute;top:8px;left:50%;width:11px;height:11px;margin-left:-5.5px;border-radius:50%;background:var(--barn-deep);box-shadow:inset 0 1px 2px rgba(0,0,0,.5)}.tag .k{display:block;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;opacity:.7}.tag .v{display:block;font-family:var(--f-mono);font-weight:700;font-size:26px;line-height:1.15;font-variant-numeric:tabular-nums}.next{display:flex;flex-direction:column;align-items:center;gap:4px}.next .k{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--trim-dim)}.next .mini{--cell:62px;position:relative;width:62px;height:62px;padding:3px}.btn{align-self:center;padding:12px 16px;font:800 13px/1 var(--f-body);letter-spacing:.1em;text-transform:uppercase;color:var(--barn-deep);background:var(--trim);border:0;border-radius:6px;box-shadow:0 4px 0 var(--barn-deep);cursor:pointer}.btn:hover{background:#fff}.btn:active{transform:translateY(2px);box-shadow:0 2px 0 var(--barn-deep)}.btn:focus-visible{outline:3px solid var(--tag);outline-offset:3px}.book{grid-area:book;width:100%;max-width:430px}.book h2{margin:0 0 2px;font-family:var(--f-display);font-weight:400;font-size:24px}.book .sub{margin:0 0 10px;font-size:13px;color:var(--trim-dim)}.book ol{display:grid;grid-template-columns:1fr;margin:0;padding:0;list-style:none}.book li{display:grid;grid-template-columns:26px 26px 1fr auto;align-items:center;gap:8px;padding-block:3px;font-size:14px;border-bottom:1px solid rgba(246,235,221,.14)}.book .no{font-family:var(--f-mono);font-size:11px;color:var(--trim-dim);font-variant-numeric:tabular-nums}.book .em{font-family:var(--f-emoji);font-size:19px;line-height:1;text-align:center}.book .name{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.book .fam{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--trim-dim)}.book li.locked .em{filter:brightness(0);opacity:.4}.book li.locked .name{font-weight:400;color:var(--trim-dim)}.book li.best .name{color:var(--tag)}@media (max-width:760px){.book ol{grid-template-columns:1fr 1fr;column-gap:18px}.book li{grid-template-columns:22px 24px 1fr}.book .fam{display:none}}@media (prefers-reduced-motion:reduce){.aim,.tile{transition-duration:1ms!important}.tile.shake{animation:none}}