/* One tabletop, short physical transitions, no looping decoration. */
:root[data-theme] .flow-dialog:is(.phase-open,.phase-busy,.phase-capsule,.phase-reveal) {align-self:flex-start;margin-block:auto}
:root[data-theme] .flow-dialog .tactile-table{background:#eef0f2;min-height:430px;border-radius:16px;isolation:isolate}
:root[data-theme] .flow-dialog .table-card:not(.reveal-table){padding-top:24px;padding-bottom:24px}
:root[data-theme] .flow-dialog .table-card:not(.reveal-table)>.tactile-control{margin:30px auto 25px}
.phase-busy .table-card .foil-pack,.phase-busy .table-chougu .pin-bag,.phase-busy .table-lucky .cloth-bag{animation:none}
.phase-busy .table-card .foil-pack{transform:rotate(-7deg) translateY(5px)}
.phase-busy .flow-skip{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.phase-busy .flow-skip:focus-visible{position:static;width:auto;height:auto;clip-path:none}
.flow-dialog .table-card .card-deck,.flow-dialog .table-card:not(.has-card-history) .card-deck{height:414px}
.flow-dialog .card-deck .reward-item.is-revealed:not(.is-inspecting){top:350px;left:calc(50% - 82px + var(--revealed-index)*58px);width:42px;height:59px}
.flow-dialog .card-deck .reward-item.is-revealed:not(.is-inspecting) .flow-reveal{transform:scale(.205)}
.collection-slots{position:absolute;left:50%;top:350px;bottom:auto;transform:translateX(-50%);display:flex;gap:16px;pointer-events:none;z-index:0}
.collection-slots i{width:42px;height:59px;border:1px dashed #c6ccd3;border-radius:4px;color:#929aa5;font-size:10px;font-style:normal;display:grid;place-items:center}
.collection-slots i.filled{border-style:solid;background:#e4e8ec}
/* A two-face hinge avoids flattened 3D layers in WebKit and follows the pointer exactly. */
.flow-dialog .table-card .flow-reveal:not(.revealed) .reward-turner{transform:translateX(var(--pull-x,0px)) rotate(calc(var(--p)*-3deg*var(--flip-sign,1)));transform-style:flat;transition:none}
.flow-dialog .table-card .flow-reveal:not(.revealed) .reward-front{transform:scaleX(max(.001,calc((var(--p) - .5)*2)));opacity:clamp(0,calc((var(--p) - .5)*100),1);backface-visibility:visible;-webkit-backface-visibility:visible;transition:none;background:white;border-radius:8px}
.flow-dialog .table-card .flow-reveal:not(.revealed) .reward-back{transform:scaleX(max(.001,calc(1 - var(--p)*2)));opacity:clamp(0,calc((.5 - var(--p))*100),1);backface-visibility:visible;-webkit-backface-visibility:visible;transition:none}
.flow-dialog .table-card .flow-reveal.just-revealed .reward-front{animation:none}
.flow-dialog .table-card .flow-reveal.revealed[data-flow=next-card]:is(.is-dragging,.is-finishing) .reward-turner{transform:translateX(calc(var(--p)*28px*var(--flip-sign,1))) rotate(calc(var(--p)*4deg*var(--flip-sign,1)))!important;opacity:1}
.playing-card-back{overflow:hidden;background:#1d2733!important;border:5px solid #fff!important;box-shadow:0 5px 13px #18233325,inset 0 0 0 1px #ffffff35!important}
.playing-card-back:before{content:'';position:absolute;width:220%;height:50%;background:#ff602e;transform:rotate(-30deg);top:25%;left:-60%;z-index:0}
.playing-card-back>*{position:relative;z-index:1}.playing-card-back small{font-size:24px!important;font-weight:950!important;letter-spacing:-.06em!important;align-self:flex-start;margin-left:9px}
.playing-card-back .pack-emblem{color:#fff!important;width:100px!important;stroke-width:3!important;opacity:.95}
.playing-card-back b{font-size:14px!important;font-weight:700!important;letter-spacing:.1em!important}.playing-card-back>span{opacity:.65}
/* Detached visual copies keep origin and destination connected across a model render. */
:root[data-theme] .motion-bridge{z-index:111!important;pointer-events:none!important;min-width:0!important;max-width:none!important;max-height:none!important;margin:0!important;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;overflow:visible!important;animation:none!important}
:root[data-theme] .motion-bridge .tactile-table{background:transparent!important;margin:0!important;min-height:100%!important;height:100%!important;overflow:visible!important;border:0!important}
.motion-bridge .table-caption,.motion-bridge .gesture-feedback,.motion-bridge .deck-counter,.motion-bridge .reward-caption,.motion-bridge .reveal-sound{visibility:hidden!important}
.motion-bridge *, .motion-collected-card *{animation:none!important;transition:none!important}
.motion-bridge .tactile-control{pointer-events:none!important}
.motion-collected-card{position:fixed;z-index:112;transform-origin:top left;pointer-events:none}
.motion-collected-card>.reward-front{position:absolute;inset:0;display:block;transform:none!important;opacity:1!important;visibility:visible!important;backface-visibility:visible!important}
.motion-collected-card .real-trading-card{display:block;width:100%;height:100%}
.motion-collected-card img{display:block;width:100%;height:100%;object-fit:contain;border-radius:8px}
[data-motion=prize] .quick-prize,[data-motion=prize] .summary-object{animation:none}
.unpack-load{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);pointer-events:none}
:root[data-theme=dark] .flow-dialog .tactile-table{background:#292f39}
:root[data-theme=dark] .collection-slots i{border-color:#515b69;color:#abb4c1;background:transparent}
@media(max-width:760px){
 :root[data-theme] .flow-dialog .tactile-table{min-height:398px;padding:18px 12px 14px}
 .flow-dialog .table-card .card-deck,.flow-dialog .table-card:not(.has-card-history) .card-deck{height:381px}
 .flow-dialog .card-deck .reward-item.is-revealed:not(.is-inspecting){top:326px;left:calc(50% - 78px + var(--revealed-index)*55px);width:38px;height:53px}
 .flow-dialog .card-deck .reward-item.is-revealed:not(.is-inspecting) .flow-reveal{transform:scale(.2)}
 .collection-slots{gap:17px;top:326px;bottom:auto}.collection-slots i{width:38px;height:53px}
 :root[data-theme] .flow-dialog h2{font-size:23px;margin:16px 0}
 .flow-dialog .table-capsule .capsule-shell{margin:67px 0 55px}
}
@media(max-width:360px){
 .flow-dialog .table-card .card-deck,.flow-dialog .table-card:not(.has-card-history) .card-deck{height:366px}
 .flow-dialog .table-card .card-deck .reward-item.is-revealed:not(.is-inspecting){top:311px!important;left:calc(50% - 75px + var(--revealed-index)*54px)!important;width:36px!important}
 .flow-dialog .table-card .card-deck .reward-item.is-revealed:not(.is-inspecting) .flow-reveal{transform:scale(.2)}
 .collection-slots i{width:36px;height:50px}.collection-slots{gap:18px;top:311px}
}
@media(prefers-reduced-motion:reduce){.motion-bridge,.motion-collected-card{display:none!important}.flow-dialog *{animation:none!important;transition:none!important}}

.card-deck .reward-item:not(.is-revealed) .reward-caption{visibility:hidden}
/* Keep the playfield anchored while its controls and rewards change. */
:root[data-theme] .flow-backdrop{align-items:flex-start;padding-top:clamp(16px,6vh,54px)}
:root[data-theme] .flow-backdrop .flow-dialog{margin:0 auto!important}
.flow-dialog .table-gacha .capsule-machine{transform:none}
.flow-dialog .table-card .flow-reveal{perspective:none}
@media(max-width:760px){:root[data-theme] .flow-backdrop{padding-top:8px}}
