/* One painted portrait cockpit, sliced around a flexible live game window.
   Source is 887×1774. The 260px header and 710px console stay proportional;
   only the empty window rails extend when a phone is taller. */
.mobile-cockpit-art,.mobile-only{display:none}
/* Touch feedback follows the painted artwork instead of a browser rectangle. */
button,input,select,a{-webkit-tap-highlight-color:transparent}
button:focus:not(:focus-visible){outline:none}
@media(max-aspect-ratio:1/1),(max-width:1100px) and (max-height:600px){
 #app .icon-button:focus-visible,#app #speed-button:focus-visible{outline:0;filter:drop-shadow(0 0 5px #92eaff)}
 #app #stake:focus-visible{outline:0;background:none;color:#fff;text-shadow:0 0 5px #8fe5ff}
 #app .stake-input button:hover:not(:disabled),#app .stake-input button:focus-visible,#app .stake-input button:active:not(:disabled){background:none;box-shadow:none;outline:0}
 #app .stake-input button:focus-visible::before{filter:brightness(1.35)}
 #app #speed-button b,#app #speed-button>span{text-box:trim-both cap alphabetic}
}
@media(max-aspect-ratio:1/1){
 body{padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);background:#020a12}
 #app{--mobile-header:26cqw;--mobile-footer:71cqw;--mobile-touch-row:max(44px,11cqw);width:min(calc(100vw - env(safe-area-inset-left) - env(safe-area-inset-right)),600px,calc((100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom)) * .72));height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom));max-width:none;aspect-ratio:auto;background:#031321;box-shadow:0 0 40px #000}
 .cockpit-shell,.startup-cockpit-video{display:none!important}
 .mobile-cockpit-art{display:block;position:absolute;inset:0;z-index:2;pointer-events:none;border-style:solid;border-color:transparent;border-width:var(--mobile-header) 5.637cqw var(--mobile-footer);border-image:url('../../public/assets/ui-v23-mobile/mobile-cockpit.png') 260 50 710 50 / var(--mobile-header) 5.637cqw var(--mobile-footer) stretch;user-select:none}
 /* The live picture extends beneath the opaque bevel, including cut corners. */
 #arena{left:3%;right:3%;top:23.6cqw;bottom:70cqw;width:auto;height:auto;border:0;border-image:none;z-index:1}
 #arena::after{background:linear-gradient(0deg,#020912b0,transparent 18%)}
 .brand{left:23%;top:-.7cqw;width:54%;z-index:7;filter:drop-shadow(0 1px 2px #0009)}
 .wallet{left:18%;right:auto;top:14.8cqw;width:64%;height:6cqw;display:flex;align-items:center;justify-content:center;padding:0 3cqw;gap:1.8cqw;background:none;border:0}
 .wallet .coin{flex:0 0 4.7cqw;width:4.7cqw;height:4.7cqw;filter:none}
 .wallet #balance{width:auto;max-width:calc(100% - 6.5cqw);font-size:calc(clamp(14px,4.4cqw,26px) * var(--amount-scale,1));line-height:1;text-box:trim-both cap alphabetic;text-shadow:0 1px 2px #532009}
 #sound-button,#fullscreen-button{top:0;width:20%;height:14cqw;min-height:44px;padding:0;background:none;border:0;z-index:7;transform:none}
 #sound-button{left:79.967%}#fullscreen-button{left:.034%}
 .icon-button svg{width:clamp(20px,6cqw,30px);height:clamp(20px,6cqw,30px);filter:drop-shadow(0 0 3px #087aaa)}
 #app footer,.history-strip,.mission-map{display:none}

 /* The two live instruments share the first illustrated console row. */
 .nuclear-meter{left:3.31%;top:calc(100% - var(--mobile-footer) + 1.8cqw);width:44%;height:13.2cqw;aspect-ratio:auto;filter:none;background:url('../../public/assets/ui-v24-mobile/nuclear-collector.png') center / 100% 100% no-repeat}
 .nuclear-meter-art{display:none}
 .nuclear-meter::before{content:'NUCLEAR';position:absolute;top:16.5%;left:0;right:0;transform:translateY(-50%);text-align:center;text-box:trim-both cap alphabetic;font-size:clamp(8px,2.25cqw,13px);line-height:1;font-weight:800;letter-spacing:.09em;color:#eed6ff;text-shadow:0 0 3px #8b26c9}
 .nuclear-canisters{left:3.7%;right:3.7%;top:32%;bottom:25%;gap:0}
 .nuclear-canister img{width:100%;left:0;filter:none}
 .nuclear-canister:not(.is-collected) img{opacity:0}
 .nuclear-canister.is-collected img{filter:drop-shadow(0 0 3px #ca6aff);opacity:1}
 .nuclear-meter-status{left:24%;right:24%;top:88%;bottom:auto;height:auto;transform:translateY(-50%);font-size:clamp(6px,1.8cqw,10.5px);line-height:1;letter-spacing:.015em;color:#d6c7ee}
 .nuclear-meter-track{display:none}
 .multiplier-panel{left:52.69%;right:auto;top:calc(100% - var(--mobile-footer) + 1.8cqw);width:44%;height:13.2cqw;aspect-ratio:auto;padding:0;background:url('../../public/assets/ui-v25-mobile/multiplier-housing.png') center / 100% 100% no-repeat;transform:none;filter:none}
 .multiplier-panel .panel-label{position:absolute;inset:auto 28%;top:14%;height:auto;padding:0;font-size:clamp(8px,2.1cqw,12px);line-height:1;letter-spacing:.04em;color:#ead7ff;text-align:center;text-box:trim-both cap alphabetic;transform:translateY(-50%);background:none}
 .multiplier-panel #multiplier{position:absolute;left:13%;right:13%;top:31%;width:74%;height:38%;margin:0;font-size:5.6cqw;line-height:1}
 .multiplier-panel .potential{left:20%;right:20%;top:85%;bottom:auto;height:max(9px,2.3cqw);display:flex;flex-direction:row;gap:.65cqw;margin:0;padding:0;border:0;background:none;overflow:hidden;align-items:center;justify-content:center;transform:translateY(-50%)}
 .multiplier-panel .potential::before{display:none}
 .multiplier-panel .potential>span{top:0;flex:0 0 auto;font-size:clamp(5.5px,1.4cqw,8px);max-width:none;letter-spacing:0;line-height:1;white-space:nowrap;transform:none}
 .multiplier-panel .potential #potential{top:0;width:auto;max-width:52%;min-width:0;font-size:calc(clamp(8px,2.2cqw,13px) * var(--amount-scale,1));line-height:1;transform:none}

 /* A single recent receipt stays in view; tap the strip for the complete log. */
 .power-panel{left:5.7%;top:calc(100% - var(--mobile-footer) + 16.1cqw);width:88.6%;height:7.3cqw;min-height:0;background:none;border:0;box-shadow:none;overflow:visible;z-index:4}
 .power-panel::before,.collections-title{display:none}
 #mobile-collections-button{display:flex;position:absolute;top:calc(13.9cqw - var(--mobile-touch-row) * 1.5);left:-1cqw;right:-1cqw;height:var(--mobile-touch-row);z-index:4;align-items:center;justify-content:space-between;padding:0 1.3cqw;border:0;background:transparent;color:#b7ddee;font-size:clamp(8px,2.1cqw,13px);font-weight:700;letter-spacing:.035em}
 #mobile-collections-button>span:first-child{writing-mode:horizontal-tb;width:21%;text-align:left}
 #mobile-collections-button>span{transform:translateY(calc(var(--mobile-touch-row) - 10.25cqw))}
 #mobile-collections-button>span:last-child{font-size:7cqw;color:#77daff}
 .collections-feed{inset:0 5% 0 23%;display:block;padding:0;overflow:hidden;pointer-events:none;scrollbar-width:none}
 .collections-feed:empty::after{content:'Your first pickup awaits';display:flex;align-items:center;height:100%;color:#97b7c9;font-size:clamp(10px,2.7cqw,16px);font-weight:500}
 .collections-feed .collection-entry{display:none;height:100%;min-height:0;border:0;padding:0;animation:none}
 .collections-feed .collection-entry:first-child{display:block}
 .collections-feed .collection-face{padding:0;gap:1cqw;transform:none}
 .collections-feed .collection-card-art{display:none}
 .collections-feed .collection-entry .item-art{width:7cqw;height:7cqw;flex-shrink:0}
 .collections-feed .collection-copy b{font-size:clamp(10px,2.75cqw,16px);line-height:1.15;white-space:nowrap}
 .collections-feed .collection-copy small{font-size:clamp(8px,2cqw,12px);line-height:1.2;margin-top:.4cqw;display:block}
 .collections-feed .collection-value{min-width:0;font-size:clamp(11px,3cqw,18px);padding-right:1cqw}
 .collections-feed .collection-entry:is([data-type=uranium],[data-type=minigun],[data-type=grow],[data-type=nuclear],[data-kind=neutralized]) .collection-value{font-size:clamp(9px,2.2cqw,14px)}

 /* Face coordinates are measured from the artwork; touch targets may extend
    beyond a face without moving its centered icon. */
 .stake-control{left:0;top:calc(100% - var(--mobile-footer) + 24.4cqw);width:100%;height:12cqw;min-height:44px;aspect-ratio:auto;background:none;filter:none;padding:0;border:0}
 .stake-control::before{content:'BET';position:absolute;left:25%;width:50%;top:2.6cqw;text-align:center;text-box:trim-both cap alphabetic;font-size:clamp(8px,2.2cqw,13px);letter-spacing:.16em;font-weight:800;color:#9bcde5;pointer-events:none}
 .stake-input button{top:calc(5.6cqw - var(--mobile-touch-row) / 2);width:18%;height:var(--mobile-touch-row);min-height:44px;min-width:44px;padding:0;font-size:0;background:none;clip-path:none;text-shadow:none;overflow:visible}
 .stake-input #stake-minus{left:1.654%}.stake-input #stake-plus{left:80.177%}
 .stake-input button::before{content:'';position:absolute;left:50%;top:50%;width:12.3cqw;height:7.4cqw;transform:translate(-50%,-50%);clip-path:polygon(12% 0,88% 0,100% 15%,100% 85%,88% 100%,12% 100%,0 85%,0 15%);background:linear-gradient(#168bc4,#06488a 48%,#052766 51%,#085f9f);box-shadow:inset 0 1px #78e6ff,inset 0 -1px #159fe3,inset 0 0 8px #1d8fff66}
 .stake-input button::after{content:'';position:absolute;left:50%;top:50%;width:4.4cqw;height:4.4cqw;transform:translate(-50%,-50%);background:linear-gradient(#e7fbff,#e7fbff) center / 100% 2.5px no-repeat;filter:drop-shadow(0 0 2px #46baff)}
 .stake-input #stake-plus::after{background:linear-gradient(#e7fbff,#e7fbff) center / 100% 2.5px no-repeat,linear-gradient(#e7fbff,#e7fbff) center / 2.5px 100% no-repeat}
 .stake-input button:hover:not(:disabled),.stake-input button:focus-visible,.stake-input button:active:not(:disabled){background:none;box-shadow:none}
 .stake-input button:hover:not(:disabled)::before,.stake-input button:focus-visible::before{filter:brightness(1.25)}
 .stake-input button:active:not(:disabled)::before{filter:brightness(.8)}
 .stake-input input{left:23%;top:calc(5.6cqw - var(--mobile-touch-row) / 2);width:54%;height:var(--mobile-touch-row);padding:3.1cqw 0 0;font-size:clamp(18px,5.4cqw,30px);line-height:1}
 .stake-input input::-webkit-inner-spin-button,.stake-input input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.stake-input input{appearance:textfield;-moz-appearance:textfield}
 .stake-presets{display:none}
 .launch-control{--mobile-roll-height:max(44px,13.6cqw);--mobile-roll-hit-offset:max(0px,44px - 14.6cqw);left:8.3%;top:calc(100% - var(--mobile-footer) + 44.6cqw - var(--mobile-roll-height) / 2 + var(--mobile-roll-hit-offset));width:83.4%;height:var(--mobile-roll-height);min-height:44px;aspect-ratio:auto;background:none}
 #launch-button,#launch-button[data-art-label=true],#launch-button[data-wormhole-spin=true]{height:100%;padding:0;background:url('../../public/assets/ui-v23-mobile/mobile-cockpit.png') left -8.3cqw top calc(-151cqw + var(--mobile-roll-height) / 2 - var(--mobile-roll-hit-offset)) / 100cqw 177.4cqw no-repeat;isolation:isolate;overflow:hidden}
 #launch-button::before{background:linear-gradient(100deg,transparent,#ffddad33,transparent);clip-path:polygon(5% 0,95% 0,100% 25%,100% 75%,95% 100%,5% 100%,0 75%,0 25%)}
 #launch-button #launch-label{left:50%;top:calc(50% - var(--mobile-roll-hit-offset));width:96%;font-size:clamp(17px,5.3cqw,30px);letter-spacing:.04em;white-space:nowrap;line-height:1;text-box:trim-both cap alphabetic;transform:translate(-50%,-50%);text-shadow:0 2px 1px #742306}
 #launch-lettering{left:50%;top:calc(50% - var(--mobile-roll-hit-offset));width:48%;transform:translate(-50%,-44.8%)}
 #wormhole-spin-lettering{left:50%;top:calc(50% - var(--mobile-roll-hit-offset));width:75%;transform:translate(-50%,-50.8333%)}
 #launch-button>.idle-button-shine{clip-path:polygon(6% 4%,94% 4%,100% 24%,100% 76%,94% 95%,6% 95%,0 76%,0 24%)}

 /* Four large thumb targets occupy the bottom utility wells. */
 .utility-controls{display:contents;position:static}
 .utility-controls .icon-button,#speed-button{position:absolute;top:auto;bottom:2.65cqw;left:auto;width:21%;height:14cqw;min-height:44px;min-width:44px;padding:0;z-index:5;border:0;background:none;transform:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.65cqw;filter:none}
 .utility-controls #rules-button{left:4.1%;top:auto}.utility-controls #mobile-log-button{left:27.662%;top:auto}.utility-controls #settings-button{left:51.337%;top:auto}#speed-button{left:74.844%}
 #rules-button::after{content:'GUIDE'}#settings-button::after{content:'SETTINGS'}
 .utility-controls .icon-button::after,#mobile-log-button>span,#speed-button b,#speed-button>span{font-size:clamp(8px,2.1cqw,13px);letter-spacing:.04em;line-height:1;color:#c2e6f3;font-weight:700}
 .utility-controls .icon-button:active:not(:disabled){transform:translateY(1px)}
 #speed-button::before,#speed-button::after,#speed-button>i{display:none}
 #speed-button b{position:static;transform:none;width:auto;font-size:clamp(10px,2.8cqw,16px);color:#80deff}
 #speed-button>span{display:block;position:static;transform:none;color:#8caebe}
 #speed-button[aria-pressed=true] b,#speed-button[aria-pressed=true]>span{color:#b9ff8a}

 /* Scene overlays retain readable type without consuming the play window. */
 .bottom-telemetry{left:5%;right:5%;bottom:calc(3cqw + 3.234%);gap:3cqw}
 .course-caption{font-size:clamp(8px,2.15cqw,13px);letter-spacing:0}.course-caption b{font-size:clamp(10px,2.7cqw,16px)}.course-caption small{font-size:8px}
 .course-line{height:3px;margin-top:5px}.course-line>i{height:6px;top:-2px}#course-orb{width:6px;height:6px;top:-2px}
 .energy{width:26cqw}.energy>div:first-child{font-size:clamp(7px,1.85cqw,11px)}.energy .energy-meter{height:7px;margin-top:5px}
 #event-text.terminal-messages{top:9%;left:5%;width:78%;max-width:78%;font-size:clamp(16px,4.4cqw,25px)}
 .power-status-list{top:3%;right:3%;width:28cqw;gap:2px}.power-status-card{height:10cqw;min-height:32px}.power-status-copy>b{font-size:clamp(8px,2.1cqw,13px)}.power-status-time{font-size:clamp(9px,2.3cqw,14px)}.power-status-detail small{font-size:clamp(6px,1.6cqw,10px)}
 .paused-overlay{font-size:clamp(10px,2.7cqw,18px)}#resume-button.primary{min-height:64px;width:82%;font-size:clamp(18px,5cqw,28px)}
 .nuclear-alert{top:calc(25.5cqw + (100% - 99.5cqw) * .4)}
 .wormhole-wheel-title{font-size:clamp(17px,5cqw,30px)}.wormhole-wheel-formula{white-space:normal}
 .wormhole-wheel-footer{bottom:calc(3cqw + 3.234%)}
 .wormhole-wheel:not(.is-revealed) .wormhole-wheel-formula{font-size:clamp(10px,2.8cqw,17px)}
}
