/* One staged encounter language for Oak and the gacha. Transform/opacity drive the effects. */
.encounter-scene { --reveal-color:#4fb4ff; position:relative; isolation:isolate; overflow:hidden; width:100%; height:clamp(280px,45dvh,440px); min-height:280px; border-radius:24px; background:#0a292b; }
.encounter-world { position:absolute;inset:0;z-index:0;transform-origin:50% 62%;background:linear-gradient(#021a2940,#031d2080),url('../assets/encounters/forest-clearing.webp') center 58%/cover,#0a292b; }
.encounter-scene:not([data-phase=sealed]) .encounter-world { animation:encounter-approach var(--encounter-travel,8800ms) cubic-bezier(.22,.55,.3,1) both; }
.encounter-scene::after { content:'';position:absolute;inset:0;z-index:5;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 65px #00151988,inset 0 0 0 1px #a5ecd11c; }
.encounter-atmosphere { position:absolute; inset:0; pointer-events:none; z-index:0; overflow:hidden; border-radius:inherit; }
.encounter-aura { position:absolute; width:300px; height:300px; left:50%; top:50%; border-radius:50%; transform:translate(-50%,-50%) scale(.65); background:radial-gradient(circle,color-mix(in srgb,var(--reveal-color) 50%,transparent),transparent 68%); opacity:.4; }
.encounter-rays { position:absolute; width:600px; height:600px; left:50%; top:50%; transform:translate(-50%,-50%) rotate(-12deg); background:repeating-conic-gradient(from 8deg,transparent 0 21deg,color-mix(in srgb,var(--reveal-color) 15%,transparent) 22deg 27deg,transparent 28deg 45deg); mask-image:radial-gradient(circle,#000,transparent 65%); opacity:0; }
.encounter-floor { position:absolute; width:min(68%,310px); height:78px; bottom:15%; left:50%; transform:translateX(-50%); border:1px solid color-mix(in srgb,var(--reveal-color) 60%,transparent); border-radius:50%; background:radial-gradient(ellipse,color-mix(in srgb,var(--reveal-color) 22%,transparent),#06172710 65%); box-shadow:0 0 0 12px #d0eaff06,0 0 0 28px #d0eaff04; }
.encounter-column { position:absolute; width:140px; height:100%; left:50%; bottom:20%; transform:translateX(-50%) scaleX(.1); opacity:0; background:linear-gradient(0deg,color-mix(in srgb,var(--reveal-color) 65%,transparent),transparent 88%); mask-image:linear-gradient(90deg,transparent,#000 35% 65%,transparent); }
.encounter-wave { position:absolute; width:200px;height:200px;left:50%;top:50%;border:2px solid var(--reveal-color);border-radius:50%;opacity:0;transform:translate(-50%,-50%) scale(.2); }
.encounter-flare { position:absolute; width:260px;height:260px;left:50%;top:50%;border-radius:50%;background:radial-gradient(#fffcea 0 8%,color-mix(in srgb,var(--reveal-color) 75%,transparent) 22%,transparent 65%);opacity:0;transform:translate(-50%,-50%) scale(.3); }
.encounter-particles { position:absolute;inset:0; }
.encounter-particles i { position:absolute;left:50%;top:50%;width:5px;height:5px;background:var(--reveal-color);opacity:0;box-shadow:0 0 6px var(--reveal-color);border-radius:1px; }
.encounter-particles i:nth-child(3n) { width:9px;height:9px;clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%);background:#fff4d3; }
.encounter-pokemon,#scr-result #res-stage.encounter-pokemon { display:block;position:absolute;left:50%;top:50%;bottom:auto;width:280px;height:240px;max-width:80%;max-height:90%;object-fit:contain;image-rendering:pixelated;transform:translate(-50%,-50%) scale(.18);opacity:0;pointer-events:none;z-index:2;background:none;border:0;border-radius:0;box-shadow:none;margin:0; }
.encounter-grassbank { position:absolute;inset:0;z-index:3;pointer-events:none; }
.encounter-grass { position:absolute;bottom:-7%;width:74%;height:75%;transition:transform 1.6s cubic-bezier(.4,0,.2,1); }
.encounter-grass-left { left:-10%;transform-origin:12% 100%; }
.encounter-grass-right { right:-10%;transform:scaleX(-1);transform-origin:50% 100%; }
.encounter-blades { width:100%;height:100%;background:url('../assets/encounters/tall-grass.webp') center bottom/100% 100% no-repeat;image-rendering:pixelated;transform-origin:50% 100%;filter:drop-shadow(0 12px 6px #00151280);animation:encounter-breeze 3.4s ease-in-out infinite; }
.encounter-grass-right .encounter-blades { animation-delay:-1.8s; }
.encounter-ground-mist { position:absolute;width:100%;height:25%;bottom:0;background:radial-gradient(ellipse at 50% 100%,color-mix(in srgb,var(--reveal-color) 22%,transparent),transparent 65%);opacity:0;transition:opacity 1s; }
.encounter-scene:is([data-phase=sealed],[data-phase=approaching],[data-phase=charging]) .encounter-pokemon,#scr-result .encounter-scene:is([data-phase=sealed],[data-phase=approaching],[data-phase=charging]) #res-stage { opacity:.8;filter:brightness(0);transform:translate(-50%,-43%) scale(.8); }
.encounter-scene[data-phase=approaching] .encounter-pokemon,#scr-result .encounter-scene[data-phase=approaching] #res-stage { animation:encounter-near 2.2s ease-in-out both; }
.encounter-scene[data-phase=charging] .encounter-pokemon,#scr-result .encounter-scene[data-phase=charging] #res-stage { animation:encounter-shadow var(--encounter-charge,3s) ease-in-out both; }
.encounter-scene[data-phase=charging] .encounter-blades { animation:encounter-rustle 1.3s ease-in-out 3; }
.encounter-scene[data-phase=charging] .encounter-grass-right .encounter-blades { animation-delay:.12s; }
.encounter-scene[data-phase=charging] .encounter-aura { animation:encounter-gather var(--encounter-charge,3s) ease-in-out both; }
.encounter-scene:is([data-phase=charging],[data-phase=opening]) .encounter-particles i { animation:encounter-inflow 1.6s var(--delay) ease-in-out 2 both; }
.encounter-scene[data-phase=opening] .encounter-column { animation:encounter-beam 1.6s ease-in-out both; }
.encounter-scene:is([data-phase=opening],[data-phase=released],[data-phase=revealed]) .encounter-grass-left { transform:translateX(-62%) rotate(-8deg); }
.encounter-scene:is([data-phase=opening],[data-phase=released],[data-phase=revealed]) .encounter-grass-right { transform:translateX(62%) scaleX(-1) rotate(-8deg); }
.encounter-scene:is([data-phase=opening],[data-phase=released],[data-phase=revealed]) .encounter-ground-mist { opacity:1; }
.encounter-scene[data-phase=opening] .encounter-pokemon,#scr-result .encounter-scene[data-phase=opening] #res-stage { opacity:1;animation:encounter-illuminate 1.6s ease-in-out both; }
.encounter-scene:is([data-phase=released],[data-phase=revealed]) .encounter-flare { animation:encounter-flare 1.5s ease-out both; }
.encounter-scene:is([data-phase=released],[data-phase=revealed]) .encounter-wave { animation:encounter-wave 1.7s ease-out both; }
.encounter-scene:is([data-phase=released],[data-phase=revealed]) .encounter-wave-second { animation-delay:.13s; }
.encounter-scene:is([data-phase=released],[data-phase=revealed]) .encounter-particles i { animation:encounter-scatter 1.8s var(--delay) cubic-bezier(.16,1,.3,1) both; }
.encounter-scene:is([data-phase=released],[data-phase=revealed]) .encounter-rays { opacity:.9;transition:opacity .6s;animation:encounter-rays 18s linear infinite; }
.encounter-scene[data-phase=released] .encounter-pokemon,#scr-result .encounter-scene[data-phase=released] #res-stage { opacity:1;filter:brightness(0) invert(1) drop-shadow(0 0 10px var(--reveal-color));animation:encounter-materialize 1.5s cubic-bezier(.4,0,.2,1) both; }
.encounter-scene[data-phase=revealed] .encounter-pokemon,#scr-result .encounter-scene[data-phase=revealed] #res-stage { opacity:1;transform:translate(-50%,-50%) scale(1);filter:drop-shadow(0 8px 0 #0003);animation:encounter-color 1.1s ease-out both,encounter-greet 1.6s .65s ease-in-out both; }
.encounter-scene[data-phase=revealed] .encounter-aura { opacity:.85;transform:translate(-50%,-50%) scale(1.12);transition:opacity .6s,transform .6s; }
.encounter-scene[data-tier="5"] .encounter-rays { background:repeating-conic-gradient(transparent 0 14deg,#ffdd7138 15deg 18deg,transparent 19deg 30deg); }
.encounter-scene[data-tier="4"] .encounter-aura { width:340px;height:340px; }
.encounter-scene[data-tier="5"] .encounter-aura { width:390px;height:390px; }
.encounter-scene[data-shiny=true] .encounter-particles i:nth-child(3n+1) { background:#ffb2ed;box-shadow:0 0 8px #ffb2ed; }
.encounter-scene[data-shiny=true] .encounter-particles i:nth-child(3n+2) { background:#b3fff0;box-shadow:0 0 8px #b3fff0; }
.gacha-encounter { width:min(800px,100%);flex-shrink:0; margin:auto 0; }
.encounter-heading { display:flex;justify-content:space-between;align-items:center;gap:16px;margin:0 0 14px; }
.encounter-eyebrow { color:#9fbacb;font:700 10px/1.4 var(--ui-font);letter-spacing:.18em; }
.encounter-counter { color:#e1ecf7;font:600 15px/1.4 var(--ui-font);margin:6px 0 0; }
.encounter-fast { min-height:44px;flex-shrink:0;font-size:13px; }
.encounter-quality-wrap { position:absolute;top:20px;left:12px;right:12px;z-index:4;text-align:center;color:var(--reveal-color); }
.encounter-quality { display:block;font:700 24px/1.1 var(--ui-display);text-shadow:0 2px 0 #0006; }
.encounter-stars { display:block;font-size:12px;letter-spacing:5px;margin-top:8px; }
.encounter-caption { min-height:122px;text-align:center;padding:18px 8px 4px; }
.encounter-status { color:#b6cedf;font-size:13px;margin:0 0 9px; }
.encounter-name { color:#fff0bd;font:700 clamp(30px,7vw,46px)/1.1 var(--ui-display);margin:0 0 10px; }
.encounter-detail { display:flex;justify-content:center;gap:6px; }
.encounter-scene[data-phase=revealed]~.encounter-caption .encounter-name { animation:encounter-title .4s ease-out both; }
#pull-fx::before,#pull-fx::after { content:none; }
#pull-fx:has(.gacha-encounter) .ui-pull-scroll { width:100%; }
#pull-results:empty { display:none; }
.oak-reveal-stage.encounter-scene { min-height:240px;height:clamp(240px,36dvh,360px);border:1px solid #a2d0d018; }
.oak-reveal-stage .oak-reveal-professor { z-index:4;left:0;bottom:0;opacity:.9; }
.encounter-investigate { position:absolute;bottom:12px;left:50%;transform:translateX(-50%);z-index:6;min-height:44px;padding:8px 16px;border-radius:20px;border:1px solid #c0e7be88;background:#0a2b29d9;color:#e3f3d9;font:600 12px var(--ui-font);white-space:nowrap;cursor:pointer; }
.encounter-scene:not([data-phase=sealed]) .encounter-investigate { visibility:hidden; }
#scr-result[data-reveal=revealed] #oak-reveal-identity { animation:encounter-title .5s ease-out both; }
@keyframes encounter-approach { from { transform:scale(1); } 28% { transform:scale(1.055); } to { transform:scale(1.12); } }
@keyframes encounter-near { from { transform:translate(-50%,-39%) scale(.6);opacity:.4; } to { transform:translate(-50%,-43%) scale(.8);opacity:.8; } }
@keyframes encounter-gather { to { opacity:1;transform:translate(-50%,-50%) scale(1.05); } }
@keyframes encounter-inflow { from { opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--turn)) scale(.8); } 25% { opacity:.85; } to { opacity:0;transform:translate(0,0) rotate(var(--turn)) scale(.2); } }
@keyframes encounter-beam { to { opacity:.8;transform:translateX(-50%) scaleX(1.2); } }
@keyframes encounter-flare { 25% { opacity:.9; } to { opacity:0;transform:translate(-50%,-50%) scale(1.7); } }
@keyframes encounter-wave { 10% { opacity:.8; } to { opacity:0;transform:translate(-50%,-50%) scale(2); } }
@keyframes encounter-scatter { 0% { opacity:1;transform:translate(0,0) rotate(0) scale(.4); } 60% { opacity:1; } 100% { opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--turn)) scale(.2); } }
@keyframes encounter-materialize { from { transform:translate(-50%,-50%) scale(.9); } to { transform:translate(-50%,-50%) scale(1); } }
@keyframes encounter-color { from { filter:brightness(0) invert(1) drop-shadow(0 0 16px var(--reveal-color)); } to { filter:drop-shadow(0 8px 0 #0003); } }
@keyframes encounter-rays { from { transform:translate(-50%,-50%) rotate(0); } to { transform:translate(-50%,-50%) rotate(360deg); } }
@keyframes encounter-title { from { opacity:0;transform:translateY(10px); } to { opacity:1;transform:translateY(0); } }
@keyframes encounter-breeze { 0%,100% { transform:skewX(-1deg) rotate(-1deg); } 50% { transform:skewX(2deg) rotate(1.5deg); } }
@keyframes encounter-rustle { 0%,100% { transform:rotate(0); } 20% { transform:rotate(-5deg) skewX(-3deg); } 45% { transform:rotate(5deg) skewX(4deg); } 70% { transform:rotate(-3deg); } }
@keyframes encounter-shadow { 0%,100% { transform:translate(-50%,-43%) scale(.8); } 30% { transform:translate(-55%,-45%) scale(.82); } 64% { transform:translate(-46%,-43%) scale(.8); } }
@keyframes encounter-illuminate { from { transform:translate(-50%,-43%) scale(.8);filter:brightness(0); } 65% { filter:brightness(0) invert(.4) sepia(1) saturate(.5); } to { transform:translate(-50%,-50%) scale(.9);filter:brightness(0) invert(1) drop-shadow(0 0 8px var(--reveal-color)); } }
@keyframes encounter-greet { 0%,100% { transform:translate(-50%,-50%) scale(1); } 25% { transform:translate(-50%,-50%) scale(1.015,.96); } 48% { transform:translate(-50%,-55%) scale(.99,1.02) rotate(-3deg); } 70% { transform:translate(-50%,-50%) scale(1) rotate(2deg); } }
.encounter-scene[data-phase=sealed] .encounter-pokemon,#scr-result .encounter-scene[data-phase=sealed] #res-stage { transform:translate(-50%,-39%) scale(.6);opacity:.4; }
.encounter-scene[data-fast=true] * { animation-duration:180ms!important;animation-delay:0ms!important;transition-duration:180ms!important; }
@media(max-width:500px) { .encounter-scene { border-radius:18px; }.encounter-heading { gap:8px; }.encounter-counter { font-size:12px; }.encounter-fast { font-size:12px;padding:8px 10px; }.encounter-quality { font-size:22px; }.encounter-caption { min-height:118px; } }
@media(max-height:520px) and (orientation:landscape) {
 .gacha-encounter { display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:12px; }
 .encounter-heading { grid-column:1/-1;margin:0; }.gacha-encounter .encounter-scene { height:230px;min-height:230px; }.encounter-caption { align-self:center; }.encounter-quality-wrap { top:12px; }.encounter-quality { font-size:20px; }.encounter-stars { margin-top:4px; }
 .oak-reveal-stage.encounter-scene { width:46%;min-height:230px;height:250px; }.oak-reveal-copy { min-width:0; }
}
@media(prefers-reduced-motion:reduce) {
 .encounter-scene *,.encounter-name,#scr-result #oak-reveal-identity { animation:none!important;transition:none!important; }
 .encounter-scene[data-phase=revealed] .encounter-pokemon,#scr-result .encounter-scene[data-phase=revealed] #res-stage { opacity:1;transform:translate(-50%,-50%) scale(1);filter:none; }
}
/* PokéMática — enamel, brass, three physical reels and an illuminated encounter chamber. */
.machine-encounter { width:min(680px,100%); }
.machine-encounter .encounter-heading { margin-bottom:12px; }
.machine-encounter .encounter-caption { min-height:105px;padding:14px 4px 0; }
.machine-encounter .encounter-status { line-height:1.45;max-width:42ch;margin:0 auto 8px; }
.machine-encounter .encounter-name { font-size:clamp(30px,7vw,43px);margin-bottom:8px; }
#pull-fx:has(.machine-encounter) { background:radial-gradient(ellipse at 50% 42%,#184943 0,#091e2b 52%,#04121c);gap:8px; }
#pull-fx:has(.machine-encounter) .ui-pull-scroll { gap:0;justify-content:safe center;padding-block:8px; }
.gacha-machine { --reveal-color:#c7e6d0;--reel-step:clamp(38px,calc(var(--ui-height,100dvh) * .075),64px);position:relative;isolation:isolate;width:min(430px,calc(100% - 32px));margin:0 auto;color:#dcebd6; }
.gacha-machine::before { content:'';position:absolute;z-index:-1;inset:10% -16% -5%;border-radius:50%;background:radial-gradient(ellipse,color-mix(in srgb,var(--reveal-color) 16%,transparent),transparent 68%);transition:background 1s; }
.machine-cabinet { position:relative;padding:14px 18px 12px;border:3px solid #a9b5a0;border-radius:30px 30px 20px 20px;background:linear-gradient(95deg,#52736b 0,#264c49 5%,#203e42 48%,#2d5750 93%,#18363e);box-shadow:inset 0 0 0 3px #0c262e,inset 0 0 0 5px #729185,0 9px 0 #102b31,0 12px 0 #517367,0 22px 38px #0007; }
.machine-marquee { position:relative;display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:55px;padding:8px 12px;border:2px solid #f0ca86;border-radius:17px 17px 9px 9px;background:linear-gradient(#d17865,#9d4447);box-shadow:inset 0 2px 0 #f7b08c,0 3px 0 #0c2b33; }
.machine-marquee>div { display:flex;gap:4px;align-items:baseline;color:#fff0bc;font:700 clamp(24px,5.5vw,34px)/1 var(--ui-display);letter-spacing:.02em;text-shadow:0 3px 0 #633438; }
.machine-marquee b { font:inherit; }.machine-marquee i { width:9px;height:9px;flex:0 0 auto;background:#fae1a1;border-radius:50%;box-shadow:0 0 7px #ffe5a1; }
.machine-meter { display:flex;justify-content:center;gap:7px;padding:10px 0 8px; }
.machine-meter span { width:24px;height:5px;background:#10272e;border:1px solid #617e72;border-radius:3px;transition:background .6s,box-shadow .6s; }
.gacha-machine[data-tier="1"] .machine-meter span:nth-child(-n+1),.gacha-machine[data-tier="2"] .machine-meter span:nth-child(-n+2),.gacha-machine[data-tier="3"] .machine-meter span:nth-child(-n+3),.gacha-machine[data-tier="4"] .machine-meter span:nth-child(-n+4),.gacha-machine[data-tier="5"] .machine-meter span { background:var(--reveal-color);box-shadow:0 0 8px var(--reveal-color);border-color:var(--reveal-color); }
.machine-screen { position:relative;isolation:isolate;height:calc(var(--reel-step) * 3 + 8px);overflow:hidden;border:4px solid #153039;border-radius:11px;background:#0a2630;box-shadow:0 0 0 2px #b9b594,inset 0 0 25px #000c; }
.machine-reels { position:absolute;inset:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;padding:0 5px;background:#102b34;transition:opacity .5s,transform .65s; }
.machine-reel { position:relative;overflow:hidden;min-width:0;background:linear-gradient(90deg,#b7bfa7,#f6f0cd 28% 65%,#b2bca8);border-inline:1px solid #eddbad88; }
.machine-reel::after { content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(#102b34b0,transparent 38% 62%,#102b34bb);box-shadow:inset 0 0 12px #18303955; }
.machine-strip { will-change:transform;transform:translateY(0); }
.machine-symbol { display:grid;place-items:center;height:var(--reel-step);width:100%; }
.machine-symbol svg { display:block;width:calc(var(--reel-step) * .68);height:calc(var(--reel-step) * .68);filter:drop-shadow(0 2px 0 #18303944); }
.machine-target { color:var(--reveal-color)!important; }
.machine-reel[data-motion=spinning] .machine-strip { animation:machine-spin .52s linear infinite;filter:blur(.6px); }
.machine-reel:nth-child(2)[data-motion=spinning] .machine-strip { animation-delay:-.19s;animation-duration:.46s; }
.machine-reel:nth-child(3)[data-motion=spinning] .machine-strip { animation-delay:-.36s;animation-duration:.56s; }
.machine-reel[data-motion=locked] { box-shadow:inset 0 0 0 2px var(--reveal-color); }
.machine-reel[data-motion=locked] .machine-target svg { animation:machine-lock .4s ease-out both;filter:drop-shadow(0 0 5px var(--reveal-color)); }
.machine-payline { pointer-events:none;position:absolute;z-index:2;left:1px;right:1px;top:var(--reel-step);height:var(--reel-step);border-block:2px solid #efd69b99;box-shadow:0 0 10px #efd69b33;transition:opacity .3s; }
.machine-payline::before,.machine-payline::after { content:'';position:absolute;top:calc(50% - 6px);border-block:6px solid transparent; }.machine-payline::before { left:0;border-left:9px solid #ffe4a4; }.machine-payline::after { right:0;border-right:9px solid #ffe4a4; }
.machine-glass { position:absolute;z-index:5;pointer-events:none;inset:0;background:linear-gradient(117deg,transparent 15%,#f1ffff0b 16% 27%,transparent 28% 35%,#f1ffff0b 36% 37%,transparent 38%);box-shadow:inset 0 0 0 1px #c4e0d633; }
.machine-shutter { position:absolute;z-index:4;inset:0;background:repeating-linear-gradient(#466661 0 7px,#203e43 8px 10px);transform:translateY(-105%);border-bottom:4px solid #c9bc94; }
.machine-console { display:flex;align-items:center;justify-content:space-between;gap:8px;height:36px;margin:8px 0;border-bottom:1px solid #93afa333; }
.machine-readout { color:#b1d9b8;font:700 9px/1.3 var(--ui-font);letter-spacing:.06em; }
.machine-ticket-slot { position:relative;width:38px;height:20px;flex-shrink:0;perspective:200px; }
.machine-ticket-slot>i { position:absolute;left:0;right:0;bottom:4px;height:5px;border-radius:4px;background:#071d25;border:1px solid #91a797; }
.machine-ticket { position:absolute;left:9px;bottom:8px;width:22px;height:34px;display:grid;place-items:center;background:linear-gradient(100deg,#e5b75b,#ffe5a6);border:1px solid #fff1bd;border-radius:3px;box-shadow:0 3px 5px #0005;opacity:0; }
.machine-ticket span { color:#7b512c;font-size:16px; }
.machine-quality { text-align:center;min-height:41px;color:var(--reveal-color); }
.machine-quality .encounter-quality { font-size:23px;letter-spacing:.02em; }
.machine-quality .encounter-stars { font-size:10px;letter-spacing:4px;margin-top:4px;min-height:12px; }
.machine-screws { pointer-events:none;position:absolute;inset:0; }.machine-screws i { position:absolute;width:6px;height:6px;border-radius:50%;background:linear-gradient(45deg,#a8b69b 0 43%,#375451 45% 56%,#a8b69b 58%);box-shadow:0 1px 2px #0009; }
.machine-screws i:nth-child(1) { left:6px;top:20px; }.machine-screws i:nth-child(2) { right:6px;top:20px; }.machine-screws i:nth-child(3) { left:7px;bottom:13px; }.machine-screws i:nth-child(4) { right:7px;bottom:13px; }
.machine-lever { position:absolute;right:-19px;top:37%;width:25px;height:90px;z-index:-1; }
.machine-lever::before { content:'';position:absolute;bottom:8px;left:0;width:20px;height:30px;border-radius:0 8px 8px 0;background:linear-gradient(90deg,#162d34,#a7b39a,#46605b);border:2px solid #748777; }
.machine-lever i { position:absolute;left:9px;bottom:25px;width:9px;height:65px;background:linear-gradient(90deg,#789b98,#e4dcc0,#6d9090);border:1px solid #13313c;border-radius:6px;transform-origin:50% 100%; }
.machine-lever b { position:absolute;top:-1px;left:2px;width:24px;height:24px;border:2px solid #ffc09a;border-radius:50%;background:radial-gradient(circle at 32% 28%,#f9a177,#ab414b 65%);box-shadow:0 3px 0 #532b36; }
/* The reels retreat into a lab chamber; the capsule and Pokémon share the same visual anchor. */
.machine-chamber { position:absolute;inset:0;z-index:3;overflow:hidden;opacity:0;transform:scale(.88);background:radial-gradient(ellipse at 50% 70%,#2b635c,#102c38 65%,#071e2b);transition:opacity .45s,transform .7s; }
.machine-halo { position:absolute;inset:-20%;opacity:0;transform:rotate(-15deg);background:repeating-conic-gradient(from 0deg,transparent 0 25deg,color-mix(in srgb,var(--reveal-color) 23%,transparent) 26deg 32deg,transparent 33deg 45deg);mask-image:radial-gradient(circle,#000,transparent 66%); }
.machine-orbit { position:absolute;left:50%;top:50%;width:calc(var(--reel-step) * 2.7);aspect-ratio:1;border:1px dashed var(--reveal-color);border-radius:50%;transform:translate(-50%,-50%);opacity:.3; }
.machine-platform { position:absolute;left:50%;bottom:5%;width:55%;height:14%;transform:translateX(-50%);border:2px solid var(--reveal-color);border-radius:50%;box-shadow:0 0 0 4px #c9fff011,0 0 24px color-mix(in srgb,var(--reveal-color) 50%,transparent),inset 0 0 20px color-mix(in srgb,var(--reveal-color) 40%,transparent); }
.machine-pod { position:absolute;left:50%;top:50%;width:calc(var(--reel-step) * 1.6);aspect-ratio:1;transform:translate(-50%,-50%);filter:drop-shadow(0 0 14px color-mix(in srgb,var(--reveal-color) 40%,transparent)); }
.machine-pod-top,.machine-pod-bottom { position:absolute;inset:0;border:3px solid #d8e5cd;border-radius:50%;transition:transform 1s cubic-bezier(.2,.7,.2,1),opacity 1s; }
.machine-pod-top { clip-path:inset(0 0 50%);background:linear-gradient(120deg,#fff8bb,var(--reveal-color) 55%,#16494a); }
.machine-pod-bottom { clip-path:inset(50% 0 0);background:linear-gradient(120deg,#e8f0d6,#a8c6c0); }
.machine-pod-button { position:absolute;left:37%;top:37%;width:26%;height:26%;background:var(--reveal-color);border:4px solid #173d43;border-radius:50%;box-shadow:0 0 0 2px #f2f5d8;transition:opacity .4s; }
.machine-pokemon { position:absolute;left:50%;top:45%;width:calc(var(--reel-step) * 4);height:calc(var(--reel-step) * 3.4);max-width:92%;max-height:100%;object-fit:contain;image-rendering:pixelated;transform:translate(-50%,-50%) scale(.3);opacity:0;filter:brightness(0) invert(1);z-index:2;pointer-events:none; }
.machine-sparks { position:absolute;inset:0;z-index:3;pointer-events:none; }.machine-sparks i { position:absolute;left:50%;top:50%;width:5px;height:5px;border-radius:1px;background:var(--reveal-color);box-shadow:0 0 7px var(--reveal-color);opacity:0; }
.machine-sparks i:nth-child(3n) { width:9px;height:9px;clip-path:polygon(50% 0,63% 37%,100% 50%,63% 63%,50% 100%,37% 63%,0 50%,37% 37%);background:#fff6d1; }
.gacha-machine[data-phase=ticket] .machine-ticket { animation:machine-insert .75s cubic-bezier(.3,.2,.6,1) both; }
.gacha-machine[data-phase=ticket] .machine-lever { animation:machine-lever .75s ease-in-out; }
.gacha-machine:is([data-phase=spinning],[data-phase=scanning]) .machine-marquee i { animation:machine-bulb 1.2s ease-in-out infinite alternate; }.gacha-machine .machine-marquee i:last-child { animation-delay:-.6s; }
.gacha-machine[data-phase=aligned] .machine-payline { border-color:var(--reveal-color);box-shadow:0 0 16px var(--reveal-color); }
.gacha-machine[data-phase=charging] .machine-shutter { animation:machine-shutter 1.05s ease-in-out both; }
.gacha-machine:is([data-phase=charging],[data-phase=opening],[data-phase=revealed]) .machine-reels { opacity:0;transform:scale(.8); }
.gacha-machine:is([data-phase=charging],[data-phase=opening],[data-phase=revealed]) .machine-payline { opacity:0; }
.gacha-machine:is([data-phase=charging],[data-phase=opening],[data-phase=revealed]) .machine-chamber { opacity:1;transform:scale(1); }
.gacha-machine[data-phase=charging] .machine-pod { animation:machine-pod-charge 1s ease-in-out both; }
.gacha-machine:is([data-phase=opening],[data-phase=revealed]) .machine-pod-top { transform:translateY(-65%) rotate(-18deg);opacity:0; }
.gacha-machine:is([data-phase=opening],[data-phase=revealed]) .machine-pod-bottom { transform:translateY(65%) rotate(18deg);opacity:0; }
.gacha-machine:is([data-phase=opening],[data-phase=revealed]) .machine-pod-button { opacity:0; }
.gacha-machine[data-phase=opening] .machine-pokemon { animation:machine-materialize 1.1s cubic-bezier(.2,.7,.2,1) both; }
.gacha-machine:is([data-phase=opening],[data-phase=revealed]) .machine-halo { opacity:1;animation:machine-halo 20s linear infinite; }
.gacha-machine:is([data-phase=opening],[data-phase=revealed]) .machine-sparks i { animation:machine-spark 1.4s var(--d) ease-out both; }
.gacha-machine[data-phase=revealed] .machine-pokemon { opacity:1;transform:translate(-50%,-50%) scale(1);filter:drop-shadow(0 5px 0 #0004);animation:machine-hello 1.2s .25s ease-in-out both; }
.machine-encounter:has([data-phase=revealed]) .encounter-name { animation:encounter-title .5s ease-out both; }
.gacha-machine[data-tier="5"] .machine-cabinet { border-color:#f1d990;box-shadow:inset 0 0 0 3px #263330,inset 0 0 0 5px #b7a26b,0 9px 0 #303b2f,0 12px 0 #a88a57,0 0 50px #f1c65630; }
.gacha-machine[data-shiny=true] .machine-orbit { border-style:solid;border-color:#c6fdf5;box-shadow:0 0 0 5px #cf9aee33,0 0 0 10px #91e2ff22;animation:machine-orbit 2s ease-in-out infinite alternate; }
.gacha-machine[data-shiny=true] .machine-sparks i:nth-child(3n+1) { background:#ffb9ed;box-shadow:0 0 7px #ffb9ed; }.gacha-machine[data-shiny=true] .machine-sparks i:nth-child(3n+2) { background:#abfff0;box-shadow:0 0 7px #abfff0; }
.gacha-machine[data-fast=true] * { animation-duration:120ms!important;animation-delay:0ms!important;transition-duration:120ms!important; }
.gacha-machine[data-fast=true] :is(.machine-marquee i,.machine-halo,.machine-orbit) { animation:none!important; }
@keyframes machine-spin { from { transform:translateY(0); } to { transform:translateY(calc(var(--reel-step) * -12)); } }
@keyframes machine-lock { 0% { transform:translateY(-6px); } 55% { transform:translateY(3px) scale(1.06); } 100% { transform:none; } }
@keyframes machine-insert { 0% { opacity:0;transform:translateY(-32px) rotate(-12deg); } 25% { opacity:1;transform:translateY(-18px) rotate(5deg); } 55% { opacity:1;transform:translateY(0) scaleY(1); } 100% { opacity:0;transform:translateY(12px) scaleY(.1); } }
@keyframes machine-lever { 0%,100% { transform:rotateX(0); } 45% { transform:translateY(28px) rotateX(42deg); } }
@keyframes machine-bulb { from { opacity:.45; } to { opacity:1;box-shadow:0 0 12px #ffe5a1; } }
@keyframes machine-shutter { 0% { transform:translateY(-105%); } 38%,55% { transform:translateY(0); } 100% { transform:translateY(105%); } }
@keyframes machine-pod-charge { from { transform:translate(-50%,-50%) scale(.6);opacity:0; } 35% { opacity:1; } 70% { transform:translate(-50%,-50%) scale(1.08) rotate(-6deg); } to { transform:translate(-50%,-50%) scale(1);opacity:1; } }
@keyframes machine-materialize { from { opacity:0;transform:translate(-50%,-40%) scale(.35); } 45% { opacity:1;filter:brightness(0) invert(1) drop-shadow(0 0 15px var(--reveal-color)); } to { opacity:1;transform:translate(-50%,-50%) scale(1);filter:drop-shadow(0 5px 0 #0004); } }
@keyframes machine-hello { 0%,100% { transform:translate(-50%,-50%); } 30% { transform:translate(-50%,-54%) rotate(-4deg); } 65% { transform:translate(-50%,-50%) rotate(3deg); } }
@keyframes machine-halo { to { transform:rotate(345deg); } }
@keyframes machine-spark { 0% { opacity:0;transform:translate(0,0) scale(.2); } 15% { opacity:1; } 100% { opacity:0;transform:translate(var(--x),var(--y)) rotate(90deg) scale(.3); } }
@keyframes machine-orbit { to { transform:translate(-50%,-50%) scale(1.1);opacity:.8; } }
@media(max-height:680px) {
 .machine-encounter .encounter-heading { margin-bottom:8px; }.machine-encounter .encounter-caption { min-height:90px;padding-top:10px; }.machine-encounter .encounter-status { font-size:12px;margin-bottom:6px; }.machine-encounter .encounter-name { font-size:30px; }
 .machine-marquee { min-height:44px;padding-block:6px; }.machine-marquee>div { font-size:27px; }.machine-cabinet { padding:10px 14px 8px; }.machine-meter { padding:8px 0 6px; }.machine-console { height:30px;margin:5px 0; }.machine-quality { min-height:36px; }.machine-quality .encounter-quality { font-size:20px; }
}
@media(max-height:520px) and (min-width:560px) {
 .machine-encounter { display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:6px 18px;align-items:center;max-width:760px; }.machine-encounter .encounter-heading { grid-column:1/-1;margin:0; }.machine-encounter .encounter-caption { padding:0;min-height:0; }.gacha-machine { --reel-step:clamp(28px,calc(var(--ui-height,100dvh) * .08),38px);width:min(330px,calc(100% - 24px)); }.machine-marquee { min-height:34px;padding:5px 10px; }.machine-marquee>div { font-size:23px; }.machine-meter { padding:6px 0; }.machine-console { height:24px;margin:4px 0; }.machine-readout { font-size:8px; }.machine-quality { min-height:30px; }.machine-quality .encounter-quality { font-size:18px; }.machine-quality .encounter-stars { font-size:8px;margin-top:2px; }.machine-cabinet { border-radius:24px 24px 14px 14px;padding:8px 13px; }
}
@media(prefers-reduced-motion:reduce) { .gacha-machine *,.machine-encounter .encounter-name { animation:none!important;transition:none!important; } }