@font-face{font-family:Alfa Slab One;font-weight:400;font-display:swap;src:url(/the15puzzle/assets/alfa-slab-one-latin-400-normal-CbTZiZTW.woff2) format("woff2")}@font-face{font-family:Oswald;font-weight:400;font-display:swap;src:url(/the15puzzle/assets/oswald-latin-400-normal-BAFo8sP8.woff2) format("woff2")}@font-face{font-family:Oswald;font-weight:700;font-display:swap;src:url(/the15puzzle/assets/oswald-latin-700-normal-vy6hmKSr.woff2) format("woff2")}@font-face{font-family:Fraunces;font-weight:400;font-display:swap;src:url(/the15puzzle/assets/fraunces-latin-400-normal-6IfK1voy.woff2) format("woff2")}@font-face{font-family:Fraunces;font-weight:700;font-display:swap;src:url(/the15puzzle/assets/fraunces-latin-700-normal-CEOla-zY.woff2) format("woff2")}@font-face{font-family:Fraunces;font-style:italic;font-weight:400;font-display:swap;src:url(/the15puzzle/assets/fraunces-latin-400-italic-ChpO6tcr.woff2) format("woff2")}:root{--paper: #efe6cf;--paper-hi: #f7f1e1;--paper-lo: #e2d5b4;--ink: #1c1a17;--ink-soft: #4a453c;--ink-faint: rgba(28, 26, 23, .18);--red: #c8321f;--red-deep: #8f1f12;--wood: #b07a45;--wood-deep: #6e4724;--f-head: "Alfa Slab One", "Rockwell Extra Bold", Rockwell, Georgia, serif;--f-label: "Oswald", "Arial Narrow", "Roboto Condensed", sans-serif;--f-read: "Fraunces", Georgia, "Times New Roman", serif;--grain: radial-gradient(circle, rgba(28, 26, 23, .07) 1px, transparent 1.3px) 0 0 / 5px 5px;--rule-box: inset 0 0 0 3px var(--paper-hi), inset 0 0 0 4px var(--ink);--print: 3px 3px 0 var(--ink);--stamp-in: cubic-bezier(.2, 1.5, .4, 1);--settle: cubic-bezier(.2, .9, .3, 1.1);--bg: var(--paper);--bg-elev: var(--paper-hi);--bg-elev-2: var(--paper-lo);--fg: var(--ink);--fg-dim: var(--ink-soft);--accent: var(--red);--accent-2: var(--ink);--good: var(--red);--warn: var(--red-deep);--bad: var(--red);--border: var(--ink);--shadow: var(--print);--tile-bg: radial-gradient(circle, rgba(255, 250, 240, .05) 1px, transparent 1.4px) 0 0 / 4px 4px, linear-gradient(180deg, #2b2823, var(--ink) 60%, #12110f);--tile-fg: var(--paper-hi);--board-bed: #d6c7a1;--hub-focus-color: var(--red);--hub-focus-inner: var(--paper-hi);--hub-focus-width: 3px;--hub-focus-gap: 3px;--hub-menu-clear: 64px;--frame-pad: 14px;color-scheme:light}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}html{background:var(--paper)}body{font-family:var(--f-read);color:var(--ink);background:var(--grain),radial-gradient(140% 90% at 50% 20%,var(--paper-hi) 0%,var(--paper) 55%,var(--paper-lo) 100%) fixed;-webkit-font-smoothing:antialiased}a{color:var(--red);text-decoration-thickness:1px;text-underline-offset:2px}a:hover{color:var(--red-deep)}button{font-family:inherit;color:inherit}::selection{background:var(--red);color:var(--paper-hi)}input,textarea,select{font-family:var(--f-read);font-size:16px;color:var(--ink);background:#fffcf499;border:0;border-bottom:2px dotted var(--ink);border-radius:0;padding:9px 4px 7px;outline:none;min-height:44px;transition:background-color .15s ease,border-color .15s ease}input::placeholder{color:#4a453c99;font-style:italic}input:hover,textarea:hover,select:hover{background:#fffcf4f2}input:focus,textarea:focus,select:focus{background:var(--paper-hi);border-bottom:2px solid var(--red);box-shadow:0 2px 0 var(--red)}input:disabled,select:disabled{opacity:.5;cursor:not-allowed}select{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding-right:30px;font-family:var(--f-label);text-transform:uppercase;letter-spacing:.06em;background:linear-gradient(45deg,transparent 50%,var(--ink) 50%) right 14px center / 6px 6px no-repeat,linear-gradient(-45deg,transparent 50%,var(--ink) 50%) right 8px center / 6px 6px no-repeat,#fffcf499;border:2px solid var(--ink);box-shadow:2px 2px 0 var(--ink);cursor:pointer}select:focus{border:2px solid var(--red);box-shadow:2px 2px 0 var(--red)}input[type=range]{-moz-appearance:none;appearance:none;-webkit-appearance:none;height:44px;padding:0;border:0;background:repeating-linear-gradient(90deg,var(--ink) 0 1px,transparent 1px 10%) center / 100% 12px no-repeat,linear-gradient(var(--ink),var(--ink)) center / 100% 3px no-repeat;box-shadow:none;cursor:pointer}input[type=range]:hover,input[type=range]:focus{background-color:transparent}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:28px;background:var(--red);border:2px solid var(--ink);box-shadow:2px 2px 0 var(--ink)}input[type=range]::-moz-range-thumb{width:22px;height:28px;border-radius:0;background:var(--red);border:2px solid var(--ink);box-shadow:2px 2px 0 var(--ink)}input[type=range]:focus-visible::-webkit-slider-thumb{outline:3px solid var(--red);outline-offset:3px}input[type=range]:active::-webkit-slider-thumb{transform:translate(2px,2px);box-shadow:none}input[type=color].swatch{width:46px;height:44px;flex:none;padding:3px;border:2px solid var(--ink);background:var(--paper-hi);box-shadow:2px 2px 0 var(--ink);cursor:pointer}input[type=color].swatch::-webkit-color-swatch-wrapper{padding:0}input[type=color].swatch::-webkit-color-swatch{border:1px solid var(--ink);border-radius:0}input[type=file]{min-height:0;padding:4px 0;font-family:var(--f-label);font-size:13px;background:none;border:0;box-shadow:none}input[type=file]::file-selector-button{margin-right:10px;padding:6px 12px;font-family:var(--f-label);font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--paper-hi);background:var(--ink);border:0;cursor:pointer}input[type=file]::file-selector-button:hover{background:var(--red)}.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 20px;border:2px solid var(--ink);border-radius:0;outline:1.5px dashed var(--ink);outline-offset:-7px;background:var(--paper-hi);color:var(--ink);box-shadow:var(--print);cursor:pointer;font-family:var(--f-label);font-weight:700;font-size:15px;letter-spacing:.07em;text-transform:uppercase;text-decoration:none;-webkit-tap-highlight-color:transparent;transition:transform .12s ease,box-shadow .12s ease,background-color .15s ease,color .15s ease}.btn:hover{color:var(--ink);text-decoration:none;background:#fffaf0;transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--ink)}.btn:active{transform:translate(3px,3px);box-shadow:0 0 0 var(--ink);transition-duration:.04s}.btn:focus-visible{outline:1.5px dashed var(--ink);box-shadow:var(--print),0 0 0 3px var(--paper-hi),0 0 0 6px var(--red)}.btn:disabled,.btn[aria-disabled=true]{cursor:not-allowed;color:#1c1a1773;background:repeating-linear-gradient(-45deg,transparent 0 5px,rgba(28,26,23,.07) 5px 6px),var(--paper);border-color:#1c1a1773;outline-color:#1c1a1759;box-shadow:none;transform:none}.btn-primary{background:var(--red);color:var(--paper-hi);outline-color:#f7f1e1d9}.btn-primary:hover{background:#d63a26;color:var(--paper-hi)}.btn-primary:disabled{color:#f7f1e1cc;background:repeating-linear-gradient(-45deg,transparent 0 5px,rgba(28,26,23,.12) 5px 6px),#c97a6e}.btn-danger{color:var(--red);border-color:var(--red);outline-color:var(--red);box-shadow:3px 3px 0 var(--red-deep);background:var(--paper-hi)}.btn-danger:hover{color:var(--paper-hi);background:var(--red);box-shadow:4px 4px 0 var(--red-deep)}.btn-ghost{border-color:transparent;outline-color:transparent;box-shadow:none;background:transparent;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}.btn-ghost:hover{color:var(--red);background:transparent;box-shadow:none;transform:none;text-decoration:underline;text-decoration-thickness:2px}.btn-ghost:active{transform:translateY(1px)}.btn-sm{min-height:36px;padding:5px 12px;font-size:13px;outline-offset:-5px;box-shadow:2px 2px 0 var(--ink)}.btn[aria-pressed=true]{position:relative}.btn[aria-pressed=true]:after{content:"✓";position:absolute;top:-10px;right:-8px;width:22px;height:22px;display:grid;place-items:center;font-size:13px;color:var(--paper-hi);background:var(--ink);border:2px solid var(--paper-hi);border-radius:50%}.card{position:relative;padding:20px;background:var(--grain),var(--paper-hi);border:2px solid var(--ink);box-shadow:var(--rule-box),5px 5px 0 var(--ink-faint)}.card-head{font-family:var(--f-head);font-size:22px;line-height:1.05;margin-bottom:4px}.card-dek{font-family:var(--f-read);font-style:italic;font-size:14px;color:var(--ink-soft)}.app-shell{min-height:100%;display:flex;flex-direction:column}.app-header{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 24px;background:var(--grain),color-mix(in srgb,var(--paper) 94%,transparent);border-bottom:4px double var(--ink);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.app-header .brand{font-family:var(--f-head);font-size:22px;line-height:1;color:var(--ink);text-decoration:none;white-space:nowrap}.app-header .brand:hover{color:var(--red)}.app-header .header-left{display:flex;align-items:center;gap:14px;min-width:0}.app-header .header-back{white-space:nowrap;flex-shrink:0}.app-header .controls{display:flex;align-items:center;gap:12px}.app-header .header-greet{font-family:var(--f-read);font-style:italic;color:var(--ink-soft)!important}.app-header .header-greet strong{font-style:normal;font-family:var(--f-label);letter-spacing:.04em;text-transform:uppercase}.app-main{flex:1;padding:24px;padding-bottom:max(24px,var(--hub-menu-clear));max-width:1200px;width:100%;margin:0 auto}.landing{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:36px;align-items:start}@media (max-width: 800px){.landing{grid-template-columns:minmax(0,1fr);gap:22px}}.floaters{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden;z-index:0}.floater{position:absolute;bottom:-60px;width:var(--s);height:var(--s);display:grid;place-items:center;font-family:var(--f-head);font-size:calc(var(--s) * .55);color:var(--paper);background:var(--ink);box-shadow:0 3px 0 var(--wood-deep);opacity:0;animation:floater-rise 11s linear infinite}@keyframes floater-rise{0%{transform:translate(0) rotate(0);opacity:0}10%{opacity:.09}50%{transform:translate(24px,-55vh) rotate(90deg)}85%{opacity:.07}to{transform:translate(-16px,-115vh) rotate(180deg);opacity:0}}.hero{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:20px;padding:18px 0 12px;width:100%;max-width:480px;justify-self:center}@media (max-width: 800px){.hero{padding-top:0;gap:16px}}.logo{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;width:100%;padding-bottom:12px;border-bottom:2px solid var(--ink)}.logo-dateline{width:100%;display:flex;justify-content:center;padding:3px 0;border-top:2px solid var(--ink);border-bottom:1px solid var(--ink);font-family:var(--f-read);font-style:italic;font-size:.82rem;color:var(--ink-soft);opacity:0;animation:fade-up .5s .05s ease-out forwards}.logo-kicker{display:flex;align-items:center;gap:12px;margin-top:6px;font-family:var(--f-label);font-weight:700;font-size:.85rem;letter-spacing:.5em;padding-left:.5em;text-transform:uppercase;opacity:0;animation:fade-up .5s .5s ease-out forwards}.logo-kicker:before,.logo-kicker:after{content:"";width:36px;height:2px;background:var(--ink)}.wordmark{display:flex;align-items:center;margin:0;font-family:var(--f-head);font-weight:400;font-size:clamp(3rem,15vw,5.3rem);line-height:.95;letter-spacing:-.01em}.wm-space{width:.18em}.wm-letter{display:inline-block;color:var(--ink);text-shadow:1px 1px 0 rgba(28,26,23,.22);opacity:0;animation:letter-press .42s calc(.15s + var(--i) * .06s) var(--stamp-in) forwards}.wm-letter.wm-tile{flex:none;display:inline-grid;place-items:center;width:.98em;height:1.04em;margin-right:.06em;font-size:.8em;color:var(--paper-hi);background:var(--tile-bg);box-shadow:inset 0 0 0 .05em var(--paper-hi),inset 0 0 0 .08em var(--ink),0 .07em 0 var(--wood),0 .1em 0 var(--wood-deep);text-shadow:none}.wm-letter.wm-tile:nth-child(2){background:radial-gradient(circle,rgba(255,250,240,.06) 1px,transparent 1.4px) 0 0 / 4px 4px,linear-gradient(180deg,#d63a26,var(--red) 60%,var(--red-deep))}@keyframes letter-press{0%{opacity:0;transform:translateY(-18%) scale(1.5);filter:blur(2px)}70%{opacity:1;transform:translateY(2%) scale(.96);filter:none}to{opacity:1;transform:none}}@keyframes fade-up{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.taglines{position:relative;height:1.45em;width:100%;font-family:var(--f-read);font-style:italic;font-size:1.02rem;color:var(--ink-soft);text-align:center}.taglines span{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;animation:tagline 14s linear infinite}.taglines span:nth-child(2){animation-delay:3.5s}.taglines span:nth-child(3){animation-delay:7s}.taglines span:nth-child(4){animation-delay:10.5s}@keyframes tagline{0%{opacity:0;transform:translateY(6px)}4%,21%{opacity:1;transform:translateY(0)}25%,to{opacity:0;transform:translateY(-6px)}}.logo-stamp{position:absolute;right:0;top:30px;padding:0 8px 1px;font-family:var(--f-head);font-size:.85rem;letter-spacing:.05em;text-transform:uppercase;color:var(--red);border:3px solid var(--red);box-shadow:inset 0 0 0 2px var(--paper),inset 0 0 0 3px var(--red);background:#f7f1e1b3;transform:rotate(-8deg);mix-blend-mode:multiply;-webkit-mask:radial-gradient(circle at 30% 40%,#000 55%,transparent 56%) 0 0 / 4px 4px,linear-gradient(#000 0 0);-webkit-mask-composite:source-over;opacity:0;animation:stamp-thump .45s 1.1s var(--stamp-in) forwards}@keyframes stamp-thump{0%{opacity:0;transform:rotate(-8deg) scale(2.2)}60%{opacity:1;transform:rotate(-8deg) scale(.92)}to{opacity:.92;transform:rotate(-8deg) scale(1)}}.menu-panel{width:100%;display:flex;flex-direction:column;gap:14px;padding:6px 4px 0}.btn.mbtn{justify-content:flex-start;gap:14px;width:100%;padding:10px 40px 10px 10px;text-align:left;text-transform:none;letter-spacing:0;opacity:0;animation:btn-in .4s var(--settle) forwards}@keyframes btn-in{0%{opacity:0;transform:translate(-16px) rotate(-1deg)}to{opacity:1;transform:none}}.mbtn-icon{flex:0 0 auto;display:grid;place-items:center;width:46px;height:46px;font-family:var(--f-head);font-size:1.3rem;color:var(--paper-hi);background:var(--tile-bg);box-shadow:0 3px 0 var(--wood);transition:transform .18s var(--stamp-in)}.mbtn-text{display:flex;flex-direction:column;gap:2px;min-width:0}.mbtn-label{font-family:var(--f-head);font-weight:400;font-size:1.22rem;line-height:1.05;text-transform:uppercase}.mbtn-sub{font-family:var(--f-read);font-style:italic;font-size:.86rem;color:var(--ink-soft)}.mbtn:after{content:"☜";position:absolute;right:10px;top:50%;font-family:Segoe UI Symbol,Apple Symbols,Noto Sans Symbols,"Noto Sans Symbols 2",DejaVu Sans,sans-serif;font-size:1.9rem;line-height:1;color:var(--red);opacity:0;transform:translate(10px,-50%);transition:opacity .15s ease,transform .15s ease}.btn.mbtn:hover,.btn.mbtn:focus-visible{outline:1.5px dashed var(--ink)}.mbtn:hover .mbtn-icon,.mbtn:focus-visible .mbtn-icon{transform:rotate(-6deg) scale(1.06)}.mbtn:hover:after,.mbtn:focus-visible:after{opacity:1;animation:pointer .6s ease-in-out infinite alternate}@keyframes pointer{0%{transform:translateY(-50%)}to{transform:translate(-5px,-50%)}}.btn.mbtn:active{transform:translate(3px,3px)}.btn.mbtn--primary,.btn.mbtn--primary:hover,.btn.mbtn--primary:focus-visible{padding-top:14px;padding-bottom:14px;background:var(--grain),var(--red);color:var(--paper-hi);outline-color:#f7f1e1d9}.btn.mbtn--primary:hover{background:var(--grain),#d63a26}.mbtn--primary .mbtn-label{font-size:1.6rem;color:var(--paper-hi)}.mbtn--primary .mbtn-sub{color:#f7f1e1eb}.mbtn--primary .mbtn-icon{width:54px;height:54px;font-size:1.5rem;color:var(--red);background:var(--paper-hi);box-shadow:0 3px 0 var(--red-deep)}.mbtn--primary:after{color:var(--paper-hi)}.mbtn--primary:before{content:"✂";position:absolute;top:-15px;left:18px;font-size:1.15rem;line-height:1;color:var(--ink);background:var(--paper);padding:0 3px;pointer-events:none}.mbtn--primary:hover:before,.mbtn--primary:focus-visible:before{animation:snip 1.6s ease-in-out infinite}@keyframes snip{0%{transform:translate(0) scaleY(1)}20%{transform:translate(14px) scaleY(.7)}40%{transform:translate(28px) scaleY(1)}60%{transform:translate(42px) scaleY(.7)}to{transform:translate(0) scaleY(1)}}.btn.mbtn--small{padding-top:7px;padding-bottom:7px}.mbtn--small .mbtn-icon{width:34px;height:34px;font-size:1rem}.mbtn--small .mbtn-label{font-size:1rem}.leaderboard{position:sticky;top:86px;z-index:1;padding:16px 18px 18px;opacity:0;animation:panel-in .5s .45s var(--settle) forwards}@keyframes panel-in{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 800px){.leaderboard{position:static}}.leaderboard h3{margin:0;font-family:var(--f-head);font-weight:400;font-size:1.75rem;line-height:1;text-align:center}.leaderboard .lb-by{margin:4px 0 10px;padding-bottom:8px;border-bottom:2px solid var(--ink);font-family:var(--f-read);font-style:italic;font-size:.85rem;text-align:center;color:var(--ink-soft)}.leaderboard ol{list-style:none;padding:0;margin:0;display:flex;flex-direction:column}.leaderboard li{display:grid;grid-template-columns:32px 1fr auto;align-items:center;gap:10px;padding:8px 2px;border-bottom:1px dotted var(--ink)}.leaderboard .rank{font-family:var(--f-head);font-size:1.15rem;text-align:center;color:var(--ink)}.leaderboard .top .rank{display:grid;place-items:center;width:30px;height:30px;color:var(--paper-hi);background:var(--tile-bg);box-shadow:0 2px 0 var(--wood)}.leaderboard .top-1 .rank{background:var(--red);box-shadow:0 2px 0 var(--red-deep)}.leaderboard .you{background:linear-gradient(transparent 55%,#c8321f2e 55%)}.leaderboard .you .lb-name:after{content:" (you)";font-family:var(--f-read);font-style:italic;font-weight:400;text-transform:none;letter-spacing:0;color:var(--red)}.leaderboard .lb-name{font-family:var(--f-label);font-weight:700;font-size:1.02rem;letter-spacing:.03em;text-transform:uppercase;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.leaderboard .count{min-width:34px;text-align:right;font-family:var(--f-head);font-size:1.3rem;font-variant-numeric:tabular-nums}.leaderboard .meta{font-family:var(--f-read);font-style:italic;font-size:12.5px;color:var(--ink-soft)}.leaderboard .lb-more{width:100%;margin-top:10px}.auth-page{display:flex;justify-content:center;align-items:center;min-height:calc(100vh - 80px)}.auth-card{width:100%;max-width:400px;display:flex;flex-direction:column;gap:16px;padding:26px;animation:panel-in .45s var(--settle) both}.auth-card h2{margin:0 0 4px;font-family:var(--f-head);font-weight:400;font-size:30px;line-height:1;border-bottom:2px solid var(--ink);padding-bottom:10px}.field{display:flex;flex-direction:column;gap:6px}.auth-card label,.field-label{font-family:var(--f-label);font-weight:700;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink)}.auth-card .error,.form-error,.race-error{font-family:var(--f-read);font-style:italic;font-size:14px;color:var(--red);padding-left:10px;border-left:3px solid var(--red)}.auth-card .switch{font-size:14px;color:var(--ink-soft);text-align:center;font-style:italic}.puzzles-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}.puzzle-card{position:relative;display:flex;flex-direction:column;gap:4px;min-height:100px;padding:14px 16px 16px;color:var(--ink);text-decoration:none;background:var(--paper-hi);border:2px solid var(--ink);box-shadow:var(--print);cursor:pointer;transition:transform .12s ease,box-shadow .12s ease}.puzzle-card:hover{color:var(--ink);transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--ink)}.puzzle-card:active{transform:translate(3px,3px);box-shadow:none}.puzzle-card:focus-visible{outline:3px solid var(--red);outline-offset:3px}.puzzle-card .name{font-family:var(--f-head);font-size:1.2rem;line-height:1.1;padding-right:64px}.puzzle-card .sub{font-family:var(--f-read);font-style:italic;font-size:13px;color:var(--ink-soft)}.puzzle-card .diff{height:10px;margin-top:auto;background:repeating-linear-gradient(90deg,var(--ink-faint) 0 8px,transparent 8px 11px)}.puzzle-card .diff>span{display:block;height:100%;background:repeating-linear-gradient(90deg,var(--ink) 0 8px,transparent 8px 11px);transform-origin:left;animation:bar-grow .8s .2s var(--settle) both}@keyframes bar-grow{0%{transform:scaleX(0)}}.puzzle-card .badge{position:absolute;top:12px;right:8px;padding:0 6px;font-family:var(--f-head);font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--red);border:2px solid var(--red);transform:rotate(8deg);mix-blend-mode:multiply;animation:badge-thump .45s .3s var(--stamp-in) both}@keyframes badge-thump{0%{opacity:0;transform:rotate(8deg) scale(2)}}.section-title{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:8px 0 16px;padding-bottom:8px;border-bottom:4px double var(--ink)}.section-title h2{margin:0;font-family:var(--f-head);font-weight:400;font-size:26px;line-height:1}.play-page{display:grid;grid-template-columns:1fr auto 1fr;gap:24px;align-items:start}@media (max-width: 900px){.play-page{grid-template-columns:1fr}}.play-side{display:flex;flex-direction:column;gap:14px}.stat{display:flex;flex-direction:column;padding:10px 14px 12px;background:var(--paper-hi);border:2px solid var(--ink);box-shadow:var(--rule-box)}.stat .label{font-family:var(--f-label);font-weight:700;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);border-bottom:1px solid var(--ink);padding-bottom:3px;margin-bottom:4px}.stat .value{font-family:var(--f-head);font-size:28px;line-height:1.05;font-variant-numeric:tabular-nums}.stat-warn{border-color:var(--red);box-shadow:inset 0 0 0 3px var(--paper-hi),inset 0 0 0 4px var(--red)}.stat-warn .value{color:var(--red);font-size:20px}.board-frame{position:relative;padding:var(--frame-pad);background:repeating-linear-gradient(90deg,rgba(255,255,255,.04) 0 2px,transparent 2px 5px),linear-gradient(180deg,#3b3832,#24221e);border:2px solid var(--ink);box-shadow:inset 0 1px #ffffff26,6px 6px 0 var(--ink-faint)}.board-frame:before,.board-frame:after{content:"";position:absolute;width:26px;height:calc(var(--frame-pad) - 6px);min-height:4px;left:50%;margin-left:-13px;background:linear-gradient(180deg,#d8c9a6,#8c7b58);clip-path:polygon(0 0,100% 25%,100% 100%,0 100%);pointer-events:none}.board-frame:before{top:3px}.board-frame:after{bottom:3px;transform:scaleY(-1)}.board{position:relative;overflow:hidden;touch-action:none;-webkit-tap-highlight-color:transparent;box-shadow:inset 0 2px 6px #00000073}.board:not([style*="url("]){background-image:repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 1px,transparent 1px 4px)!important}.tile{position:absolute;left:0;top:0;font-family:var(--f-head);font-weight:400;cursor:default;user-select:none;-webkit-user-select:none;z-index:1}.tile.movable{cursor:pointer}.tile-face{width:100%;height:100%;display:flex;align-items:center;justify-content:center;border-radius:3px;background:var(--tile-bg);color:var(--tile-fg);background-size:cover;background-position:center;box-shadow:inset 0 0 0 2px #f7f1e11f,inset 0 -3px #00000059,0 4px 0 var(--wood),0 5px 0 var(--wood-deep),0 8px 10px #00000059;text-shadow:0 1px 0 rgba(0,0,0,.4);transition:transform .1s ease,filter .15s ease,box-shadow .12s ease,background .2s ease}.tile.no-numbers .tile-face{color:transparent;text-shadow:none}.tile.movable:hover .tile-face{filter:brightness(1.25);transform:translateY(-2px)}.tile:active .tile-face{transform:translateY(3px);box-shadow:inset 0 0 0 2px #f7f1e11f,0 1px 0 var(--wood),0 2px 0 var(--wood-deep)}.tile-face.home:not(.custom){background:radial-gradient(circle,rgba(255,250,240,.07) 1px,transparent 1.4px) 0 0 / 4px 4px,linear-gradient(180deg,#d63a26,var(--red) 60%,var(--red-deep));color:var(--paper-hi)}.tile-face.custom{border-radius:2px}.tile-face.pop-0{animation:tile-pop-a .4s var(--stamp-in)}.tile-face.pop-1{animation:tile-pop-b .4s var(--stamp-in)}@keyframes tile-pop-a{0%{transform:scale(1.18)}60%{transform:scale(.94)}to{transform:scale(1)}}@keyframes tile-pop-b{0%{transform:scale(1.18)}60%{transform:scale(.94)}to{transform:scale(1)}}.tile-face.nudge-0{animation:tile-nudge-a .32s ease}.tile-face.nudge-1{animation:tile-nudge-b .32s ease}@keyframes tile-nudge-a{0%,to{transform:translate(0)}25%{transform:translate(-5px) rotate(-3deg)}60%{transform:translate(4px) rotate(2deg)}}@keyframes tile-nudge-b{0%,to{transform:translate(0)}25%{transform:translate(-5px) rotate(-3deg)}60%{transform:translate(4px) rotate(2deg)}}.tile-face.wave{animation:tile-wave .6s var(--stamp-in) both}@keyframes tile-wave{0%{transform:none}35%{transform:translateY(-10%) scale(1.06);filter:brightness(1.4)}60%{transform:translateY(3%) scale(.97)}to{transform:none}}.board-fx{position:absolute;left:0;top:0;pointer-events:none;z-index:3}.board.solved{animation:board-press .9s ease-out}@keyframes board-press{0%,to{transform:none}30%{transform:scale(.985)}}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:16px;background:#1c1a178c;-webkit-backdrop-filter:blur(2px) sepia(.4);backdrop-filter:blur(2px) sepia(.4)}.modal{width:100%;max-width:440px;padding:24px 24px 22px;display:flex;flex-direction:column;gap:14px;background:var(--grain),var(--paper-hi);border:2px solid var(--ink);box-shadow:var(--rule-box),8px 8px 0 var(--ink)}.modal h3{margin:0;padding-bottom:8px;font-family:var(--f-head);font-weight:400;font-size:30px;line-height:1;border-bottom:2px solid var(--ink)}.modal-text{margin:0;font-family:var(--f-read);font-size:16px;line-height:1.45;color:var(--ink-soft)}.modal-actions{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:12px;padding-top:4px}.toggle-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;font-family:var(--f-read)}.toggle-label{font-family:var(--f-label);font-weight:700;font-size:13px;letter-spacing:.1em;text-transform:uppercase}.toggle{position:relative;flex:none;width:30px;height:30px;padding:0;margin:7px;border:2px solid var(--ink);border-radius:0;background:var(--paper-hi);box-shadow:inset 0 0 0 2px var(--paper-hi),2px 2px 0 var(--ink);cursor:pointer;transition:transform .1s ease,box-shadow .1s ease}.toggle:before{content:"";position:absolute;top:-9px;right:-9px;bottom:-9px;left:-9px}.toggle:after{content:"✗";position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;font-family:var(--f-head);font-size:22px;line-height:1;color:var(--red);opacity:0;transform:scale(1.8) rotate(-12deg);transition:opacity .12s ease,transform .22s var(--stamp-in)}.toggle:hover{background:#fffaf0}.toggle:active{transform:translate(2px,2px);box-shadow:inset 0 0 0 2px var(--paper-hi)}.toggle:focus-visible{outline:3px solid var(--red);outline-offset:4px}.toggle.on:after{opacity:1;transform:scale(1) rotate(-6deg)}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}@media (max-width: 520px){.field-row{grid-template-columns:1fr}}canvas.particles{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:50}.empty-state{text-align:center;padding:40px;font-family:var(--f-read);font-style:italic;font-size:1.05rem;color:var(--ink-soft)}.solved-overlay{position:absolute;z-index:5;inset:var(--frame-pad);display:flex;align-items:center;justify-content:center;pointer-events:none;background:radial-gradient(circle,#f7f1e1eb,#efe6cfc7 70%);animation:solved-in .4s .7s ease-out both}@keyframes solved-in{0%{opacity:0}to{opacity:1}}.solved-card{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;padding:0 12px}.solved-stamp{padding:4px 18px 6px;font-family:var(--f-head);font-size:clamp(30px,9vw,46px);line-height:1;letter-spacing:.04em;text-transform:uppercase;color:var(--red);border:5px solid var(--red);box-shadow:inset 0 0 0 3px var(--paper-hi),inset 0 0 0 5px var(--red);transform:rotate(-7deg);mix-blend-mode:multiply;-webkit-mask:radial-gradient(circle at 30% 40%,#000 58%,transparent 60%) 0 0 / 5px 5px,linear-gradient(#000 0 0);-webkit-mask-composite:source-over;animation:stamp-thump .5s .95s var(--stamp-in) both}.solved-line{margin-top:8px;font-family:var(--f-head);font-size:22px;color:var(--ink)}.solved-sub{font-family:var(--f-read);font-style:italic;font-size:15px;color:var(--ink-soft)}.community-creator-form{display:flex;flex-direction:column;gap:18px;max-width:760px;margin:0 auto}.community-creator-form .card strong{font-family:var(--f-label);font-weight:700;letter-spacing:.1em;text-transform:uppercase}.uploader{display:flex;flex-direction:column;gap:4px;padding:12px;background:#fffcf499;border:2px dashed var(--ink);cursor:pointer;transition:background-color .15s ease}.uploader:hover{background:var(--paper-hi)}.uploader:focus-within{border-color:var(--red)}.uploader.has-file{border-style:solid;border-color:var(--ink);box-shadow:3px 3px 0 var(--red)}.uploader-label{font-family:var(--f-label);font-weight:700;font-size:13px;letter-spacing:.06em;text-transform:uppercase}.uploader-note{font-family:var(--f-read);font-style:italic;font-size:12px;color:var(--ink-soft);overflow-wrap:anywhere}.uploader.has-file .uploader-note{color:var(--red);font-style:normal}.tile-uploads{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.tile-uploads .uploader{padding:8px}.tile-uploads .uploader input[type=file]{width:100%;font-size:0}.tile-uploads .uploader input[type=file]::file-selector-button{width:100%;font-size:11px;letter-spacing:.03em;padding:5px 2px;margin:0}@media (max-width: 600px){.tile-uploads{grid-template-columns:repeat(3,1fr)}}.race-page{max-width:580px;margin:0 auto;display:flex;flex-direction:column;gap:20px}.race-card{padding:20px;animation:panel-in .45s var(--settle) both}.race-card+.race-card{animation-delay:.1s}.race-title{margin:0 0 6px;padding-bottom:8px;font-family:var(--f-head);font-weight:400;font-size:32px;line-height:1;border-bottom:2px solid var(--ink)}.race-sub,.race-dim{font-family:var(--f-read);font-style:italic;color:var(--ink-soft);font-size:14px}.race-sub{margin:0 0 16px}.race-label{font-family:var(--f-label);font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.16em;margin-bottom:8px}.race-seg{display:flex;gap:12px;flex-wrap:wrap}.race-seg .btn{flex:1 1 0;min-width:84px}.race-private{margin:16px 0;gap:12px}.race-private>span{font-family:var(--f-read);font-size:15px}.race-actions{display:flex;flex-wrap:wrap;gap:12px}.race-actions .btn{flex:1 1 auto}.race-error{margin-top:12px}.race-h3{margin:0 0 10px;padding-bottom:6px;font-family:var(--f-head);font-weight:400;font-size:22px;border-bottom:2px solid var(--ink)}.race-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}.race-list li{display:flex;align-items:center;gap:10px;padding:8px 2px;border-bottom:1px dotted var(--ink)}.race-name{min-height:44px;background:none;border:0;padding:0;color:var(--ink);font-family:var(--f-label);font-weight:700;font-size:16px;text-transform:uppercase;letter-spacing:.03em;cursor:pointer}.race-name:hover{color:var(--red);text-decoration:underline}.race-name:focus-visible{outline:3px solid var(--red);outline-offset:2px}.race-list .race-dim{flex:1}.race-join{padding:6px 16px}.race-board-page{padding-top:56px}@media (max-width: 900px){.race-board-page{padding-top:104px;gap:14px}.race-board-page .board-frame{order:-1;justify-self:center}.race-board-page .play-side .card{display:none}.race-board-page .play-side:first-child{flex-direction:row}.race-board-page .play-side:first-child .stat{flex:1;padding:8px 12px}}.race-lock{position:absolute;z-index:5;inset:var(--frame-pad);display:flex;align-items:flex-start;justify-content:center;padding-top:18%;font-family:var(--f-head);font-size:28px;color:var(--ink);background:var(--grain),#efe6cff2;pointer-events:none}.race-over{flex-direction:column;align-items:center;justify-content:center;gap:10px;padding-top:0;background:#efe6cfd9}.race-over-stamp{padding:2px 12px;font-size:26px;text-transform:uppercase;color:var(--ink);border:4px solid var(--ink);transform:rotate(-5deg);animation:stamp-thump .45s var(--stamp-in) both}.header-face,.race-host-face{flex:none}.race-racers{display:flex;flex-direction:column;gap:12px;padding:14px}.race-lane{display:flex;align-items:center;gap:12px}.race-lane-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}.race-lane-name{font-family:var(--f-label);font-weight:700;font-size:14px;letter-spacing:.06em;text-transform:uppercase;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.race-lane-bar{height:12px;border:2px solid var(--ink);background:var(--paper-hi);overflow:hidden}.race-lane-bar>span{display:block;height:100%;background:repeating-linear-gradient(-45deg,var(--red) 0 4px,var(--red-deep) 4px 6px);transition:width .25s ease}.race-lane-placed{font-family:var(--f-head);font-variant-numeric:tabular-nums;color:var(--ink);font-size:15px}@media (max-width: 900px){.race-board-page .play-side .race-racers{display:flex;flex-direction:row;gap:14px;padding:10px 12px}.race-board-page .race-lane{flex:1;min-width:0;gap:8px}.race-board-page .race-lane-placed{display:none}}@media (max-width: 480px){.app-header{padding:10px 14px;gap:8px}.app-header .brand{font-size:19px}.app-header .header-hi{display:none}.app-header .header-greet{max-width:34vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.app-header .controls .btn{white-space:nowrap}.app-header .header-back+.brand{display:none}.app-header:has(.header-back) .header-greet{display:none}}@media (max-width: 400px){.app-header .header-greet{max-width:22vw}}@media (max-width: 600px){:root{--frame-pad: 8px}.app-main{padding-left:14px;padding-right:14px}.app-header .header-create{display:none}.board-frame:before,.board-frame:after{display:none}}@media (max-width: 900px){.app-main:has(>.play-page:not(.race-board-page)){padding-top:16px}.play-page:not(.race-board-page){display:flex;flex-wrap:wrap;gap:10px}.play-page:not(.race-board-page)>.play-side{display:contents}.play-page:not(.race-board-page)>*,.play-page:not(.race-board-page)>.play-side>*{flex:1 1 100%;min-width:0}.play-page:not(.race-board-page)>.play-side>.stat{flex-basis:0;padding:7px 10px 8px}.play-page:not(.race-board-page)>.play-side>.stat .value{font-size:20px;white-space:nowrap}.play-page:not(.race-board-page)>.play-side>.stat .label{font-size:11px;letter-spacing:.1em}.play-page:not(.race-board-page)>.play-side:first-child>:not(.stat):not(.card){order:1}.play-page:not(.race-board-page)>:not(.play-side),.play-page:not(.race-board-page)>.play-side:last-child>:not(.stat:first-child){order:2}.play-page:not(.race-board-page)>.board-frame{flex:0 1 auto;margin:0 auto}.play-page .card{padding:12px 16px}.play-page .card-head{font-size:19px}}@media (prefers-reduced-motion: reduce){.wm-letter,.logo-dateline,.logo-kicker,.logo-stamp,.btn.mbtn,.leaderboard,.taglines span,.floater,.mbtn--primary:before,.mbtn:after,.tile-face,.solved-overlay,.solved-stamp,.board.solved,.puzzle-card .diff>span,.puzzle-card .badge,.auth-card,.race-card,.race-over-stamp{animation:none!important}.wm-letter,.logo-dateline,.logo-kicker,.btn.mbtn,.leaderboard,.solved-overlay,.solved-stamp,.auth-card,.race-card{opacity:1!important}.logo-stamp{opacity:.92!important}.taglines span:first-child{opacity:1}.floaters{display:none}.btn,.toggle,.toggle:after,.tile-face,.puzzle-card{transition:none!important}}
