/* Mobile layout and touch controls; card artwork keeps its original proportions. */
.mobile-controls{display:none}
[hidden]{display:none!important}
@media(max-width:760px){
 html{scroll-padding-top:24px;-webkit-text-size-adjust:100%;text-size-adjust:100%}
 body{min-width:280px}
 header{height:76px;margin:0 max(20px,env(safe-area-inset-left)) 0 max(20px,env(safe-area-inset-right));gap:12px}
 header .wordmark{font-size:24px}
 header nav{margin-left:auto;gap:0;min-width:0}
 header nav>a{display:none}
 header nav button{min-height:44px;padding:0 10px;font-size:12px;max-width:120px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .language{flex-shrink:0}
 .language select{min-height:44px;max-width:112px;font-size:12px;padding:10px 12px}
 .hero{padding:26px max(20px,env(safe-area-inset-right)) 40px max(20px,env(safe-area-inset-left));gap:28px}
 .intro .eyebrow{font-size:9px;letter-spacing:1.4px;margin:0 0 18px}
 h1,html[lang^=zh] h1,html[lang=ja] h1,html[lang=ko] h1{font-size:clamp(35px,10.7vw,56px);line-height:1.12;letter-spacing:-1.5px;margin:0 0 14px}
 .lead{font-size:14px;line-height:1.7;max-width:480px;margin:0}
 .primary{margin-top:19px;min-height:48px;width:184px;font-size:13px;padding:14px 20px}
 .edition{display:none}
 .stage{max-width:500px;scroll-margin-top:25px;padding-top:0}
 .stage-label{padding:0;font-size:9px;letter-spacing:.4px;gap:12px}
 .stage-label span:first-child{min-width:0}
 .stage-label span:last-child{white-space:nowrap}
 .card-wrap{padding:30px 4px 20px}
 .card{width:100%;max-width:none;transform:rotate(-3deg);box-shadow:0 18px 35px #0009,0 1px 1px #aaa6a455 inset;touch-action:pan-y pinch-zoom}
 .card-top button{min-height:12px}
 .orbit{top:0;height:260px;max-width:100%;box-shadow:none}
 .stage-foot{font-family:inherit;font-size:11px;line-height:1.5;letter-spacing:0;text-align:center;margin:10px 0 16px;gap:7px;color:#a4ad95}
 .status-dot{flex-shrink:0}
 .mobile-controls{display:block;border:1px solid #343b2d;border-radius:15px;background:#151812;padding:6px 14px 14px;margin-bottom:12px}
 .mobile-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding-bottom:8px;border-bottom:1px solid #ffffff10}
 .mobile-tabs button{min-height:44px;background:transparent;border:0;border-radius:9px;color:#a7b29b;font-size:13px}
 .mobile-tabs button[aria-pressed=true]{background:#d9fb7312;color:#d9fb73}
 .mobile-readout{display:flex;justify-content:space-between;align-items:end;gap:12px;padding:14px 1px 2px;font-variant-numeric:tabular-nums}
 .mobile-readout>div{display:flex;align-items:baseline;gap:8px;min-width:0}
 #mobile-ticker{font-size:11px;color:#a7b29b}
 #mobile-amount{font-size:22px;font-weight:500;letter-spacing:-.5px;color:var(--accent)}
 #mobile-fiat{font-size:13px;line-height:1.4;color:#c2c9b7;white-space:nowrap}
 .mobile-colors{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-top:10px;min-height:54px}
 .mobile-colors>span{font-size:13px;color:#b4bda9}
 .mobile-colors>div{display:flex;gap:4px}
 .mobile-colors button{width:44px;height:44px;border:0;border-radius:50%;background:radial-gradient(circle,var(--swatch) 0 9px,transparent 10px)}
 .asset-selector{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
 .asset-selector button{min-height:48px;min-width:0;padding:10px 4px;font-size:11px;border-radius:12px;white-space:nowrap}
 .asset-selector button>span{font-size:16px;margin-right:3px}
 .asset-selector small{display:none}
 .detail{padding:28px 20px 36px}
 .detail-head .eyebrow{font-size:9px;letter-spacing:1.4px}
 .detail h2{font-size:28px;line-height:1.4;margin:16px 0 20px}
 .detail-grid{gap:24px 20px;margin-top:0}
 .detail-grid p{font-size:14px;line-height:1.8}
 .detail-grid h3{font-size:15px}
 .detail-grid div p{font-size:13px;line-height:1.7}
 .film-section{margin:0 20px 36px;padding-top:30px;gap:22px}
 .film-thumb{height:240px}
 .film-copy .eyebrow{font-size:9px;letter-spacing:1.5px}
 .film-copy h2{font-size:30px;margin-top:18px}
 .film-copy>p:not(.eyebrow){font-size:14px;line-height:1.8}
 .film-link{min-height:44px;font-size:14px;margin-top:8px}
 footer{padding:26px max(20px,env(safe-area-inset-right)) max(26px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));gap:18px}
 footer p{font-size:12px;line-height:1.8}
 footer>span{font-size:9px;letter-spacing:.4px}
 dialog{width:calc(100% - 24px);max-width:440px;max-height:calc(100dvh - 24px);padding:12px;border-radius:14px}
 .dialog-head{margin-bottom:10px;font-size:10px;letter-spacing:.8px;gap:8px}
 .dialog-head button{min-width:44px;min-height:44px;padding:8px}
 video{max-height:calc(100dvh - 112px);object-fit:contain}
}
@media(max-width:360px){
 header{margin-left:14px;margin-right:14px;gap:6px}
 header .wordmark{font-size:22px}
 header nav button{font-size:11px;max-width:94px;padding:0 6px}
 .language select{max-width:100px;padding:8px}
 .hero{padding-left:16px;padding-right:16px;gap:24px}
 .stage-label{font-size:8px;letter-spacing:0}
 .mobile-readout{gap:7px}
 #mobile-amount{font-size:20px}
 #mobile-fiat{font-size:11px}
 .mobile-readout>div{gap:5px}
 .mobile-colors>span{font-size:12px}
 .mobile-colors>div{gap:0}
 .asset-selector button{font-size:10px}
}
@media(max-width:760px) and (orientation:landscape){
 .hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:25px;align-items:center;padding-top:24px}
 h1,html[lang^=zh] h1,html[lang=ja] h1,html[lang=ko] h1{font-size:34px}
 .intro .lead{font-size:12px}
 .card-wrap{padding-top:23px;padding-bottom:14px}
 .stage-foot{font-size:10px}
 .mobile-readout{flex-wrap:wrap}
}
@media(hover:none),(pointer:coarse){
 .card{will-change:auto}
 .contour-glow{animation-duration:9s}
 .film-thumb:hover img{transform:none}
}
@media(max-width:760px){.orbit{width:80%;left:10%;transform:rotate(-12deg)}}