:root{color-scheme:dark;--ink:#e6e7da;--dim:#aeb6ae;--gold:#d4b378;--green:#8db39e;--red:#db7165;--panel:rgba(14,22,21,.88)}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#1b221e;font-family:Arial,"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;color:var(--ink)}button,input,select{font:inherit}button{color:inherit;cursor:pointer;border:0}button:focus-visible{outline:2px solid var(--gold);outline-offset:5px}button:disabled{cursor:wait;opacity:.5}[hidden]{display:none!important}#scene{position:absolute;inset:0;display:block;width:100%;height:100%;touch-action:none;cursor:grab}.battle #scene{cursor:crosshair}.cinema{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(11,18,17,.67),transparent 57%),linear-gradient(0deg,rgba(8,15,13,.8),transparent 29%,transparent 83%,rgba(8,15,13,.4));transition:opacity .7s}.battle .cinema{opacity:0}.loading{position:absolute;inset:0;z-index:100;display:flex;flex-direction:column;gap:22px;align-items:center;justify-content:center;background:#151d19;font-size:13px;letter-spacing:.15em}.loading-icon{width:30px;height:30px;border:1px solid #737d70;transform:rotate(45deg);animation:load 2s infinite;border-top-color:var(--gold)}@keyframes load{50%{transform:rotate(225deg);opacity:.5}100%{transform:rotate(405deg)}}.garage-ui{position:absolute;inset:0;pointer-events:none}.garage-ui button{pointer-events:auto}.garage-header{position:absolute;top:32px;left:42px;right:42px;display:flex;align-items:center;justify-content:space-between}.brand-mark{font-family:Georgia,serif;font-size:30px;display:flex;align-items:center;gap:17px;color:var(--gold)}.brand-mark span{font-family:Arial,sans-serif;font-size:11px;letter-spacing:.24em;color:var(--ink);padding-left:17px;border-left:1px solid #798575}.header-right{display:flex;align-items:center;gap:24px}.build-tag{font-size:9px;letter-spacing:.2em;color:#bec5b9}.icon-button{width:38px;height:38px;border:1px solid #78837488;background:#141c1777;font-size:20px}.icon-button:hover{border-color:var(--gold);background:#243127}.garage-title{position:absolute;left:7%;top:20%}.eyebrow{margin:0 0 13px;color:var(--gold);font-size:10px;letter-spacing:.24em;font-weight:600}.garage-title h1{font-family:Impact,"Arial Narrow",Arial,sans-serif;font-size:clamp(64px,8vw,135px);font-weight:900;line-height:.86;margin:22px 0;letter-spacing:.02em;text-shadow:0 2px 20px #1b231e33}.garage-title h1 span{color:var(--gold)}.tagline{font-size:14px;letter-spacing:.23em;color:#d0d3c5;margin-top:32px}.vehicle-panel{position:absolute;right:6%;top:30%;max-width:260px;text-shadow:0 1px 8px #0a110c}.vehicle-panel .diamond{font-size:11px;margin-right:6px}.vehicle-panel h2{font-family:Georgia,serif;font-size:38px;letter-spacing:.03em;margin:12px 0 24px;font-weight:400}.vehicle-panel h2 span{font:11px Arial,sans-serif;color:#b6bdae;margin-left:7px}.vehicle-panel p:not(.eyebrow){font-size:12px;line-height:1.9;color:#c2c8bd}.vehicle-specs{display:flex;gap:24px;border-top:1px solid #b0bca644;border-bottom:1px solid #b0bca644;padding:17px 0;margin:23px 0}.vehicle-specs small{display:block;font-size:9px;color:#a9b4a5;margin-bottom:9px}.vehicle-specs strong{font:19px Georgia,serif}.vehicle-specs strong span{font:9px Arial,sans-serif;color:#a9b4a5}.text-button{background:none;padding:10px 0;font-size:11px;color:#d3d9cd;letter-spacing:.08em}.text-button span{margin-left:15px;color:var(--gold)}.text-button:hover{color:var(--gold)}.garage-footer{position:absolute;left:42px;right:42px;bottom:42px;display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:30px}.mission{display:flex;align-items:center;gap:20px}.mission-icon{font-size:35px;color:#c7b48c}.mission .eyebrow{font-size:9px;margin-bottom:9px}.mission h3{font-size:14px;letter-spacing:.1em;margin:0 0 10px}.mission h3 span{color:#a6b0a0;font-size:11px;font-weight:400}.mission p:last-child{font-size:10px;color:#aab4a3;margin:0}.deploy-wrap{text-align:center}.deploy-button{width:234px;height:61px;background:linear-gradient(135deg,#b89863,#debc83);color:#162019;box-shadow:0 2px 20px #0005;display:flex;justify-content:space-between;align-items:center;padding:0 25px;font-size:19px;font-weight:bold;letter-spacing:.15em;transition:all .2s}.deploy-button:hover{filter:brightness(1.14);transform:translateY(-2px)}.button-arrow{font-size:26px;font-weight:400}.deploy-wrap p{font-size:9px;color:#a4af9e;letter-spacing:.03em;margin:12px 0 0}.help-link{justify-self:end}.help-link span{display:inline-flex;align-items:center;justify-content:center;border:1px solid #72816c;width:20px;height:20px;color:#b7c3ad}.orbit-hint{position:absolute;bottom:20%;left:50%;transform:translateX(-50%);font-size:9px;color:#b5c1b1;letter-spacing:.07em;opacity:.75;white-space:nowrap}.orbit-hint span{padding:0 10px}.battle-hud{position:absolute;inset:0;pointer-events:none;font-size:12px;text-shadow:0 1px 4px #000}.battle-hud button{pointer-events:auto}.battle-top{position:absolute;top:25px;left:30px;right:30px;display:flex;justify-content:space-between;align-items:start}.objective .eyebrow{font-size:11px;color:#e3e8d9;letter-spacing:.15em}.objective p{font-size:10px;color:#c1cbbb;margin:0}.score{position:absolute;left:50%;transform:translateX(-50%);display:flex;gap:22px;align-items:center}.score .ally{font-size:24px;color:var(--green)}.score strong{font-size:24px;font-weight:400;color:var(--red)}.score-line{display:flex;gap:4px;width:100px}.score-line i{height:3px;background:#d27367;width:25%;opacity:.9}.score-line i:first-child{background:#8cab94}#timer{position:absolute;top:40px;left:50%;transform:translateX(-50%);font:13px monospace;color:#d2dacb;letter-spacing:.1em}.reticle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:1px;height:1px;color:#c6d7b8}.reticle-ring{position:absolute;width:80px;height:80px;border:1px dashed #d1dfbd99;border-radius:50%;transform:translate(-50%,-50%);transition:width .06s,height .06s}.reticle-center{position:absolute;width:4px;height:4px;background:#d5e7c1;box-shadow:0 0 4px #18301c;transform:translate(-50%,-50%);border-radius:50%}.reticle-left,.reticle-right{position:absolute;top:0;width:14px;height:1px;background:#c6d7b8aa}.reticle-left{right:26px}.reticle-right{left:26px}.range-text{position:absolute;top:50px;left:-45px;width:90px;text-align:center;font:10px monospace;letter-spacing:.06em}.reload-text{position:absolute;top:69px;left:-55px;width:110px;text-align:center;font-size:9px;color:#a5c1a3}.artillery-view .reticle-ring{width:110px;height:110px;border-style:solid;border-color:#e8c27a99}.artillery-view .battle-hud::before{content:"";position:absolute;inset:0;box-shadow:inset 0 0 120px 30px #0a1410aa;pointer-events:none}.traverse-text{position:absolute;top:86px;left:-90px;width:180px;text-align:center;font-size:10px;letter-spacing:.06em;color:#eab872}.gun-marker{position:absolute;left:50%;top:50%;width:9px;height:9px;border:1px solid #dcdfb4;transform:translate(-50%,-50%) rotate(45deg);border-radius:2px}.sniper .battle-hud::before{content:"";position:absolute;inset:0;box-shadow:inset 0 0 150px 40px #07100cee;border:1px solid #9cab8930;pointer-events:none}.sniper .reticle::after{content:"";position:absolute;left:-160px;top:0;width:320px;height:1px;background:linear-gradient(90deg,transparent,#b9c5ac66 25%,transparent 40%,transparent 60%,#b9c5ac66 75%,transparent)}.vehicle-hud{position:absolute;left:30px;bottom:56px;width:220px;padding:17px 17px 10px;background:linear-gradient(110deg,#121d1bd9,#121d1b88);border-left:2px solid #8ba991}.vehicle-hud-heading{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.08em;color:#cad8c4}#speed{font:17px monospace;color:#e1e8d9}#speed small{font-size:8px;color:#a6b39e}.health-value{margin:14px 0 7px}.health-value strong{font-size:27px;font-weight:400}.health-value small{font:10px monospace;color:#adbba5}.health-track{height:3px;background:#435443}.health-track i{display:block;width:100%;height:100%;background:#a4c49c;transition:width .3s}.modules{display:flex;align-items:center;justify-content:space-between;font-size:8px;color:#b1c0a7;margin-top:12px}.modules button{background:transparent;font-size:8px;padding:0;color:#b1c0a7}.modules .damaged{color:var(--red)}kbd{border:1px solid #b6c1b344;border-radius:2px;background:#17211a66;font:9px Arial,sans-serif;padding:2px 4px}.vehicle-diagram{height:53px;overflow:hidden;margin-top:5px}.vehicle-diagram svg{width:100%;height:100%;fill:none;stroke:#99ae8566;stroke-width:1.2}.ammo-hud{position:absolute;bottom:43px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:13px;padding:10px 17px 30px;border-bottom:1px solid #b5bf9a55;background:linear-gradient(0deg,#102019aa,transparent);min-width:172px}.ammo-round{font-size:25px;color:var(--gold)}.ammo-hud strong{display:block;font-size:14px;letter-spacing:.1em}.ammo-hud div>span{display:block;color:#b4c1a8;font-size:8px;margin-top:4px}.ammo-reload{width:60px;height:3px;background:#435543}.ammo-reload i{display:block;width:100%;height:100%;background:var(--gold)}.ammo-hud small{position:absolute;bottom:8px;left:32px;font-size:8px;color:#bcc9af;white-space:nowrap}.map-hud{position:absolute;bottom:24px;right:26px;width:207px;background:#0c1918db;border:1px solid #96ab8144}.map-hud.expanded{width:320px}.map-caption{display:flex;justify-content:space-between;align-items:center;padding:8px 10px;font-size:7px;letter-spacing:.15em;color:#b5c4a7}.map-caption button{font-size:15px;background:none;color:#b5c4a7;padding:0}#minimap{width:100%;height:auto;display:block}.map-coordinates{display:flex;justify-content:space-between;padding:5px 10px 8px;font:8px monospace;color:#98af8b}.controls-hint{position:absolute;bottom:20px;left:30px;font-size:8px;color:#c8d1bc}.controls-hint span{padding:0 9px;color:#71856d}.enemy-label{position:absolute;transform:translate(-50%,-100%);text-align:center;min-width:88px;white-space:nowrap;color:#e49a83;text-shadow:0 1px 3px #070b06;font-size:9px}.enemy-label .enemy-diamond{color:#e5816e;font-size:17px;line-height:18px}.enemy-label .enemy-name{margin:3px 0}.enemy-label .enemy-health{height:3px;background:#41231ee0;width:64px;margin:5px auto 0}.enemy-label .enemy-health i{display:block;height:100%;background:#d47361}.enemy-label small{font:8px monospace;color:#e7b69a}.spotted{position:absolute;top:18%;left:50%;transform:translateX(-50%);color:#edb075;text-align:center;font-size:10px;letter-spacing:.1em}.spotted span{display:block;font-size:29px;margin-bottom:6px}.hit-feedback{position:absolute;left:calc(50% + 65px);top:calc(50% - 25px);opacity:0;transition:opacity .25s}.hit-feedback strong{display:block;color:#edcaa0;font-size:25px;font-weight:400}.hit-feedback span{display:block;font-size:10px;color:#dbe6ce;margin-top:6px}.hit-feedback.visible{opacity:1}.damage-overlay{position:absolute;inset:0;box-shadow:inset 0 0 90px 14px #b04731;opacity:0;pointer-events:none;transition:opacity .6s}.capture-hud{position:absolute;top:100px;left:50%;transform:translateX(-50%);width:260px;font-size:9px;display:flex;gap:10px;align-items:center;color:#d3bd91}.capture-hud div{width:90px;height:3px;background:#544931}.capture-hud i{display:block;height:100%;background:var(--gold)}.capture-hud strong{font-weight:400}.notifications{position:absolute;top:100px;left:30px;width:270px;display:flex;flex-direction:column;gap:8px}.notification{background:#0b171cc2;border-left:2px solid #d3b88d;padding:9px 12px;color:#d0ddc5;font-size:9px;animation:notice 5s both}@keyframes notice{0%{opacity:0;transform:translateX(-8px)}10%,80%{opacity:1;transform:translateX(0)}100%{opacity:0}}.mouse-hint{position:absolute;bottom:33%;left:50%;transform:translateX(-50%);background:#0d191dcc;padding:12px 20px;border:1px solid #9cae8055;white-space:nowrap;font-size:10px}.inspection-ui{position:absolute;left:35px;right:35px;bottom:35px;display:flex;justify-content:space-between;align-items:end;pointer-events:none}.inspection-ui button{pointer-events:auto}.inspection-ui h2{font:24px Georgia,serif;margin:6px 0}.inspection-ui p:last-child{font-size:10px;color:#b8c5ae}.inspection .cinema{opacity:.4}dialog{color:var(--ink);background:linear-gradient(130deg,#1d2925f5,#0e1b19fa);border:1px solid #95a57b66;border-top:2px solid var(--gold);padding:38px;width:min(490px,calc(100% - 32px));box-shadow:0 20px 90px #0008;max-height:85vh;overflow:auto}dialog::backdrop{background:#070e0ba6;backdrop-filter:blur(6px)}dialog h2{font-size:25px;font-weight:400;letter-spacing:.1em;margin:10px 0 26px}.dialog-close{position:absolute;right:17px;top:13px;padding:3px;background:transparent;font-size:24px;color:#b3c1a5}.control-table>div{display:flex;align-items:center;gap:15px;padding:11px 0;border-bottom:1px solid #a1b28d22;font-size:11px}.control-table kbd{width:105px;text-align:center;padding:5px;font-size:10px;color:#d8dfcd}.guide-note{font-size:11px;line-height:1.9;color:#a9b99e;margin:22px 0}.primary-small{background:#c9ab77;color:#18241b;font-weight:bold;padding:13px 25px;font-size:12px;display:block;width:100%;margin:18px 0 5px;letter-spacing:.08em}.primary-small:hover{background:#dfc293}.secondary-small{background:#ffffff09;border:1px solid #a4b59355;width:100%;padding:12px;font-size:12px;margin:9px 0}#pause-dialog,#result-dialog{text-align:center}#pause-dialog .text-button,#result-dialog .text-button{margin-top:14px}.setting-row{display:flex;align-items:center;justify-content:space-between;font-size:12px;padding:16px 0;border-bottom:1px solid #85986c33;gap:15px}.setting-row select{background:#18231b;border:1px solid #94a68477;padding:8px 16px;color:#d7e3ca;font-size:11px}.setting-row input{accent-color:var(--gold);max-width:170px}.result-stats{display:flex;justify-content:space-between;border-top:1px solid #81966944;border-bottom:1px solid #81966944;padding:23px 0;margin:28px 0}.result-stats small{display:block;font-size:9px;color:#a5b497}.result-stats strong{display:block;font:26px Georgia,serif;margin-top:12px;color:var(--gold)}#result-desc{font-size:12px;color:#afbfa3}.error-panel{position:absolute;inset:0;z-index:110;background:#111e19;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:35px}.error-panel h2{font-size:21px}.error-panel p{font-size:12px;max-width:480px;line-height:1.8;color:#bac8b0}.error-panel button{max-width:250px}.touch-controls{display:none}.touch-drive{position:absolute;left:20px;bottom:30px;display:grid;grid-template-columns:repeat(3,44px);grid-template-rows:repeat(2,40px);gap:3px}.touch-drive button{background:#15211c99;border:1px solid #acbd9155;color:#d2dcbf}.touch-drive button:nth-child(1){grid-column:2}.touch-drive button:nth-child(2){grid-column:1;grid-row:2}.touch-drive button:nth-child(3){grid-column:2;grid-row:2}.touch-drive button:nth-child(4){grid-column:3;grid-row:2}#touch-fire{position:absolute;right:25px;bottom:30px;width:62px;height:62px;border:1px solid #d2bd8a;background:#af935d99;border-radius:50%;font-size:11px}#touch-scope{position:absolute;right:100px;bottom:40px;width:45px;height:45px;border:1px solid #acbd9177;background:#15211caa;border-radius:50%;font-size:10px}
@media(min-width:1700px){.vehicle-panel{right:8%;top:34%}.garage-title{top:24%}}@media(max-width:1000px){.garage-title{left:5%;top:20%}.vehicle-panel{right:4%;top:29%;max-width:225px}.vehicle-specs{gap:15px}.garage-header{left:25px;right:25px;top:23px}.garage-footer{left:25px;right:25px;bottom:27px}.mission h3 span{display:none}.mission p:last-child{max-width:155px;line-height:1.8}.mission-icon{display:none}.help-link{font-size:9px}.deploy-button{width:190px}.vehicle-hud{left:20px;bottom:46px;width:190px}.map-hud{width:175px;bottom:15px;right:18px}.controls-hint{left:20px;font-size:7px}.battle-top{left:20px;right:20px;top:18px}}@media(max-width:700px){.garage-title{top:16%;left:6%}.garage-title h1{font-size:62px}.tagline{font-size:10px;letter-spacing:.1em;margin-top:20px}.garage-header{top:18px;left:20px;right:20px}.brand-mark{font-size:23px;gap:9px}.brand-mark span{font-size:8px;letter-spacing:.1em;padding-left:9px}.header-right{gap:10px}.build-tag{display:none}.vehicle-panel{top:auto;right:23px;bottom:165px;max-width:190px}.vehicle-panel h2{font-size:25px;margin:10px 0}.vehicle-panel p:not(.eyebrow){display:none}.vehicle-specs{margin:10px 0;padding:10px 0;gap:14px}.vehicle-specs strong{font-size:15px}.vehicle-specs small{font-size:8px;margin-bottom:5px}.vehicle-panel .eyebrow{font-size:8px;margin-bottom:5px}.vehicle-panel .text-button{font-size:9px;padding:5px 0}.garage-footer{display:block;left:23px;right:23px;bottom:24px}.mission{margin-bottom:18px}.mission .eyebrow{font-size:7px;margin:0 0 5px}.mission h3{font-size:11px;margin:0 0 5px}.mission p:last-child{max-width:100%;font-size:8px}.deploy-wrap{text-align:left}.deploy-button{width:100%;height:50px;font-size:15px}.deploy-wrap p{text-align:center;font-size:8px}.help-link{position:absolute;right:0;top:0;padding:0;font-size:9px}.orbit-hint{display:none}.battle-top{left:14px;right:14px;top:14px}.objective p{display:none}.objective .eyebrow{font-size:9px}.score{gap:10px}.score-line{width:65px}.score strong,.score .ally{font-size:20px}#timer{top:30px;font-size:10px}.vehicle-hud{left:14px;bottom:42px;width:143px;padding:10px}.vehicle-hud-heading{font-size:8px}#speed{font-size:12px}.health-value strong{font-size:21px}.health-value small{font-size:8px}.vehicle-diagram{height:34px}.modules{font-size:7px}.map-hud{width:135px;right:12px;bottom:15px}.map-caption{font-size:5px;letter-spacing:.05em;padding:5px}.map-coordinates{padding:4px;font-size:6px}.ammo-hud{bottom:30px;min-width:130px;padding:9px 10px 25px;gap:7px}.ammo-hud small{font-size:7px;left:15px}.ammo-reload{width:40px}.ammo-round{font-size:20px}.controls-hint{left:14px;bottom:14px;max-width:150px;line-height:1.7;font-size:7px}.controls-hint span{padding:0 3px}.notifications{left:14px;top:75px;width:190px}.notification{font-size:8px}.map-hud.expanded{width:min(280px,65vw)}.capture-hud{top:75px}.inspection-ui{left:20px;right:20px;bottom:20px}.inspection-ui h2{font-size:19px}dialog{padding:27px 23px}.reticle-left{right:22px}.reticle-right{left:22px}.hit-feedback{left:calc(50% + 40px)}.hit-feedback strong{font-size:21px}.mouse-hint{font-size:9px;padding:10px 15px}}
@media(pointer:coarse){.touch-controls{display:block}.battle .vehicle-hud{bottom:130px;width:140px}.battle .map-hud{bottom:115px;width:130px}.battle .ammo-hud{bottom:25px}.battle .controls-hint,.battle .mouse-hint{display:none!important}.spotted{top:17%}.battle .vehicle-diagram{display:none}.battle .modules{font-size:7px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}.notification{animation:none}.loading-icon{animation:none}}

.setting-row input[type="checkbox"]{width:18px;height:18px;accent-color:#abc399}.gun-marker.blocked{border-color:#dc987c;box-shadow:0 0 7px #dc987c99}

.career-wallet{display:grid;grid-template-columns:repeat(2,auto);gap:5px 18px;text-align:right;font-size:10px;color:var(--gold)}
.career-wallet strong{font-size:15px;font-weight:400;font-variant-numeric:tabular-nums}
.career-wallet small{grid-column:1/-1;font-size:8px;color:var(--dim)}
.garage-vehicle-actions{display:flex;gap:15px;align-items:center;flex-wrap:wrap}.garage-vehicle-actions .secondary-small{width:auto;margin:0;padding:10px 14px;font-size:10px}
#career-dialog{width:min(880px,calc(100% - 32px));padding:30px}.career-intro{font-size:11px;color:var(--dim);line-height:1.8;margin-top:-12px}
.research-wallet{display:flex;gap:24px;color:var(--gold);border-bottom:1px solid #95a57b33;padding:12px 0 18px;font-size:11px}.research-wallet strong{font-size:20px;font-weight:400;font-variant-numeric:tabular-nums}
.roster-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:20px 0}.roster-card{padding:17px;border:1px solid #8c9b7444;background:#07120d44;display:flex;flex-direction:column}
.roster-card.selected{border-color:var(--gold);background:#d4b3780b}.roster-card small{color:var(--gold);font-size:8px;letter-spacing:.14em}.roster-card h3{font-size:17px;font-weight:400;margin:11px 0}.roster-card p{font-size:10px;color:var(--dim);line-height:1.8;margin:0 0 10px}.roster-card .secondary-small{margin-top:auto;font-size:10px;line-height:1.7;padding:10px 6px}
button:disabled{cursor:default;opacity:.45}.roster-card.selected button:disabled{opacity:.8;color:var(--gold)}
.research-section{border-top:1px solid #95a57b33;padding-top:15px}.research-section h3{font-weight:400;margin:8px 0}.research-performance{font-size:11px;color:var(--gold);line-height:1.8}
.upgrade-list>div{display:flex;gap:15px;align-items:center;justify-content:space-between;padding:12px 0;border-bottom:1px solid #95a57b22}.upgrade-list strong{font-size:12px;font-weight:400}.upgrade-list small{display:block;font-size:10px;color:var(--dim);margin-top:5px}.upgrade-list button{width:auto;min-width:150px;max-width:55%;font-size:10px;line-height:1.6;margin:0;padding:10px}
.career-feedback{min-height:1.5em;color:var(--gold);font-size:11px;line-height:1.8}.career-record{font-size:10px;color:var(--dim)}
.result-rewards{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:0 0 15px}.result-rewards span{font-size:10px;color:var(--dim)}.result-rewards strong{display:block;font-size:22px;font-weight:400;color:var(--gold);margin-top:9px}.result-rewards small{width:100%;color:var(--dim);font-size:10px}
@media(max-width:700px){.career-wallet{gap:4px 9px;font-size:8px}.career-wallet strong{font-size:12px}.career-wallet small{max-width:165px;font-size:7px}.garage-vehicle-actions{gap:7px}.garage-vehicle-actions .secondary-small{font-size:9px;padding:8px 10px}#career-dialog{padding:26px 18px}.roster-grid{grid-template-columns:1fr}.roster-card{padding:14px}.roster-card p{margin-bottom:6px}.roster-card .secondary-small{margin-top:8px}.upgrade-list button{min-width:130px}.career-intro{font-size:10px}}

/* The workshop leaves the vehicle visible beside its editing panel. */
#career-dialog{width:min(690px,calc(100% - 32px));max-height:90vh;margin:5vh 3vw 5vh auto;padding:28px}
#career-dialog::backdrop{background:#06100a55;backdrop-filter:none}
#career-dialog h2{font-size:22px;letter-spacing:.04em;margin-bottom:23px}
.workshop-toolbar{position:sticky;top:-28px;z-index:2;display:flex;align-items:center;gap:16px;background:#172720;padding:12px 0;border-bottom:1px solid #d4b37855}
.workshop-toolbar .text-button{width:45%;font-size:10px}.workshop-toolbar .secondary-small{width:55%;font-size:11px;margin:0;padding:11px 8px}
.research-wallet{align-items:center;flex-wrap:wrap}.research-wallet .text-button{margin-left:auto;font-size:10px}
.workshop-section{border-top:1px solid #95a57b33;margin-top:19px;padding-top:17px}
.workshop-section summary{cursor:pointer;color:var(--gold);font-size:12px;padding:0 0 8px}
.workshop-guide{padding:15px;background:#d4b3780d;border-left:2px solid var(--gold);margin-top:18px;font-size:11px;line-height:1.8}
.workshop-guide strong{font-weight:400;color:var(--gold)}.workshop-guide p{color:var(--dim);margin:8px 0 0}.workshop-guide .text-button{padding-bottom:0}
.workshop-section label,.field-label{display:block;font-size:10px;color:var(--dim);line-height:1.6}
.workshop-section input,.workshop-section select,#mission-select{width:100%;background:#0f1d18;color:var(--ink);border:1px solid #8f9e7555;padding:10px 12px;font-size:11px;min-width:0;margin-top:5px;border-radius:2px}
.workshop-section input:focus-visible,.workshop-section select:focus-visible,#mission-select:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.design-identity{display:grid;grid-template-columns:2fr 1.2fr .8fr;gap:10px;margin-top:14px}.design-actions{display:flex;gap:10px}
.design-actions .secondary-small{width:50%;font-size:11px}.assembly-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}
.assembly-status{font-size:10px;line-height:1.8;color:var(--gold);padding:10px 12px;background:#13251b;border:1px solid #8f9e7533}
.comparison-table{border-collapse:collapse;width:100%;font-size:10px;font-variant-numeric:tabular-nums}
.comparison-table th{text-align:right;font-weight:400;color:var(--gold);border-bottom:1px solid #8f9e7555;padding:8px 5px}
.comparison-table th:first-child,.comparison-table td:first-child{text-align:left}.comparison-table td{padding:8px 5px;text-align:right;border-bottom:1px solid #8f9e7522;white-space:nowrap}
.comparison-table td:last-child{color:var(--gold)}.part-catalog{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.part-card{border:1px solid #8f9e7533;padding:13px;background:#07120d55;display:flex;flex-direction:column}.part-card.equipped{border-color:#d4b37877}
.part-card strong{font-size:11px;font-weight:400;color:var(--ink)}.part-card p{font-size:10px;line-height:1.8;color:var(--dim);margin:8px 0}
.part-card small{color:var(--gold);font-size:9px;margin-top:auto}.part-card .secondary-small{font-size:10px;margin:10px 0 0;padding:9px}
.garage-ui select{pointer-events:auto}#mission-select{margin:0 0 10px;padding:8px 10px;max-width:300px;font-size:10px}
.mission .eyebrow{display:block;margin-bottom:6px}.mission h3{margin-bottom:6px}#mission-objective,#mission-details{font-size:10px;line-height:1.7;color:var(--dim);max-width:390px;margin:4px 0}
.training-panel{position:absolute;left:30px;top:92px;width:min(350px,calc(100% - 50px));padding:18px;background:#10201de8;border-left:2px solid var(--gold);pointer-events:auto}
.training-panel .eyebrow{margin-bottom:10px;font-size:9px}.training-guide{font-size:10px;line-height:1.8;color:var(--dim)}#training-status{white-space:pre-wrap;font:11px/1.8 monospace;color:var(--ink);min-height:70px;margin:10px 0}
.training-actions{display:flex;gap:8px}.training-actions button{font-size:10px;padding:10px 8px;width:50%;margin:4px 0}
.battle-module-status{position:absolute;left:30px;bottom:272px;max-width:250px;white-space:pre-line;font-size:10px;line-height:1.9;color:#e8c299;background:#12221dd9;padding:8px 12px}
.battle-module-status:empty{display:none}.result-analysis{text-align:left;font-size:11px;line-height:1.9;color:var(--dim);white-space:pre-line;margin:0 0 20px;border-left:2px solid var(--gold);padding-left:12px}
.damage-diagram .damage-outline{stroke:#b4c6a888;fill:#90ab7b0b}
.damage-diagram .damage-zone{fill:#9cb28a26;stroke:#adca9699;stroke-width:1.1;transition:fill .12s,stroke .12s}
.damage-diagram .damage-zone[data-state="worn"]{fill:#d1b46666;stroke:#ebd190}
.damage-diagram .damage-zone[data-state="damaged"]{fill:#d78d3e99;stroke:#f0bd75}
.damage-diagram .damage-zone[data-state="broken"]{fill:#b64d43bb;stroke:#f89a7c;stroke-dasharray:2 1}
.capture-hud.overrun{color:#e7a08a}.capture-hud.overrun i{background:#d47361}
.enemy-label.reported .enemy-diamond{color:#e8c27a}.enemy-label.reported small{color:#e8c27a}
.lead-marker{position:absolute;transform:translate(-50%,-50%);pointer-events:none;text-align:center;color:#e8c27a;font-size:8px;white-space:nowrap}.lead-marker i{display:block;width:14px;height:14px;margin:0 auto 2px;border:1px dashed #e8c27acc;border-radius:50%}
.damage-diagram .damage-structure{stroke:#b4c6a855;stroke-dasharray:2 1.5;fill:none}
.damage-diagram .damage-arc{fill:#e8c27a1c;stroke:#e8c27a66;stroke-width:.8}
.vehicle-traits{display:flex;flex-wrap:wrap;gap:5px;margin:0 0 4px}.vehicle-traits span{font-size:9px;letter-spacing:.04em;color:#e2d3ac;border:1px solid #c9ab7766;background:#151f1a99;padding:3px 6px;line-height:1.3}.vehicle-panel p.vehicle-traits{font-size:9px;line-height:1.3}
.damage-diagram .damage-labels{fill:#c0cfb7;stroke:none;font-size:9px}.damage-diagram .damage-key{fill:#cfb580;font-size:8px}
.modules button:disabled{cursor:default;color:#a8b69e;opacity:.7}
.battle-module-status{max-width:250px;max-height:190px;overflow:hidden;line-height:1.65}
@media(max-width:1100px){#career-dialog{width:min(620px,calc(100% - 32px));margin:5vh 2vw 5vh auto}.garage-footer{grid-template-columns:1fr auto auto;gap:20px}.mission{gap:10px}.vehicle-panel h2{font-size:28px}}
@media(max-width:700px){#career-dialog{width:calc(100% - 24px);margin:3vh auto;max-height:94vh;padding:24px 18px}#career-dialog h2{font-size:19px}.design-identity{grid-template-columns:1fr 1fr}.design-identity label:first-child{grid-column:1/-1}.part-catalog{grid-template-columns:1fr 1fr}.part-card{padding:10px}.comparison-table{font-size:9px}.comparison-table td,.comparison-table th{padding:7px 3px}.assembly-grid{gap:9px}.garage-title{top:15%}.garage-title h1{font-size:52px}.vehicle-panel{bottom:250px;right:20px;max-width:195px}.garage-footer{bottom:18px}.mission{margin-bottom:13px}#mission-select{max-width:calc(100vw - 130px);margin-bottom:6px}#mission-name{display:none}#mission-details{font-size:8px;max-width:100%;line-height:1.5}#mission-objective{font-size:9px;line-height:1.5}.mission .eyebrow{font-size:7px}.training-panel{top:70px;left:14px;width:270px;padding:12px}.training-guide{font-size:9px}#training-status{font-size:10px}.battle-module-status{left:14px;bottom:215px;font-size:8px;max-width:175px}}
@media(max-height:600px) and (min-width:701px){.garage-title{top:17%}.garage-title h1{font-size:62px}.tagline{font-size:10px;margin-top:17px}.vehicle-panel{top:20%;max-width:245px}.vehicle-panel h2{font-size:24px;margin-bottom:10px}.vehicle-specs{margin:10px 0}.garage-footer{bottom:20px}#mission-details{max-width:360px;font-size:8px}.orbit-hint{display:none}}
@media(max-width:700px) and (max-height:600px){.garage-title{display:none}.vehicle-panel{top:76px;bottom:auto;left:23px;right:23px;max-width:none;display:grid;grid-template-columns:1fr 1fr;column-gap:14px}.vehicle-panel>.eyebrow{grid-column:1;margin:0}.vehicle-panel h2{grid-column:1;font-size:19px;margin:4px 0 9px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.vehicle-panel .vehicle-specs{grid-column:2;grid-row:1/3;margin:0;padding:7px 0;gap:8px;justify-content:space-between}.vehicle-panel .vehicle-specs strong{font-size:12px}.vehicle-panel .vehicle-specs small{font-size:7px}.garage-vehicle-actions{grid-column:1/-1;gap:7px}.garage-vehicle-actions .secondary-small{font-size:9px;padding:8px}.garage-footer{bottom:14px}#mission-details{display:none}.training-panel{max-height:calc(100vh - 165px);overflow:auto}.training-actions{position:sticky;bottom:-12px;background:#10201d;padding-top:6px}}
/* v0.6 legibility pass: enemy labels, objective and spotted text must read over bright sky and snow. */
.enemy-label{font-size:12px;font-weight:600;color:#ffc4b2;text-shadow:0 0 3px #000,0 1px 2px #000}
.enemy-label .enemy-name{display:inline-block;background:#0a120ec4;padding:2px 7px;border-radius:2px}
.enemy-label small{font-size:11px;color:#ffd6c4;background:#0a120ec4;padding:1px 5px;border-radius:2px}
.enemy-label .enemy-diamond{font-size:19px;text-shadow:0 0 4px #000}
.enemy-label .enemy-health{height:4px;width:72px}
.objective .eyebrow,.objective p{text-shadow:0 1px 3px #000,0 0 6px #000a}
.objective p{font-size:12px;color:#e3e8dc}
.spotted{text-shadow:0 0 4px #000,0 1px 2px #000;font-size:12px}
.score-line i{height:5px}
.score-line i.ally{background:#8cab94}
.score-line i.enemy{background:#d27367}
.score-line i.down{background:transparent;box-shadow:inset 0 0 0 1px #c9d1c0aa;opacity:.7}
/* Proving ground: the panel owns the top-left, so notices move right; the match score means nothing here. */
body.training .notifications{left:auto;right:30px}
body.training .score .score-line,body.training .score .ally,body.training .score strong{display:none}
.training-panel{z-index:3}
/* Hit direction: an arc on the side the shot came from. Red when it cost HP, pale when blocked. */
.hit-directions{position:absolute;inset:0;pointer-events:none}
.hit-directions i{--hit-color:#ef5a3f;position:absolute;left:50%;top:50%;width:250px;height:250px;border-radius:50%;opacity:0;background:conic-gradient(from -28deg,var(--hit-color) 0deg 56deg,transparent 56deg);-webkit-mask:radial-gradient(circle,transparent 63%,#000 64%,#000 69%,transparent 70%);mask:radial-gradient(circle,transparent 63%,#000 64%,#000 69%,transparent 70%);filter:drop-shadow(0 0 3px #000)}
.hit-directions i.blocked{--hit-color:#e8dcc0}
.hit-directions i.visible{animation:hit-direction 2.4s ease-out forwards}
@keyframes hit-direction{0%{opacity:1}65%{opacity:.85}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.hit-directions i.visible{animation-duration:3s}}
/* Dialog actions stay reachable: on short screens the body scrolls under a pinned button row. */
dialog .dialog-actions{position:sticky;bottom:-38px;margin:0 -38px -38px;padding:4px 38px 26px;background:linear-gradient(180deg,#0e1b1900,#0f1c1af2 22%,#0e1b19)}
dialog .dialog-actions .primary-small{margin-top:14px}
#result-dialog .dialog-actions .text-button{margin:10px auto 0}
@media (max-width:700px){dialog .dialog-actions{bottom:-27px;margin:0 -23px -27px;padding:4px 23px 18px}}
/* Short desktop screens: the ammo block sat over the player's own hull. */
@media (min-width:900px) and (max-height:820px){.ammo-hud{left:270px;transform:none;bottom:30px}}
/* Penetration is the strongest confirmation: larger, hot-coloured number with a brief pop. */
.hit-feedback strong,.hit-feedback span{text-shadow:0 1px 3px #000,0 0 6px #000a}
.hit-feedback.penetration strong{color:#ff8a5c;font-size:30px;font-weight:600}
.hit-feedback.penetration.visible strong{animation:hit-pop .28s ease-out}
@keyframes hit-pop{0%{transform:scale(1.35)}100%{transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.hit-feedback.penetration.visible strong{animation:none}}
/* Workshop part buttons: owned / affordable / short of funds read differently at a glance. */
.part-card .secondary-small.affordable{background:#c9ab77;color:#18241b;border-color:#c9ab77;font-weight:bold}
.part-card .secondary-small.affordable:hover{background:#dfc293}
.part-card .secondary-small.owned{background:transparent;border-color:#8cab9455;color:#a9c4ad;opacity:1}
.part-card .secondary-small.short{color:#c9b8a0;border-style:dashed;opacity:.8}
/* Settings v0.6: grouped sections, live values, key bindings. */
.settings-section{margin:22px 0 0;font-size:10px;letter-spacing:.18em;color:var(--gold);text-align:left}
.setting-control{display:flex;align-items:center;gap:10px}
.setting-control output{min-width:44px;text-align:right;font:11px monospace;color:#d7e3ca}
.keybind-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 18px;padding:12px 0 4px}
.keybind-row{display:flex;align-items:center;justify-content:space-between;font-size:11px;gap:10px}
.keybind{min-width:86px;padding:6px 10px;border:1px solid #b6c1b355;background:#17211a;color:#e6ecdc;font:11px Arial,sans-serif;cursor:pointer}
.keybind:hover,.keybind:focus-visible{border-color:var(--gold)}
.keybind.listening{border-color:var(--gold);color:var(--gold);animation:keybind-blink 1s steps(2) infinite}
@keyframes keybind-blink{50%{opacity:.55}}
.keybind-footer{display:flex;align-items:center;justify-content:space-between;gap:12px}
.keybind-footer .guide-note{margin:6px 0;text-align:left}
#settings-dialog{width:min(560px,calc(100% - 32px))}
@media (max-width:700px){.keybind-list{grid-template-columns:1fr}}
/* Colour-vision palette: friendly blue, enemy orange; shapes (hollow segments, diamonds) carry state too. */
html.palette-blue-orange .score .ally{color:#6fb3e8}
html.palette-blue-orange .score strong{color:#f2a33a}
html.palette-blue-orange .score-line i.ally{background:#6fb3e8}
html.palette-blue-orange .score-line i.enemy{background:#f2a33a}
html.palette-blue-orange .score-line i.down{background:transparent}
html.palette-blue-orange .enemy-label{color:#ffd08a}
html.palette-blue-orange .enemy-label .enemy-diamond{color:#f2a33a}
html.palette-blue-orange .enemy-label .enemy-health i{background:#f2a33a}
html.palette-blue-orange .enemy-label small{color:#ffe0b0}
#timer{white-space:nowrap}
.tutorial-panel{position:absolute;left:30px;top:92px;width:min(380px,calc(100% - 50px));padding:16px 18px 14px;background:#10201de8;border-left:2px solid #f1d06a;pointer-events:none}
.tutorial-panel .eyebrow{font-size:9px;color:#f1d06a;margin-bottom:6px}.tutorial-panel h3{font-size:17px;margin:0 0 6px;letter-spacing:.06em}.tutorial-panel p#tutorial-text{font-size:12px;line-height:1.75;color:var(--ink);margin:0}
.tutorial-bar{height:3px;background:#ffffff1a;margin-top:12px}.tutorial-bar i{display:block;height:100%;width:0;background:#f1d06a;transition:width .4s}
.campaign-progress{font-size:10px;color:var(--dim);margin:2px 0 6px;letter-spacing:.04em}
.result-unlocks{margin:10px 0 0;padding:10px 12px;border-left:2px solid #f1d06a;background:#f1d06a14;font-size:12px;line-height:1.7;white-space:pre-line}
@media(max-width:700px){.tutorial-panel{top:70px;left:14px;width:270px;padding:12px}.tutorial-panel h3{font-size:14px}.tutorial-panel p#tutorial-text{font-size:10px}}
#briefing-dialog{width:min(1040px,calc(100% - 32px));text-align:left;padding:26px 28px}
#briefing-dialog h2{margin:2px 0 14px;font-size:24px;letter-spacing:.08em}
.briefing-body{display:grid;grid-template-columns:minmax(0,520px) minmax(0,1fr);gap:22px;align-items:start}
#briefing-map{width:100%;aspect-ratio:1;border:1px solid #95a57b55;background:#18241f;image-rendering:auto}
.briefing-text h3{font-size:11px;letter-spacing:.14em;color:var(--gold);margin:14px 0 5px;font-weight:600}
.briefing-text p,.briefing-text li{font-size:13px;line-height:1.75;color:var(--ink);margin:0}
.briefing-text ul,.briefing-text ol{margin:0;padding-left:1.2em}
#briefing-stars{list-style:none;padding:0}#briefing-stars li{color:var(--dim)}
.difficulty-row{display:flex;gap:8px;flex-wrap:wrap}.difficulty-row button.selected{background:var(--gold);color:#16201c;border-color:var(--gold)}
.briefing-note{font-size:11px!important;color:var(--dim)!important;margin-top:6px!important}
.briefing-legend{font-size:11px!important;color:var(--dim)!important;margin-top:12px!important}.legend-route{color:#f1d06a}.legend-enemy{color:#e0806a}
#briefing-dialog .dialog-actions{display:flex;gap:16px;align-items:center;justify-content:flex-end;margin-top:18px}
.result-stars-count{font-size:22px;letter-spacing:.12em;color:var(--gold);margin:6px 0 4px}
.result-stars{list-style:none;padding:0;margin:0 auto 10px;display:inline-block;text-align:left}.result-stars li{font-size:12px;line-height:1.8;color:var(--dim)}.result-stars li.met{color:var(--gold)}
@media(max-width:820px){.briefing-body{grid-template-columns:1fr}#briefing-map{max-width:420px}}

/* v1.1 title screen and save slots: drawn over the slowly orbiting garage scene. */
.title-screen{position:absolute;inset:0;z-index:20;display:flex;align-items:stretch;background:linear-gradient(90deg,#0b1411f2 0,#0b1411d9 34%,#0b141155 62%,transparent 80%),linear-gradient(0deg,#08100dcc,transparent 30%)}
.title-inner{width:min(560px,100%);padding:clamp(28px,7vh,80px) 0 34px clamp(24px,6vw,92px);display:flex;flex-direction:column;overflow:auto}
.title-brand h1{font-family:Impact,"Arial Narrow",Arial,sans-serif;font-size:clamp(58px,8vw,118px);font-weight:900;line-height:.86;margin:14px 0 18px;letter-spacing:.02em;text-shadow:0 2px 24px #0008}
.title-brand h1 span{display:block;color:var(--gold)}
.title-tagline{font-size:13px;letter-spacing:.18em;color:#cfd5c6;margin:0 0 clamp(22px,5vh,48px)}
.title-slots-label{margin-bottom:12px}
.title-slots{display:flex;flex-direction:column;gap:10px}
.slot-card{position:relative;padding:14px 16px 12px;border:1px solid #8c9b7444;border-left:2px solid #8c9b7488;background:#0a1511cc;transition:border-color .2s,background .2s}
.slot-card:hover{border-color:#d4b37877;background:#101d18e6}
.slot-card.last-played{border-left-color:var(--gold)}
.slot-card.last-played .slot-number::after{content:"前回の記録";margin-left:10px;padding:2px 6px;border:1px solid #d4b37866;color:var(--gold);font-size:8px;letter-spacing:.1em}
.slot-card.empty h3{color:var(--dim)}
.slot-card.confirming{border-color:var(--red)}
.slot-head{display:flex;justify-content:space-between;align-items:center;font-size:9px;letter-spacing:.16em;color:var(--gold)}
.slot-head small{color:var(--dim);letter-spacing:.04em}
.slot-card h3{font-size:15px;font-weight:400;margin:8px 0 5px;letter-spacing:.03em}
.slot-card p{font-size:10px;color:var(--dim);margin:0;line-height:1.7}
.slot-actions{display:flex;align-items:center;gap:18px;margin-top:9px}
.slot-play{background:linear-gradient(135deg,#b89863,#debc83);color:#162019;font-weight:bold;letter-spacing:.12em;font-size:12px;padding:9px 18px;display:flex;gap:16px;align-items:center}
.slot-play:hover:not(:disabled){filter:brightness(1.12)}
.slot-play span{font-weight:400;font-size:16px}
.slot-delete{padding:6px 0;font-size:10px;color:#b9a79b}
.slot-card.confirming .slot-delete{color:var(--red)}
.title-footer{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:auto;padding-top:26px}
.title-footer small{font-size:9px;color:var(--dim)}.title-version{margin-left:auto;padding-right:20px;letter-spacing:.14em}
.title-link span{margin-left:8px}
.title .orbit-hint{display:none}
@media(max-width:700px){.title-screen{background:linear-gradient(0deg,#0b1411f5 0,#0b1411e6 55%,#0b141188)}.title-inner{padding:24px 16px}.title-brand h1{font-size:54px}.title-tagline{font-size:10px;letter-spacing:.08em}.slot-card h3{font-size:13px}.title-version{padding-right:0}}
@media(max-height:820px){.title-inner{padding-top:28px;padding-bottom:20px}.title-brand h1{font-size:clamp(40px,8vh,64px);margin:8px 0 10px;white-space:nowrap}.title-brand h1 span{display:inline;margin-left:.18em}.title-tagline{margin-bottom:16px}.slot-card{padding:10px 14px 9px}.slot-card h3{margin:5px 0 3px;font-size:14px}.slot-actions{margin-top:6px}.slot-play{padding:7px 16px}.title-slots{gap:8px}.title-footer{padding-top:14px}}
.difficulty-row button{flex:1 1 0;width:auto;margin:0;padding:9px 6px;font-size:12px}
@media(max-height:820px) and (min-width:821px){#briefing-dialog{max-height:94vh;padding:18px 24px}#briefing-dialog h2{margin-bottom:8px;font-size:21px}.briefing-body{grid-template-columns:minmax(0,min(440px,62vh)) minmax(0,1fr);gap:18px}.briefing-text p,.briefing-text li{font-size:12px;line-height:1.6}.briefing-text h3{margin:9px 0 4px}#briefing-dialog .dialog-actions{margin-top:10px}}
#briefing-dialog .dialog-actions .primary-small{width:auto;min-width:240px;margin:0}#briefing-dialog .dialog-actions .text-button{margin:0}

/* ======================================================================================================
   v1.1.1 UI polish: one type scale, resolution-aware HUD, readable minimums, consistent controls,
   short eased transitions, dialogs whose action bar never covers their content.
   ====================================================================================================== */
:root{--hud:1;--ease:cubic-bezier(.2,.7,.2,1)}
html,body{font-family:"Segoe UI","Yu Gothic UI","Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP","Yu Gothic",Meiryo,Arial,sans-serif}
#hp,#speed,#timer,#range-text,#reload-text,#enemy-count,.score .ally,#capture-percent,#ammo-count,.career-wallet strong,.research-wallet strong,.result-stats strong,.result-rewards strong,.vehicle-specs strong,#position-text{font-variant-numeric:tabular-nums}
button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.primary-small,.secondary-small,.slot-play,.deploy-button,.icon-button,.text-button{transition:background-color .15s var(--ease),border-color .15s var(--ease),color .15s var(--ease),filter .15s var(--ease),transform .15s var(--ease)}
.primary-small:active,.secondary-small:active,.slot-play:active,.deploy-button:active{transform:translateY(1px)}
.secondary-small:hover:not(:disabled){border-color:#d4b37899;background:#d4b37812}
button:disabled{cursor:not-allowed}

/* Selects: one custom control everywhere (no platform default arrows). */
#mission-select,.workshop-section select,.setting-row select,#design-select,#design-compare{appearance:none;-webkit-appearance:none;padding-right:32px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23d4b378' stroke-width='1.6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 11px center;background-color:#0f1d18;border:1px solid #8f9e7566;border-radius:2px;color:var(--ink);cursor:pointer}
#mission-select:hover,.workshop-section select:hover,.setting-row select:hover{border-color:#d4b37899}
select option{background:#13211c;color:var(--ink)}

/* Dialogs: a short rise-in; the sticky action bar sits on an opaque base and content keeps clear of it. */
dialog[open]{animation:dialog-in .22s var(--ease) both}
dialog::backdrop{animation:backdrop-in .22s ease both}
@keyframes dialog-in{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
@keyframes backdrop-in{from{opacity:0}to{opacity:1}}
dialog .dialog-actions{background:linear-gradient(180deg,#0f1c1a00,#0f1c1af7 18px,#0e1b19);padding-top:22px;box-shadow:0 -1px 0 #95a57b22}
.title-screen:not([hidden]){animation:backdrop-in .35s ease both}
.title-screen .slot-card{animation:slot-in .4s var(--ease) both}
.title-screen .slot-card:nth-child(2){animation-delay:.05s}.title-screen .slot-card:nth-child(3){animation-delay:.1s}
@keyframes slot-in{from{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:none}}

/* Result screen: fits 720p without scrolling; rewards are tiles, never hidden by the buttons. */
#result-dialog{width:min(640px,calc(100% - 32px));padding:30px 36px 0;max-height:94vh}
#result-dialog h2{font-size:34px;margin:6px 0 10px;letter-spacing:.3em}
#result-desc{margin:0 0 6px}
.result-stars-count{font-size:28px;margin:4px 0 2px;letter-spacing:.18em}
.result-stars{margin:0 auto 6px}.result-stars li{font-size:13px;line-height:1.75}
.result-stats{padding:12px 0;margin:12px 0}
.result-stats small{font-size:11px;letter-spacing:.06em}
.result-stats strong{font-size:28px;margin-top:6px}
.result-analysis{font-size:12px;margin:0 0 10px}
.result-rewards{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:0 0 8px;text-align:left}
.result-rewards span{background:#d4b3780d;border:1px solid #d4b37833;padding:10px 14px;font-size:11px;letter-spacing:.04em}
.result-rewards strong{font-size:24px;margin-top:4px}
.result-rewards small{grid-column:1/-1;font-size:11px;line-height:1.6}
.result-unlocks{text-align:left;margin:4px 0 0}
#result-dialog .dialog-actions{display:flex;gap:14px;align-items:center;justify-content:center;margin-top:8px;padding-bottom:22px}
#result-dialog .dialog-actions .primary-small{width:auto;min-width:220px;margin:0}
#result-dialog .dialog-actions .text-button{margin:0}
#result-dialog.win h2{color:#f1dfb4;text-shadow:0 0 24px #d4b37855}
#result-dialog.lose h2{color:#e8b0a4}
.result-stars-count .star{display:inline-block;animation:star-in .45s var(--ease) both}
.result-stars-count .star.on{color:var(--gold);text-shadow:0 0 14px #d4b37899}.result-stars-count .star.off{color:#6d7a6c}
.result-stars-count .star:nth-child(2){animation-delay:.12s}.result-stars-count .star:nth-child(3){animation-delay:.24s}
@keyframes star-in{from{opacity:0;transform:scale(1.8)}to{opacity:1;transform:none}}
#pause-dialog{width:min(420px,calc(100% - 32px))}

/* Garage: the title screen owns the big logo now; the mission becomes a card beside the deploy button. */
.garage-title{display:none}
.garage-footer .mission{align-items:flex-start;background:linear-gradient(110deg,#0b1612e6,#0b161299);border:1px solid #8c9b7433;border-left:2px solid var(--gold);padding:16px 18px 14px;max-width:470px}
.garage-footer .mission .eyebrow{font-size:11px;margin-bottom:8px}
.garage-footer #mission-select{font-size:13px;padding:9px 32px 9px 12px;margin:0 0 8px}
.campaign-progress{font-size:11px!important;color:#c9b88d!important;margin:0 0 10px!important}
.garage-footer .mission h3{font-size:22px;letter-spacing:.06em;margin:0 0 6px}
#mission-objective{font-size:13px;color:#e3e8dc;margin:0 0 6px;line-height:1.6}
.mission p:last-child,#mission-details{font-size:12px!important;line-height:1.7;color:#b9c3b2}
.mission-icon{margin-top:6px}
.deploy-wrap p{font-size:11px}
.career-wallet small{font-size:10px}
.vehicle-panel .eyebrow{font-size:11px}
.vehicle-panel p:not(.eyebrow){font-size:13px}
.vehicle-specs small{font-size:11px}
.garage-vehicle-actions{display:grid;grid-template-columns:1fr;gap:8px;max-width:240px}
.garage-vehicle-actions .secondary-small,.garage-vehicle-actions .text-button{width:100%;margin:0;padding:11px 14px;font-size:12px;text-align:left;display:flex;justify-content:space-between;align-items:center;background:#0e1a16b3;border:1px solid #a4b59344}
.garage-vehicle-actions .text-button span{margin-left:12px}
.garage-vehicle-actions #career-open{border-color:#d4b37877;color:#f1e3c0}
.help-link{font-size:12px}
.orbit-hint{font-size:11px}

/* Battle HUD: readable minimums at 720p, scaled up with the screen height (see --hud in app.js). */
.objective,.score,#timer,#pause-button,.vehicle-hud,.ammo-hud,.map-hud,.notifications,.controls-hint,.capture-hud,.battle-module-status,.tutorial-panel,.training-panel{scale:var(--hud)}
.objective{transform-origin:top left}.score,#timer{transform-origin:left top}#pause-button{transform-origin:top right}
.battle-module-status{bottom:calc(296px * var(--hud))}
.vehicle-hud,.controls-hint,.battle-module-status{transform-origin:left bottom}
.map-hud{transform-origin:right bottom}.ammo-hud{transform-origin:left bottom}
.notifications,.training-panel,.tutorial-panel{transform-origin:left top}.capture-hud{transform-origin:left top}
.objective .eyebrow{font-size:13px}.objective p{font-size:13px}
#timer{font-size:15px;top:44px}
.capture-hud{top:96px;width:300px;font-size:12px;letter-spacing:.06em}.capture-hud div{width:110px;height:4px}
.vehicle-hud-heading{font-size:12px}#speed{font-size:19px}#speed small{font-size:10px}
.modules{font-size:11px}.modules button{font-size:11px}
.vehicle-diagram{height:72px}
.damage-diagram .damage-labels{font-size:11px}
.ammo-hud strong{font-size:16px}.ammo-hud div>span,#ammo-count{font-size:11px}
.ammo-hud small{font-size:11px;bottom:7px}
.map-caption{font-size:10px;letter-spacing:.12em;padding:9px 11px}
.map-coordinates{font-size:10px}
.controls-hint{font-size:11px}
.notification{font-size:12px;padding:10px 14px}
.range-text{font-size:12px}.reload-text{font-size:11px}
.battle-module-status{font-size:12px}
.enemy-label small{font-size:11px}
.hit-feedback strong{font-size:28px;font-weight:600;text-shadow:0 0 10px #000a}.hit-feedback span{font-size:12px}
@media(max-height:600px){.vehicle-diagram{height:54px}}
.dialog-close:focus-visible{outline:1px solid #d4b37866;outline-offset:-6px}
.result-stars-count small{font-size:12px;letter-spacing:.06em;color:var(--dim)}
#result-dialog .dialog-actions{margin:8px -36px 0;bottom:0}
.primary-small:focus-visible,.slot-play:focus-visible,.deploy-button:focus-visible{outline:1px solid #f4e7c8b8;outline-offset:4px}
.vehicle-hud{width:248px}.vehicle-hud-heading{gap:12px;align-items:baseline}.vehicle-hud-heading #battle-vehicle-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.damage-diagram .damage-key{font-size:10px}
.capture-hud{color:#f1dfb4;text-shadow:0 1px 3px #000,0 0 8px #000b}
.result-stats strong,.vehicle-specs strong{font-family:inherit;font-weight:300;letter-spacing:.01em}
.dialog-close:focus-visible{outline:none;color:var(--gold);text-shadow:0 0 8px #d4b37899}
.garage-vehicle-actions{grid-template-columns:1fr 1fr;max-width:260px}
.garage-vehicle-actions #career-open{grid-column:1/-1}
.garage-vehicle-actions .text-button,.garage-vehicle-actions #trial-open{font-size:11px;padding:10px 12px}
.career-wallet small{text-shadow:0 1px 3px #000,0 0 6px #000a}
.vehicle-panel{top:27%}
/* v1.1.2 less text: hide what the player does not need right now; details move to hover titles or appear only when relevant */
#garage-vehicle-description:empty,#deploy-note:empty,#career-save-status:empty,#mission-details:empty,.slot-card p:empty,.roster-card p:empty,#design-comparison-name:empty,#research-performance:empty,.part-card small:empty,#bind-status:empty,#result-save-status:empty,#reward-note:empty,#title-status:empty{display:none}
#mission-details{display:inline-block;margin-top:6px!important;padding:3px 8px;border:1px solid #c9ab7766;color:#e2c995!important;font-size:12px!important;line-height:1.5!important}
.part-card p{display:none}
.damage-diagram .damage-labels{display:none}
.vehicle-hud{width:248px}
.vehicle-hud .health-value,.vehicle-hud .health-track,.vehicle-hud .modules{margin-right:70px}
.vehicle-hud .vehicle-diagram{position:absolute;right:12px;top:42px;width:62px;height:auto;bottom:10px;margin:0}
.vehicle-hud.all-ok .modules{display:none}
.ammo-hud small{display:none}
.ammo-hud{padding-bottom:14px}
.battle .controls-hint{animation:hint-out .8s ease 12s forwards}
@keyframes hint-out{to{opacity:0;visibility:hidden}}
.training-panel pre{margin-top:4px}
#workshop-guide p{margin:6px 0}
.training-panel>.eyebrow{display:none}
.training-panel pre{margin:0 0 4px}
.enemy-label small:empty{display:none}
#training-status{min-height:0;margin:0 0 10px}
/* v1.1.3 tutorial waypoint pointer: a gold diamond with the distance over the mark, an arrow on the screen edge when the mark is out of view */
.waypoint-marker{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:2px;color:#f6cd55;text-shadow:0 0 6px #000,0 1px 2px #000;pointer-events:none;z-index:2;scale:var(--hud)}
.waypoint-marker b{font-size:24px;line-height:1;animation:waypoint-bob 1.2s ease-in-out infinite alternate}
.waypoint-marker span{font:600 13px/1 "Segoe UI","Yu Gothic UI",sans-serif;background:#0a120ed0;padding:3px 7px;border:1px solid #f6cd5588;border-radius:2px;font-variant-numeric:tabular-nums}
.waypoint-marker i{display:none;width:22px;height:28px;font-size:0;background:#f6cd55;clip-path:polygon(50% 0,100% 100%,50% 74%,0 100%);filter:drop-shadow(0 0 3px #000)}
.waypoint-marker.edge b{display:none}
.waypoint-marker.edge i{display:block}
@keyframes waypoint-bob{to{transform:translateY(-5px)}}
/* v1.1.3 practice targets (tutorial): grey-white labels, unlike enemies */
.enemy-label.practice{color:#e6e9e1}
.enemy-label.practice .enemy-diamond{color:#c9cfc4}
.enemy-label.practice .enemy-name{background:#1b2420d0;border:1px solid #c9cfc466}
.enemy-label.practice .enemy-health i{background:#c9cfc4}
.enemy-label.practice .enemy-health{background:#2a302cd0}
/* v1.2 tech: loading progress, later-download indicator, other-tab notice, WebGL context loss, gamepad help */
.loading-bar{width:min(280px,60vw);height:3px;background:#2f3a33;overflow:hidden}
.loading-bar i{display:block;height:100%;width:0;background:var(--gold);transition:width .2s ease-out}
#loading-percent{font-size:12px;letter-spacing:.1em;color:#c9cfc4;font-variant-numeric:tabular-nums}
.asset-progress{position:fixed;top:14px;left:50%;transform:translateX(-50%);z-index:60;display:flex;align-items:center;gap:8px;padding:6px 12px;background:#0d1714e6;border:1px solid #c9ab7755;color:#d8dccf;font-size:12px;pointer-events:none;font-variant-numeric:tabular-nums}
.asset-progress i{display:block;width:90px;height:3px;background:#2f3a33}.asset-progress b{display:block;height:100%;width:0;background:var(--gold)}
.asset-progress.nudge{animation:asset-nudge .5s ease}
@keyframes asset-nudge{30%{transform:translateX(calc(-50% - 6px))}60%{transform:translateX(calc(-50% + 6px))}}
.sync-notice{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);z-index:60;padding:9px 14px;background:#0d1714f0;border-left:2px solid var(--gold);color:#e6e9e1;font-size:12px}
.context-overlay{position:fixed;inset:0;z-index:120;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;background:#0b1210e8;color:#e6e9e1;text-align:center;padding:24px}
.context-overlay p{font-size:15px;max-width:480px;line-height:1.7}.context-overlay button{max-width:220px}
.help-gamepad{display:none;margin-top:14px}body.gamepad .help-gamepad{display:block}
/* ======================================================================================================
   v1.2: workshop tabs and part effects, first-run title, objective/practice markers, large-screen scale,
   compact result, and the small-screen layouts restored (the v1.1.1 polish came later in this file and
   overrode the older ≤1000/≤700px rules, so phones and short screens overlapped). Keep this block last.
   ====================================================================================================== */
/* Workshop: four tabs instead of one long scroll; each part card says what it changes in one line. */
.workshop-tabs{display:flex;gap:4px;margin:16px 0 0;border-bottom:1px solid #95a57b44}
.workshop-tab{flex:1 1 0;background:transparent;border:1px solid transparent;border-bottom:0;padding:10px 6px 9px;font-size:12px;letter-spacing:.06em;color:var(--dim)}
.workshop-tab:hover{color:var(--ink)}
.workshop-tab.selected{color:var(--gold);background:#d4b3780f;border-color:#95a57b44;box-shadow:inset 0 2px 0 var(--gold)}
.workshop-pane>.workshop-section:first-child,.workshop-pane>.workshop-guide+.workshop-section,.workshop-pane>.workshop-guide[hidden]+.workshop-section{border-top:0;margin-top:14px}
.workshop-pane>.research-section{margin-top:18px}
.part-effect{display:block;font-style:normal;font-size:11px;line-height:1.55;color:#e8cf9b;margin:6px 0 4px;font-variant-numeric:tabular-nums}
.part-effect:empty{display:none}
.roster-card p[id^="roster-description-"]{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:11px;line-height:1.6;color:var(--dim)}
/* Battle labels and markers: mission objectives carry a gold tag. */
.enemy-label.objective .enemy-diamond{color:#f1c64a}
.enemy-label.objective .enemy-name::before{content:"目標";margin-right:6px;padding:0 5px;border-radius:2px;background:#f1c64a;color:#1a1408;font-size:10px;font-weight:700;letter-spacing:.06em}
/* First run: slot 1 is the one obvious way in. */
.title-screen.first-run #slot-card-1{border-left-color:var(--gold);background:#101d18eb}
.title-screen.first-run .slot-card:not(#slot-card-1){opacity:.62}
.title-screen.first-run .slot-card:not(#slot-card-1) .slot-play{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px #8c9b7488}
/* The ammo block sits beside the vehicle panel on short desktop screens (it overlapped it by a few pixels). */
@media (min-width:900px) and (max-height:820px){.ammo-hud{left:calc(30px + 260px * var(--hud))}}
/* Large screens: the garage, title and dialogs grow with the screen like the battle HUD does. */
@media (min-width:2000px) and (min-height:1250px){.title-inner,.garage-header,.vehicle-panel,.garage-footer,.inspection-ui,dialog{zoom:1.33}}
@media (min-width:3000px) and (min-height:1800px){.title-inner,.garage-header,.vehicle-panel,.garage-footer,.inspection-ui,dialog{zoom:1.8}}
/* Result: everything fits without scrolling on short screens. */
@media (max-height:640px){
  #result-dialog{padding:14px 24px 0;max-height:96vh}
  #result-eyebrow{display:none}
  #result-dialog h2{font-size:26px;margin:0 0 2px}
  #result-desc{font-size:12px;margin:0 0 2px}
  .result-stars-count{font-size:20px;margin:0}
  .result-stars li{font-size:11px;line-height:1.5}
  .result-stats{padding:6px 0;margin:6px 0}
  .result-stats small{font-size:10px}
  .result-stats strong{font-size:20px;margin-top:2px}
  .result-analysis{font-size:11px;margin:0 0 6px}
  .result-rewards{gap:8px;padding:0 0 4px}
  .result-rewards span{padding:6px 10px;font-size:10px}
  .result-rewards strong{font-size:18px;margin-top:1px}
  .result-rewards small{font-size:10px}
  .result-unlocks{padding:6px 10px;font-size:11px;line-height:1.5}
  #result-dialog .dialog-actions{margin:4px -24px 0;padding-top:10px;padding-bottom:12px}
  #result-dialog .dialog-actions .primary-small{padding:10px 20px;min-width:180px}
}
@media (max-height:480px) and (min-width:640px){
  #result-dialog{width:min(860px,calc(100% - 24px))}
  #result-dialog[open]{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);column-gap:22px;grid-auto-flow:row dense;align-items:start}
  #result-eyebrow,#result-title,#result-desc,#result-stars-count,#result-stars{grid-column:1}
  #result-dialog>.result-stats,#result-analysis,#result-dialog>.result-rewards,#result-unlocks,#result-save-status{grid-column:2}
  #result-dialog>.result-stats{margin-top:0}
  #result-dialog .dialog-actions{grid-column:1/-1}
}
/* Short landscape screens (phones on their side, small laptops): garage panels stack without touching. */
@media (max-height:500px) and (min-width:701px){
  .garage-header{top:12px}
  .vehicle-panel{top:58px;right:24px;max-width:320px}
  .vehicle-panel .eyebrow{margin-bottom:2px}
  .vehicle-panel h2{font-size:22px;margin:2px 0 6px}
  .vehicle-traits,#garage-vehicle-description{display:none}
  .vehicle-specs{margin:4px 0 8px;padding:6px 0;gap:18px}
  .vehicle-specs small{margin-bottom:3px}
  .vehicle-specs strong{font-size:16px}
  .garage-vehicle-actions{grid-template-columns:repeat(3,auto);max-width:none;gap:6px}
  .garage-vehicle-actions #career-open{grid-column:auto}
  .garage-vehicle-actions .secondary-small,.garage-vehicle-actions .text-button,.garage-vehicle-actions #trial-open{padding:8px 10px;font-size:11px}
  .garage-footer{left:20px;right:20px;bottom:12px;gap:14px}
  .garage-footer .mission{padding:10px 14px 9px;max-width:440px}
  .garage-footer .mission .eyebrow{margin-bottom:4px}
  .garage-footer #mission-select{margin:0 0 4px;padding:6px 30px 6px 10px}
  .campaign-progress{margin:0 0 4px!important}
  .garage-footer .mission h3{font-size:17px;margin:0 0 2px}
  #mission-objective{font-size:12px;line-height:1.45;margin:0 0 2px}
  .deploy-button{width:180px;height:50px;font-size:17px}
  /* Title: three slots side by side, all reachable. */
  .title-inner{width:min(900px,100%);padding:16px 24px 12px}
  .title-brand h1{font-size:40px;margin:0 0 4px}
  .title-tagline{margin-bottom:10px}
  .title-slots{flex-direction:row;gap:8px}
  .title-slots .slot-card{flex:1 1 0;min-width:0}
  .slot-card h3{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .slot-card p{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .title-footer{padding-top:10px}
  /* Battle: the proving-ground/tutorial panel keeps above the vehicle panel. */
  .training-panel,.tutorial-panel{top:58px;max-height:calc(100vh - 70px - 150px * var(--hud));overflow:auto}
}
/* Narrow portrait screens. */
@media (max-width:700px){
  .help-link{position:static;display:block;margin:8px 0 0 auto;width:max-content;padding:4px 0}
  .garage-footer .mission{max-width:none}
  .title-inner{width:100%}
  .notifications{left:14px;top:calc(96px + 40px * var(--hud));width:220px}
  .capture-hud{left:50%;width:min(300px,calc(100vw - 28px))}
}
/* Touch screens: the drive pad owns the bottom-left and the fire buttons the bottom-right, so the vehicle panel,
   minimap and ammo block move clear of them. */
@media (pointer:coarse){
  .battle .vehicle-hud{bottom:118px;width:248px}
  .battle .vehicle-hud .health-value,.battle .vehicle-hud .health-track,.battle .vehicle-hud .modules{margin-right:0}
  .battle .ammo-hud{left:auto;right:14px;transform:none;bottom:108px;min-width:0;transform-origin:right bottom}
  .battle .map-hud{bottom:auto;top:62px;right:14px;transform-origin:right top}
  .battle #pause-button{transform-origin:top right}
}
@media (pointer:coarse) and (max-height:500px){
  .battle .vehicle-hud{left:auto;right:14px;bottom:102px;transform-origin:right bottom}
  .battle .ammo-hud{right:auto;left:170px;bottom:16px;transform-origin:left bottom}
  .battle .map-hud{top:58px}
  .battle .map-hud .map-coordinates{display:none}
  .training-panel,.tutorial-panel{max-height:calc(100vh - 70px - 120px);overflow:auto}
}
/* Labels near the screen edge must never widen the page (on phones that zooms the whole interface out). */
.battle-hud,.garage-ui,.title-screen{overflow:hidden}
.map-caption #map-caption-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
/* Short screens: dialogs drop the eyebrow and tighten so the content is not hidden behind the pinned buttons. */
@media (max-height:500px){
  dialog{padding:16px 22px}
  dialog>.eyebrow{display:none}
  dialog h2{font-size:20px;margin:2px 0 10px}
  .dialog-close{top:6px;right:10px}
  dialog .dialog-actions{bottom:-16px;margin:0 -22px -16px;padding:10px 22px 12px}
  dialog .dialog-actions .primary-small{padding:9px 20px;margin-top:4px}
  .setting-row{padding:9px 0}
}
/* Help: two more rows (wheel, F) — tighter rows keep the whole manual on a 720p screen. */
#help-dialog{padding-top:28px}#help-dialog .control-table>div{padding:5px 0}#help-dialog .control-table kbd{padding:4px 5px}
#help-dialog h2{margin-bottom:14px}
#help-dialog .guide-note{margin:14px 0 4px}
/* v1.2.1 loading screen: step counter, detail line (MB / count and elapsed time), moving bar until the first number */
.loading-step{font-size:11px;letter-spacing:.24em;color:var(--gold)}
.loading-detail{min-height:1.4em;font-size:12px;letter-spacing:.06em;color:#aeb8a8;font-variant-numeric:tabular-nums}
#loading-percent{font-size:15px;color:#e6e9e1}
.loading-bar.indeterminate i{width:30%!important;animation:loading-sweep 1.4s ease-in-out infinite}
@keyframes loading-sweep{from{transform:translateX(-100%)}to{transform:translateX(340%)}}
.soil-status{margin:5px 0 7px;color:#d6bd8a;font-size:11px;line-height:1.4;letter-spacing:.03em}
.soil-status[data-state="bogged"]{color:#e3ad83}

.weather-status{display:block;margin-top:4px;color:#adbfc7;font-size:11px;letter-spacing:.04em}.weather-status[data-state="rain"]{color:#bdcbd4}.briefing-text .setting-row{margin-top:12px}
.wading-status{margin:5px 0 7px;color:#a9c6ca;font-size:11px;line-height:1.45;letter-spacing:.02em}
.wading-status[data-state="danger"],.wading-status[data-state="flooding"]{color:#e0bd82}
.wading-status[data-state="stalled"]{color:#ed9c83}
.river-status{display:block;margin-top:3px;color:#b6cbd0;font-size:11px;letter-spacing:.03em}
.river-status[data-state="flood"],.wading-status[data-current="swept"]{color:#edb181}
.river-status[data-state="falling"]{color:#a8c5ba}