/* App shell: the race owns the canvas; optional tools float above it. */
body[data-playing=yes] .game{max-width:none;width:100%;margin:0;padding:8px 68px 12px 12px;min-height:calc(100dvh - 66px)}
body[data-playing=yes] header{padding:8px 18px;min-height:60px}
.game>.game-layout{display:block;width:100%;max-width:none}
.game .main-board{display:flex;flex-direction:column;gap:9px;width:100%;max-width:none}
.game-top{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:28px;margin-bottom:6px}
.presentation-picker{display:flex;gap:4px;padding:3px;border-radius:12px;background:#173e3522;border:1px solid #7b9d7b66;flex-wrap:wrap}
.presentation-picker button{border:0;border-radius:8px;padding:6px 11px;background:transparent;color:inherit;font-size:12px;min-height:32px}
.presentation-picker button[aria-pressed=true]{background:#ffe49a;color:#3b351f;box-shadow:0 2px 7px #0002;font-weight:800}
.game .turn-hud{min-height:65px;margin:0;border-radius:18px}
.game .turn-copy strong{font-size:clamp(20px,2vw,28px)}
.game .turn-hud .turn-label{font-size:13px}
.avatar-charm{position:absolute!important;right:-4px;bottom:-4px;font-size:16px;line-height:1;z-index:3;filter:drop-shadow(0 2px 1px #0005)}
.crew-member,.crew-avatar,.victory-standings>div{position:relative}
.crew-member .avatar-charm{left:25px;top:32px;right:auto;bottom:auto}
.victory-standings .avatar-charm{position:static!important}
.game .track-panel{padding:12px 14px 9px;width:100%;max-width:none;isolation:isolate}
.game .track-panel .section-head h2{font-size:clamp(18px,2vw,25px)}
.game .track-panel .lane{height:clamp(42px,calc((100dvh - 600px)/5),150px);margin-bottom:2px}
.game .track-panel .runner{height:clamp(39px,calc((100dvh - 610px)/5),142px);width:clamp(64px,calc((100dvh - 520px)/5),180px);margin-left:calc(clamp(64px,calc((100dvh - 520px)/5),180px)/-2);top:1px;transition:left .8s cubic-bezier(.2,.75,.25,1),transform .8s cubic-bezier(.2,.75,.25,1)}
.game .track-panel .lane-name{font-size:12px;z-index:2;opacity:.8}
.game .track-panel .lane-spaces i{font-size:12px}
.game .track-panel .checkpoint{max-width:64px;min-height:0}
.game .race-leaders{margin:7px 0 3px}.game .leader-chip{font-size:12px;padding:5px 9px}
.game .track-caption{font-size:10px;margin-top:5px}
.game .market{padding:11px 14px;margin:0;border-radius:21px}
.game .market .section-head h2{font-size:19px}
.game .market-tray{display:flex;align-items:center;gap:18px;min-height:0;padding:10px 3px 3px;perspective:1000px}
.game .market-tray .market-cards{display:flex;justify-content:center;align-items:center;gap:clamp(8px,1.3vw,24px);flex:1;flex-wrap:nowrap;min-height:0;margin:0;padding:6px 4px 12px;overflow:visible}
.game .market-tray .race-card{width:clamp(140px,14vw,230px);max-width:none;flex:0 1 clamp(140px,14vw,230px);height:auto;min-height:0;aspect-ratio:auto;border:3px solid #fff4d9;border-radius:18px;background:#fff7df;overflow:hidden;rotate:0deg;scale:1;translate:none;transform:perspective(800px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));box-shadow:0 5px 0 #b99d6544,0 12px 22px #133e3326;transition:transform .18s,box-shadow .18s,scale .18s;animation:card-arrive .35s ease-out both}
.game .market-tray .race-card img{display:block;width:100%;height:clamp(112px,18vh,190px);max-height:none;object-fit:contain;margin:0;background:transparent}
.game .market-tray .race-card .card-name{position:absolute;bottom:0;left:0;right:0;width:auto;padding:4px;font-size:10px;line-height:1.2;background:#123d37d9;color:#fffaf0;opacity:0;transition:opacity .15s}
.game .market-tray .race-card:hover .card-name,.game .market-tray .race-card:focus-visible .card-name{opacity:1}
.game .market-tray .race-card.pickable:not(:disabled){border-color:#ffdf77;box-shadow:0 0 0 3px #ffd15c33,0 10px 20px #163e3525}
.game .market-tray .race-card.pickable:not(:disabled):hover{scale:1.07;box-shadow:0 0 0 3px #ffe79c,0 20px 28px #163e3545;z-index:4}
.game .market-tray .race-card:active:enabled{scale:.96}
.game .market-tray .reveal-deck{flex:0 0 clamp(110px,10vw,165px);width:clamp(110px,10vw,165px);height:clamp(112px,18vh,190px);min-height:0;border-radius:45% 45% 20px 20px;border:3px solid #cf9d42;background:radial-gradient(circle at 45% 30%,#fff8cf,#efd080 65%,#be9041);box-shadow:0 6px 0 #94642e66,0 10px 24px #24493024;color:#4c351c;padding:10px 8px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:8px;transition:scale .2s,box-shadow .2s}
.game .reveal-deck .fossil-foot{font-size:clamp(30px,4vw,55px);width:auto;height:auto;line-height:1;background:none;border:0;rotate:-12deg}
.game .reveal-deck strong{font-size:clamp(13px,1.2vw,17px);line-height:1.2}
.game .reveal-deck small{font-size:10px}
.game .reveal-deck:enabled{animation:egg-ready 2.7s ease-in-out infinite}
.game .reveal-deck:disabled{opacity:.45;filter:saturate(.4)}
.collection-toggle{width:100%;min-height:34px;padding:7px 15px;border-radius:12px;background:#fff9e4df;border:1px solid #abbf95;text-align:left;color:#274639}
.collection-toggle span{float:right}
.game .collection{padding:10px 14px}.game .collection-cards{gap:10px}.game .collection-item{padding:5px 9px}.game .collection-item img{width:44px;height:50px;object-fit:contain}
.side-tools{position:fixed;right:10px;top:120px;display:flex;flex-direction:column;gap:10px;z-index:40}
.side-tools button{display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid #8fbaa066;border-radius:14px;background:#153e35ed;color:#fff7df;box-shadow:0 4px 12px #153c3233;font-size:23px}
.side-tools button[aria-expanded=true]{background:#ffe090;color:#403419;box-shadow:0 0 0 3px #ffd97444}
.side-scrim{position:fixed;inset:60px 0 0;background:#0d2b2820;z-index:48;backdrop-filter:blur(2px)}
.game-side-panel{position:fixed;right:66px;top:85px;bottom:20px;width:min(365px,calc(100vw - 90px));overflow:auto;border:2px solid #a4c08c;border-radius:24px;padding:18px;background:#fff9eefa;box-shadow:0 20px 70px #173b3555;z-index:49;animation:drawer-slide .2s ease-out;color:#254538}
.close-side{float:right;width:35px;height:35px;border-radius:50%;padding:0;font-size:25px;margin-bottom:10px}
.game-side-panel .race-sidebar{display:flex;flex-direction:column;gap:14px;width:100%;clear:both}
.game-side-panel .panel{padding:10px;box-shadow:none}
.game-side-panel[data-panel=crew] .diary,.game-side-panel[data-panel=history] .standings{display:none}
.game-side-panel .standings{max-height:none}.game-side-panel .crew-content{display:block}
.game-side-panel .player{min-height:78px;padding:10px;gap:10px}.game-side-panel .player-copy b{font-size:15px}.game-side-panel .crew-avatar img{width:48px;height:50px}.game-side-panel .player strong{font-size:22px}
.game-side-panel>h2{clear:both;margin-top:15px;font-size:28px}
.game-side-panel .presentation-picker{flex-direction:column;padding:5px}.game-side-panel .presentation-picker button{min-height:48px;font-size:16px;text-align:left}
.style-preview{height:160px;margin:22px 0;background:linear-gradient(155deg,#c5e8b1,#5f9876);border-radius:20px;display:flex;align-items:center;justify-content:space-around;font-size:60px;box-shadow:inset 0 0 0 3px #fff5}
.style-preview[data-look=depth]{transform:perspective(650px) rotateX(14deg);box-shadow:0 18px 0 #173e3544,0 25px 30px #153e3544}
.style-preview[data-look=classic]{background:#eeeedd;box-shadow:none;border:1px solid #aaa}
.campfire{right:12px;bottom:12px;z-index:51}.chat-drawer{right:0;bottom:64px;box-shadow:0 18px 55px #183e3566}
/* Classic: calm flat surfaces and a familiar board, still with large readable artwork. */
body[data-presentation=classic][data-playing=yes]::before{opacity:.12}
body[data-presentation=classic] .game .track-panel{background:#f5f5e8;border:1px solid #a7b3a0;box-shadow:none}
body[data-presentation=classic] .game .track-panel::before,body[data-presentation=classic] .game .track-panel::after,body[data-presentation=classic] .fireflies{display:none}
body[data-presentation=classic] .game .lane{background:color-mix(in srgb,var(--dino) 10%,#f4f4e9);border:1px dashed #aab5a0;box-shadow:none;border-radius:4px}
body[data-presentation=classic] .game .race-card{animation:none;transform:none!important;box-shadow:0 2px 4px #0002;border-radius:9px}
body[data-presentation=classic] .game .turn-hud,body[data-presentation=classic] .game .reveal-deck{animation:none}
body[data-presentation=classic] .game .runner .dust{display:none}
/* Depth: perspective on the stage, lifted lanes and tactile floating artwork. */
body[data-presentation=depth] .game .track-panel{transform:perspective(1800px) rotateX(5deg);transform-origin:50% 60%;box-shadow:0 12px 0 #1c4e3466,0 20px 50px #173c3544;border-radius:26px;margin:5px 0 12px}
body[data-presentation=depth] .game .track-panel .lane{box-shadow:inset 0 3px 8px #ffffff35,0 4px 0 #153c3233;border-bottom-width:3px}
body[data-presentation=depth] .game .runner{filter:drop-shadow(0 12px 4px #14362766);translate:0 -3px}
body[data-presentation=depth] .game .market{background:linear-gradient(140deg,#fff7eae8,#d9e8cfee);box-shadow:0 6px 0 #315e4433,0 20px 40px #173c3522}
body[data-presentation=depth] .game .race-card{rotate:-2deg;box-shadow:0 9px 0 #b3a07855,0 22px 30px #173c3544}
body[data-presentation=depth] .game .race-card:nth-child(even){rotate:2deg}
body[data-presentation=depth] .game .market-tray{perspective:850px}
body[data-presentation=depth] .game .race-card:not(:hover){transform:perspective(850px) rotateY(-6deg) rotateX(3deg)}
body[data-presentation=depth] .game .market .section-head h2{color:#214537}
body[data-scene='3'] .game-side-panel{background:#182c3dfa;color:#e9f4db;border-color:#679eb0}
body[data-scene='3'] .collection-toggle{background:#1c3344;color:#eaf5df;border-color:#638799}
/* Toy-like victory reward. Only end-of-game dinosaur toys can be grabbed and thrown. */
.victory-screen{overflow:auto;padding:25px 15px;align-items:flex-start}
.victory-screen .victory-card{width:min(1050px,100%);max-width:1050px;margin:auto;padding:24px 30px;overflow:visible}
.victory-trophy{font-size:55px}.victory-card h1{font-size:clamp(32px,4vw,58px)}
.victory-standings{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:15px 0}
.victory-standings>div{padding:8px 12px;min-height:65px}.victory-standings img{width:44px!important;height:50px!important;object-fit:contain}.victory-rounds{font-size:11px}
.toy-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;text-align:left;padding:8px 0}.toy-heading strong{font-size:19px}.toy-heading small{flex:1;font-size:12px}.toy-heading button{padding:8px 12px;font-size:12px}
.victory-toys{position:relative;height:240px;overflow:hidden;border:2px solid #9dc678;border-radius:24px;background:radial-gradient(ellipse at 50% 20%,#f6ffdc,#b6dc92 65%);box-shadow:inset 0 -12px 0 #71a86966;touch-action:none;margin:8px 0 18px}
.toy-dino{position:absolute;left:0;top:0;width:110px;height:120px;padding:0;border:0;background:url(/assets/racers.webp) calc(var(--toy-sprite)*25%) center/500% 100% no-repeat!important;box-shadow:none;cursor:grab;touch-action:none;transition:none!important;scale:1!important;transform-origin:50% 75%;filter:drop-shadow(0 6px 3px #234a3544);user-select:none}
.toy-dino img{display:none}
.toy-dino.grabbed{cursor:grabbing;z-index:5;filter:drop-shadow(0 12px 6px #234a3555)}
.toy-crown{position:absolute;top:2px;left:40%;font-size:32px;z-index:2;rotate:-12deg;pointer-events:none}
.toy-dino.crowned{width:130px;height:140px}
.victory-actions{position:relative;z-index:2}
@keyframes card-arrive{from{opacity:0;translate:0 12px;scale:.9}to{opacity:1;translate:0 0;scale:1}}
@keyframes egg-ready{0%,100%{box-shadow:0 6px 0 #94642e66,0 0 0 3px #ffda7522}50%{box-shadow:0 6px 0 #94642e66,0 0 24px #ffd16d88}}
@keyframes drawer-slide{from{opacity:0;translate:20px 0}to{opacity:1;translate:0 0}}
@media(min-width:900px) and (max-height:680px){
 .game .track-panel .lane{height:33px}.game .track-panel .runner{height:33px;width:52px;margin-left:-26px}
 .game .track-panel{padding:8px 12px}.game .track-caption{display:none}.game .leader-chip{padding:3px 7px;font-size:10px}.game .track-panel .checkpoint{max-width:42px}
 .game .market-tray .race-card img,.game .market-tray .reveal-deck{height:102px}.game .market-tray .race-card{flex-basis:83px;width:83px}
 .game .market-tray .reveal-deck{flex-basis:100px}.game .market-tray{padding:5px 0;gap:12px}.game .turn-hud{min-height:56px;padding:7px 12px}.game .market{padding:8px 12px}
}
@media(max-width:899px){
 body[data-playing=yes] .game{padding:8px 12px 80px;min-height:calc(100dvh - 80px)}
 .game-top{flex-wrap:wrap}.game-top .presentation-picker{order:3;width:100%;justify-content:center}
 .game .track-panel .lane{height:clamp(52px,7vh,80px)}
 .game .track-panel .runner{width:clamp(55px,10vw,85px);height:clamp(47px,6.6vh,75px);margin-left:calc(clamp(55px,10vw,85px)/-2)}
 .game .market-tray{gap:10px;align-items:stretch;flex-direction:column}
 .game .market-tray .reveal-deck{flex:auto;width:100%;height:72px;min-height:72px;border-radius:18px;flex-direction:row}
 .game .reveal-deck .fossil-foot{font-size:33px}.game .reveal-deck strong{font-size:17px}
 .game .market-tray .market-cards{display:flex;overflow-x:auto;justify-content:flex-start;padding:8px 5px 18px;gap:12px;scroll-snap-type:x proximity}
 .game .market-tray .race-card{width:125px;flex:0 0 125px;scroll-snap-align:center}.game .market-tray .race-card img{height:150px}
 .side-tools{top:auto;bottom:14px;left:12px;right:auto;flex-direction:row;gap:8px}.side-tools button{width:42px;height:42px}
 .game-side-panel{top:75px;bottom:75px;right:12px;width:calc(100vw - 24px)}
 .side-scrim{inset:60px 0 0}.campfire{right:12px;bottom:12px}
 .game .turn-copy strong{font-size:20px}.game .up-next{max-width:115px;padding-left:8px}.game .turn-hud{padding:10px;gap:9px}.game .turn-avatar{width:40px;height:40px;flex-basis:40px}
 body[data-presentation=depth] .game .track-panel{transform:perspective(1200px) rotateX(3deg)}
 .victory-screen .victory-card{padding:18px 12px}.victory-standings{grid-template-columns:1fr}.victory-toys{height:260px}.toy-dino{width:70px;height:85px}.toy-dino.crowned{width:82px;height:98px}.toy-crown{font-size:24px}
 .toy-heading small{flex-basis:100%}.victory-trophy{font-size:40px}
}
@media(prefers-reduced-motion:reduce){.game .race-card,.game .reveal-deck,.game .turn-hud,.game-side-panel{animation:none!important}.game .track-panel{transform:none!important}.game .market-tray .race-card{transform:none!important;transition:none!important}}

@media(min-width:900px) and (min-height:681px) and (max-height:900px){
 .game .main-board{gap:7px}.game .turn-hud{padding:6px 12px;min-height:58px}.game .turn-avatar{width:42px;height:42px}.game .turn-avatar img{width:42px;height:42px}.game .turn-copy strong{font-size:22px;line-height:1.05}.game .turn-copy small{font-size:10px;line-height:1.2}.game .turn-copy .turn-label{font-size:10px;line-height:1.2}
 .game .track-panel{padding:6px 12px}.game .track-panel .lane{height:36px}.game .track-panel .runner{height:36px;width:58px;margin-left:-29px}.game .track-panel .section-head{margin:0;height:27px}.game .track-panel .section-head h2{font-size:20px}.game .track-caption{display:none}.game .race-leaders{margin:3px 0 0}.game .leader-chip{padding:3px 7px}.game .track-panel .checkpoint{height:28px}
 .game .market{padding:6px 12px}.game .market .section-head{margin-bottom:0}.game .market-tray{padding:2px 0}.game .market-tray .market-cards{padding:3px 0}.game .market-tray .race-card img,.game .market-tray .reveal-deck{height:128px}.game .collection-toggle{min-height:30px;padding:4px 12px}
}
@media(min-width:900px) and (min-height:681px) and (max-height:900px){
 .game .turn-copy{display:flex;flex-direction:column;gap:2px}.game .turn-copy strong{margin:0;line-height:1}.game .turn-copy small,.game .turn-label{margin:0;line-height:1}.game .turn-hud{height:60px;min-height:60px}.game .track-panel .lane{height:35px}.game .market-tray .race-card img,.game .market-tray .reveal-deck{height:118px}
 body[data-presentation=depth] .game .track-panel{margin:0 0 5px}
}
@media(min-width:900px) and (min-height:901px){
 .game .track-panel .lane{height:clamp(50px,calc((100dvh - 820px)/5),125px)}
 .game .track-panel .runner{height:clamp(48px,calc((100dvh - 830px)/5),120px);width:clamp(80px,calc((100dvh - 750px)/5),160px);margin-left:calc(clamp(80px,calc((100dvh - 750px)/5),160px)/-2)}
 .game .track-panel .checkpoint{height:35px}.game .track-caption{display:none}
}
@media(max-width:600px){
 body[data-playing=yes] header{padding:6px 10px;display:flex;flex-wrap:nowrap;gap:5px;min-height:56px}body[data-playing=yes] header .brand{font-size:15px;min-width:105px}body[data-playing=yes] header .brand small{font-size:7px}body[data-playing=yes] header nav{gap:4px;flex-wrap:nowrap}body[data-playing=yes] header nav .icon,body[data-playing=yes] header nav summary{width:30px;height:30px;min-width:30px;min-height:30px;padding:2px}
 body[data-playing=yes] header .volume-control{display:none}body[data-playing=yes] header:has(.audio-settings[open]) .volume-control{display:flex;position:absolute;top:65px;left:10px;right:10px;background:#153e35;z-index:70;padding:12px}
 .game .track-panel{padding:7px}.game .track-panel .lane{height:38px}.game .track-panel .runner{height:38px;width:58px;margin-left:-29px}.game .track-caption{display:none}.game .track-panel .checkpoint{height:28px}.game .track-panel .section-head{margin-bottom:3px}.game .track-panel .section-head h2{font-size:17px}.game .leader-chip{padding:3px;font-size:9px}.game .leader-chip img{width:25px;height:25px}.game .race-leaders{margin:4px 0 0}
 .game .turn-hud{min-height:62px;padding:6px}.game .turn-copy strong{font-size:18px}.game .market{padding:7px}.game .market .section-head{margin-bottom:0}.game .market-tray{padding:2px;gap:5px}.game .market-tray .reveal-deck{height:48px;min-height:48px}.game .market-tray .race-card{width:145px;flex-basis:145px}.game .market-tray .race-card img{height:102px}.game .market-tray .market-cards{padding:6px 4px 10px}
}
.victory-standings>div{display:grid;grid-template-columns:25px 44px minmax(0,1fr) 70px;align-items:center;gap:8px;text-align:left}.victory-standings .avatar-charm{display:none}.victory-standings b{min-width:0;overflow-wrap:anywhere}.victory-standings strong{text-align:right}.victory-standings .victory-rounds{grid-column:3 / 5}.toy-heading button{color:#264435!important}
@media(min-width:900px){.victory-screen .victory-card{padding:14px 24px}.victory-card h1{margin:4px 0;font-size:42px}.victory-trophy{font-size:38px}.victory-standings{margin:10px 0}.victory-toys{height:205px}.victory-screen .victory-card{margin-top:0}.victory-screen{padding:15px}.victory-standings>div{min-height:62px}.victory-actions{margin-top:10px}}
@media(max-width:600px){.game-top .presentation-picker{display:none}.game .game-top{min-height:20px;margin-bottom:4px}.game .main-board{gap:6px}.game .track-panel .lane{height:35px}.game .market-tray .race-card img{height:100px}.game .market-tray .market-cards{padding-bottom:5px}}
@media(min-width:900px) and (max-height:680px){
 body[data-playing=yes] header{min-height:46px;padding:4px 14px}body[data-playing=yes] .game{padding-top:4px;min-height:calc(100dvh - 50px)}.game .main-board{gap:5px}.game .game-top{min-height:28px;margin-bottom:3px}.presentation-picker button{min-height:26px;padding:3px 8px}.game .turn-hud{height:48px;min-height:48px;padding:4px 10px}.game .turn-copy{display:flex;flex-direction:column;gap:1px}.game .turn-copy strong{font-size:20px;line-height:1;margin:0}.game .turn-label,.game .turn-copy small{font-size:9px;line-height:1;margin:0}.game .turn-avatar,.game .turn-avatar img{width:34px;height:34px}.game .turn-avatar{flex-basis:34px}
 .game .track-panel{padding:4px 10px}.game .track-panel .section-head{height:24px;margin:0}.game .track-panel .section-head h2{font-size:18px}.game .track-panel .lane{height:23px;margin-bottom:1px}.game .track-panel .runner{height:26px;width:42px;margin-left:-21px}.game .track-panel .checkpoint{height:22px;max-width:32px}.game .race-leaders{margin:2px 0}.game .leader-chip{padding:2px 5px;min-height:27px}.game .leader-chip img{width:25px;height:25px}.game .lane-name{font-size:9px}.game .track-panel .lane-spaces i{font-size:9px}
 .game .market{padding:4px 10px}.game .market .section-head{height:22px;margin:0}.game .market-tray{padding:0}.game .market-tray .market-cards{padding:3px 0}.game .market-tray .race-card{width:135px;flex-basis:135px}.game .market-tray .race-card img,.game .market-tray .reveal-deck{height:90px}.game .collection-toggle{min-height:27px;padding:3px 10px}body[data-presentation=depth] .game .track-panel{margin:0 0 4px}
}