.case-stage{--case-tier:var(--tier,var(--tier-base));background:var(--bg);isolation:isolate;position:relative}.case-vignette{pointer-events:none;background:radial-gradient(70% 50% at 50% 42%,#f2f4f70f,#0000 70%),radial-gradient(120% 90%,#0000 55%,#000000bf 100%);position:absolute;inset:0}.case-ambient{pointer-events:none;background:radial-gradient(ellipse 75% 55% at 50% 40%, color-mix(in oklab, var(--case-tier) 42%, transparent), transparent 72%);opacity:0;transition:opacity .5s;position:absolute;inset:0}.case-ambient.is-on{opacity:1;animation:3.6s ease-in-out .5s infinite case-breathe}@keyframes case-breathe{0%,to{opacity:1}50%{opacity:.62}}.case-beat{pointer-events:none;background:radial-gradient(ellipse 38% 26% at 50% 52%, color-mix(in oklab, var(--gold) 34%, transparent), transparent 70%), color-mix(in oklab, var(--bg) 80%, black);position:absolute;inset:0}.case-scene{aspect-ratio:1;margin-top:calc(min(80vw,460px)/4.54545);margin-bottom:calc(min(80vw,460px)/-5);transition:width .5s cubic-bezier(.3,.7,.2,1);position:relative}.case-seam-under{filter:blur(18px);pointer-events:none;background:radial-gradient(#ffffffb3,#f2f4f747 40%,#0000 70%);border-radius:9999px;height:28%;position:absolute;top:44%;left:-6%;right:-6%}.case-seam-over{filter:blur(7px);mix-blend-mode:screen;pointer-events:none;background:radial-gradient(#ffffffd9,#f2f4f74d 50%,#0000 74%);border-radius:9999px;height:14%;position:absolute;top:51%;left:6%;right:6%}.case-interior{background:radial-gradient(ellipse at 50% 55%, color-mix(in oklab, var(--case-tier) 30%, white 70%), color-mix(in oklab, var(--case-tier) 40%, transparent) 45%, transparent 72%);filter:blur(10px);mix-blend-mode:screen;pointer-events:none;border-radius:9999px;height:24%;position:absolute;top:38%;left:12%;right:12%}.case-interior-spill{background:radial-gradient(ellipse 50% 60% at 50% 70%, color-mix(in oklab, var(--case-tier) 28%, transparent), transparent 70%);filter:blur(18px);pointer-events:none;height:70%;position:absolute;top:0;left:-10%;right:-10%}.case-flash{filter:blur(10px);pointer-events:none;background:radial-gradient(#fffffff2,#f2f4f773 40%,#0000 70%);border-radius:50%;position:absolute;inset:4% -8%}.case-rise-clip{clip-path:inset(-140% -10% 42%);pointer-events:none;position:absolute;inset:0}.case-product{justify-content:center;align-items:flex-end;height:60%;display:flex;position:absolute;left:50%;transform:translate(-50%)}.case-product-body{filter:drop-shadow(0 18px 22px #0000008c)drop-shadow(0 2px 4px #00000059)}.case-photo{object-fit:contain;object-position:bottom;border-radius:6px;width:100%;max-height:100%;display:block}.case-caption{font-family:var(--font-mono);letter-spacing:.22em;text-transform:uppercase;color:var(--muted);font-variant-numeric:tabular-nums;font-size:10px}.case-caption b{color:var(--text);font-weight:600}.case-dot{background:var(--success);width:6px;height:6px;box-shadow:0 0 8px var(--success);border-radius:9999px;display:inline-block}.case-hold{width:84px;height:84px;color:var(--text);background:radial-gradient(circle at 50% 35%, var(--surface-2), var(--bg) 70%);border:1px solid var(--border-strong);touch-action:none;-webkit-user-select:none;user-select:none;border-radius:9999px;outline:none;place-items:center;transition:transform .15s,border-color .15s;display:grid;position:relative;box-shadow:0 10px 30px -12px #000000e6,inset 0 1px #ffffff14}.case-hold:focus-visible{border-color:var(--accent-2)}.case-hold.is-holding{transform:scale(.96)}.case-hold-label{letter-spacing:.12em;text-transform:uppercase;text-align:center;font-size:10px;font-weight:700;line-height:1.25}.case-hold-ring{pointer-events:none;width:calc(100% + 12px);height:calc(100% + 12px);position:absolute;inset:-6px;transform:rotate(-90deg)}.case-hold-ring .track{fill:none;stroke:#ffffff1a;stroke-width:2px}.case-hold-ring .fill{fill:none;stroke:var(--accent-2);stroke-width:2.5px;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1px;filter:drop-shadow(0 0 4px color-mix(in oklab, var(--accent-2) 70%, transparent));transition:stroke-dashoffset .15s ease-out}.case-hold.is-holding .case-hold-ring .fill{stroke-dashoffset:0;transition:stroke-dashoffset var(--hold-ms,.6s) linear}.case-hold.is-armed .case-hold-ring .fill{stroke-dashoffset:0;transition:none}.case-tier-word{font-family:var(--font-display);text-transform:uppercase;letter-spacing:.02em;font-variation-settings:"wdth" 80;color:var(--case-tier);text-shadow:0 0 24px color-mix(in oklab, var(--case-tier) 60%, transparent);font-size:34px;font-weight:800;line-height:.92}.case-mote{background:color-mix(in oklab, var(--gold) 55%, white);width:4px;height:4px;box-shadow:0 0 10px var(--gold);opacity:0;pointer-events:none;border-radius:9999px;animation:5.5s ease-in-out infinite case-mote;position:absolute}@keyframes case-mote{0%{opacity:0;transform:translate(0,0)scale(.6)}20%{opacity:.85}60%{opacity:.6}to{transform:translate3d(var(--dx,0px), -160px, 0) scale(.2);opacity:0}}.case-result{background:color-mix(in oklab, var(--surface) 88%, transparent);border:1px solid var(--border);border-radius:var(--radius-card);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.case-result-name{font-family:var(--font-display);letter-spacing:-.02em;font-variation-settings:"wdth" 90;font-weight:800;line-height:1}.case-fade{background:var(--bg);pointer-events:none;z-index:40;position:absolute;inset:0}@media (prefers-reduced-motion:reduce){.case-ambient.is-on,.case-mote{animation:none}.case-scene{transition:none}}.pick-ring{aspect-ratio:1/.78;cursor:grab}.pick-ring:active{cursor:grabbing}.pick-ring:focus-visible{outline:1px solid var(--border-strong);outline-offset:4px;border-radius:24px}.pick-slot{will-change:left, top, transform, opacity;width:62%;position:absolute}.pick-slot.is-front:after{content:"";background:linear-gradient(90deg, transparent, color-mix(in oklab, var(--case-accent,var(--text)) 70%, transparent), transparent);filter:blur(1px);opacity:.8;border-radius:9999px;height:2px;position:absolute;bottom:20%;left:18%;right:18%}.pick-floor{background:radial-gradient(ellipse at 50% 50%, color-mix(in oklab, var(--case-accent,var(--text)) 12%, transparent), transparent 70%);border:1px solid color-mix(in oklab, var(--text) 6%, transparent);pointer-events:none;border-radius:50%;height:50%;position:absolute;top:38%;left:6%;right:6%}.case-seam-under.is-tier{background:radial-gradient(ellipse at 50% 50%, color-mix(in oklab, var(--case-tier) 70%, white), color-mix(in oklab, var(--case-tier) 45%, transparent) 40%, transparent 70%);filter:blur(22px)}.case-seam-over.is-tier{background:radial-gradient(ellipse at 50% 50%, color-mix(in oklab, var(--case-tier) 40%, white), color-mix(in oklab, var(--case-tier) 55%, transparent) 50%, transparent 74%)}.case-flash.is-grand{background:radial-gradient(ellipse at 50% 50%, color-mix(in oklab, var(--case-tier) 25%, white), color-mix(in oklab, var(--case-tier) 50%, transparent) 45%, transparent 72%);filter:blur(14px);border-radius:50%;inset:-10% -18%}.case-rays{aspect-ratio:1;pointer-events:none;background:repeating-conic-gradient(from 0deg, color-mix(in oklab, var(--case-tier) 34%, transparent) 0deg 5deg, transparent 5deg 18deg);mix-blend-mode:screen;width:150%;animation:28s linear infinite case-rays-spin;position:absolute;top:-52%;left:50%;transform:translate(-50%);-webkit-mask-image:radial-gradient(circle,#000 0%,#0000008c 22%,#0000 58%);mask-image:radial-gradient(circle,#000 0%,#0000008c 22%,#0000 58%)}.tier-big .case-rays{opacity:.7;animation-duration:40s}@keyframes case-rays-spin{to{transform:translate(-50%)rotate(360deg)}}.tier-base .case-tier-word{color:var(--muted);text-shadow:none;font-size:24px}.case-tier-word.is-grand{font-size:44px}.tier-grail .case-tier-word.is-grand{background:linear-gradient(100deg,#b8862e 0%,#f7d98b 35%,#fff4d2 50%,#f0b64a 65%,#b8862e 100%) 0 0/220% 100%;color:#0000;text-shadow:none;filter:drop-shadow(0 0 18px color-mix(in oklab, var(--gold) 55%, transparent));-webkit-background-clip:text;background-clip:text;font-size:52px;animation:3.2s ease-in-out infinite case-gold-sheen}@keyframes case-gold-sheen{0%,to{background-position:100% 0}50%{background-position:0 0}}.tier-base .case-ambient.is-on{opacity:.45;animation:none}@media (prefers-reduced-motion:reduce){.case-rays,.tier-grail .case-tier-word.is-grand{animation:none}}@media (min-width:768px){.pick-ring{aspect-ratio:1/.56}.pick-slot{width:44%}}.case-stage,.case-art{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.case-stage img,.case-art img{pointer-events:none;-webkit-user-drag:none}.case-mode-stack{aspect-ratio:2;width:min(86%,360px);position:relative}.case-mode-case{filter:drop-shadow(0 18px 24px #0009);z-index:3;width:62%;position:absolute;top:50%;left:50%;transform:translate(-50%,-46%)}.case-mode-case:first-child{filter:brightness(.62)drop-shadow(0 12px 18px #0009);z-index:1;transform:translate(-12%,-60%)scale(.8)}.case-mode-case:nth-child(2){filter:brightness(.62)drop-shadow(0 12px 18px #0009);z-index:1;transform:translate(-88%,-60%)scale(.8)}.case-mode-option{text-align:left;border:1px solid var(--border);background:color-mix(in oklab, var(--surface) 88%, transparent);border-radius:14px;flex-direction:column;gap:2px;width:100%;padding:14px 16px;transition:border-color .15s,background .15s,transform .1s;display:flex}.case-mode-option:hover{border-color:var(--border-strong)}.case-mode-option:active{transform:scale(.985)}.case-mode-option.is-last{border-color:color-mix(in oklab, var(--case-accent,var(--accent)) 55%, transparent);background:color-mix(in oklab, var(--case-accent,var(--accent)) 8%, var(--surface))}.case-mode-title{font-size:15px;font-weight:700}.case-mode-sub{color:var(--muted);font-size:12.5px}
