.prep-demo [hidden]{display:none!important}
.demo-shortcut{display:flex;justify-content:center;align-items:center;gap:12px;padding:10px;flex-wrap:wrap}.demo-shortcut button{min-height:40px;font-size:13px}.demo-shortcut>span{font-size:11px;color:#526457}
.phone.playing-demo #screen{padding-top:5px}.playing-demo .phone-bottom{display:none}.play-screen{width:100%;min-height:0;display:flex;flex-direction:column;position:relative;gap:7px}.play-cup{display:flex;align-items:center;gap:9px;flex:none}.play-cup>img{width:45px;height:55px;object-fit:contain}.play-cup>div{flex:1}.play-cup b{font-size:13px}.play-cup>div>div{display:flex;justify-content:space-between}.play-cup span{display:flex;align-items:center;gap:3px}.play-cup span img{width:23px;height:23px}.play-cup small{font-size:9px}
.public-board{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;flex:none}.public-player{padding:5px 2px;border-radius:8px;background:#f1edde;border-top:3px solid var(--player);text-align:center;display:flex;flex-direction:column;gap:2px}.public-player b{font-size:11px}.public-player span{font-size:10px}.public-player small{font-size:8px;white-space:nowrap}.public-actions{font-size:9px;min-height:25px;display:flex;flex-wrap:wrap;gap:3px 8px;align-items:center;color:#657061}.public-actions>span{white-space:nowrap}.public-actions b{font-size:13px}
.play-heading{display:flex;justify-content:space-between;align-items:center;min-height:27px;flex:none}.play-heading>b{font-size:14px}.play-heading small{font-size:10px}.play-heading button,.private-action button{font-size:11px;background:transparent;box-shadow:none;border:0;text-decoration:underline;padding:2px 5px;min-height:26px}
.pilot-carousel{display:flex;gap:10px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;min-height:195px;flex:1;align-items:center;padding:2px 0 5px;touch-action:pan-x}.pilot-carousel>button{flex:0 0 48%;padding:0;border:0;background:none;box-shadow:none;min-height:0;scroll-snap-align:start;display:flex;flex-direction:column;align-items:center;gap:3px}.pilot-carousel .pilot-card{width:100%;aspect-ratio:1632/2220;height:auto}.pilot-carousel small{font-size:9px}.chosen-pilot{min-height:195px;flex:1;display:flex;justify-content:center;align-items:center}.chosen-pilot>.pilot-card{height:100%;max-height:280px;aspect-ratio:1632/2220;width:auto;max-width:65%}
.actions-label{display:flex;align-items:center;justify-content:space-between;flex:none}.actions-label b{font-size:12px}.actions-label small{font-size:9px}.action-bar{display:flex;gap:10px;justify-content:space-around;flex:none}.action-bar>button{border:2px solid transparent;border-radius:13px;background:transparent;box-shadow:none;padding:2px;min-height:54px;width:58px;touch-action:none}.action-bar>button[aria-pressed=true]{background:#ebd294;border-color:#956b20}.action-bar>button:disabled{opacity:.5}.action-token{display:block;position:relative;width:48px;height:48px;flex:none}.action-token>img{width:100%;height:100%;object-fit:contain;display:block}.action-token>b{position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-size:23px;font-weight:900;text-shadow:0 1px 2px #0006;letter-spacing:-1px}.private-action{font-size:11px;text-align:center;min-height:20px;display:flex;align-items:center;justify-content:center;flex:none}.preview-note{text-align:center;font-size:9px;color:#61705e}.ready-button{min-height:46px;flex:none;width:100%;font-size:17px}.ready-note{font-size:9px;text-align:center;flex:none;color:#61705e}
.target-overlay{position:absolute;inset:0;z-index:20;background:#fffaf0;display:flex;flex-direction:column;gap:10px;border-radius:12px;box-shadow:0 0 0 12px #fffaf0}.target-header{display:flex;align-items:center;gap:10px;flex:none}.target-header>div{display:flex;flex-direction:column;gap:4px}.target-header b{font-size:17px}.target-header small{font-size:11px}.target-grid{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:10px;min-height:0;flex:1}.target-grid>button{padding:5px;display:flex;align-items:center;flex-direction:column;border:2px solid #aab8a2;background:#edeedd;min-height:0;box-shadow:none;gap:3px;border-radius:12px}.target-grid>button:hover,.target-grid>button:focus-visible{border-color:#bd6038;background:#f3e2bd;outline:2px solid #bd6038}.target-identity{width:100%;display:flex;justify-content:space-between;align-items:center;flex:none}.target-identity b{font-size:13px}.target-identity small{font-size:9px}.target-grid .pilot-card{min-height:0;flex:1;width:auto;aspect-ratio:1632/2220;max-width:100%}.target-status{font-size:9px;flex:none}.hidden-pilot{min-height:0;flex:1;width:100%;border-radius:9px;background:repeating-linear-gradient(45deg,#244d42,#244d42 8px,#2d594b 8px,#2d594b 16px);color:#f2d891;display:flex;align-items:center;justify-content:center;flex-direction:column;border:4px solid #ba9c58}.hidden-pilot>span{font-size:45px;font-weight:900}.hidden-pilot small{font-size:9px;letter-spacing:1px}.target-overlay>#cancel-target{min-height:45px;flex:none;width:100%}
#resolution-shell{width:100%;max-width:1100px}.resolution-heading{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px;font-size:13px}.resolution-heading button{min-height:46px}.resolution-heading button:disabled{opacity:.5}#resolution-host iframe{width:100%;height:780px;max-height:95dvh;border:0;border-radius:18px;background:#fffaf0}
.phone[style*="568px"] .play-screen{gap:4px}.phone[style*="568px"] .play-cup>img{height:43px;width:35px}.phone[style*="568px"] .play-cup span img{width:21px;height:21px}.phone[style*="568px"] .public-player{padding:3px 1px}.phone[style*="568px"] .public-actions{min-height:21px}.phone[style*="568px"] .chosen-pilot{max-height:202px}.phone[style*="568px"] .action-bar{gap:6px}.phone[style*="568px"] .target-grid{gap:7px}.phone[style*="568px"] .target-overlay{gap:7px}.phone[style*="568px"] .target-header .action-token{width:38px;height:38px}
@media(prefers-reduced-motion:reduce){.play-screen *{scroll-behavior:auto}}
.phone[style*="568px"].playing-demo .phone-top{height:28px}
.phone[style*="568px"] .play-screen{gap:3px}
.phone[style*="568px"] .preview-note,.phone[style*="568px"] .ready-note{display:none}
.target-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.target-grid>button{min-width:0}
.match-win{padding:50px;text-align:center;background:#fffaf0;border-radius:20px;font-size:42px}.match-win p{font-size:18px}
#resolution-host iframe{height:var(--resolution-h,640px);max-height:none}
.play-screen .preview-note,.play-screen .ready-note{display:none}

/* Review iteration: preserve card ratios, make browsing explicit and keep actions secret. */
.game-logo{display:block;width:66px;height:38px;object-fit:contain;mix-blend-mode:multiply}
.phone-top>.game-logo{width:65px;height:34px}.atelier .game-logo{width:78px;height:43px}
.phone.playing-demo .phone-top{height:34px}
.phone .play-screen{gap:3px}
.phone .play-cup{gap:7px;min-height:64px}
.phone .play-cup>img{width:35px;height:54px}
.phone .cup-summary{min-width:0;display:flex;flex-direction:column;gap:3px}
.phone .play-cup .cup-title{display:flex;align-items:center;justify-content:space-between;gap:4px}
.phone .cup-title>b{font-size:12px;line-height:16px}
.phone .play-cup .movement-criterion{display:flex;gap:3px;align-items:center;font-size:11px;color:#68755f}
.phone .play-cup .movement-criterion img{width:18px;height:18px}
.phone .play-cup .race-criteria{display:grid;grid-template-columns:1fr 1fr;gap:5px}
.phone .race-criterion{display:flex;align-items:center;gap:5px;background:var(--soft);border:1px solid color-mix(in srgb,var(--tone) 30%,transparent);border-left:4px solid var(--tone);border-radius:8px;padding:3px 4px;min-width:0;color:var(--tone)}
.phone .race-criterion>img{width:30px;height:30px;flex:none}
.phone .race-criterion small{display:block;font-size:7px;font-weight:800;color:var(--tone);white-space:nowrap}
.phone .race-criterion b{font-size:10px;display:block;white-space:nowrap;color:var(--tone)}
.phone .public-player{padding:3px 1px;gap:1px}
.phone .play-heading{min-height:24px}.phone .play-heading button{min-height:24px}
.play-heading #change-pilot{min-height:48px;min-width:96px;padding:10px 16px;font-size:14px;font-weight:700;text-decoration:none;border:1px solid #bfcbb4;border-radius:10px;background:#fffaf0;flex-shrink:0}
.phone .pilot-picker{flex:1;min-height:222px;display:flex;flex-direction:column;gap:2px}
.phone .pilot-carousel{container-type:size;min-height:0;flex:1;align-items:center;padding:2px 0;gap:10px;touch-action:pan-y;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;cursor:grab;user-select:none;-webkit-user-select:none}
.phone .pilot-carousel::-webkit-scrollbar,.phone .initial-deal::-webkit-scrollbar{display:none}
.phone .pilot-carousel>button{flex:0 0 auto;width:min(calc((100cqw - 10px)/2),calc((100cqh - 6px)*1632/2220));height:auto;max-width:none;aspect-ratio:1632/2220;display:block;touch-action:pan-y;transform:none;scroll-snap-align:start}
.phone .pilot-carousel>button>.pilot-card{display:block;position:relative;width:100%;height:auto;aspect-ratio:1632/2220;max-width:none}
.phone .pilot-carousel img,.phone .initial-deal img{pointer-events:none;-webkit-user-drag:none;user-select:none}
.phone .is-swiping{cursor:grabbing}
.carousel-nav{display:flex;justify-content:space-between;align-items:center;gap:5px;flex:none;height:30px;color:#516a59}
.carousel-nav button{min-height:30px;height:30px;width:38px;padding:0;font-size:19px;background:#e9eddf;box-shadow:none;border:1px solid #c4cdbb;border-radius:8px}
.carousel-nav>span{font-size:10px;font-weight:750}
.phone .chosen-pilot{min-height:195px;max-height:none;display:flex;align-items:stretch;gap:6px;flex:1}
.chosen-art{container-type:size;display:grid;place-items:center;min-width:0;min-height:0;flex:1}
.phone .chosen-art>.pilot-card{width:min(100cqw,calc(100cqh * 1632/2220),206px);height:auto;aspect-ratio:1632/2220;max-width:none;max-height:none}
.incoming-actions{display:flex;flex-direction:column;justify-content:center;gap:5px;flex:none;width:35px;align-self:stretch}
.secret-action{display:flex;flex-direction:column;align-items:center;gap:1px;border-radius:5px;padding:2px;border:2px solid var(--player);background:color-mix(in srgb,var(--player) 14%,#fffaf0);flex:none}
.secret-action>img{width:23px;height:auto;aspect-ratio:1632/2220;object-fit:contain;border-radius:2px}
.secret-action>small{font-size:8px;font-weight:850;color:var(--player);white-space:nowrap}
.phone .private-action{min-height:20px;font-size:10px}.phone .private-action button{min-height:20px;padding:0 4px}
.phone .action-bar{gap:6px}.phone .action-bar>button{min-height:54px;height:54px}
.phone .ready-button{min-height:46px;height:46px;padding:8px}
.target-grid>button{border-color:color-mix(in srgb,var(--player) 65%,#fffaf0)}
.target-body{display:flex;width:100%;min-height:0;flex:1;gap:4px}
.target-pilot{container-type:size;display:grid;place-items:center;min-width:0;min-height:0;flex:1}
.phone .target-pilot>.pilot-card,.phone .target-pilot>.secret-pilot-back{display:block;flex:none;width:min(100cqw,calc(100cqh * 1632/2220));height:auto;aspect-ratio:1632/2220;max-width:none;max-height:none;object-fit:contain;border-radius:6px}
.target-body .incoming-actions{width:31px;gap:3px}.target-body .secret-action>img{width:19px}.target-body .secret-action>small{font-size:7px}
.phone .new-cards.initial-deal{container-type:size;overflow-x:auto;overflow-y:hidden;flex:1;min-height:0;align-items:center;padding:12px 3px;touch-action:pan-y;scrollbar-width:none;user-select:none;-webkit-user-select:none;overscroll-behavior-x:contain}
.phone .initial-deal .new-card{flex:0 0 auto;width:min(65cqw,calc((100cqh - 26px)*1632/2220));height:auto;max-height:none;aspect-ratio:1632/2220;touch-action:pan-y;scroll-snap-align:start;animation:none;transform:none}
.phone .initial-deal .new-card>.pilot-card{display:block;position:relative;width:100%;height:auto;aspect-ratio:1632/2220}
.phone .initial-deal .new-card>img{display:block;position:relative;width:100%;height:auto;aspect-ratio:1632/2220;object-fit:contain}
.draw-screen>.carousel-nav{margin:3px 0 7px}
.phone.playing-demo .phone-top{height:38px}.phone-top>.game-logo{width:70px;height:38px}
.phone .pilot-picker{min-height:232px}
.phone .pilot-carousel{padding:0}
.phone .pilot-carousel>button{width:min(calc((100cqw - 10px)/2),calc(100cqh * 1632/2220))}
.phone .new-cards.initial-deal{padding:12px 0;gap:12px}
.phone .initial-deal .new-card{width:min(calc((100cqw - 12px)/2),calc(100cqh * 1632/2220))}
.demo-shortcut>a{font-size:11px;text-underline-offset:3px}
.phone .depth-carousel{position:relative;display:block;overflow:hidden;perspective:none;scroll-snap-type:none;touch-action:pan-y;padding:0;cursor:grab}
.phone .depth-carousel>button{position:absolute;left:50%;top:50%;display:block;flex:none;height:auto;min-height:0;max-height:none;max-width:none;margin:0;padding:0;aspect-ratio:1632/2220;transform-origin:center;transition:none;animation:none;scroll-snap-align:none;box-shadow:none;background:transparent;isolation:isolate;border:0;backface-visibility:visible;border-radius:0;touch-action:pan-y;filter:drop-shadow(0 3px 3px #173d3533)}
.phone .depth-carousel>button:hover{background:transparent}
.phone .depth-carousel>button>.pilot-card,.phone .depth-carousel>button>.action-card-art{background:#173d35}
.phone .depth-carousel.is-swiping>button,.phone .depth-carousel.reduced-depth-motion>button{transition:none}
.phone .depth-carousel>button>.pilot-card,.phone .depth-carousel>button>img{display:block;width:100%;height:auto;aspect-ratio:1632/2220;object-fit:contain}
.phone .depth-carousel>button[data-carousel-active=true]{box-shadow:none;filter:drop-shadow(0 5px 5px #173d3540)}
.carousel-nav{height:39px}.carousel-nav>span{text-align:center}.carousel-dots{display:flex;justify-content:center;gap:4px;margin-top:4px}.carousel-dots i{width:4px;height:4px;border-radius:50%;background:#bcc6b4}.carousel-dots i.current{width:13px;border-radius:4px;background:#b87830}
.phone .pilot-picker{position:relative}
.phone .pilot-picker{gap:0}
.phone .pilot-picker>.carousel-nav{position:static;width:100%;height:27px;min-height:27px;margin:0;flex:none}
.phone .pilot-picker>.carousel-nav button{width:36px;height:27px;min-height:27px}
.phone .play-heading:has(+.pilot-picker)>small{visibility:visible}
.phone .play-screen:has(.pilot-picker)>.private-action{display:none}
.phone .action-bar>button{display:grid;place-items:center;width:calc((100% - 18px)/4);height:66px;min-height:66px;padding:2px}
.phone .action-bar .action-token{width:58px;height:58px}.phone .action-bar .action-token>b{font-size:29px}
.chosen-art{position:relative;isolation:isolate}
.pose-shadow{position:absolute;height:15px;pointer-events:none;border-radius:50%;background:#173d3555;filter:blur(6px);z-index:-1;animation:pose-shadow .95s both}
.pose-puff{position:absolute;z-index:3;pointer-events:none;width:1px;height:1px;animation:puff-lifetime 1.15s both}
.pose-puff i{position:absolute;width:24px;height:16px;border-radius:50%;background:#f3dfb8cc;filter:blur(2px);animation:table-puff .55s .42s both}
@keyframes table-puff{0%{opacity:0;transform:translate(-50%,-50%) scale(.15)}20%{opacity:.9}100%{opacity:0;transform:translate(calc(-50% + var(--dx)),var(--dy)) scale(1.8)}}
@keyframes puff-lifetime{to{visibility:hidden}}
@keyframes pose-shadow{0%,35%{opacity:.25;transform:translate(-50%,-50%) scale(.7)}46%{opacity:.9;transform:translate(-50%,-50%) scale(1.15)}100%{opacity:0;transform:translate(-50%,-50%) scale(1)}}
.phone .new-card>.draw-flip{display:block;position:relative;top:auto;left:auto;width:100%;height:100%;padding:0;background:none;border-radius:0;transform:none;transform-style:preserve-3d;animation:draw-turn .8s var(--reveal-delay) both ease-in-out}
.reinforcement-card{perspective:900px}
.phone .new-card.reinforcement-card{animation:none}
.draw-face,.draw-back{position:absolute;inset:0;display:block;width:100%;height:100%;backface-visibility:hidden}
.draw-face>.pilot-card,.draw-face>img{display:block;width:100%;height:100%;aspect-ratio:1632/2220;object-fit:contain}
.draw-back{object-fit:contain;transform:rotateY(180deg);border-radius:6px}
@keyframes draw-turn{0%{transform:rotateY(180deg) scale(.92)}22%{transform:rotateY(180deg) scale(1.025)}32%{transform:rotateY(180deg) scale(1)}80%{transform:rotateY(-5deg) scale(1.015)}100%{transform:rotateY(0) scale(1)}}
.play-screen.is-selecting{pointer-events:none}
.pilot-carousel.is-departing{cursor:default}
.phone .target-grid>button{background:var(--player);border-color:var(--player);box-shadow:0 3px 0 #173d3530}
.phone .target-identity b{font-size:18px;color:#102a22}.phone .target-identity small{font-size:12px;color:#102a22;font-weight:750}
.phone .target-status{font-size:11px;color:#102a22;font-weight:750}
.phone .target-grid>button:hover,.phone .target-grid>button:focus-visible{background:var(--player);outline:3px solid #173d35}
.target-overlay:not([hidden]){animation:target-open .24s ease-out both}
@keyframes target-open{from{opacity:0;transform:translateY(20px) scale(.96)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.phone .new-card>.draw-flip{animation:none;transform:none}.target-overlay:not([hidden]),.pose-puff,.pose-shadow{animation:none}.pose-puff,.pose-shadow{display:none}}
.own-action-flight{position:fixed;z-index:9999;pointer-events:none;width:58px;height:58px}
.own-action-flight .action-token{width:58px;height:58px}
.modifier-value{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:2%;color:#faf7e8;filter:none}
.modifier-value>.modifier-sign{position:static;width:21%;height:24%;flex:none;overflow:visible;transform:skewX(-10deg)}
.modifier-sign path{stroke:currentColor;stroke-width:3.3;stroke-linecap:square;fill:none}
.modifier-value>.modifier-digit{position:static;inset:auto;width:auto;height:50%;max-width:none;object-fit:contain;flex:none}
.secret-action-symbol{display:inline-grid;place-items:center;width:28px;height:28px;aspect-ratio:1;border-radius:7px;border:2px solid #fff7dc;background:conic-gradient(from -30deg,#f2c85c,#6bb5b7,#9d80c2,#e87558,#f2c85c);box-shadow:0 1px 3px #173d3540;color:#fffaf0;text-shadow:0 1px 2px #183e36;font:bold 25px/1 system-ui}
.own-action-shield{position:absolute;z-index:20;width:68px;height:80px;pointer-events:none;filter:drop-shadow(0 0 9px #ffe476)}
.own-action-shield svg{width:100%;height:100%;overflow:visible}
.own-action-shield path:first-child{fill:#fff2b5d9;stroke:#c38b22;stroke-width:5;stroke-linejoin:round}
.phone .native-carousel.native-carousel{position:relative;display:flex;container-type:normal;flex:1 1 140px;width:100%;height:clamp(140px,34dvh,300px);min-height:140px;min-width:0;overflow-x:auto;overflow-y:hidden;gap:0;align-items:center;justify-content:flex-start;padding:0;scroll-padding-inline:0;scroll-snap-type:none;touch-action:pan-x pan-y;overscroll-behavior-x:contain;scrollbar-width:none;perspective:none}
.phone .native-carousel-stage{position:sticky;left:0;flex:0 0 auto;z-index:1;pointer-events:none;overflow:visible}
.phone .native-carousel-rail{display:flex;flex:0 0 auto;height:1px;pointer-events:none}
.phone .native-carousel-rail>i{display:block;flex:0 0 auto;height:1px}
.phone .native-carousel.is-departing{touch-action:none}
.phone .native-carousel.native-carousel .native-carousel-stage>button{position:absolute;display:block;flex:none;min-height:0;max-height:none;max-width:none;margin:0;padding:0;border:0;border-radius:0;background:transparent;transform:none;translate:none;rotate:none;animation:none;transition:none;filter:none;isolation:auto;touch-action:pan-x pan-y;box-shadow:none;line-height:0;pointer-events:none;overflow:visible}
.phone .native-carousel.native-carousel .native-carousel-stage>button>.pilot-card,.phone .native-carousel.native-carousel .native-carousel-stage>button>img{position:relative;inset:auto;display:block;width:100%;height:100%;aspect-ratio:auto;max-width:none;max-height:none;transform:none;transform-origin:50% 50%;backface-visibility:visible;object-fit:contain;mask:none;-webkit-mask:none;isolation:auto;pointer-events:auto;clip-path:inset(2.84% 3.8% 2.84% 3.92% round 2.45% / 1.8%)}

.modifier-sign path.modifier-sign-outline{stroke:var(--modifier-outline,#8b391d);stroke-width:7.5}

.pilot-card.stat-popout{position:fixed;z-index:100;pointer-events:none;mask:none;max-width:none;filter:drop-shadow(0 6px 8px #173d3560) drop-shadow(0 0 9px #fff2b5);overflow:visible}
.pilot-card.stat-popout>.pilot-gauge{position:absolute;left:0;top:0;width:100%;height:100%;z-index:1}
.stat-popout::after{content:'';position:absolute;inset:-25%;border:3px solid #fff2b5;border-radius:50%;box-shadow:0 0 14px #ffce62;animation:stat-impact-ring .65s ease-out both}
@keyframes stat-impact-ring{from{transform:scale(.45);opacity:1}to{transform:scale(1.65);opacity:0}}

.trophy-slots{display:inline-flex;align-items:center;justify-content:center;gap:5px;flex:none;vertical-align:middle}
.trophy-slot{display:grid;place-items:center;width:25px;height:29px;border:1px dashed #a6b4a2;border-radius:6px;background:#edf0e4;color:#b0b9a8}
.trophy-slot svg{display:block;width:21px;height:25px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.trophy-slot.is-won{border:1px solid #d2a54b;background:linear-gradient(145deg,#fff4bd,#f2cf73);color:#a0641c;box-shadow:0 2px 0 #8e65232b;transform:translateY(-2px) rotate(-5deg)}
.trophy-slot.is-won svg{fill:#eeb44a;stroke:#935e21;filter:drop-shadow(0 1px 0 #fff8)}
.trophy-slot.trophy-new{animation:trophy-awarded .8s 1.8s both}
@keyframes trophy-awarded{from{opacity:0;transform:translateY(-22px) scale(1.6) rotate(-15deg)}70%{opacity:1;transform:translateY(1px) scale(.94)}to{opacity:1;transform:translateY(-2px) rotate(-5deg)}}
@media(prefers-reduced-motion:reduce){.trophy-slot.trophy-new{animation:none}}
