:root{--m0:#f06a5a;--m1:#f49a54;--m2:#f5cf56;--m3:#61d39b;--m4:#64a9e8;--m-ink:#1a2940;--m-cream:#fff9e9;--m-paper:#fffdf7;--m-shadow:#22304a;--bg:#ffe8bf;--panel:#fff9e9;--panel-2:#31415e;--ink:#1a2940;--ink-dim:#64718a;--accent:#f5cf56;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}html,body{color:var(--m-ink);background:#ffe8bf}button{color:inherit}#app{background:radial-gradient(circle at 12% 16%,#f06a5a2b 0 4px,#0000 4.5px) 0 0/38px 38px,linear-gradient(#fff4d8,#ffdcae);grid-template:100%/100%;place-items:center;height:100%;display:grid}#app>*{grid-area:1/1}#mingle-wrap{place-items:center;width:100%;height:100%;line-height:1.2;display:grid;position:relative}#game-canvas{touch-action:none;cursor:pointer;display:block}@media (width>=800px) and (height>=620px){#game-canvas{border-radius:28px;box-shadow:0 14px 42px #432d162e}}.hidden{display:none!important}#hud{width:390px;height:var(--view-h,640px);transform:translate(-50%, -50%) scale(var(--canvas-scale,1));transform-origin:50%;pointer-events:none;color:var(--m-ink);--hud-top:max(12px, var(--safe-top));--hud-top-h:41px;position:absolute;top:50%;left:50%}.hud-top{top:var(--hud-top);grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;display:grid;position:absolute;left:16px;right:16px}.hud-stat{gap:1px;display:grid}.hud-stat span{color:#68738a;letter-spacing:.13em;text-transform:uppercase;font-size:9px;font-weight:900}.hud-stat strong{font-variant-numeric:tabular-nums;font-size:31px;font-weight:950;line-height:1}.moves-stat{text-align:right}.mode-chip{color:#fff9e9;letter-spacing:.12em;background:#2d3b55;border-radius:999px;justify-self:center;padding:5px 11px;font-size:9px;font-weight:950}.mode-chip.practice{background:#78849a}.joy-row{top:calc((var(--hud-top) + var(--hud-top-h) + var(--board-top,260px)) / 2 - 33px);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#fffdf7ad;border:2px solid #2b395321;border-radius:21px;grid-template-columns:auto 1fr;align-items:center;gap:14px;padding:13px 17px;display:grid;position:absolute;left:20px;right:20px;box-shadow:0 4px #2b395317}.joy-copy{gap:2px;min-width:84px;display:grid}.joy-copy span{color:#6c7588;letter-spacing:.1em;text-transform:uppercase;font-size:8px;font-weight:900}.joy-copy strong{font-variant-numeric:tabular-nums;font-size:24px;line-height:1}.joy-track{background:#ffffffad;border:2px solid #2b3953;border-radius:999px;height:16px;position:relative;overflow:visible;box-shadow:0 3px #2b39532e}#joy-fill{border-radius:inherit;background:linear-gradient(90deg, var(--m3), var(--m2));width:0%;height:100%;transition:width .35s cubic-bezier(.2,.8,.2,1)}#joy-fill.glowing{box-shadow:0 0 15px #f5cf56b8}#joy-face{background:#fff9e9;border:2px solid #2b3953;border-radius:50%;place-items:center;width:28px;height:28px;font-size:14px;transition:left .35s cubic-bezier(.2,.8,.2,1);display:grid;position:absolute;top:50%;left:0;transform:translateY(-50%);box-shadow:2px 2px #2b39533d}.run-story{top:calc(var(--board-top,260px) + var(--board-size,350px) + 56px);grid-template-columns:repeat(10,1fr);justify-items:center;gap:5px;width:288px;display:grid;position:absolute;left:50%;transform:translate(-50%)}.run-story .story-tile{filter:drop-shadow(0 2px #26344d33);border-radius:8px;width:24px;height:24px}.run-story .story-tile.grade-3{transform:translateY(-2px)rotate(3deg)}.story-slot{border:2px dashed #2b395333;border-radius:6px;width:15px;height:15px;margin:4px 0}.hud-actions{top:calc((var(--board-top,260px) + var(--board-size,350px) + 112px + var(--view-h,640px)) / 2 - 20px);pointer-events:auto;gap:9px;display:flex;position:absolute;left:50%;transform:translate(-50%)}#hud.compact .run-story{display:none}#hud.compact .hud-actions{top:calc((var(--board-top,260px) + var(--board-size,350px) + 52px + var(--view-h,640px)) / 2 - 20px)}.round-btn{color:#26344d;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#fff9e9d1;border:1.5px solid #2b39538c;border-radius:12px;place-items:center;width:40px;height:40px;padding:0;font-size:14px;font-weight:900;display:grid;box-shadow:2px 2px #2b395333;min-height:40px!important}.round-btn.off{opacity:.48}#chain-callout{left:50%;top:calc(var(--board-top,260px) - 42px);opacity:0;color:#fff9e9;letter-spacing:.04em;text-shadow:0 3px #26344d,0 4px 14px #26344d59;font-size:20px;font-weight:1000;position:absolute;transform:translate(-50%)}#chain-callout.pop{animation:1s ease-out forwards chain-pop}@keyframes chain-pop{0%{opacity:0;transform:translate(-50%)scale(.5)rotate(-3deg)}15%{opacity:1;transform:translate(-50%)scale(1.25)rotate(2deg)}28%{transform:translate(-50%)scale(1)}75%{opacity:1}to{opacity:0;transform:translate(-50%)translateY(-12px)}}#app .overlay{z-index:60;padding:max(18px, var(--safe-top)) 16px max(18px, env(safe-area-inset-bottom));-webkit-backdrop-filter:blur(9px)saturate(.9);backdrop-filter:blur(9px)saturate(.9);background:#1f2a3e94;place-items:center;display:grid;position:fixed;inset:0}#app .panel{border:2px solid var(--m-shadow);width:min(92vw,405px);max-height:91vh;color:var(--m-ink);background:var(--m-paper);box-shadow:7px 8px 0 var(--m-shadow), 0 20px 60px #1823344d;border-radius:28px;padding:26px 24px 22px;overflow-y:auto}#app button{border:0;border-radius:14px;min-height:48px;font-weight:900}#app .btn-primary{color:var(--m-ink);background:var(--m2);border:2px solid var(--m-shadow);box-shadow:0 5px #b78c23}#app .btn-primary:active{transform:translateY(4px)scale(.98);box-shadow:0 1px #b78c23}#app .btn-ghost{color:var(--m-ink);background:#fffdf7;border:2px solid #aeb7c7;box-shadow:0 4px #aeb7c7}#app .btn-ghost:active{transform:translateY(3px)scale(.98);box-shadow:0 1px #aeb7c7}.start-panel{text-align:center;gap:12px;display:grid}.logo-lockup{margin-bottom:3px}.logo-lockup h1{letter-spacing:-.07em;text-shadow:3px 3px 0 var(--m2);margin:7px 0 0;font-size:clamp(44px,13vw,62px);font-weight:1000;line-height:.9;transform:rotate(-2deg)}.logo-lockup p{color:#68738a;letter-spacing:.08em;text-transform:uppercase;margin-top:10px;font-size:10px;font-weight:900}.logo-friends{justify-content:center;align-items:end;gap:7px;height:54px;display:flex}.ui-tile{filter:drop-shadow(0 3px #26344d3d);flex:none;width:43px;height:43px;display:block}.logo-friends .logo-tile{border-radius:15px;width:47px;height:47px}.logo-friends .logo-tile:first-child{transform:rotate(-7deg)translateY(4px)}.logo-friends .logo-tile:nth-child(2){width:54px;height:54px;transform:translateY(-2px)}.logo-friends .logo-tile:nth-child(3){transform:rotate(7deg)translateY(4px)}.start-story{background:#eef5ff;border-radius:17px;gap:4px;margin:3px 0 7px;padding:15px;display:grid}.start-story strong{font-size:16px}.start-story span{color:#63708a;font-size:12px;line-height:1.4}.daily-note{color:#667189;min-height:16px;font-size:10px;font-weight:750}.tiny-rule{color:#7b8497;margin-top:4px;font-size:9px;line-height:1.45}.menu-panel{text-align:center;gap:12px;display:grid}.menu-panel h2,.result-panel h2{letter-spacing:-.04em;margin:2px 0 4px;font-size:35px;line-height:1}.panel-kicker{color:#728099;letter-spacing:.13em;text-transform:uppercase;font-size:9px;font-weight:1000}.settings-row{color:var(--m-ink);background:#fff4dc;border:2px solid #2b395329;border-radius:14px;justify-content:space-between;align-items:center;gap:12px;padding:10px 16px;font-size:13px;font-weight:800;display:flex}.switch-btn{border:2px solid var(--m-shadow);width:44px;height:26px;box-shadow:none;background:#d8dee8;border-radius:999px;flex:none;padding:0;position:relative;min-height:26px!important}.switch-btn[aria-checked=true]{background:var(--m3)}.switch-knob{background:#fff9e9;border-radius:50%;width:18px;height:18px;transition:transform .18s cubic-bezier(.2,.8,.2,1);position:absolute;top:1px;left:1px;box-shadow:0 1px 3px #26344d66}.switch-btn[aria-checked=true] .switch-knob{transform:translate(18px)}.result-panel{text-align:center;gap:12px;display:grid}.result-panel p{color:#63708a;max-width:31ch;margin:0 auto 3px;font-size:13px;line-height:1.45}.result-cast{justify-content:center;align-items:end;gap:4px;height:59px;margin-top:-6px;display:flex}.result-cast .result-tile{animation:friend-bow .65s cubic-bezier(.34,1.56,.64,1) var(--friend-delay) both}.result-cast .result-tile:nth-child(2),.result-cast .result-tile:nth-child(4){width:49px;height:49px}.result-cast .result-tile:nth-child(3){width:53px;height:53px}.result-cast.sunny .result-tile{box-shadow:inset 0 4px #fff3,0 3px #26344d3d,0 0 15px #f5cf56b3}@keyframes friend-bow{0%{opacity:0;transform:translateY(35px)scale(.55)rotate(-8deg)}70%{transform:translateY(-4px)scale(1.06)rotate(3deg)}to{opacity:1;transform:none}}.result-score{width:100%;color:var(--m-cream);background:#2c3a54;border-radius:17px;padding:13px 18px;display:grid}.result-score span{color:#aeb9ca;letter-spacing:.14em;text-transform:uppercase;font-size:8px;font-weight:900}.result-score strong{font-variant-numeric:tabular-nums;font-size:34px;line-height:1.05}.result-stats{grid-template-columns:repeat(3,1fr);gap:7px;display:grid}.result-stats div{background:#fff;border:1.5px solid #d7dce6;border-radius:13px;padding:10px 5px}.result-stats span{color:#7b8497;letter-spacing:.09em;text-transform:uppercase;font-size:7px;font-weight:900;display:block}.result-stats strong{margin-top:2px;font-size:17px;display:block}.move-story-wrap{background:#fff4dc;border-radius:15px;gap:7px;padding:9px 10px 10px;display:grid}.move-story-head{color:#725c32;justify-content:space-between;align-items:baseline;gap:10px;display:flex}.move-story-head strong{letter-spacing:.08em;text-transform:uppercase;font-size:9px;font-weight:1000}.move-story-head span{color:#9a8250;letter-spacing:.03em;font-size:7px;font-weight:850}.move-story{flex-wrap:wrap;place-content:center;gap:4px;min-height:27px;display:flex}.move-story .move-tile{border-width:1.5px;border-radius:8px;width:25px;height:25px;box-shadow:inset 0 2px #ffffff2e,0 2px #26344d30}.move-story .move-tile.grade-2{transform:translateY(-1px)}.move-story .move-tile.grade-3{transform:translateY(-2px)rotate(2deg);box-shadow:inset 0 2px #ffffff2e,0 2px #26344d30,0 0 0 2px #f5cf5680}.ranking{color:#226548;background:#dbf6e8;border-radius:12px;padding:10px;font-size:11px;font-weight:900}.text-btn{padding:3px 10px;font-size:10px;text-decoration:underline;color:#67738a!important;background:0 0!important;min-height:30px!important}.signin-nudge{background:#eef5ff;border-radius:15px;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px 10px;padding:11px 13px;animation:.22s ease-out signin-nudge-in;display:flex}.signin-nudge-copy{color:#4a5875;flex:190px;margin:0;font-size:11.5px;font-weight:750;line-height:1.4}.signin-nudge-actions{flex:none;justify-content:center;align-items:center;gap:8px;display:flex}#app .signin-nudge-primary{border:2px solid var(--m-shadow);background:var(--m2);min-height:44px;color:var(--m-ink);border-radius:12px;padding:0 16px;font-size:12px;font-weight:900;box-shadow:0 3px #b78c23}#app .signin-nudge-primary:active{transform:translateY(3px);box-shadow:0 0 #b78c23}#app .signin-nudge-dismiss{color:#67738a;background:0 0;border:0;border-radius:8px;min-height:44px;padding:3px 8px;font-size:10px;font-weight:800;text-decoration:underline}.signin-nudge-done{background:#dbf6e8}.signin-nudge-done .signin-nudge-copy{color:#226548;font-weight:900}@keyframes signin-nudge-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@media (height<=720px){#app .panel{max-height:94vh;padding-block:19px}.logo-friends{transform-origin:bottom;height:43px;transform:scale(.82)}.logo-lockup h1{font-size:44px}.start-story{padding:11px}.result-cast{transform-origin:bottom;height:45px;transform:scale(.8)}}@media (prefers-reduced-motion:reduce){#joy-fill{transition:none}.result-cast .result-tile{animation:none}#chain-callout.pop{animation-duration:.25s}.switch-knob{transition:none}.signin-nudge{animation:none}}