.gp{--u: clamp(13px, calc((100vw - 32px - 72px) / 15.6), 24px);--jar-w: calc(var(--u) * 2.1);--neck-h: calc(var(--u) * .6);--pad: 3px;--body-h: calc(var(--u) * 4 + var(--pad) * 2);--row-h: calc(var(--neck-h) + var(--body-h));--row-gap: calc(var(--u) * .9);--col-gap: calc(var(--u) * .45);--big-w: calc(var(--u) * 3.1);--big-body-h: calc(var(--row-h) * 4 + var(--row-gap) * 3 - var(--neck-h));--big-u: calc((var(--big-body-h) - var(--pad) * 2) / 16);max-width:520px;margin:0 auto;padding-bottom:32px;user-select:none;-webkit-tap-highlight-color:transparent}.gp-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.gp-title{text-align:center}.gp-level{font-weight:600;font-size:1.125rem;line-height:1.3}.gp-sub{font-size:.8125rem;color:var(--muted-foreground)}.gp-btn{min-height:40px;padding:0 16px;border:1px solid var(--border);border-radius:var(--radius);background:var(--background);color:var(--foreground);font-size:.875rem;font-weight:500;cursor:pointer}.gp-btn:hover:not(:disabled){background:var(--secondary)}.gp-btn:disabled{opacity:.45;cursor:default}.gp-arrow{width:40px;padding:0;font-size:1.5rem;line-height:1}.gp-primary{border-color:#f47a1f;background:#f47a1f;color:#fff}.gp-primary:hover:not(:disabled){background:#e06a12}.gp-ghost{border-color:#ffffff40;background:transparent;color:#e7ecff}.gp-ghost:hover:not(:disabled){background:#ffffff14}.gp-controls{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:8px}.gp-status{min-height:1.5em;margin-top:12px;text-align:center;font-size:.875rem;color:var(--muted-foreground);font-variant-numeric:tabular-nums}.gp-help{margin-top:16px;font-size:.8125rem;line-height:1.5;color:var(--muted-foreground);text-align:center}.gp-board{position:relative;display:flex;justify-content:center;align-items:flex-start;gap:calc(var(--col-gap) * 2);padding:calc(var(--u) * 1.4) 8px calc(var(--u) * .9);border-radius:16px;background:radial-gradient(120% 70% at 50% 0%,#4a5a92,#3a4777 55%,#313c68);box-shadow:inset 0 1px #ffffff14;overflow:hidden}.gp-block{display:grid;grid-template-columns:repeat(3,var(--jar-w));grid-auto-rows:var(--row-h);column-gap:var(--col-gap);row-gap:var(--row-gap)}.gp-jar{position:relative;display:flex;flex-direction:column;align-items:center;width:var(--jar-w);padding:0;border:0;background:none;cursor:pointer;transition:transform .16s cubic-bezier(.3,.7,.4,1.2)}.gp-jar:focus-visible{outline:none}.gp-jar:focus-visible .gp-body{box-shadow:0 0 0 2px #fff}.gp-neck{width:58%;height:var(--neck-h);border:1.5px solid rgba(210,225,255,.45);border-bottom:0;border-radius:5px 5px 0 0;background:linear-gradient(90deg,#ffffff1a,#ffffff38 35%,#ffffff0f)}.gp-body{position:relative;width:100%;height:var(--body-h);padding:var(--pad);border:1.5px solid rgba(210,225,255,.5);border-radius:calc(var(--u) * .7) calc(var(--u) * .7) calc(var(--u) * .55) calc(var(--u) * .55);background:linear-gradient(90deg,#a0b9f01f,#a0b9f038 45%,#a0b9f014);box-shadow:inset 0 -4px 10px #0a143c40,0 3px 8px #0a143c40;overflow:hidden}.gp-fill{position:absolute;inset:auto var(--pad) var(--pad);display:flex;flex-direction:column-reverse;border-radius:0 0 calc(var(--u) * .45) calc(var(--u) * .45);overflow:hidden}.gp-unit{height:var(--u);flex:none;background:linear-gradient(90deg,#0000002e,#ffffff29 35%,#fff0 60%,#00000024),var(--c)}.gp-unit.is-top{position:relative}.gp-unit.is-top:before{content:"";position:absolute;inset:0 0 auto;height:22%;background:color-mix(in srgb,var(--c),#fff 30%);border-radius:50%/100%}.gp-unit.is-fresh{animation:gp-fill .26s ease-out both;transform-origin:bottom}@keyframes gp-fill{0%{transform:scaleY(0)}to{transform:scaleY(1)}}.gp-shine{position:absolute;top:8%;bottom:10%;left:14%;width:14%;border-radius:999px;background:linear-gradient(#ffffff8c,#ffffff1f);pointer-events:none}.gp-jar.is-lifted{transform:translateY(calc(var(--u) * -.7))}.gp-jar.is-lifted .gp-body,.gp-jar.is-lifted .gp-neck{border-color:#fff}.gp-jar.is-shaking{animation:gp-shake .3s ease-in-out}@keyframes gp-shake{20%,60%{transform:translate(-4px)}40%,80%{transform:translate(4px)}}.gp-jar.is-hinted .gp-body{animation:gp-pulse .9s ease-in-out infinite}@keyframes gp-pulse{50%{box-shadow:0 0 0 3px #ffd84d,0 0 16px 4px #ffd84d8c}}.gp-cork{position:absolute;top:calc(var(--u) * -.35);left:50%;z-index:1;width:66%;height:calc(var(--u) * .85);border-radius:4px 4px 3px 3px;background:linear-gradient(90deg,#0000002e,#ffffff2e 40%,#0000001f),#b98552;box-shadow:inset 0 -2px #0003,0 2px 3px #0000004d;transform:translate(-50%);animation:gp-cork .38s cubic-bezier(.3,.7,.4,1.3) both}@keyframes gp-cork{0%{transform:translate(-50%,calc(var(--u) * -1.6));opacity:0}}.gp-jar.is-sealed .gp-body{border-color:color-mix(in srgb,var(--c),#fff 55%);box-shadow:inset 0 -4px 10px #0a143c40,0 0 12px color-mix(in srgb,var(--c),transparent 45%)}.gp-jar.is-sealed{cursor:default}.gp-pop{position:absolute;top:calc(var(--u) * -1.2);left:50%;z-index:2;font-size:calc(var(--u) * .8);font-weight:800;color:#ffd84d;text-shadow:0 1px 3px rgba(0,0,0,.5);white-space:nowrap;pointer-events:none;animation:gp-pop 1.1s ease-out both}@keyframes gp-pop{0%{opacity:0;transform:translate(-50%,6px) scale(.6)}20%{opacity:1;transform:translate(-50%) scale(1.15)}to{opacity:0;transform:translate(-50%,calc(var(--u) * -1.6)) scale(1)}}.gp-big{width:var(--big-w)}.gp-big .gp-body{height:var(--big-body-h);border-radius:calc(var(--u) * 1) calc(var(--u) * 1) calc(var(--u) * .8) calc(var(--u) * .8)}.gp-big .gp-neck{width:80%}.gp-big .gp-unit{height:var(--big-u)}.gp-big .gp-fill{border-radius:0 0 calc(var(--u) * .65) calc(var(--u) * .65)}.gp-big.is-ready .gp-body{border-color:#ffb36b;box-shadow:0 0 0 2px #f47a1f80,0 0 18px #f47a1f73}.gp-count{position:absolute;inset:auto 0 calc(var(--u) * .5);text-align:center;font-size:calc(var(--u) * .62);font-weight:700;color:#ffffffd9;text-shadow:0 1px 2px rgba(0,0,0,.35);font-variant-numeric:tabular-nums;pointer-events:none}.gp-board.is-won .gp-big .gp-body{box-shadow:0 0 0 3px #f47a1f99,0 0 30px 6px #f47a1f8c}.gp-overlay{position:absolute;inset:0;display:grid;place-items:center;background:#181e3c8c;backdrop-filter:blur(2px);animation:gp-appear .3s .35s ease-out both}@keyframes gp-appear{0%{opacity:0}}.gp-card{display:grid;gap:10px;min-width:220px;padding:20px;border-radius:14px;background:#242c52;box-shadow:0 10px 30px #00000059;text-align:center;color:#e7ecff}.gp-card-title{font-size:1.5rem;font-weight:700;color:#ffb36b}.gp-card-score{font-size:1.25rem;font-weight:700;color:#ffd84d;font-variant-numeric:tabular-nums}.gp-card-body{font-size:.875rem;color:#c3cbee}@media (prefers-reduced-motion: reduce){.gp-jar,.gp-unit.is-fresh,.gp-jar.is-shaking,.gp-jar.is-hinted .gp-body,.gp-overlay,.gp-cork{animation:none;transition:none}.gp-pop{display:none}}