:root{--bg:#0e1220;--ink:#f4efe2;--muted:#cfc6b2;--brass:#d8b25a;--walnut:#5a3420;--leather:#3a2216;--cloth:#1f3d6b;--good:#7fe0a8;--foul:#ff6b5e;--font:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif}html,body{overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;height:100%;font-family:var(--font);color:var(--ink);background:radial-gradient(ellipse at 50% 40%, #0e122040, #080910e0 75%), var(--img-background,none) center / cover no-repeat, var(--bg);margin:0;overflow:hidden}#game{touch-action:none;position:fixed;inset:0}#table,#felt{touch-action:none;display:block;position:absolute;top:0;left:0}#felt{pointer-events:none}[hidden]{display:none!important}.panel{box-sizing:border-box;border:28px solid #0000;border-image:var(--img-panel,none) 74 / 28px / 0 stretch;text-align:center;filter:drop-shadow(0 18px 30px #0000008c);background-color:#0000;background-image:radial-gradient(at 50% 0,#ffdca014,#0000 60%),linear-gradient(#3e2416,#26150c);background-position:0 0,0 0;background-repeat:repeat,repeat;background-size:auto,auto;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:padding-box;border-radius:18px;flex-direction:column;align-items:stretch;gap:10px;width:100%;max-width:min(420px,100vw - 24px);padding:26px 26px 22px;display:flex}.panel h1,.panel h2,.panel h3{text-shadow:0 2px #00000073;margin:0}.panel h1{letter-spacing:.5px;color:#ffe9b8;font-size:34px}.panel h2{color:#ffe9b8;font-size:24px}.panel h3{text-align:left;color:#ffe9b8;margin-top:6px;font-size:15px}.panel h3 small{color:var(--muted);font-weight:500}.sub{color:var(--muted);margin:0;font-size:14px;line-height:1.35}.foot{color:var(--muted);margin:2px 0 0;font-size:13px}.btn{font:700 17px/1.1 var(--font);cursor:pointer;touch-action:manipulation;border:14px solid #0000;border-radius:16px;min-height:50px;padding:0 18px;transition:transform 80ms}.btn:active{transform:scale(.97)}.btn:focus-visible{outline-offset:2px;outline:3px solid #fff}.btn.primary{color:#2a170a;border-image:var(--img-button-primary,none) 56 fill / 14px / 0 stretch;text-shadow:0 1px #fff0c899;background:linear-gradient(#f2d27a,#b8892c) padding-box padding-box}.btn.secondary{color:var(--ink);border-image:var(--img-button-secondary,none) 56 fill / 14px / 0 stretch;text-shadow:0 1px #00000080;background:linear-gradient(#24406c,#142640) padding-box padding-box}.btn.big{min-height:58px;font-size:20px}.btn.small{border-width:11px;min-height:44px;padding:0 8px;font-size:14px}.btn:disabled{opacity:.45;cursor:default}.screen{z-index:5;padding:max(64px, env(safe-area-inset-top)) 12px 16px;box-sizing:border-box;background:#06080e8c;place-items:center;animation:.2s fade-in;display:grid;position:fixed;inset:0;overflow-y:auto}@keyframes fade-in{0%{opacity:0}}.menu-panel .key-art{background:var(--img-key-art,none) center / cover, radial-gradient(circle at 40% 40%, #f4efe2 0 18%, #1f3d6b 19%);width:132px;height:132px;box-shadow:0 0 0 3px var(--brass), 0 8px 18px #00000080;border-radius:14px;margin:-6px auto 2px}.list-panel{max-width:min(520px,100vw - 24px)}.rivals{gap:10px;display:grid}.rival{text-align:left;color:var(--ink);font:inherit;cursor:pointer;background:#0a0e1a8c;border:2px solid #d8b25a80;border-radius:14px;grid-template-columns:64px 1fr auto;align-items:center;gap:12px;min-height:76px;padding:8px 12px 8px 8px;display:grid}.rival img{width:64px;height:64px}.rival .name{font-size:17px;font-weight:800}.rival .blurb{color:var(--muted);font-size:13px;line-height:1.3}.rival .rec{color:var(--muted);text-align:right;white-space:nowrap;font-size:12px}.rival .medals{letter-spacing:1px;font-size:15px}.rival.locked{opacity:.55;cursor:default}.rival.locked img{filter:grayscale()brightness(.6)}.rival.fresh{animation:.9s unlock}@keyframes unlock{0%{transform:scale(.9)rotateY(90deg)}60%{transform:scale(1.04)rotateY(0)}}.medal-b,.medal-s,.medal-g{border-radius:50%;width:14px;height:14px;margin-left:2px;display:inline-block;box-shadow:inset 0 -2px #0000004d}.medal-b{background:radial-gradient(circle at 35% 30%,#ffd9b8,#d08a55 45%,#7a4320)}.medal-s{background:radial-gradient(circle at 35% 30%,#fff,#d9e0e6 45%,#7d8890)}.medal-g{background:radial-gradient(circle at 35% 30%,#fff3c4,#ffd36a 45%,#a0700f)}.medal-off{opacity:.18}.trick-grid{grid-template-columns:repeat(5,1fr);gap:8px;display:grid}.trick-btn{min-height:54px;color:var(--ink);font:700 15px/1.1 var(--font);cursor:pointer;background:#0a0e1a99;border:2px solid #d8b25a73;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:3px;padding:4px 0;display:flex}.trick-btn .st{letter-spacing:1px;color:#ffd36a;font-size:11px}.trick-btn .st .off{color:#ffffff40}.toggle{text-align:left;cursor:pointer;align-items:center;gap:10px;min-height:44px;font-size:15px;display:flex}.toggle input{width:24px;height:24px;accent-color:var(--brass)}.swatches{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.swatch{min-height:56px;color:var(--ink);font:600 12px/1.2 var(--font);cursor:pointer;text-shadow:0 1px 2px #000;border:2px solid #ffffff26;border-radius:12px;flex-direction:column;justify-content:flex-end;align-items:center;padding:4px;display:flex}.swatch.on{border-color:var(--brass);box-shadow:0 0 0 2px var(--brass)}.swatch:disabled{opacity:.4;cursor:default}.results-panel{align-items:center}.results-panel>.btn{align-self:stretch}.flip{perspective:600px;width:96px;height:96px;margin-top:-4px;position:relative}.flip .face{backface-visibility:hidden;place-items:center;transition:transform .6s cubic-bezier(.3,1.4,.5,1);display:grid;position:absolute;inset:0}.flip .face img{width:96px;height:96px}.flip .back{transform:rotateY(180deg)}.flip.flipped .front{transform:rotateY(-180deg)}.flip.flipped .back{transform:rotateY(0)}.medal{width:84px;height:84px;font:900 15px var(--font);color:#2a170a;border-radius:50%;place-items:center;display:grid;box-shadow:inset 0 -6px #00000040,0 0 0 4px #ffffff40,0 0 24px #ffd36a99}.big-score{font:900 40px/1 var(--font);color:#ffe9b8;text-shadow:0 3px #00000080}.stars{justify-content:center;gap:6px;min-height:0;display:flex}.stars .star{background:var(--img-icon-star,none) center / contain no-repeat;opacity:.18;filter:grayscale();width:44px;height:42px}.stars .star.on{opacity:1;filter:none;animation:.35s cubic-bezier(.3,1.6,.5,1) backwards stamp}@keyframes stamp{0%{opacity:0;transform:scale(2.2)rotate(-20deg)}}.pyramid{flex-direction:column-reverse;align-items:center;gap:1px;min-height:0;display:flex}.pyramid .row{gap:1px;display:flex}.pyramid .ball{border-radius:50%;width:18px;height:18px;animation:.5s cubic-bezier(.3,1.5,.5,1) backwards tumble;box-shadow:inset -3px -3px 4px #00000059}@keyframes tumble{0%{opacity:0;transform:translateY(-80px)rotate(-200deg)}}.unlock{color:var(--good);flex-direction:column;align-items:center;gap:2px;font-weight:700;animation:.9s unlock;display:flex}.bar{top:max(8px, env(safe-area-inset-top));left:max(8px, env(safe-area-inset-left));right:calc(max(8px, env(safe-area-inset-right)) + 104px);z-index:3;gap:6px;max-width:560px;height:44px;display:flex;position:fixed}.chip{white-space:nowrap;background:#0a08089e;border:2px solid #d8b25a59;border-radius:12px;flex:1 1 0;align-items:center;gap:6px;min-width:0;padding:0 8px;font-size:14px;transition:border-color .2s,box-shadow .2s;display:flex;overflow:hidden}.chip.turn{border-color:var(--brass);box-shadow:0 0 12px #ffd36a80}.chip .who{text-overflow:ellipsis;flex:0 auto;min-width:2.2em;font-weight:800;overflow:hidden}.chip .pips{flex:0 auto;min-width:0;overflow:hidden}@media (width<=430px){.chip{gap:4px;font-size:13px}.pips{gap:1px}.pips i{width:5px;height:5px}.chip .badge{display:none}}.chip .score{color:#ffe9b8;font-variant-numeric:tabular-nums;margin-left:auto;font-weight:800}.chip .badge{width:30px;height:30px}.chip .shots{color:var(--muted);margin-left:auto}.pips{gap:2px;display:flex}.pips i{border-radius:50%;width:8px;height:8px;display:block}.pips.open:after{content:"open";color:var(--muted);font-size:11px}.power{z-index:3;touch-action:none;cursor:ns-resize;position:fixed}.power .track{background:linear-gradient(#0a0808b3,#1e0e08bf);border:2px solid #d8b25a99;border-radius:16px;position:absolute;inset:0 13px;overflow:hidden}.power .fill{background:linear-gradient(#7fe0a8,#ffd36a 55%,#ff6b5e);height:0;position:absolute;top:0;left:0;right:0;box-shadow:0 0 12px #ffd36a99}.power .grip{background:linear-gradient(#f2d27a,#a87a26);border-radius:9px;height:18px;position:absolute;top:-2px;left:6px;right:6px;box-shadow:0 2px 6px #00000080}.power.off{opacity:.4}.ghost-finger{opacity:0;pointer-events:none;background:radial-gradient(circle,#ffffffe6 0 30%,#ffffff59 31% 60%,#0000 61%);border-radius:50%;width:34px;height:34px;margin-left:-17px;position:absolute;top:0;left:50%}.ghost-finger.on{animation:2.2s ease-in-out infinite ghost-pull}@keyframes ghost-pull{0%,10%{opacity:0;transform:translateY(0)}20%{opacity:1;transform:translateY(0)}65%{opacity:1;transform:translateY(var(--pull,120px))}80%,to{opacity:0;transform:translateY(var(--pull,120px))}}.spin{z-index:3;background:var(--img-spin-badge,none) center / contain no-repeat, radial-gradient(circle, #f4efe2 0 60%, #5a3420 62%);cursor:pointer;border:0;border-radius:50%;width:56px;height:56px;padding:0;position:fixed}.spin .dot,.spin-face .dot{pointer-events:none;background:#d8382c;border-radius:50%;width:10px;height:10px;margin:-5px 0 0 -5px;position:absolute;top:50%;left:50%;box-shadow:0 0 0 2px #fffc}.spin-face{width:200px;height:200px;box-shadow:0 0 0 6px var(--walnut), 0 0 0 8px var(--brass);touch-action:none;cursor:crosshair;background:radial-gradient(circle at 38% 34%,#fffdf6,#e8e0cc 55%,#b9ae94);border-radius:50%;margin:6px auto;position:relative}.spin-face:before,.spin-face:after{content:"";background:#0000001f;position:absolute}.spin-face:before{width:1px;top:10%;bottom:10%;left:50%}.spin-face:after{height:1px;top:50%;left:10%;right:10%}.spin-face .dot{width:26px;height:26px;margin:-13px 0 0 -13px}.spin-panel .row{grid-template-columns:1fr 1fr;gap:10px;display:grid}.nudge{z-index:3;width:48px;height:48px;color:var(--ink);cursor:pointer;touch-action:none;background:radial-gradient(circle at 40% 35%,#7a4626,#3a2216);border:2px solid #d8b25a99;border-radius:50%;place-items:center;padding:0;display:grid;position:fixed}.nudge svg{fill:none;stroke:currentColor;stroke-width:3px;stroke-linecap:round;stroke-linejoin:round;width:22px;height:22px}.trick-tools{z-index:3;gap:6px;display:flex;position:fixed}.trick-tools .btn{white-space:nowrap;flex:1 1 0;padding:0 2px}.overlay{z-index:6;background:#06080e99;place-items:center;display:grid;position:fixed;inset:0}.banner{z-index:4;opacity:0;border:2px solid var(--brass);font:800 19px var(--font);color:#ffe9b8;white-space:nowrap;pointer-events:none;background:#0a0808cc;border-radius:14px;padding:10px 22px;transition:transform .22s cubic-bezier(.2,1.3,.5,1),opacity .22s;position:fixed;top:30%;left:50%;transform:translate(-50%,-20px)}.banner.on{opacity:1;transform:translate(-50%)}.banner.foul{border-color:var(--foul);color:#ffd4cf}.hint{z-index:4;max-width:calc(100vw - 32px);font:700 16px/1.3 var(--font);color:#fff8e6;text-align:center;pointer-events:none;opacity:0;background:#080606eb;border:2px solid #d8b25abf;border-radius:12px;padding:8px 14px;transition:opacity .25s;position:fixed;left:50%;transform:translate(-50%);box-shadow:0 6px 18px #0000008c}.hint.on{opacity:1}.pops{z-index:4;pointer-events:none;position:fixed;inset:0}.pop{font:900 22px var(--font);color:#ffe9b8;text-shadow:0 2px #3a2216,0 0 12px #ffd36ab3;white-space:nowrap;animation:1.1s ease-out forwards pop-up;position:absolute;transform:translate(-50%,-50%)}.pop.small{font-size:17px}.pop.bad{color:#ffd4cf;text-shadow:0 2px #3a0d08,0 0 10px #ff6b5eb3}@keyframes pop-up{0%{opacity:0;transform:translate(-50%,-30%)scale(.6)}15%{opacity:1;transform:translate(-50%,-50%)scale(1.15)}30%{transform:translate(-50%,-50%)scale(1)}to{opacity:0;transform:translate(-50%,-140%)}}.toast{left:50%;bottom:max(18px, env(safe-area-inset-bottom));z-index:30;opacity:0;pointer-events:none;text-align:center;background:#0a0808e6;border:1px solid #d8b25a99;border-radius:12px;max-width:calc(100vw - 32px);padding:10px 18px;font-size:15px;transition:opacity .2s,transform .2s;position:fixed;transform:translate(-50%,20px)}.toast.on{opacity:1;transform:translate(-50%)}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}@media (width<=420px){.panel{padding:18px 8px 16px}.trick-grid{gap:6px}}.power.h .track{inset:12px 0}.power.h .fill{background:linear-gradient(90deg,#7fe0a8,#ffd36a 55%,#ff6b5e);width:0;height:auto;top:0;bottom:0}.power.h .grip{width:18px;height:auto;inset:4px auto 4px -2px}.power.h .ghost-finger{margin:-17px 0 0;top:50%;left:0}.power.h .ghost-finger.on{animation-name:ghost-pull-x}@keyframes ghost-pull-x{0%,10%{opacity:0;transform:translate(0)}20%{opacity:1;transform:translate(0)}65%{opacity:1;transform:translateX(var(--pull,120px))}80%,to{opacity:0;transform:translateX(var(--pull,120px))}}.bar.with-tools{right:calc(max(8px, env(safe-area-inset-right)) + 210px)}.unlock-line{white-space:nowrap}.medal.gold{background:radial-gradient(circle at 35% 30%,#fff3c4,#ffd36a 38%,#c8901e 78%,#8a5e10)}.medal.silver{background:radial-gradient(circle at 35% 30%,#fff,#d9e0e6 38%,#9aa5ae 78%,#66717a)}.medal.bronze{background:radial-gradient(circle at 35% 30%,#ffd9b8,#d08a55 38%,#9a5a2c 78%,#64361a)}.medal:after{content:"";border:2px solid #ffffff59;border-radius:50%;position:absolute;inset:8px;box-shadow:inset 0 0 0 2px #0000002e}.medal{text-shadow:0 1px #ffffff73;position:relative}.chip.them{flex-grow:1.5}
