:root{font-family:'Trebuchet MS',Arial,sans-serif;color:#4b3b31;background:#eee8dc;font-synthesis:none;--cream:#fff1d2;--ink:#34271f;--gold:#f5b747;--stitch:#bd8a54;--brown:#5b3527}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% 20%,#faf6ed 0,#eee8dc 75%);min-height:100vh}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #f5bc4d;outline-offset:5px}button{transition:transform .16s,filter .16s,background .16s}button:active{transform:translateY(2px)}button:disabled{cursor:default;opacity:.5}button:not(:disabled):hover{filter:brightness(1.1)}.app{max-width:1460px;margin:auto;padding:25px 56px 22px}.topbar{height:69px;display:flex;align-items:flex-start;justify-content:space-between}.wordmark{display:flex;align-items:center;gap:12px;color:#49382c;text-decoration:none;font-family:Georgia,serif;font-weight:bold;font-size:25px;letter-spacing:-1.1px}.top-actions{display:flex;align-items:center;gap:16px;padding-top:6px}.best-label{font-size:9px;letter-spacing:1.4px;color:#93816a;display:flex;align-items:center;gap:10px}.best-label svg{width:17px;height:17px;fill:none;stroke:#ad8550;stroke-width:1.7}.best-label strong{font-size:15px;letter-spacing:0;color:#604c35;margin-left:3px}.top-divider{width:1px;height:22px;background:#d5c9b8;margin:0 3px}.icon-btn{height:30px;width:30px;border:0;background:transparent;color:#8a765d;padding:4px;display:grid;place-items:center}.icon-btn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.stage-wrap{border:1px solid #c1a781;border-radius:13px;background:#543828;padding:7px 7px 0;box-shadow:0 20px 50px #57381324,0 3px 7px #39271b35,inset 0 1px 0 #fff5c780}.stage{position:relative;aspect-ratio:1200/760;overflow:hidden;border-radius:7px;background:#4a2e24;isolation:isolate;box-shadow:0 0 0 1px #241711,0 0 0 3px #9b714947}canvas{display:block;width:100%;height:100%;image-rendering:pixelated}.stage-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#21170df0 0%,#261a15e0 31%,#2b1b1344 61%,#2417090d 100%),linear-gradient(0deg,#221811bb,transparent 20%);transition:opacity .4s;z-index:1}.stage-shade.hidden{display:block;opacity:0}.menu{position:absolute;left:6.5%;top:8%;width:34%;max-width:415px;text-align:center;z-index:2;color:#fff0cf}.eyebrow{display:flex;align-items:center;justify-content:center;gap:10px;font-size:8px;letter-spacing:2.8px;color:#c7b08b;margin-bottom:22px}.eyebrow>span{width:20px;height:1px;background:#ae8b536b}.title-lockup{position:relative;margin:0 -10px 8px;transform:rotate(-3deg)}h1{position:relative;margin:0}.menu-tagline{font-family:Georgia,serif;font-style:italic;font-size:clamp(12px,1.3vw,18px);letter-spacing:.6px;color:#cfbda0;margin:20px 0 25px}.play-btn{position:relative;width:100%;height:61px;border:2px solid #ffdd8a;border-radius:10px;box-shadow:0 5px 0 #8b4a22,0 8px 20px #0005,inset 0 0 0 4px #df9330;color:#4b2b14;background:repeating-linear-gradient(45deg,#ffffff05 0 2px,transparent 2px 4px),linear-gradient(#ffc962,#f7b643);font-size:20px;font-weight:900;letter-spacing:2px;display:flex;align-items:center;justify-content:center;gap:16px;margin-bottom:18px}.play-btn:after{content:'';position:absolute;inset:6px;border:1px dashed #a9652b94;border-radius:5px;pointer-events:none}.play-triangle{width:0;height:0;border-left:14px solid #67401e;border-top:9px solid transparent;border-bottom:9px solid transparent}.key-pill{position:absolute;right:17px;font-size:14px;letter-spacing:0;border:1px solid #a9743888;border-radius:4px;width:20px;height:20px;line-height:17px;color:#986327}.menu-secondary{display:grid;gap:11px}.menu-secondary button{height:47px;position:relative;border:1px solid #a47753;border-radius:8px;box-shadow:0 3px 0 #21120fc9,inset 0 0 0 4px #32201b;background:linear-gradient(105deg,#5d3a2f,#472c25);color:#eadac2;display:flex;align-items:center;text-align:left;padding:0 20px;gap:15px;font-size:12px;font-weight:700;letter-spacing:1.7px}.menu-secondary button:after{content:'';position:absolute;inset:5px;border:1px dashed #ba8f6555;border-radius:4px;pointer-events:none}.menu-icon{font-size:24px;line-height:1;width:25px;text-align:center;color:#ceae7f}.chevron{font-size:21px;color:#a78666;margin-left:auto;line-height:1}#selected-name{font-size:8px;letter-spacing:1px;color:#b59779;margin-left:auto}#selected-name+.chevron{margin-left:-7px}.how-link{border:0;background:none;color:#bfa98a;font-size:11px;padding:20px;letter-spacing:.5px}.how-link>span{display:inline-grid;place-items:center;border:1px solid #ac927466;border-radius:50%;width:15px;height:15px;margin-right:6px;font-size:10px}.scene-caption{position:absolute;bottom:6.5%;right:9%;z-index:2;color:#e6d5b4b3;letter-spacing:2.7px;font-size:8px;display:flex;align-items:center;gap:13px}.caption-rule{width:30px;height:1px;background:#c4a37366}.stage-bottom{height:30px;display:flex;align-items:center;padding:0 12px;gap:7px;font-size:7px;letter-spacing:1.5px;color:#cfaf87}.live-dot{height:4px;width:4px;border-radius:50%;background:#c5a76a}.local-badge{margin-left:auto;font-size:7px;letter-spacing:1.4px;color:#ab8c68}.local-badge>span{color:#c99c57;margin-left:8px}.below-stage{display:flex;align-items:center;justify-content:space-between;padding:22px 6px 17px}.control-hint{display:flex;align-items:center;gap:7px;font-size:10px;color:#968570}.key-group{display:flex;gap:3px}kbd{font:9px 'Trebuchet MS',sans-serif;display:inline-grid;place-items:center;min-width:21px;height:22px;border:1px solid #cbbda7;border-radius:4px;background:#f6f1e7;box-shadow:0 2px #ded4c4;color:#8d7b61}.control-hint>span{margin-right:16px}.space-key{padding:0 8px;font-size:8px;letter-spacing:.6px}.below-stage p{font-size:10px;color:#927e62;letter-spacing:.2px;margin:0}.below-stage em{color:#6b5840;font-style:normal}footer{display:flex;justify-content:space-between;border-top:1px solid #d9cfbe;padding:19px 5px 0;font-family:Georgia,serif;font-size:11px;color:#a3937e}footer>span:last-child{font:7px 'Trebuchet MS',sans-serif;letter-spacing:1.4px;display:flex;align-items:center;gap:12px}.footer-button{height:17px;width:17px;border:1px solid #b8a88d;border-radius:50%;display:grid;place-items:center;font-size:17px}.hidden{display:none!important}.hud{position:absolute;top:21px;left:25px;right:25px;z-index:2;display:flex;justify-content:space-between;pointer-events:none;color:#fff0ce}.hud-group{display:flex;gap:27px;background:#31221fee;border:1px solid #997254;border-radius:11px;padding:11px 20px;box-shadow:0 4px 8px #0004;min-width:230px}.hud-group span{font-size:9px;letter-spacing:1.7px;color:#cdb99a;display:block;margin-bottom:3px}.hud-group strong{font:700 28px 'Courier New',monospace;letter-spacing:1px}.hud-score{min-width:99px}.hud-combo{position:relative;min-width:51px}.hud-combo strong{color:#ffc45d;font-size:24px}.combo-track{height:2px;background:#745438;margin-top:3px;border-radius:2px;overflow:hidden}.combo-track i{height:100%;display:block;background:#f9b647;width:0;transition:width .07s linear}.hud-right{display:flex;gap:10px;align-items:flex-start}.timer{font:13px 'Courier New',monospace;padding:16px 10px;text-shadow:0 2px 3px #000}.yarn-count{display:flex;align-items:center;gap:12px;background:#31221fee;border:1px solid #997254;border-radius:10px;padding:9px 15px;height:53px;box-shadow:0 4px 8px #0004}.yarn-icon{font-size:32px;color:#e87797;text-shadow:2px 2px #7c334d;line-height:1;display:block;transform:rotate(-20deg)}.yarn-count strong{font-size:20px;min-width:42px}.yarn-count em{font-size:12px;color:#bba78d;font-style:normal}.pause-btn{pointer-events:auto;height:38px;width:37px;display:grid;place-items:center;border:1px solid #997254;background:#31221fe8;border-radius:8px;font-weight:700;color:#d8c5a5;font-size:16px;margin-top:7px}.run-toast{position:absolute;bottom:29px;left:50%;transform:translate(-50%,15px);padding:10px 20px;background:#251b17e6;border:1px solid #a583586b;box-shadow:0 3px 12px #0003;border-radius:30px;color:#f2deb9;font-size:12px;letter-spacing:.3px;opacity:0;transition:opacity .25s,transform .25s;z-index:5;text-align:center;pointer-events:none;white-space:nowrap}.run-toast.visible{opacity:1;transform:translate(-50%,0)}.modal-backdrop{position:absolute;inset:0;display:grid;place-items:center;z-index:6;background:#211710a6;backdrop-filter:blur(6px);padding:20px}.modal{position:relative;width:430px;max-width:100%;max-height:100%;overflow-y:auto;background:radial-gradient(ellipse at top,#694732,#422b23);border:2px solid #b88b5c;outline:1px dashed #94714f;outline-offset:-8px;border-radius:18px;padding:31px 32px;color:#f8e7c7;text-align:center;box-shadow:0 20px 70px #0007}.modal.wide{width:520px}.modal .eyebrow{margin:0 0 10px}.modal h2{font-family:Georgia,serif;font-size:32px;margin:6px 0 10px;letter-spacing:-.5px;font-weight:500}.modal p{font-size:12px;line-height:1.7;color:#cfbca0;margin:0 0 20px}.modal-close{position:absolute;right:13px;top:11px;border:0;background:transparent;color:#ceb394;font-size:25px;width:28px;height:28px;line-height:1;z-index:1}.modal .play-btn{height:49px;font-size:13px;letter-spacing:1.3px;margin:14px 0 10px}.secondary-btn{border:1px solid #9c7550;background:#38251f;color:#dfc9a6;border-radius:8px;padding:12px 20px;font-size:11px;letter-spacing:1px;width:100%;margin-top:10px}.characters{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin:23px 0}.character-card{position:relative;min-height:158px;border:1px solid #926b4a;background:#382820bb;border-radius:10px;color:#dbc2a1;padding:14px 10px;display:flex;flex-direction:column;align-items:center;gap:10px}.character-card.selected{border:2px solid #f9c76a;background:#87603266;box-shadow:0 0 0 3px #c8974440}.character-card img{width:88px;height:88px;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 7px 2px #1d140e5c)}.character-card b{font-size:12px;letter-spacing:2px}.character-card small{font-size:9px;color:#bca58a}.character-card .check{position:absolute;right:9px;top:7px;color:#ffd070;font-size:14px}.character-placeholder{font-size:61px;line-height:88px}.wallet{display:inline-flex;gap:8px;align-items:center;padding:7px 13px;border:1px solid #927148;border-radius:30px;color:#f6c870;font-size:12px;margin:3px 0 16px}.wallet>span{font-size:18px}.upgrade-card{text-align:left;padding:15px 15px 13px;border:1px solid #936c4944;background:#2d201c77;border-radius:10px;margin:10px 0}.upgrade-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.upgrade-card h3{font-size:12px;letter-spacing:1.4px;margin:0}.upgrade-card p{font-size:11px;margin:7px 0 10px;line-height:1.5}.level-dots{display:flex;gap:4px}.level-dots i{width:17px;height:4px;border-radius:2px;background:#75563c}.level-dots i.on{background:#e8b450}.buy-btn{border:1px solid #bb8d51;border-radius:5px;background:#74512b;color:#ffe0a2;padding:7px 11px;font-size:10px;width:100%;letter-spacing:.6px}.upgrade-note{margin:15px 0 0!important;font-size:10px!important}.scores-table{width:100%;border-collapse:collapse;text-align:left;margin-top:22px;font-size:12px}.scores-table th{font-size:8px;font-weight:400;color:#ad9273;letter-spacing:1px;padding:0 8px 10px;border-bottom:1px solid #ab835e33}.scores-table td{padding:12px 8px;border-bottom:1px solid #ab835e22}.scores-table td:nth-child(2){color:#ffd180;font-weight:bold}.scores-table tr:first-child td:first-child{color:#edbf66}.empty-scores{padding:25px 0 16px}.empty-scores>span{font-size:43px;color:#bc9657;display:block;margin-bottom:12px}.big-score{font:700 62px 'Courier New',monospace;color:#ffd071;line-height:1.1;margin:12px 0 4px;letter-spacing:-3px}.score-label{font-size:8px;letter-spacing:2px;color:#bb9f79}.results{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:24px 0 18px}.results>div{border:1px solid #9d765137;background:#39271d5c;border-radius:8px;padding:12px 3px}.results strong{display:block;font:700 20px 'Courier New',monospace;color:#f9e8c7;margin-bottom:6px}.results span{font-size:7px;letter-spacing:1px;color:#c4ab8a}.earned{font-size:11px!important;color:#d8b273!important;margin-bottom:18px!important}.instructions{display:grid;gap:13px;text-align:left;margin:25px 0}.instruction{display:flex;gap:14px;align-items:center}.instruction>span{display:grid;place-items:center;min-width:39px;height:39px;background:#33251d;border-radius:9px;font-size:24px;color:#e7b25e}.instruction strong{display:block;font-size:12px;color:#eddec7;margin:0 0 4px}.instruction p{font-size:10px;margin:0;line-height:1.5}.instruction kbd{height:16px;min-width:17px;font-size:8px;vertical-align:middle;box-shadow:none;background:#6f5037;border-color:#af8150;color:#ffdda9}.touch-controls{position:absolute;left:20px;right:20px;bottom:17px;z-index:4;justify-content:space-between;align-items:flex-end;pointer-events:none}.dpad{width:118px;height:94px;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(2,1fr);gap:4px;pointer-events:auto}.dpad button,.touch-throw{border:1px solid #e7cc9c77;background:#2d211f99;color:#ffdfb7;touch-action:none;user-select:none;-webkit-user-select:none;border-radius:12px}.dpad button[data-move=up]{grid-column:2;grid-row:1}.dpad button[data-move=left]{grid-column:1;grid-row:2}.dpad button[data-move=down]{grid-column:2;grid-row:2}.dpad button[data-move=right]{grid-column:3;grid-row:2}.touch-throw{width:72px;height:72px;border-radius:50%;font-size:13px;font-weight:700;pointer-events:auto;background:#955366bb}.touch-throw span{display:block;font-size:7px;letter-spacing:2px;margin-top:4px}body.playing .stage{touch-action:none}body.playing .stage-wrap{border-color:#b49669}.stage:fullscreen{width:100vw;height:100vh;border-radius:0;background:#2a1b14}.stage:fullscreen canvas{object-fit:contain}.stage:fullscreen .menu{left:8%;width:30%;top:12%}
@media(min-width:1500px){.app{padding-top:34px}.topbar{height:79px}}
@media(max-width:1100px){.app{padding:20px 28px 15px}.menu{top:7%;left:6%;width:35%}.eyebrow{margin-bottom:17px;font-size:7px;letter-spacing:2px}.menu-tagline{margin:17px 0 18px}.play-btn{height:52px;font-size:17px;margin-bottom:15px}.menu-secondary button{height:40px;font-size:10px;padding:0 15px;gap:9px}.menu-secondary{gap:9px}.how-link{padding:16px;font-size:10px}.scene-caption{font-size:7px;letter-spacing:1.5px}.below-stage p{font-size:9px}.control-hint>span{margin-right:8px}.modal{padding:25px 26px}.modal h2{font-size:29px}}
@media(max-width:760px){.app{padding:17px 14px 12px}.topbar{height:65px}.wordmark{font-size:22px;gap:9px}.top-actions{gap:7px}.best-label{font-size:0;gap:5px}.best-label strong{font-size:14px}.top-divider{margin:0 2px}.stage-wrap{padding:5px 5px 0;border-radius:11px}.stage{aspect-ratio:4/4.1}.stage canvas{position:absolute;width:162%;height:100%;left:-31%}.stage-shade{background:linear-gradient(90deg,#261911e0,#261a1599 60%,#261a1522),linear-gradient(0deg,#261911cc,transparent 40%)}.menu{top:8%;left:7%;width:53%;max-width:300px}.eyebrow{font-size:6px;letter-spacing:1.5px;gap:6px;margin-bottom:16px}.eyebrow>span{width:10px}.menu-tagline{font-size:12px;margin:13px 0 17px}.play-btn{height:45px;font-size:13px;letter-spacing:1px;gap:9px;margin-bottom:13px}.play-triangle{border-left-width:10px;border-top-width:7px;border-bottom-width:7px}.key-pill{right:10px;width:17px;height:17px;font-size:11px}.menu-secondary button{height:36px;font-size:8px;letter-spacing:1.4px;padding:0 13px;gap:8px}.menu-icon{font-size:19px;width:20px}#selected-name{font-size:6px}.menu-secondary{gap:8px}.how-link{font-size:9px;padding:15px 5px}.scene-caption{right:7%;bottom:5%;font-size:5px;letter-spacing:1.2px}.scene-caption .caption-rule{width:15px}.stage-bottom{height:26px;font-size:5px;padding:0 5px;letter-spacing:1.1px}.local-badge{font-size:5px;letter-spacing:.8px}.below-stage{flex-direction:column;align-items:center;gap:16px;padding-top:21px;padding-bottom:21px}.control-hint{font-size:9px;gap:5px}.control-hint>span{margin-right:5px}kbd{height:19px;min-width:18px;font-size:8px}.below-stage p{font-size:10px}footer{font-size:9px;padding:16px 1px 0}footer>span:last-child{font-size:5px;letter-spacing:.7px;gap:7px}.footer-button{height:14px;width:14px;font-size:14px}body.playing .stage{aspect-ratio:1200/900}body.playing .stage canvas{width:100%;height:84.44%;left:0;top:0}body.playing .stage{background:#3c2a24}.hud{top:8px;left:8px;right:8px}.hud-group{gap:12px;padding:6px 10px;min-width:130px;border-radius:7px}.hud-group span{font-size:6px;letter-spacing:1px}.hud-group strong{font-size:17px}.hud-score{min-width:57px}.hud-combo{min-width:25px}.hud-combo strong{font-size:15px}.hud-right{gap:4px}.timer{font-size:8px;padding:11px 5px}.yarn-count{height:37px;padding:4px 8px;gap:5px;border-radius:7px}.yarn-icon{font-size:23px}.yarn-count strong{font-size:14px;min-width:30px}.yarn-count em{font-size:9px}.pause-btn{height:28px;width:27px;font-size:12px;margin-top:4px}.run-toast{bottom:90px;font-size:8px;padding:8px 13px;max-width:94%;white-space:normal}.modal-backdrop{padding:11px}.modal{padding:23px 20px;width:370px;border-radius:13px}.modal h2{font-size:24px}.modal p{font-size:10px;margin-bottom:14px}.modal .eyebrow{font-size:6px}.modal .play-btn{height:42px;font-size:11px}.characters{margin:13px 0;gap:10px}.character-card{min-height:124px;padding:10px 7px;gap:7px}.character-card img{width:64px;height:64px}.character-placeholder{font-size:50px;line-height:64px}.character-card b{font-size:10px}.character-card small{font-size:8px}.wallet{margin:0 0 8px;font-size:10px;padding:5px 10px}.upgrade-card{padding:10px;margin:8px 0}.upgrade-card h3{font-size:10px}.upgrade-card p{font-size:9px;margin:5px 0 8px}.upgrade-note{font-size:8px!important;margin-top:8px!important}.instructions{gap:10px;margin:15px 0}.instruction p{font-size:9px;margin:0}.instruction strong{font-size:11px}.instruction>span{height:31px;min-width:31px;font-size:20px}.big-score{font-size:45px}.results{margin:16px 0 12px}.results strong{font-size:16px}.results span{font-size:6px}.secondary-btn{font-size:9px;padding:10px}.scores-table{font-size:10px;margin-top:13px}.scores-table td{padding:8px}.touch-controls{bottom:7px;left:13px;right:13px}.dpad{width:96px;height:71px;gap:3px}.dpad button{font-size:12px;border-radius:8px}.touch-throw{width:57px;height:57px;font-size:10px}.touch-throw span{font-size:6px}}
@media(pointer:coarse){body.playing .touch-controls:not(.hidden){display:flex}.control-hint{display:none}.below-stage{padding:15px}.below-stage:before{content:'TOUCH CONTROLS · MOVE + THROW';font-size:8px;letter-spacing:1.5px;color:#968570}.below-stage p{margin-top:-6px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
@media(max-width:760px){body:not(.playing) .stage{aspect-ratio:4/5.7}.scene-caption{display:none}.menu{top:8%}.stage-shade{background:linear-gradient(90deg,#261911c9,#261a1580 52%,#261a1500 84%),linear-gradient(0deg,#26191199,transparent 25%)}}
@media(max-width:420px){.menu{width:54%;left:7%}.menu-secondary button{letter-spacing:1px}.eyebrow{letter-spacing:1px}.menu-tagline{font-size:11px}.how-link{padding-top:16px}.top-actions{gap:3px}.wordmark{font-size:20px}.best-label svg{width:13px}}
.countdown{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff0ce;text-shadow:0 3px 12px #21150e;background:#271b1233;pointer-events:none}.countdown>span{font-size:10px;letter-spacing:3px}.countdown strong{font:bold clamp(52px,9vw,108px) Georgia,serif;color:#ffd076;line-height:1.2}.countdown small{font-size:11px;letter-spacing:.5px}
@media(max-width:760px){body.playing .stage{aspect-ratio:auto;padding-bottom:86px}body.playing .stage canvas{position:relative;aspect-ratio:1200/760;width:100%;height:auto;left:0;top:0}.countdown{bottom:86px}.countdown>span{font-size:8px}.countdown small{font-size:9px}.run-toast{bottom:94px}}
body.playing .stage{aspect-ratio:auto;padding-top:86px;background:#34241d}body.playing .stage canvas{width:100%;height:auto;aspect-ratio:1200/760}body.playing .hud{top:12px}.countdown{top:86px}.stage:fullscreen canvas{height:100%;aspect-ratio:auto}
@media(max-width:760px){body.playing .stage{padding-top:58px}body.playing .hud{top:8px}.countdown{top:58px}}