:root{color-scheme:dark;--ink:#101a16;--ink2:#17221c;--paper:#eeeada;--muted:#a9b3a3;--line:#374337;--gold:#e7b762;--orange:#ed7344;--mint:#72d5c1;--mono:ui-monospace,SFMono-Regular,Consolas,monospace}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--ink);color:var(--paper);font-family:Arial,Helvetica,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:wait;opacity:.62}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:2px solid var(--mint);outline-offset:4px}button:hover:not(:disabled){filter:brightness(1.12)}a{color:inherit;text-decoration:none}button{border:0;background:none}button,select{touch-action:manipulation}kbd{display:inline-block;font:10px var(--mono);padding:3px 5px;border:1px solid var(--line);border-radius:2px} [hidden]{display:none!important}
#citadel{position:relative;width:100%;height:100svh;height:100dvh;min-height:320px;background:radial-gradient(ellipse at 78% 34%,var(--ink2) 0,transparent 65%),var(--ink);overflow:hidden}#field{position:absolute;inset:70px -20px 40px 35%;touch-action:none}#scene,#tactical{position:absolute;width:100%;height:100%;display:block;outline-offset:-3px}#tactical{pointer-events:none}.field-vignette{position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 -40px 60px -30px var(--ink)}.masthead{position:absolute;top:max(26px,env(safe-area-inset-top));left:4.5%;right:4.5%;display:flex;align-items:center;justify-content:space-between;z-index:12}.brand{font-size:19px;letter-spacing:-.8px;color:#b7c0ae}.brand b{color:var(--paper)}.brand span{font:8px var(--mono);letter-spacing:2.4px;border-left:1px solid var(--line);margin-left:12px;padding-left:12px;color:var(--gold)}.mast-right{display:flex;align-items:center;gap:25px}.signal{font:9px var(--mono);letter-spacing:2.2px;color:var(--muted)}.signal i,.small-dot{display:inline-block;width:5px;height:5px;margin-right:12px;border-radius:50%;background:var(--mint);box-shadow:0 0 10px #72d5c140}.icon-button{width:42px;height:42px;border:1px solid var(--line);background:#1a231bdd;font-size:24px;display:grid;place-items:center}.screen{position:absolute;inset:0;z-index:3}.menu-screen{pointer-events:none}.title-copy{position:absolute;left:4.5%;top:15%;width:33%;max-width:460px}.eyebrow{font:700 9px var(--mono);letter-spacing:2px;color:var(--gold);line-height:1.7;margin:0 0 15px}.eyebrow span{font-size:20px;margin-right:12px;vertical-align:middle}h1{font-size:clamp(76px,8.8vw,150px);font-weight:900;letter-spacing:-.068em;line-height:.86;margin:0 0 23px}.period{color:var(--orange)}.title-rule{display:flex;align-items:center;gap:20px;margin-bottom:26px}.title-rule h2{font-size:16px;letter-spacing:5px;color:var(--orange);white-space:nowrap;margin:0}.title-rule span{height:1px;background:var(--line);flex:1}.title-rule b{border:1px solid var(--line);padding:4px;font:9px var(--mono);color:var(--muted)}.manifesto{font-size:20px;line-height:1.36;color:var(--muted);margin:0 0 10px}.manifesto strong{color:var(--paper);font-weight:400}.intro-copy{font-size:12px;line-height:1.7;color:var(--muted);margin:0}.launch-panel{pointer-events:auto;position:absolute;bottom:13%;left:4.5%;width:min(390px,33%);border:1px solid var(--line);border-top:2px solid var(--orange);padding:17px;background:#121e18e8;box-shadow:0 16px 35px #08100933}.panel-overline,.panel-footer{display:flex;justify-content:space-between;gap:10px;font:8px var(--mono);letter-spacing:1px;color:var(--muted)}#load-status{color:var(--mint);text-align:right;letter-spacing:.3px}.mode-tabs{display:grid;grid-template-columns:1fr 1fr;margin-top:14px;border-bottom:1px solid var(--line);gap:2px}.mode-tabs button{text-align:left;padding:10px 9px 12px;border-bottom:2px solid transparent;color:var(--muted)}.mode-tabs button[aria-selected=true]{background:#202b20aa;border-color:var(--orange);color:var(--paper)}.mode-tabs strong{display:block;font:700 10px var(--mono);letter-spacing:.6px}.mode-tabs small{display:block;font-size:10px;margin-top:5px;color:var(--muted)}.operation-row{display:flex;align-items:center;justify-content:space-between;margin:16px 0 13px}.micro{font:8px var(--mono);letter-spacing:1.1px;color:var(--muted);line-height:1.5}.operation-row h3{font-size:20px;margin:6px 0 0}.text-button{font-size:11px;padding:8px;color:var(--muted)}.text-button span{color:var(--orange);margin-left:7px}.primary{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:50px;width:100%;background:var(--orange);color:#111c16;font-weight:700;text-align:left;padding:15px 18px;border-bottom:3px solid #ffc18d}.primary b{font-size:22px}.panel-footer{margin-top:13px}.load-line{height:2px;background:#3b4738;margin-top:3px}.load-line i{display:block;height:100%;width:0;background:var(--mint);transition:width .2s}.model-caption{position:absolute;right:16%;bottom:16%;display:flex;gap:13px;align-items:center;color:var(--gold);text-shadow:0 2px 10px #000}.crosshair{font-size:26px}.model-caption b{display:block;font:10px var(--mono);letter-spacing:2px}.model-caption small{display:block;font:8px var(--mono);letter-spacing:1.2px;margin-top:7px;color:var(--muted)}.menu-footer{position:absolute;bottom:max(28px,env(safe-area-inset-bottom));left:4.5%;right:4.5%;display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding-top:20px;z-index:8}.menu-footer nav{display:flex;gap:20px}.menu-footer button{font-size:10px;color:var(--muted);padding:3px 0}.menu-footer button:hover{color:var(--paper)}
#citadel[data-view=game] #field{inset:94px 24px 66px 242px}#citadel[data-view=game] .masthead{display:none}.hud-top{position:absolute;top:max(22px,env(safe-area-inset-top));left:28px;right:28px;height:49px;display:grid;grid-template-columns:205px 1fr 148px 42px;gap:30px;align-items:center;z-index:4}.hud-operation strong{display:block;letter-spacing:2px;font-size:13px;margin-top:6px}.hud-wave{text-align:center;font:10px var(--mono);letter-spacing:2px;max-width:350px;width:100%;justify-self:center}.wave-line{height:3px;background:var(--line);margin-top:12px}.wave-line i{display:block;height:100%;background:var(--gold);width:5%;transition:width .2s}.core-health>span{font:8px var(--mono);letter-spacing:1px}.core-health>div{display:flex;gap:5px;margin-top:9px}.core-health i{height:9px;width:34px;display:block;background:var(--mint);box-shadow:0 0 12px #72d5c119}.core-health i.empty{background:#343e33;box-shadow:none}.core-health.danger i:not(.empty){background:var(--orange)}.command-strip{position:absolute;top:116px;bottom:96px;left:28px;width:181px;border-top:1px solid var(--line);z-index:4}.strip-title{font:8px var(--mono);letter-spacing:1.1px;padding:14px 0;color:var(--muted);display:flex;justify-content:space-between;align-items:center}.strip-title i{display:block;width:5px;height:5px;background:var(--mint);border-radius:50%}.score-block{margin:17px 0 30px}.score-block>span{font:9px var(--mono);letter-spacing:2px;color:var(--gold)}.score-block>strong{display:block;font-size:37px;letter-spacing:-1.5px;line-height:1.5;font-variant-numeric:tabular-nums}.score-block>small{font:8px var(--mono);letter-spacing:1px;color:var(--gold)}.pilot-block{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:20px 0}.pilot-block>span{font:10px var(--mono);letter-spacing:1px}.pilot-block>span b{float:right;color:var(--gold)}#hull-pips{display:flex;gap:5px;margin:14px 0 9px}#hull-pips i{display:block;width:33px;height:5px;background:var(--gold)}#hull-pips i.empty{background:var(--line)}.pilot-block small{font:8px var(--mono);color:var(--muted);letter-spacing:1px}.field-facts{margin:20px 0;display:flex;justify-content:space-between}.field-facts div span{display:block;font:8px var(--mono);color:var(--muted);letter-spacing:1px;margin-bottom:6px}.field-facts b{font:18px var(--mono)}.fortify-info{border-top:1px solid var(--line);padding-top:19px}.fortify-info>span{font:8px var(--mono);color:var(--gold);letter-spacing:1px}.fortify-info h3{letter-spacing:4px;font-size:19px;margin:9px 0}.fortify-info p{font-size:11px;line-height:1.7;color:var(--muted)}.charge-track{height:4px;background:var(--line);margin:15px 0 9px}.charge-track i{display:block;width:40%;height:100%;background:var(--mint)}.fortify-info>strong{display:block;font:9px var(--mono);color:var(--mint);letter-spacing:1px}.fortify-info small{display:block;color:var(--muted);font:8px var(--mono);margin-top:14px}.support-brief{margin-top:16px;padding-top:14px;border-top:1px solid #37433799}.support-brief>span{font:8px var(--mono);color:var(--mint);letter-spacing:1px}.support-brief h4{margin:7px 0 5px;font:700 11px var(--mono);letter-spacing:1.2px;color:var(--paper)}.support-brief p{margin:0;font-size:9px;line-height:1.45}.support-track{height:3px;background:var(--line);margin:9px 0 7px}.support-track i{display:block;width:45%;height:100%;background:var(--gold)}.support-brief>strong{display:block;font:8px var(--mono);color:var(--gold);letter-spacing:.6px}.support-brief small{margin-top:8px}.battle-footer{position:absolute;left:28px;right:28px;bottom:25px;display:flex;align-items:center;justify-content:space-between;font:9px var(--mono);letter-spacing:1px;color:var(--muted);padding-top:17px;border-top:1px solid var(--line);z-index:4}.battle-footer span:last-child{font-size:9px;letter-spacing:0;color:#7c8b7c}.mobile-status{display:none}.power-status{position:absolute;left:260px;bottom:75px;font:9px var(--mono);letter-spacing:1px;color:var(--mint);z-index:5}.boss-warning{position:absolute;top:84px;left:50%;transform:translateX(-50%);font:10px var(--mono);letter-spacing:1.5px;color:var(--orange);z-index:5;white-space:nowrap}.boss-warning span{color:var(--muted);font-size:9px;margin-left:15px;letter-spacing:0}.overlay-screen{z-index:15;background:#0b140ecc;backdrop-filter:blur(7px);display:flex;align-items:center;justify-content:center;padding:22px;overflow:auto}.dispatch-card{width:410px;max-width:100%;padding:31px;border:1px solid var(--line);border-top:2px solid var(--gold);background:var(--ink2);box-shadow:0 30px 80px #0007}.dispatch-card h2,.armory-copy h2{font-size:clamp(48px,5vw,67px);font-weight:900;letter-spacing:-3px;line-height:.91;margin:15px 0 22px}.dispatch-card h2 span,.armory-copy h2 span{color:var(--orange)}.dispatch-card>p{font-size:13px;line-height:1.6;color:var(--muted)}.dispatch-card .primary{margin-top:24px}.button-row{display:flex;gap:8px;margin:10px 0}.secondary{border:1px solid var(--line);background:#202d23;display:block;padding:13px;min-height:43px;font-size:11px;text-align:center;flex:1}.dispatch-card>.text-button{display:block;margin:15px auto 0}.result-card{width:490px}.result-card h2{font-size:50px;margin-bottom:12px}.result-overline{display:flex;justify-content:space-between;align-items:center}.result-overline .eyebrow{margin:0}.medals{font-size:19px;letter-spacing:3px;color:var(--gold)}.result-score{display:flex;align-items:baseline;gap:13px}.result-score strong{font-size:48px;letter-spacing:-2px;line-height:1.2}.result-score>span{font:9px var(--mono);letter-spacing:2px;color:var(--muted)}.result-stats{display:grid;grid-template-columns:1fr 1fr;gap:16px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 0;margin:18px 0}.result-stats b{display:block;font:18px var(--mono);margin-bottom:6px}.result-stats span{font:8px var(--mono);letter-spacing:1px;color:var(--muted)}.dispatch-card .micro{font:8px var(--mono)}.result-card .primary{margin-top:16px}.score-nudge{display:block;color:var(--mint);font-size:11px;line-height:1.5;margin:12px 0}.armory-copy{position:absolute;left:5%;top:23%;width:31%;max-width:380px}.armory-copy h2{font-size:72px}.armory-copy h3{letter-spacing:5px;font-size:21px;color:var(--gold);margin:30px 0 10px}.armory-copy>p:not(.eyebrow):not(.micro){font-size:14px;line-height:1.6;color:var(--muted)}.armory-tabs{display:flex;flex-wrap:wrap;gap:3px;border-bottom:1px solid var(--line);margin-top:28px}.armory-tabs button{font:9px var(--mono);letter-spacing:.7px;padding:11px 8px;border:1px solid transparent;border-bottom:2px solid transparent;flex:1 1 31%;min-width:92px}.armory-tabs button[data-enemy]{flex-basis:100%;color:var(--muted);border-top-color:var(--line)}.armory-tabs button[aria-pressed=true]{border-color:var(--orange);color:var(--gold);background:#1d2c22}.armory-copy dl{margin:24px 0}.armory-copy dl div{display:flex;justify-content:space-between;gap:10px;font:9px var(--mono);padding:10px 0;border-bottom:1px solid var(--line)}.armory-copy dt{color:var(--muted)}.armory-copy dd{margin:0;text-align:right}.armory-copy .micro{margin-top:18px;font-size:7px}.armory-screen{pointer-events:none}.armory-copy{pointer-events:auto}#citadel[data-view=armory] #field{left:37%;right:0;top:90px;bottom:90px}#citadel[data-view=armory] #scene{cursor:grab}#toast{position:absolute;z-index:20;bottom:11%;left:50%;transform:translate(-50%,10px);pointer-events:none;padding:12px 21px;border:1px solid #a88a4c;background:#1b241cdd;color:var(--gold);font:10px var(--mono);letter-spacing:1.3px;text-align:center;opacity:0;transition:opacity .15s,transform .15s}#toast.show{opacity:1;transform:translate(-50%,0)}
dialog{background:var(--ink2);background:color-mix(in srgb,var(--ink2) 95%,transparent);color:var(--paper);border:1px solid var(--line);border-top:2px solid var(--gold);width:min(690px,92vw);max-height:88dvh;padding:25px;box-shadow:0 25px 80px #0009;overflow:auto;overscroll-behavior:contain}dialog::backdrop{background:#09110bc9;backdrop-filter:blur(7px)}.dialog-heading{display:flex;justify-content:space-between;align-items:center}.dialog-heading .eyebrow{margin:0}dialog h2{font-size:35px;letter-spacing:-1px;margin:8px 0 22px}.operations-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.operations-grid button{padding:15px 10px;border:1px solid var(--line);background:#202d24;min-height:98px;text-align:left}.operations-grid button:disabled{opacity:.4;cursor:not-allowed}.operations-grid button.selected{border-color:var(--orange)}.operations-grid small{display:block;font:8px var(--mono);color:var(--gold);letter-spacing:1px}.operations-grid strong{display:block;font-size:12px;line-height:1.3;margin:10px 0}.operations-grid em{font-size:10px;font-style:normal;letter-spacing:2px;color:var(--gold)}.setting-row{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding:14px 0;gap:12px}.setting-row strong,.setting-row b{font-size:13px}.setting-row small{display:block;font-size:10px;line-height:1.5;color:var(--muted);margin-top:4px}.setting-row button,.setting-row select{border:1px solid var(--line);background:#24362a;color:var(--paper);padding:9px 13px;min-width:82px;font:10px var(--mono)}.setting-row button[aria-pressed=true]{color:var(--mint);border-color:#487e64}.manual-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.manual-grid h3{font:11px var(--mono);letter-spacing:1px;color:var(--gold)}.manual-grid p{font-size:12px;line-height:1.7;color:var(--muted);margin-top:7px}.manual-note{font-size:12px;line-height:1.7;color:var(--muted);padding-top:15px;border-top:1px solid var(--line)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.no-script{position:absolute;inset:0;z-index:100;background:var(--ink);display:grid;place-content:center;font-size:18px;gap:20px}
#touch-controls{display:none;position:absolute;left:0;right:0;bottom:0;height:175px;z-index:10;pointer-events:none;user-select:none;-webkit-user-select:none}.movement-control{position:absolute;left:26px;bottom:max(19px,env(safe-area-inset-bottom));text-align:center}.movement-control>.micro{font-size:8px;display:block;margin-top:9px;letter-spacing:2px}#joystick{position:relative;width:112px;height:112px;border:1px solid #63765d73;border-radius:50%;background:radial-gradient(circle,#32403166 0,transparent 66%),#121f1770;pointer-events:auto;touch-action:none;box-shadow:inset 0 0 0 12px #43543a18}#joystick>span{position:absolute;font-size:13px;color:#839675;pointer-events:none}.pad-n{left:50%;top:8px;transform:translateX(-50%)}.pad-s{left:50%;bottom:8px;transform:translateX(-50%)}.pad-e{right:9px;top:50%;transform:translateY(-50%)}.pad-w{left:9px;top:50%;transform:translateY(-50%)}#joystick-thumb{position:absolute;width:42px;height:42px;left:34px;top:34px;border-radius:50%;border:1px solid #a4b59877;background:linear-gradient(135deg,#55634b,#2f3d2b);box-shadow:0 4px 14px #0007;pointer-events:none}.action-controls{position:absolute;right:28px;bottom:max(18px,env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:center;gap:10px;pointer-events:auto}#fire{width:100px;height:100px;border:2px solid #eb9b61;border-radius:50%;background:radial-gradient(circle at 40% 25%,#ee8656,#b9472f);box-shadow:0 0 0 7px #d8873b0d,inset 0 -7px 12px #74251377;color:#fff0cc;touch-action:none;padding:14px;display:flex;flex-direction:column;align-items:center;justify-content:center}#fire svg{height:51px;width:51px}#fire>b{font:700 10px var(--mono);letter-spacing:2px;margin-top:3px}#fire.pressed{transform:scale(.95);filter:brightness(1.25)}#fortify{border:1px solid #52745c;background:#152b20;padding:9px 10px;font:8px var(--mono);letter-spacing:.6px;min-width:107px;color:var(--mint);touch-action:none}#fortify>span{font-size:12px}#fortify b{display:inline-block;margin-left:5px}#fortify.ready{background:#c0dd9e;color:#17281c;border-color:#d6f2b3}#fortify.pressed{filter:brightness(1.4)}.support-stack{display:flex;flex-direction:column;gap:7px}.support-stack>button{width:100%}#support{border:1px solid #4e776f;background:#102923;padding:9px 10px;font:8px var(--mono);letter-spacing:.6px;min-width:107px;color:var(--mint);touch-action:none}#support>span{font-size:12px}#support b{display:inline-block;margin-left:5px}#support.ready{background:#9eddd2;color:#10251f;border-color:#cef8ef;box-shadow:0 0 18px #72d5c128}#support.pressed{filter:brightness(1.4)}.left-handed .movement-control{left:auto;right:26px}.left-handed .action-controls{right:auto;left:28px}
@media(max-height:790px) and (min-width:901px){.title-copy{top:15%}h1{font-size:clamp(76px,7.5vw,104px)}.title-rule{margin-bottom:15px}.manifesto{font-size:18px}.intro-copy{display:none}.launch-panel{bottom:13%;padding:13px}.menu-footer{bottom:22px;padding-top:14px}.model-caption{bottom:13%}.score-block{margin:8px 0 17px}.pilot-block{padding:13px 0}.field-facts{margin:15px 0}.fortify-info{padding-top:12px}.fortify-info>p,#support-copy{display:none}.support-brief{margin-top:10px;padding-top:10px}.armory-copy{top:18%}.armory-copy h2{font-size:58px}}
@media(max-width:1100px) and (min-width:901px){.title-copy{width:35%}h1{font-size:102px}.title-rule h2{font-size:13px;letter-spacing:3px}.manifesto{font-size:18px}.launch-panel{width:36%}.intro-copy{display:none}.menu-footer nav{gap:13px}.menu-footer>.micro{letter-spacing:.2px}}
@media(pointer:coarse),(max-width:900px){#touch-controls:not([hidden]){display:block}.keyboard-hint{display:none}}
@media(max-width:900px){.masthead{top:max(15px,env(safe-area-inset-top));left:21px;right:21px}.brand{font-size:16px}.brand span{font-size:6px;letter-spacing:1.7px;margin-left:9px;padding-left:9px}.mast-right{gap:12px}.signal{font-size:7px;letter-spacing:1px}.icon-button{height:36px;width:36px;font-size:22px}.title-copy{left:24px;top:96px;width:45%}.title-copy .eyebrow{font-size:7px;letter-spacing:1px}.eyebrow span{margin-right:5px;font-size:16px}h1{font-size:98px}.title-rule{margin-top:14px;gap:10px}.title-rule h2{font-size:13px;letter-spacing:3px}.manifesto{font-size:17px}.intro-copy{font-size:11px}.launch-panel{left:24px;width:45%;bottom:105px;padding:14px}.menu-footer{left:24px;right:24px;bottom:26px;display:block;padding-top:17px}.menu-footer nav{justify-content:space-between;gap:9px;margin-top:14px}.menu-footer nav button{font-size:10px}.menu-footer>.micro{font-size:7px;letter-spacing:.9px}#field{left:36%;top:110px;bottom:110px;right:-40px}.model-caption{display:none}#citadel[data-view=game] #field{inset:100px 9px 170px}.command-strip{display:none}.hud-top{top:max(12px,env(safe-area-inset-top));left:15px;right:15px;height:45px;grid-template-columns:1fr 1fr 100px 36px;gap:10px}.hud-operation strong{font-size:10px;letter-spacing:1px;margin-top:5px}.hud-operation .micro{font-size:7px;letter-spacing:.7px}.hud-wave{font-size:8px;letter-spacing:1px}.wave-line{margin-top:8px}.core-health>span{font-size:6px;letter-spacing:.8px}.core-health i{width:25px;height:7px}.core-health>div{margin-top:7px;gap:4px}.mobile-status{display:flex;position:absolute;top:70px;left:17px;right:17px;justify-content:space-between;border-top:1px solid var(--line);padding-top:10px;font:8px var(--mono);letter-spacing:1px;color:var(--muted)}.mobile-status span:first-child{color:var(--gold)}.battle-footer{left:18px;right:18px;bottom:165px;text-align:center;justify-content:center;font-size:7px;letter-spacing:1px;border:0;padding:0}.battle-footer span:last-child{display:none}.power-status{left:50%;transform:translateX(-50%);bottom:146px;font-size:8px;white-space:nowrap}.boss-warning{top:96px;font-size:8px}.boss-warning span{display:none}.armory-copy{left:25px;top:110px;width:42%}.armory-copy h2{font-size:59px}.armory-copy dl div{font-size:8px}.armory-copy h3{font-size:18px}.armory-copy>p:not(.eyebrow):not(.micro){font-size:12px}#citadel[data-view=armory] #field{left:42%;top:150px;bottom:140px}#toast{bottom:27%;font-size:9px;max-width:87vw;white-space:nowrap}.dispatch-card{padding:25px}.result-card{width:450px}.result-card h2{font-size:44px}.result-score strong{font-size:42px}}
@media(max-width:600px) and (orientation:portrait){.signal{display:none}.title-copy{left:25px;top:87px;width:calc(100% - 50px)}.title-copy .eyebrow{font-size:7px;margin-bottom:11px;letter-spacing:1.2px}h1{font-size:76px;line-height:.91;margin-bottom:13px}h1 br{display:none}h1 br:after{content:' '}.title-rule{margin:0;gap:15px}.title-rule h2{font-size:11px;letter-spacing:3.6px}.title-rule b{font-size:8px}.intro-copy{display:none}#field{inset:180px -17px 272px}.launch-panel{left:22px;right:22px;width:auto;bottom:90px;padding:13px 14px}.panel-overline{font-size:7px}.mode-tabs{margin-top:10px}.mode-tabs button{padding:9px 8px}.mode-tabs strong{font-size:9px}.mode-tabs small{font-size:9px}.operation-row{margin:11px 0}.operation-row h3{font-size:18px;margin-top:4px}.operation-row .micro{font-size:7px}.primary{min-height:47px;padding:11px 14px;font-size:13px}.panel-footer{font-size:7px;margin-top:10px}.menu-footer{left:23px;right:23px;bottom:max(21px,env(safe-area-inset-bottom));padding-top:11px}.menu-footer>.micro{font-size:6px;letter-spacing:.8px}.menu-footer nav{margin-top:12px;gap:12px}.menu-footer nav button{font-size:9px}.armory-copy{left:24px;right:24px;top:80px;width:auto}.armory-copy h2{font-size:48px;margin:0 0 15px}.armory-copy h2 br{display:none}.armory-copy .eyebrow{font-size:7px}.armory-tabs{margin-top:18px;max-width:290px}.armory-copy h3{margin-top:265px;font-size:19px}.armory-copy>p:not(.eyebrow):not(.micro){margin-top:8px;font-size:12px;max-width:350px}.armory-copy dl{margin:10px 0}.armory-copy dl div{padding:7px 0}.armory-copy .micro{font-size:6px;letter-spacing:.5px}.armory-copy .secondary{max-width:100%;padding:11px}#citadel[data-view=armory] #field{inset:200px 0 auto;height:245px}.hud-top{grid-template-columns:1fr 93px 80px 32px;gap:7px}.hud-top .icon-button{height:32px;width:32px}.hud-wave{font-size:7px;letter-spacing:.8px}.hud-operation strong{font-size:9px;letter-spacing:.5px}.core-health>span{font-size:6px;letter-spacing:.3px}.core-health i{width:21px;height:6px}.mobile-status{font-size:7px;letter-spacing:.35px;top:68px}.battle-footer{font-size:6px;letter-spacing:.55px}.operations-grid{grid-template-columns:repeat(3,1fr);gap:7px}.operations-grid button{padding:11px 8px;min-height:88px}.operations-grid strong{font-size:10px}.operations-grid small{font-size:6px;letter-spacing:.5px}dialog{padding:20px}dialog h2{font-size:31px}.manual-grid{gap:12px}.manual-grid p{font-size:11px}.manual-grid h3{font-size:9px}.dispatch-card{padding:23px}.result-stats{gap:13px;margin:14px 0;padding:15px 0}.result-stats span{font-size:7px}.dispatch-card h2{font-size:49px}.result-card h2{font-size:43px}.result-card>p{font-size:12px}.result-score strong{font-size:39px}.result-card .primary{margin-top:11px}.button-row .secondary{font-size:10px;min-height:41px}.result-overline .eyebrow{font-size:7px;letter-spacing:1px}.medals{font-size:16px}.overlay-screen{padding:18px}}
@media(max-width:600px) and (max-height:735px) and (orientation:portrait){.title-copy{top:74px}.title-copy .eyebrow{margin-bottom:8px;font-size:6px}h1{font-size:65px}.title-rule h2{font-size:10px}#field{top:148px;bottom:266px}.launch-panel{bottom:85px;padding:10px 13px}.mode-tabs button{padding:7px}.mode-tabs small{font-size:8px}.mode-tabs{margin-top:7px}.panel-footer{margin-top:8px}.operation-row{margin:9px 0}.menu-footer{bottom:17px}.armory-copy{top:76px}.armory-copy h2{font-size:39px}.armory-copy h3{margin-top:216px}.armory-copy dl div{padding:5px 0}#citadel[data-view=armory] #field{top:173px;height:200px}.armory-copy .micro{margin-top:9px}.armory-copy>p:not(.eyebrow):not(.micro){font-size:10px}.dispatch-card{padding:19px}.dispatch-card h2{font-size:44px}.result-card h2{font-size:36px;margin-top:13px}.result-score strong{font-size:34px}.result-stats{margin:12px 0;padding:12px 0;gap:10px}.result-stats b{font-size:15px}.result-stats span{font-size:6px}.result-card>p{margin:9px 0;font-size:11px}.score-nudge{font-size:10px}.result-card .micro{font-size:7px}#citadel[data-view=game] #field{inset:95px 5px 163px}.movement-control{left:22px;bottom:15px}#joystick{width:100px;height:100px}#joystick-thumb{left:28px;top:28px}.action-controls{right:23px;bottom:15px}#fire{width:88px;height:88px}#fire svg{width:44px;height:44px}#fortify{padding:8px}#touch-controls{height:160px}.battle-footer{bottom:155px}.power-status{bottom:138px}}
@media(max-height:540px) and (orientation:landscape){.masthead{top:12px;left:23px;right:23px}.masthead .brand{font-size:14px}.mast-right .signal{display:none}.masthead .icon-button{width:32px;height:32px}.title-copy{top:64px;left:24px;width:37%}.title-copy .eyebrow{font-size:6px;letter-spacing:.8px;margin-bottom:9px}h1{font-size:69px;margin-bottom:13px;line-height:.86}.title-rule{margin:0;gap:10px}.title-rule h2{font-size:11px;letter-spacing:3px}.manifesto,.intro-copy{display:none}#field{inset:50px -14px 46px 37%}.launch-panel{left:auto;right:25px;bottom:55px;width:35%;padding:11px;background:#101a16ee}.mode-tabs{margin-top:8px}.mode-tabs button{padding:6px}.mode-tabs strong{font-size:8px}.mode-tabs small{display:none}.operation-row{margin:10px 0}.operation-row h3{font-size:16px}.operation-row .micro{font-size:6px}.panel-overline{font-size:6px;letter-spacing:.4px}.panel-footer{font-size:6px;margin-top:8px}.primary{min-height:42px;padding:8px 12px;font-size:11px}.primary b{font-size:18px}.menu-footer{bottom:13px;left:24px;right:24px;display:flex;padding-top:10px}.menu-footer nav{margin:0;gap:20px}.menu-footer>.micro{font-size:6px}.menu-footer nav button{font-size:8px}.model-caption{display:none}#citadel[data-view=game] #field{inset:61px 146px 22px}.hud-top{top:10px;left:17px;right:17px;height:34px;grid-template-columns:145px 1fr 100px 32px;gap:18px}.hud-operation strong{font-size:9px}.hud-operation .micro{font-size:6px}.hud-wave{max-width:270px;font-size:8px}.wave-line{margin-top:8px}.core-health span{font-size:6px}.hud-top .icon-button{width:32px;height:32px}.mobile-status{top:80px;left:18px;right:auto;width:111px;flex-direction:column;gap:12px;font-size:8px;padding-top:10px;letter-spacing:0}.battle-footer{bottom:6px;left:150px;right:150px;font-size:6px;letter-spacing:0}.power-status{bottom:23px;font-size:7px}.boss-warning{top:50px;font-size:7px}.movement-control{left:18px;bottom:18px}#joystick{width:100px;height:100px}#joystick-thumb{left:28px;top:28px}.action-controls{right:19px;bottom:19px}#fire{width:89px;height:89px}#fire svg{width:42px;height:42px}#fortify{padding:8px;font-size:7px;min-width:104px}#touch-controls{height:166px}.left-handed .movement-control{right:18px}.left-handed .action-controls{left:19px}#toast{bottom:36%;font-size:8px}.overlay-screen{padding:14px;align-items:flex-start}.dispatch-card{margin:auto;max-width:600px;width:550px;padding:17px 22px}.dispatch-card h2{font-size:39px;margin:8px 0}.dispatch-card h2 br{display:none}.dispatch-card>p{font-size:11px;margin:9px 0}.dispatch-card .primary{margin-top:12px}.dispatch-card>.text-button{margin:6px auto 0}.result-card{display:grid;grid-template-columns:1fr 1fr;column-gap:20px}.result-overline{grid-column:1/-1}.result-card h2{font-size:34px;grid-column:1}.result-score{grid-column:1;grid-row:3}.result-score strong{font-size:32px}.result-card>p{grid-column:1;font-size:10px}.result-card .result-stats{grid-column:2;grid-row:2/5;margin:10px 0;padding:10px 0;gap:10px}.result-card .result-stats b{font-size:15px}.result-card .result-stats span{font-size:6px}.result-card .primary{grid-column:1;grid-row:6;margin-top:5px}.result-card .button-row{grid-column:2;grid-row:6;margin:5px 0 0}.result-card .score-nudge{grid-column:1/-1;font-size:9px}.result-card #share-status{grid-column:1/-1;margin:4px 0}.result-card .secondary{padding:10px 7px;min-height:38px;font-size:9px}.result-card .micro{font-size:6px}.armory-copy{top:70px;left:26px;width:35%}.armory-copy h2{font-size:38px;margin:5px 0 12px}.armory-copy h2 br{display:none}.armory-copy h3{font-size:15px;margin-top:14px}.armory-copy .eyebrow{font-size:6px;margin:0}.armory-tabs{margin-top:14px}.armory-tabs button{padding:9px;font-size:8px}.armory-copy>p:not(.eyebrow):not(.micro){font-size:10px;margin:8px 0}.armory-copy dl{margin:10px 0}.armory-copy dl div{padding:5px 0;font-size:7px}.armory-copy .secondary{padding:8px;min-height:32px}.armory-copy .micro{font-size:6px;margin-top:8px}#citadel[data-view=armory] #field{inset:55px 0 35px 39%}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}.reduce-motion *{transition:none!important;animation:none!important}

/* Final composition: copy must never sit behind the deployment panel. */
@media(max-width:700px) and (orientation:portrait){
 #citadel[data-view=menu] #menu-screen{display:flex;flex-direction:column;justify-content:flex-start;padding:max(68px,calc(env(safe-area-inset-top) + 52px)) 0 max(118px,calc(env(safe-area-inset-bottom) + 88px));box-sizing:border-box;overflow-y:auto;overscroll-behavior:contain}
 #citadel[data-view=menu] #menu-screen .title-copy{position:relative!important;left:auto!important;top:auto!important;right:auto!important;width:auto!important;max-width:none;padding:0 22px;margin:0;min-height:clamp(168px,25dvh,236px);flex:0 1 auto;z-index:2}
 #citadel[data-view=menu] #menu-screen .manifesto{display:block!important;font-size:clamp(14px,3.7vw,17px);line-height:1.35;margin:0}
 #citadel[data-view=menu] #menu-screen .intro-copy{display:none!important}
 #citadel[data-view=menu] #menu-screen h1{font-size:clamp(54px,13vw,76px)!important;line-height:.88!important;margin-bottom:10px!important}
 #citadel[data-view=menu] #menu-screen .title-rule{margin-top:10px!important;margin-bottom:12px!important}
 #citadel[data-view=menu] #menu-screen .launch-panel{position:relative!important;left:auto!important;right:auto!important;bottom:auto!important;width:auto!important;margin:14px 22px 0!important;flex:0 0 auto;z-index:5}
 #citadel[data-view=menu] #field{inset:clamp(190px,32dvh,240px) -17px clamp(268px,42dvh,320px)}
}
@media(min-width:901px) and (min-height:700px){.title-copy{top:14%;}h1{font-size:clamp(78px,7.55vw,126px)}.intro-copy{display:none}.manifesto{font-size:18px}.title-rule{margin-bottom:18px}.launch-panel{bottom:12%}}
@media(max-width:600px) and (orientation:portrait){h1{font-size:14.8vw!important;letter-spacing:-.066em}.title-copy{right:22px}.title-rule{margin-top:12px}.mobile-status{font-size:9px;letter-spacing:.1px}.hud-operation .micro{font-size:8px}.hud-operation strong{font-size:10px}.hud-wave{font-size:9px}.core-health>span{font-size:7px}.battle-footer{font-size:8px}.panel-overline,.panel-footer{font-size:8px}.mode-tabs strong{font-size:10px}.menu-footer button{font-size:10px}.menu-footer>.micro{font-size:7px}.model-caption{display:none}}
@media(max-width:600px) and (min-height:736px) and (orientation:portrait){#citadel[data-view=menu] #field{top:207px;bottom:276px}}


/* v1.2 mobile battlefield layout */
@media(max-width:600px) and (orientation:portrait){
 #citadel[data-view=game] #field{inset:80px 0 112px}
 .hud-top{top:max(8px,env(safe-area-inset-top));left:10px;right:10px;height:36px;grid-template-columns:minmax(0,1fr) auto 34px;gap:7px}
 .hud-operation{min-width:0}.hud-operation strong{font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hud-operation .micro{font-size:6px}
 .hud-wave{justify-self:end;width:auto;max-width:116px;font-size:7px;white-space:nowrap}.wave-line{margin-top:5px}
 #core-health-block{display:none!important}.hud-top #pause{grid-column:3;width:34px;height:34px}
 .mobile-status{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));top:50px;left:10px;right:10px;gap:3px;padding:7px 6px;border:1px solid #374337aa;border-radius:6px;background:#0f1915d9;backdrop-filter:blur(5px);font-size:6.5px;letter-spacing:.15px;text-align:center}
 .mobile-status span{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobile-status span:first-child{color:var(--gold)}#mobile-core{color:var(--mint)}
 .battle-footer{display:none}.power-status{top:80px;bottom:auto;left:50%;max-width:76vw;padding:3px 8px;border-radius:10px;background:#101b17c9;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:7px}
 .boss-warning{top:80px;max-width:82vw;overflow:hidden;text-overflow:ellipsis;font-size:7px}
 #touch-controls{position:fixed;height:calc(112px + env(safe-area-inset-bottom));left:0;right:0;bottom:0;border-top:1px solid #37433799;background:linear-gradient(180deg,transparent,#0d1713aa 22%,#0d1713e8);pointer-events:none}
 .movement-control{left:14px;bottom:max(10px,env(safe-area-inset-bottom))}.movement-control>.micro{display:none}
 #joystick{width:96px;height:96px;background:radial-gradient(circle,#3a4a396e 0,transparent 66%),#111d17a6;box-shadow:inset 0 0 0 10px #43543a16,0 5px 22px #0005}
 #joystick-thumb{width:38px;height:38px;left:28px;top:28px}
 .action-controls{right:14px;bottom:max(10px,env(safe-area-inset-bottom));flex-direction:row;align-items:flex-end;gap:8px}
 #fire{width:84px;height:84px;padding:10px;box-shadow:0 0 0 5px #d8873b10,inset 0 -6px 10px #74251377,0 6px 20px #0005}
 #fire svg{width:40px;height:40px}#fire>b{font-size:9px}
 #fortify,#support{min-width:72px;max-width:78px;height:42px;padding:5px 6px;font-size:6.5px;line-height:1.1;white-space:normal;border-radius:5px}.support-stack{gap:4px}
 .left-handed .movement-control{left:auto;right:14px}.left-handed .action-controls{right:auto;left:14px}
 .operations-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.operations-grid button{min-height:84px}
 .manual-grid{grid-template-columns:1fr}.manual-grid p{font-size:11px}
 #toast{bottom:145px;max-width:90vw;white-space:normal}
}
@media(max-width:600px) and (max-height:735px) and (orientation:portrait){
 #citadel[data-view=game] #field{inset:78px 0 108px}
 #touch-controls{position:fixed;height:calc(108px + env(safe-area-inset-bottom));left:0;right:0;bottom:0}
 .movement-control{left:12px;bottom:max(8px,env(safe-area-inset-bottom))}#joystick{width:88px;height:88px}#joystick-thumb{width:34px;height:34px;left:26px;top:26px}
 .action-controls{right:12px;bottom:max(8px,env(safe-area-inset-bottom));gap:7px}#fire{width:78px;height:78px}#fire svg{width:37px;height:37px}#fortify,#support{min-width:68px;max-width:72px;height:38px}
 .left-handed .movement-control{right:12px}.left-handed .action-controls{left:12px}
 #toast{bottom:130px}
}
@media(max-height:540px) and (orientation:landscape){
 #citadel[data-view=game] #field{inset:50px 112px 7px}
 .hud-top{top:7px;left:12px;right:12px;height:34px;grid-template-columns:150px minmax(120px,1fr) 96px 32px;gap:10px}
 .mobile-status{display:none}.battle-footer{display:none}.power-status{bottom:7px;font-size:7px}.boss-warning{top:45px}
 #touch-controls{height:100%;background:none;border:0}
 .movement-control{left:12px;bottom:12px}#joystick{width:88px;height:88px}#joystick-thumb{width:34px;height:34px;left:26px;top:26px}.movement-control>.micro{display:none}
 .action-controls{right:12px;bottom:12px;gap:7px}#fire{width:80px;height:80px}#fire svg{width:38px;height:38px}#fortify,#support{min-width:83px;padding:6px;font-size:6.5px}
 .left-handed .movement-control{left:auto;right:12px}.left-handed .action-controls{right:auto;left:12px}
 #toast{bottom:16px;max-width:55vw}
}


/* v2.2 over-the-shoulder immersive chase */
.hud-top{grid-template-columns:205px 1fr 148px 88px 42px;gap:20px}
.view-toggle{height:36px;padding:0 9px;border:1px solid #536654;background:#142119d9;color:var(--mint);font:700 8px var(--mono);letter-spacing:.8px;white-space:nowrap}
.view-toggle[aria-pressed=true]{border-color:var(--orange);color:#fff0cc;background:#3a2218e6;box-shadow:0 0 18px #ed734422}
#immersive-overlay{display:none;position:absolute;inset:0;z-index:3;pointer-events:none;overflow:hidden}
#citadel.immersive:not(.immersive-redeploy) #immersive-overlay{display:block}
#citadel.immersive #field{inset:0!important;background:linear-gradient(180deg,var(--ink) 0%,var(--ink2) 44%,var(--line) 45%,var(--ink2) 72%,var(--ink) 100%)}
#citadel.immersive .command-strip,#citadel.immersive .battle-footer,#citadel.immersive .mobile-status{display:none!important}
#citadel.immersive .power-status{left:50%;transform:translateX(-50%);bottom:18px;padding:5px 10px;border:1px solid #53665488;background:#0b120fd9}
#citadel.immersive .field-vignette{box-shadow:inset 0 0 86px 16px #05080688,inset 0 -105px 145px -85px #000}
.chase-reticle{position:absolute;left:50%;top:47%;width:62px;height:62px;transform:translate(-50%,-50%);filter:drop-shadow(0 0 4px #000)}
.chase-reticle:before,.chase-reticle:after{content:'';position:absolute;background:#d9f2d4a8}.chase-reticle:before{left:31px;top:4px;width:1px;height:54px}.chase-reticle:after{left:4px;top:31px;width:54px;height:1px}
.chase-reticle i{position:absolute;inset:17px;border:1px solid #d9f2d4a8;border-radius:50%}.chase-reticle b{position:absolute;left:28px;top:28px;width:7px;height:7px;border:1px solid #ffca77;border-radius:50%}.chase-reticle span{position:absolute;left:12px;right:12px;bottom:-8px;border-bottom:1px solid #d9f2d466}
.immersive-title{position:absolute;left:7%;top:8.7%;font:700 8px var(--mono);letter-spacing:2px;color:#b9c8ae;text-shadow:0 2px 5px #000}
.immersive-readout{position:absolute;left:50%;bottom:3.1%;transform:translateX(-50%);display:flex;gap:28px;align-items:center;font:700 9px var(--mono);letter-spacing:1px;color:#c8d5c0;text-shadow:0 2px 4px #000}.immersive-readout span:nth-child(2){color:var(--mint)}.immersive-readout span:nth-child(3){color:var(--gold)}
.immersive-minimap{display:none;position:absolute;right:7%;top:62px;width:120px;height:120px;border:1px solid #70856a99;border-radius:4px;background:#07100de8;box-shadow:0 8px 24px #0008,inset 0 0 18px #5d8a6c18}
#citadel.immersive .immersive-minimap:not([hidden]){display:block}
#citadel.immersive .hud-top{background:linear-gradient(180deg,#07100ccc,transparent);padding:5px 8px;top:max(7px,env(safe-area-inset-top));left:6%;right:6%}
#citadel.immersive .boss-warning{top:56px}

@media(max-width:900px){
 .hud-top{grid-template-columns:1fr 1fr 90px 74px 36px;gap:7px}
 .view-toggle{height:32px;padding:0 6px;font-size:7px;letter-spacing:.4px}
}
@media(max-width:600px) and (orientation:portrait){
 .hud-top{grid-template-columns:minmax(0,1fr) 88px 66px 32px;gap:5px}
 .hud-top #core-health-block{display:none!important}.hud-top #view-toggle{grid-column:3}.hud-top #pause{grid-column:4}
 .view-toggle{height:32px;font-size:6px;padding:0 4px}
 #citadel.immersive .hud-top{left:5px;right:5px;padding:3px 5px}
 #citadel.immersive .hud-operation strong{max-width:112px}
 .cockpit-glass{inset:6% 3% 15%;border-radius:10px}.cockpit-top{height:6%}.cockpit-side{width:4.6%;bottom:13%}.cockpit-dash{display:none}
 .immersive-title{top:7%;left:6%;font-size:6px;letter-spacing:1.2px}.immersive-readout{top:49px;bottom:auto;gap:11px;font-size:6px;letter-spacing:.25px;padding:4px 7px;background:#09100cd9;border:1px solid #4c5d4d88;border-radius:10px}
 .chase-reticle{width:58px;height:58px;top:44%}.chase-reticle:before{left:29px;height:58px}.chase-reticle:after{top:29px;width:58px}.chase-reticle i{inset:15px}.chase-reticle b{left:26px;top:26px}
 #citadel.immersive .power-status{bottom:calc(108px + env(safe-area-inset-bottom));font-size:6px;max-width:70vw}
 #citadel.immersive .boss-warning{top:70px}
}
@media(max-height:540px) and (orientation:landscape){
 .hud-top{grid-template-columns:145px 1fr 92px 68px 32px;gap:8px}
 .view-toggle{height:30px;font-size:6px}
 .cockpit-glass{inset:7% 3% 10%}.cockpit-top{height:6%}.cockpit-side{width:4%;bottom:8%}.cockpit-dash{height:10%}.immersive-title{top:8%;font-size:6px}.immersive-readout{bottom:2.2%;font-size:7px;gap:18px}
 #citadel.immersive .power-status{bottom:5px}.chase-reticle{top:49%}
}

.audio-test{width:100%;margin-top:16px;letter-spacing:.5px}

@media(max-width:600px) and (orientation:portrait){#citadel.immersive .immersive-minimap{right:8px;top:76px;width:84px;height:84px}.chase-reticle{top:48%}}

/* v2.2.2 mobile control containment */
@media(max-width:420px) and (orientation:portrait){
 #touch-controls{height:calc(106px + env(safe-area-inset-bottom));overflow:visible}
 .movement-control{left:8px;bottom:calc(8px + env(safe-area-inset-bottom))}
 #joystick{width:88px;height:88px}
 #joystick-thumb{width:34px;height:34px;left:26px;top:26px}
 .action-controls{right:8px;bottom:calc(8px + env(safe-area-inset-bottom));gap:6px}
 #fire{width:76px;height:76px;padding:8px}
 #fire svg{width:36px;height:36px}
 #fire>b{font-size:8px}
 #fortify,#support{min-width:64px;max-width:66px;height:36px;padding:4px 5px;font-size:6px}
 .support-stack{gap:4px}
 .left-handed .movement-control{right:8px}
 .left-handed .action-controls{left:8px}
 #citadel[data-view=game] #field{bottom:106px}
}


/* v3.0 flagship warfront presence */
.field-vignette{background:radial-gradient(ellipse at 52% 48%,transparent 42%,#06100b24 78%,#02070570 100%);box-shadow:inset 0 0 90px 10px #07100b40,inset 0 -72px 90px -48px #030806aa}
@media(min-width:1200px) and (min-height:650px){
 #citadel[data-view=game] #field{inset:76px 14px 50px 246px}
 .command-strip{left:20px;top:94px;bottom:66px;width:198px;padding:0 11px 12px;box-sizing:border-box;overflow-y:auto;overflow-x:hidden;background:color-mix(in srgb,var(--ink2) 82%,transparent);border:1px solid color-mix(in srgb,var(--line) 78%,transparent);border-top-color:var(--gold);scrollbar-width:thin}
 .hud-top{left:20px;right:20px;top:max(14px,env(safe-area-inset-top));grid-template-columns:222px minmax(260px,1fr) 140px 88px 42px}
 .battle-footer{left:20px;right:20px;bottom:17px}
 .power-status{left:260px;bottom:59px}
 .boss-warning{top:72px}
}
@media(min-width:1500px) and (min-height:760px){
 #citadel[data-view=game] #field{inset:68px 10px 42px 250px}
 .command-strip{left:18px;top:88px;bottom:58px;width:205px;padding:0 12px 14px}
 .score-block>strong{font-size:36px}
 .fortify-info h3{font-size:18px}
 .hud-top{left:18px;right:18px;grid-template-columns:228px minmax(300px,1fr) 150px 96px 42px}
 .power-status{left:266px;bottom:51px}
}


/* v3.1 visual style system + settings polish */
#citadel,.primary,.secondary,.view-toggle,.launch-panel,.mobile-status,dialog{transition:background-color .22s,border-color .22s,color .22s,box-shadow .22s}
.theme-setting{padding:2px 0 18px}.setting-heading{display:flex;justify-content:space-between;gap:20px;align-items:end;margin-bottom:12px}.setting-heading b{font-size:13px}.setting-heading small{max-width:360px;text-align:right;font-size:10px;line-height:1.45;color:var(--muted)}
.theme-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px}.theme-card{min-width:0;min-height:108px;padding:8px;border:1px solid var(--line);background:var(--ink);text-align:left;display:flex;flex-direction:column;gap:7px;position:relative}.theme-card:hover{border-color:var(--muted)}.theme-card[aria-pressed=true]{border-color:var(--mint);box-shadow:inset 0 -2px 0 var(--mint),0 0 0 1px color-mix(in srgb,var(--mint) 25%,transparent)}.theme-card[aria-pressed=true]:after{content:'ACTIVE';position:absolute;right:6px;top:6px;font:600 5px var(--mono);letter-spacing:.7px;color:var(--mint)}
.theme-card strong{font-size:9px;line-height:1.15}.theme-card small{font-size:7px;line-height:1.3;color:var(--muted)}.theme-swatch{height:43px;display:grid;grid-template-columns:1.4fr .8fr .8fr;gap:2px;border:1px solid color-mix(in srgb,var(--line) 75%,transparent);overflow:hidden}.theme-swatch i:nth-child(1){background:linear-gradient(145deg,var(--theme-a),color-mix(in srgb,var(--theme-a) 58%,var(--theme-b)))}.theme-swatch i:nth-child(2){background:linear-gradient(180deg,var(--theme-b),var(--theme-a))}.theme-swatch i:nth-child(3){background:linear-gradient(180deg,var(--theme-c),var(--theme-a))}
.settings-divider{margin:2px 0 0;padding:13px 0 7px;border-top:1px solid var(--line);font:700 7px var(--mono);letter-spacing:1.8px;color:var(--gold)}
#citadel[data-theme=jungle] .field-vignette{box-shadow:inset 0 0 110px 12px #03110870,inset 0 -72px 90px -48px #020704cc}
#citadel[data-theme=colorful] .field-vignette{box-shadow:inset 0 0 96px 8px #15102a55,inset 0 -68px 96px -50px #080618aa}
#citadel[data-theme=animated] .field-vignette{box-shadow:inset 0 0 72px 6px #07131d44,inset 0 -55px 75px -42px #06101788}
#citadel[data-theme=realistic] .field-vignette{box-shadow:inset 0 0 120px 18px #0204037d,inset 0 -88px 110px -52px #010201d6}
#citadel[data-theme=siberia] .field-vignette{box-shadow:inset 0 0 88px 8px #d6e4e466,inset 0 -66px 92px -46px #7d929977;background:radial-gradient(ellipse at 50% 44%,#ffffff12 12%,transparent 58%,#5d737a33 100%)}
#citadel[data-theme=laser] .field-vignette{box-shadow:inset 0 0 92px 8px #00efff20,inset 0 0 170px 34px #07001866,inset 0 -70px 96px -46px #ff2bd626;background:radial-gradient(ellipse at 50% 48%,transparent 28%,#03061522 64%,#01020a80 100%)}
#citadel[data-theme=laser] .primary,#citadel[data-theme=laser] .view-toggle,#citadel[data-theme=laser] .mobile-status,#citadel[data-theme=laser] .theme-card[aria-pressed=true]{box-shadow:0 0 14px color-mix(in srgb,var(--mint) 34%,transparent),inset 0 0 12px color-mix(in srgb,var(--orange) 10%,transparent)}
#citadel[data-theme=animated] .primary{border-bottom-width:4px}#citadel[data-theme=animated] .view-toggle,#citadel[data-theme=animated] .mobile-status{border-width:2px}
#citadel[data-theme=colorful] .charge-track i,#citadel[data-theme=colorful] .support-track i,#citadel[data-theme=colorful] .wave-line i{box-shadow:0 0 12px color-mix(in srgb,var(--mint) 58%,transparent)}
#citadel[data-theme=realistic] .field-vignette{background:radial-gradient(ellipse at 52% 48%,transparent 34%,#07080630 72%,#01020178 100%)}

@media(max-width:700px){
 .theme-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .theme-card{min-height:88px}.theme-card:last-child{grid-column:span 2}
 .setting-heading{display:block}.setting-heading small{display:block;text-align:left;margin-top:5px}
 dialog{padding:19px}
}
@media(max-width:380px){
 .theme-grid{grid-template-columns:1fr}.theme-card:last-child{grid-column:auto}.theme-card{min-height:76px;display:grid;grid-template-columns:82px 1fr;grid-template-rows:auto auto;align-items:center}.theme-swatch{grid-row:1/3;height:56px}.theme-card strong{font-size:10px}.theme-card small{font-size:8px}
}


/* v3.1 theme-consistent control surfaces */
.launch-panel,.command-strip,.mobile-status,.view-toggle,.icon-button,.secondary,.operations-grid button,.setting-row select,.setting-row button,#joystick,#fire,#fortify,#support,#toast{
 background-color:var(--ink2);
 border-color:var(--line);
}
.launch-panel,dialog,.mobile-status{backdrop-filter:blur(7px)}
.mode-tabs button[aria-selected=true],.operation-card.selected{background:color-mix(in srgb,var(--ink2) 75%,var(--mint) 10%);border-color:var(--orange)}
#joystick{background:radial-gradient(circle,color-mix(in srgb,var(--mint) 12%,transparent) 0,transparent 66%),color-mix(in srgb,var(--ink2) 78%,transparent);box-shadow:inset 0 0 0 12px color-mix(in srgb,var(--line) 26%,transparent)}
#joystick-thumb{background:linear-gradient(135deg,color-mix(in srgb,var(--mint) 32%,var(--line)),var(--ink2));border-color:color-mix(in srgb,var(--paper) 35%,transparent)}
#fire{background:radial-gradient(circle at 38% 32%,color-mix(in srgb,var(--orange) 92%,white 8%),var(--orange) 66%,color-mix(in srgb,var(--orange) 64%,black))}
#fortify,#support{background:color-mix(in srgb,var(--ink2) 82%,var(--mint) 5%)}#fortify.ready,#support.ready{border-color:var(--mint);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--mint) 22%,transparent)}
#toast{background:color-mix(in srgb,var(--ink2) 92%,transparent);border-color:var(--gold);color:var(--gold)}
.signal #theme-status{color:var(--mint)}


/* v3.2 Citadel Convergence massive co-op */
.mode-tabs{grid-template-columns:repeat(3,minmax(0,1fr))}
.mode-tabs button{min-width:0}
.mode-tabs small{font-size:9px;line-height:1.32}
.coop-minimap{display:none;position:absolute;right:24px;top:88px;width:132px;height:132px;z-index:7;border:1px solid color-mix(in srgb,var(--mint) 55%,var(--line));border-radius:4px;background:var(--ink);box-shadow:0 12px 34px #0009,inset 0 0 22px color-mix(in srgb,var(--mint) 7%,transparent);pointer-events:none}
#citadel.coop-active .coop-minimap:not([hidden]){display:block}
.coop-team-status{position:absolute;right:24px;top:230px;width:132px;z-index:7;padding:8px 9px;border:1px solid var(--line);background:color-mix(in srgb,var(--ink) 90%,transparent);box-shadow:0 9px 24px #0006;pointer-events:none}
.coop-team-status b{display:block;font:700 6px var(--mono);letter-spacing:1.2px;color:var(--mint);margin-bottom:5px}.coop-team-status span{display:block;font:600 6px var(--mono);line-height:1.55;color:var(--paper)}
#citadel.coop-active .core-health>div{gap:2px;max-width:145px;flex-wrap:nowrap}
#citadel.coop-active .core-health i{width:11px;height:8px}
#citadel.coop-active .field-vignette{box-shadow:inset 0 0 120px 14px color-mix(in srgb,var(--ink) 42%,transparent),inset 0 -82px 110px -55px #000c}
#citadel.coop-active .battle-footer{right:178px}
.coop-setup{display:block}.coop-intro{padding:13px 14px;border:1px solid var(--line);background:color-mix(in srgb,var(--ink) 72%,var(--mint) 4%);margin-bottom:14px}.coop-intro>b{display:block;font:800 10px var(--mono);letter-spacing:1.5px;color:var(--gold);margin-bottom:7px}.coop-intro p{font-size:11px;line-height:1.65;color:var(--muted);margin:0}
.coop-choices{display:grid;grid-template-columns:1fr 1fr;gap:9px}.coop-choice,.coop-join{border:1px solid var(--line);background:var(--ink);min-height:126px;padding:15px;text-align:left}.coop-choice:hover{border-color:var(--mint)}.coop-choice strong{display:block;font:800 11px var(--mono);letter-spacing:1px;color:var(--paper);margin-bottom:9px}.coop-choice small{display:block;font-size:10px;line-height:1.55;color:var(--muted)}
.coop-join{grid-column:1/-1;min-height:auto;display:grid;grid-template-columns:1fr auto;gap:10px;align-items:end}.coop-join label span{display:block;font:700 7px var(--mono);letter-spacing:1.4px;color:var(--gold);margin-bottom:7px}.coop-join input{width:100%;height:42px;padding:0 12px;border:1px solid var(--line);background:var(--ink2);color:var(--paper);font:800 15px var(--mono);letter-spacing:4px;text-transform:uppercase;outline:none}.coop-join input:focus{border-color:var(--mint)}.coop-join button{height:42px;padding:0 17px;border:1px solid var(--mint);background:color-mix(in srgb,var(--ink2) 76%,var(--mint) 10%);color:var(--paper);font:700 8px var(--mono);letter-spacing:1px}
.coop-room-status{margin-top:10px;padding:11px;border:1px solid var(--line);background:color-mix(in srgb,var(--ink2) 88%,transparent);font:7px var(--mono);letter-spacing:.8px;line-height:1.7;color:var(--muted)}.coop-room-status .coop-code{display:inline-block;margin:3px 5px;color:var(--gold);font-size:19px;letter-spacing:5px}.coop-room-status small{display:block;margin:4px 0 10px}.coop-room-status .secondary{width:100%;margin-top:8px}
@media(max-width:900px){
 .mode-tabs strong{font-size:8px}.mode-tabs small{font-size:8px}
 #citadel.coop-active .coop-minimap{right:12px;top:78px;width:104px;height:104px}
 #citadel.coop-active .coop-team-status{right:12px;top:188px;width:104px;padding:6px}
 #citadel.coop-active .battle-footer{right:12px}
}
@media(max-width:600px) and (orientation:portrait){
 .mode-tabs{gap:1px}.mode-tabs button{padding:9px 5px}.mode-tabs small{font-size:7px}
 #citadel.coop-active .coop-minimap{right:7px;top:78px;width:92px;height:92px}
 #citadel.coop-active .coop-team-status{right:7px;top:176px;width:92px;padding:5px 6px}
 #citadel.coop-active .coop-team-status b{font-size:5px}.coop-team-status span{font-size:5px}
 #citadel.coop-active .core-health{display:none}
 .coop-choices{grid-template-columns:1fr}.coop-join{grid-column:auto;grid-template-columns:1fr}.coop-choice{min-height:98px}
}
@media(max-width:390px){
 .mode-tabs strong{font-size:7px}.mode-tabs small{font-size:6px}
 #citadel.coop-active .coop-minimap{width:84px;height:84px}
 #citadel.coop-active .coop-team-status{top:168px;width:84px}
}


/* v3.2.2 final HUD containment — authoritative after legacy media rules */
.hud-operation{min-width:0;overflow:hidden}
.hud-operation strong{display:block;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.command-strip{overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;box-sizing:border-box;padding-bottom:max(12px,env(safe-area-inset-bottom))}
@media(max-height:700px) and (orientation:landscape){
 #citadel[data-view=game] .command-strip{display:none!important}
 #citadel[data-view=game] #field{left:8px!important}
 #citadel[data-view=game] .mobile-status{display:flex!important;top:max(49px,env(safe-area-inset-top));left:max(14px,env(safe-area-inset-left));right:max(14px,env(safe-area-inset-right));width:auto;flex-direction:row;gap:12px;align-items:center;justify-content:flex-start;padding:7px 0 0;font-size:7px;line-height:1.2;white-space:nowrap}
 #citadel[data-view=game] .mobile-status span{min-width:0}
 #citadel[data-view=game] .mobile-status span+span:before{content:'·';margin-right:10px;color:var(--line)}
 #citadel[data-view=game] .power-status{left:50%!important;transform:translateX(-50%);white-space:nowrap}
 #citadel[data-view=game] .battle-footer{left:125px;right:125px}
 #citadel.coop-active .coop-minimap{top:78px;right:max(9px,env(safe-area-inset-right));width:88px;height:88px}
 #citadel.coop-active .coop-team-status{display:none!important}
}
@media(max-height:500px) and (orientation:landscape){
 #citadel[data-view=game] .mobile-status{top:max(43px,env(safe-area-inset-top));font-size:6px;gap:8px}
 #citadel[data-view=game] .mobile-status span+span:before{margin-right:7px}
 #citadel[data-view=game] .battle-footer{display:none}
 #citadel[data-view=game] .power-status{bottom:10px;font-size:6px}
 #citadel.coop-active .coop-minimap{top:66px;width:78px;height:78px}
}
@media(max-width:420px) and (orientation:portrait){
 .hud-top{grid-template-columns:minmax(0,1fr) 84px 68px 32px!important;gap:5px!important;left:9px!important;right:9px!important}
 .hud-operation strong{font-size:8px!important;letter-spacing:.2px!important}
 .hud-operation .micro{font-size:6px!important}
 .hud-wave{font-size:7px!important;letter-spacing:.25px!important}
 .core-health>span{font-size:5px!important}.core-health i{width:17px!important}
}

/* v3.2.1 desktop HUD containment */
@media(min-width:1200px){
 .command-strip *{min-width:0}
 .command-strip .score-block>strong{font-variant-numeric:tabular-nums}
 .fortify-info p,.support-brief p{overflow-wrap:anywhere}
 .field-facts{gap:12px}
 .field-facts>div{min-width:0}
 .command-strip::-webkit-scrollbar{width:5px}
 .command-strip::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--line) 72%,transparent)}
}


/* v3.3 cinematic combat composition — gameplay owns the screen */
.mode-tabs{grid-template-columns:repeat(4,minmax(0,1fr))}
#citadel[data-view=game] .command-strip{display:none!important}
#citadel[data-view=game] .battle-footer{display:none!important}
#citadel[data-view=game] #field{left:0!important;right:0!important}
#citadel[data-view=game] .power-status{left:50%!important;transform:translateX(-50%);max-width:min(72vw,680px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#citadel[data-view=game] .hud-top{z-index:8}
#citadel[data-view=game] .hud-operation,
#citadel[data-view=game] .hud-wave,
#citadel[data-view=game] .core-health,
#citadel[data-view=game] .view-toggle,
#citadel[data-view=game] #pause{filter:drop-shadow(0 2px 8px #0008)}
#citadel.town-active .hud-wave{color:var(--gold)}
#citadel.town-active .wave-line i{background:linear-gradient(90deg,var(--orange),var(--gold),var(--mint))}
#citadel.town-active .core-health>span:before{content:'CITY ';color:var(--gold)}
#citadel.town-active .core-health i{width:18px}
#citadel.immersive .command-strip{display:none!important}
#citadel.immersive .battle-footer{display:none!important}

@media(min-width:901px){
 #citadel[data-view=game] #field{inset:0!important}
 #citadel[data-view=game].immersive #field{inset:0!important}
 #citadel[data-view=game] .hud-top{top:max(10px,env(safe-area-inset-top));left:18px!important;right:18px!important;grid-template-columns:minmax(160px,1fr) minmax(220px,360px) 150px 88px 42px!important;gap:14px!important}
 #citadel[data-view=game] .power-status{bottom:14px!important;padding:4px 9px;border-radius:12px;background:color-mix(in srgb,var(--ink) 78%,transparent);backdrop-filter:blur(4px)}
}
@media(max-width:900px){
 .mode-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}
 .mode-tabs button{min-height:54px}
}
@media(max-width:420px){
 .mode-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}
 .mode-tabs small{font-size:6px}
}
/* v4.0: compact status badges must never stretch between portrait top/bottom insets. */
#citadel[data-view=game] .power-status:empty{display:none}
#citadel[data-view=game].immersive .power-status{top:auto;max-height:28px}
#citadel[data-view=game].immersive .mobile-status{display:none!important}
@media(max-width:700px) and (orientation:portrait){
 #citadel[data-view=game]:not(.immersive) .power-status{top:80px;bottom:auto!important;max-height:28px}
 #citadel[data-view=game].immersive .power-status{bottom:calc(108px + env(safe-area-inset-bottom))!important}
}
@media(orientation:landscape) and (max-height:500px){
 #citadel[data-view=game].immersive .immersive-title{display:none}
}

/* Flagship campaign and cosmetic loadout controls. */
#operation-brief{max-width:46ch;line-height:1.6;margin:12px 0}
#objective-status{position:absolute;top:82px;left:24px;max-width:65%;color:#ffe0a0;text-shadow:0 2px 4px #000;pointer-events:none}
.skin-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.skin-option{min-height:40px;padding:8px;text-align:left;border:1px solid #526454;border-radius:4px;background:#16201b;color:#e5eadb;font:11px ui-monospace,monospace}.skin-option[aria-pressed=true]{border-color:#b9dab1;background:#2d4235}#skin-panel{margin:14px 0;max-width:400px}#skin-panel p{line-height:1.5}#skin-panel .secondary{min-height:38px}#audio-debug{position:fixed;right:8px;bottom:8px;max-width:min(430px,90vw);max-height:42vh;overflow:auto;z-index:300;background:#071009ee;color:#bbf4c4;border:1px solid #65876f;padding:10px;font:10px monospace;pointer-events:none}.operation-card[hidden]{display:none}#dialog-content>select{width:100%;min-height:44px;margin-bottom:16px;background:#17221b;color:#e0e7d8;border:1px solid #60705d;padding:10px}.armory-copy{max-height:calc(100dvh - 38px);overflow-y:auto;padding-bottom:24px}
@media(max-width:700px){#objective-status{top:101px;left:12px;max-width:80%;font-size:9px}.skin-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.armory-copy{max-height:52dvh}}@media(max-height:500px){#objective-status{top:63px;font-size:9px}.armory-copy{max-height:94dvh}.skin-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}

#coop-minimap:not([hidden]){display:block}#objective-status:empty{display:none}@media(max-width:700px){#objective-status{top:112px}#coop-minimap:not([hidden]){width:88px;height:88px;right:12px;bottom:132px}}

#perf-debug{position:fixed;right:8px;top:92px;z-index:280;font:10px monospace;background:#071009e8;color:#c5eac6;padding:10px;pointer-events:none}

/* Keep mission and boss callouts clear of the compact tablet/phone status row. */
#objective-status{z-index:7}
@media(min-width:701px) and (max-width:900px) and (orientation:portrait){#objective-status{top:102px;left:16px;font-size:9px}.boss-warning{top:125px}}
@media(max-width:700px) and (orientation:portrait){#citadel .boss-warning{top:136px;left:12px;transform:none;max-width:calc(100vw - 24px);padding:4px 6px;background:#101a16dd;white-space:normal}}

@media(max-width:700px) and (orientation:portrait){
 #citadel[data-view=armory] #field{inset:66px 10px 58dvh!important}
 #citadel[data-view=armory] .armory-copy{top:43dvh!important;left:18px!important;width:calc(100% - 36px)!important;max-width:none;max-height:calc(57dvh - 18px);padding:14px 8px 20px;background:var(--ink);border-top:1px solid var(--line);z-index:4}
 #citadel[data-view=armory] .armory-copy h2{font-size:34px;margin:8px 0 14px}
 #citadel[data-view=armory] .armory-copy h3{margin-top:18px}
 #citadel[data-view=armory] .armory-tabs{margin-top:14px}
}



/* v5 atmosphere pass — lively sky/horizon behind the transparent WebGL battlefield. */
#citadel{
 --sky-top:#4d728a;--sky-mid:#87a58f;--sky-horizon:#e1b46f;--sky-sun:#ffd88f;--sky-cloud:#e7efe8;--sky-haze:#d7b47b;
}
#citadel[data-theme=jungle]{--sky-top:#2d7891;--sky-mid:#72a579;--sky-horizon:#f0c779;--sky-sun:#fff0a4;--sky-cloud:#eaf1d8;--sky-haze:#b8c876}
#citadel[data-theme=colorful]{--sky-top:#5350a4;--sky-mid:#a55ca7;--sky-horizon:#ffad73;--sky-sun:#ffe97d;--sky-cloud:#f2d9ff;--sky-haze:#ef91b8}
#citadel[data-theme=animated]{--sky-top:#2797c7;--sky-mid:#66c5cf;--sky-horizon:#ffd27a;--sky-sun:#fff2a0;--sky-cloud:#f7fff0;--sky-haze:#f2b968}
#citadel[data-theme=realistic]{--sky-top:#506a78;--sky-mid:#7f8c84;--sky-horizon:#bfa77d;--sky-sun:#ead39d;--sky-cloud:#cfd5cf;--sky-haze:#a99a7f}
#citadel[data-theme=siberia]{--sky-top:#6f96ad;--sky-mid:#b7cbd0;--sky-horizon:#f0eee4;--sky-sun:#fff8db;--sky-cloud:#ffffff;--sky-haze:#dde6e3}
#citadel[data-theme=laser]{--sky-top:#01020a;--sky-mid:#05091a;--sky-horizon:#09152c;--sky-sun:#00f0ff;--sky-cloud:#ff2bd6;--sky-haze:#7f4dff}
#citadel[data-weather=rain]{--sky-top:#334d63;--sky-mid:#607788;--sky-horizon:#a5a18c;--sky-sun:#d8d5b4;--sky-cloud:#b9c5cc;--sky-haze:#77888b}
#citadel[data-weather=storm]{--sky-top:#1d3448;--sky-mid:#485c70;--sky-horizon:#9a806a;--sky-sun:#f1c876;--sky-cloud:#9eabb5;--sky-haze:#596b72}
#citadel[data-weather=snow]{--sky-top:#6fa2c0;--sky-mid:#aac8d1;--sky-horizon:#e8f1e9;--sky-sun:#fff7cb;--sky-cloud:#ffffff;--sky-haze:#d8e8e5}
#citadel[data-weather=dust]{--sky-top:#6e7f82;--sky-mid:#b59569;--sky-horizon:#f0b966;--sky-sun:#ffe09c;--sky-cloud:#d6c09e;--sky-haze:#d39757}
#citadel[data-weather=smoke],#citadel[data-weather=ash]{--sky-top:#454e51;--sky-mid:#766e62;--sky-horizon:#c38658;--sky-sun:#f0a65f;--sky-cloud:#aaa9a1;--sky-haze:#8f644c}
#citadel[data-weather=embers]{--sky-top:#393c4a;--sky-mid:#7f4d48;--sky-horizon:#ef8f50;--sky-sun:#ffd073;--sky-cloud:#a9847b;--sky-haze:#c86b42}

#field{
 overflow:hidden;isolation:isolate;
 background:
  radial-gradient(circle at 78% 18%,color-mix(in srgb,var(--sky-sun) 82%,transparent) 0 4%,color-mix(in srgb,var(--sky-sun) 24%,transparent) 5% 12%,transparent 24%),
  linear-gradient(180deg,var(--sky-top) 0%,var(--sky-mid) 47%,var(--sky-horizon) 79%,color-mix(in srgb,var(--sky-horizon) 54%,var(--ink)) 100%);
}
#field::before,#field::after{content:'';position:absolute;pointer-events:none;z-index:0}
#field::before{
 left:-28%;right:-28%;top:5%;height:52%;
 background:
  radial-gradient(ellipse at 8% 48%,color-mix(in srgb,var(--sky-cloud) 70%,transparent) 0 9%,transparent 10%),
  radial-gradient(ellipse at 27% 30%,color-mix(in srgb,var(--sky-cloud) 56%,transparent) 0 8%,transparent 9%),
  radial-gradient(ellipse at 48% 52%,color-mix(in srgb,var(--sky-cloud) 62%,transparent) 0 10%,transparent 11%),
  radial-gradient(ellipse at 69% 34%,color-mix(in srgb,var(--sky-cloud) 48%,transparent) 0 8%,transparent 9%),
  radial-gradient(ellipse at 91% 55%,color-mix(in srgb,var(--sky-cloud) 60%,transparent) 0 10%,transparent 11%);
 filter:blur(5px);opacity:.48;transform:translate3d(-3%,0,0);
 animation:tankSkyDrift 46s linear infinite;
}
#field::after{
 left:-8%;right:-8%;bottom:-2%;height:44%;
 background:
  radial-gradient(ellipse at 50% 100%,color-mix(in srgb,var(--sky-haze) 56%,transparent) 0 8%,color-mix(in srgb,var(--sky-haze) 22%,transparent) 34%,transparent 66%),
  linear-gradient(180deg,transparent 0 52%,color-mix(in srgb,var(--sky-haze) 18%,transparent) 78%,color-mix(in srgb,var(--ink) 52%,transparent) 100%);
 opacity:.78;
}
#scene,#tactical{z-index:2}
.field-vignette{z-index:3}
#citadel.immersive #field{
 background:
  radial-gradient(circle at 72% 14%,color-mix(in srgb,var(--sky-sun) 88%,transparent) 0 3.5%,color-mix(in srgb,var(--sky-sun) 22%,transparent) 4% 13%,transparent 25%),
  linear-gradient(180deg,var(--sky-top) 0%,var(--sky-mid) 48%,var(--sky-horizon) 78%,color-mix(in srgb,var(--sky-horizon) 48%,var(--ink)) 100%);
}
#citadel[data-weather=storm] #field::before,#citadel[data-weather=rain] #field::before{opacity:.68;filter:blur(7px) brightness(.82)}
#citadel[data-weather=embers] #field::before,#citadel[data-weather=ash] #field::before{opacity:.30;filter:blur(8px) sepia(.18)}
#citadel[data-theme=colorful] #field::before,#citadel[data-theme=animated] #field::before{opacity:.56}
#citadel[data-theme=laser] #field,#citadel[data-theme=laser].immersive #field{background:radial-gradient(circle at 50% 58%,#00eaff1f 0 8%,#7a2fff12 20%,transparent 42%),linear-gradient(180deg,#01020a 0%,#04081a 56%,#07142b 100%)}
#citadel[data-theme=laser] #field::before{left:0;right:0;top:0;height:100%;background:repeating-linear-gradient(90deg,transparent 0 7.85%,#00efff18 7.98%,transparent 8.12%),repeating-linear-gradient(0deg,transparent 0 12.3%,#ff2bd614 12.46%,transparent 12.62%);filter:none;opacity:.52;transform:none;animation:laserPhotonPulse 3.2s ease-in-out infinite}
#citadel[data-theme=laser] #field::after{left:-5%;right:-5%;bottom:-4%;height:58%;background:radial-gradient(ellipse at 50% 100%,#00f0ff2b 0 4%,#7b39ff16 24%,transparent 62%),linear-gradient(180deg,transparent 0 44%,#ff2bd60d 75%,#02030bbb 100%);opacity:.88}
@keyframes laserPhotonPulse{0%,100%{opacity:.38;filter:brightness(.9)}50%{opacity:.64;filter:brightness(1.35)}}
@keyframes tankSkyDrift{from{transform:translate3d(-3%,0,0)}to{transform:translate3d(10%,1.5%,0)}}
.reduce-motion #field::before{animation:none!important}\n@media(prefers-reduced-motion:reduce){#field::before{animation:none!important}}


/* v5.1 twelve-theme material and readability overhaul */
#citadel{--sky-top:#64869a;--sky-mid:#9eb49b;--sky-horizon:#e9c985;--sky-sun:#ffe3a5;--sky-cloud:#f2f6ee;--sky-haze:#ddbf86}
#citadel[data-theme=jungle]{--sky-top:#4b8fa1;--sky-mid:#86b98b;--sky-horizon:#f2d08b;--sky-sun:#fff1ad;--sky-cloud:#f2f6e8;--sky-haze:#c5d789}
#citadel[data-theme=colorful]{--sky-top:#6967b6;--sky-mid:#b376b7;--sky-horizon:#ffbd88;--sky-sun:#fff09a;--sky-cloud:#f7e6ff;--sky-haze:#f1a7c8}
#citadel[data-theme=animated]{--sky-top:#53abd0;--sky-mid:#82d0d5;--sky-horizon:#ffdd91;--sky-sun:#fff4b2;--sky-cloud:#fbfff5;--sky-haze:#f4c97c}
#citadel[data-theme=realistic]{--sky-top:#718894;--sky-mid:#9aa59d;--sky-horizon:#cdb98f;--sky-sun:#efe0b3;--sky-cloud:#dde1dc;--sky-haze:#b4a88e}
#citadel[data-theme=siberia]{--sky-top:#83aac0;--sky-mid:#c5d5d9;--sky-horizon:#f4f3eb;--sky-sun:#fffbe2;--sky-cloud:#ffffff;--sky-haze:#e4eeec}
#citadel[data-theme=laser]{--sky-top:#08101f;--sky-mid:#101b35;--sky-horizon:#192f50;--sky-sun:#55edf4;--sky-cloud:#ff72c0;--sky-haze:#987cff}
#citadel[data-theme=marble]{--sky-top:#8da8b8;--sky-mid:#c7d1d2;--sky-horizon:#f2e8d5;--sky-sun:#fff1c8;--sky-cloud:#fffdf8;--sky-haze:#d6c39b}
#citadel[data-theme=wood]{--sky-top:#7994a0;--sky-mid:#c5a773;--sky-horizon:#efc77f;--sky-sun:#ffe0a0;--sky-cloud:#efe0c5;--sky-haze:#c88b55}
#citadel[data-theme=space]{--sky-top:#030510;--sky-mid:#090f2a;--sky-horizon:#15234a;--sky-sun:#8ee7ff;--sky-cloud:#b478ff;--sky-haze:#ff73b1}
#citadel[data-theme=crystal]{--sky-top:#6c9fc0;--sky-mid:#a2d7dc;--sky-horizon:#e5e5ff;--sky-sun:#fff0ca;--sky-cloud:#f8fbff;--sky-haze:#cdb8ff}
#citadel[data-theme=porcelain]{--sky-top:#83a8c4;--sky-mid:#c4d6df;--sky-horizon:#f5eee1;--sky-sun:#fff0c6;--sky-cloud:#fffdf7;--sky-haze:#c8d6df}

#citadel[data-theme=iron] .field-vignette{box-shadow:inset 0 0 74px 8px #07110d2c,inset 0 -58px 78px -46px #07110d52}
#citadel[data-theme=jungle] .field-vignette{box-shadow:inset 0 0 82px 8px #05201132,inset 0 -58px 78px -46px #0420105c}
#citadel[data-theme=colorful] .field-vignette{box-shadow:inset 0 0 76px 7px #17122c2b,inset 0 -55px 78px -46px #0a082f50}
#citadel[data-theme=animated] .field-vignette{box-shadow:inset 0 0 64px 5px #0a1b2422,inset 0 -48px 70px -45px #0b1a2942}
#citadel[data-theme=realistic] .field-vignette{box-shadow:inset 0 0 84px 9px #080b0938,inset 0 -64px 86px -48px #0608065a;background:radial-gradient(ellipse at 52% 48%,transparent 42%,#11151016 76%,#07080738 100%)}
#citadel[data-theme=siberia] .field-vignette{box-shadow:inset 0 0 62px 6px #d9e7e72f,inset 0 -52px 74px -46px #73889038;background:radial-gradient(ellipse at 50% 44%,#ffffff12 14%,transparent 66%,#78909a18 100%)}
#citadel[data-theme=laser] .field-vignette{box-shadow:inset 0 0 64px 6px #4ee6f21c,inset 0 0 112px 18px #15102e26,inset 0 -54px 76px -46px #ff64b31c;background:radial-gradient(ellipse at 50% 48%,transparent 38%,#0b122518 72%,#06081542 100%)}
#citadel[data-theme=marble] .field-vignette{box-shadow:inset 0 0 66px 5px #ffffff3a,inset 0 -54px 76px -46px #80756632}
#citadel[data-theme=wood] .field-vignette{box-shadow:inset 0 0 72px 7px #6d3c1b24,inset 0 -58px 78px -46px #3d210f48}
#citadel[data-theme=space] .field-vignette{box-shadow:inset 0 0 70px 6px #5a69ff20,inset 0 -54px 80px -46px #03050d62}
#citadel[data-theme=crystal] .field-vignette{box-shadow:inset 0 0 64px 5px #aaf6ff26,inset 0 -52px 76px -46px #4a5f7d32}
#citadel[data-theme=porcelain] .field-vignette{box-shadow:inset 0 0 62px 5px #ffffff34,inset 0 -52px 74px -46px #49657b2c}

#citadel[data-theme=laser] #field,#citadel[data-theme=laser].immersive #field{background:radial-gradient(circle at 20% 30%,#42e8f51b 0 6%,transparent 18%),radial-gradient(circle at 76% 24%,#ff5db918 0 7%,transparent 20%),radial-gradient(circle at 64% 72%,#8f6cff18 0 8%,transparent 22%),radial-gradient(circle at 34% 78%,#ffc2730e 0 6%,transparent 18%),linear-gradient(180deg,#08101f 0%,#101a32 48%,#172a47 100%)}
#citadel[data-theme=laser] #field::before{left:0;right:0;top:0;height:100%;background:repeating-linear-gradient(90deg,transparent 0 9.7%,#42e8f510 9.85%,transparent 10%),repeating-linear-gradient(0deg,transparent 0 13.7%,#ff5db90e 13.85%,transparent 14%),linear-gradient(115deg,transparent 0 28%,#8f6cff12 31%,transparent 34% 63%,#ffc2730c 66%,transparent 69%);filter:none;opacity:.46;transform:none;animation:laserPhotonPulse 5.2s ease-in-out infinite}
#citadel[data-theme=laser] #field::after{left:-5%;right:-5%;bottom:-4%;height:60%;background:radial-gradient(ellipse at 38% 100%,#42e8f51c 0 5%,transparent 34%),radial-gradient(ellipse at 68% 96%,#ff5db914 0 6%,transparent 36%),linear-gradient(180deg,transparent 0 48%,#8f6cff0d 76%,#06081482 100%);opacity:.70}
@keyframes laserPhotonPulse{0%,100%{opacity:.38;filter:brightness(.96)}50%{opacity:.52;filter:brightness(1.12)}}

#citadel[data-theme=space] #field,#citadel[data-theme=space].immersive #field{background:radial-gradient(circle at 12% 18%,#ffffff 0 1px,transparent 1.5px),radial-gradient(circle at 31% 40%,#9de8ff 0 1px,transparent 1.5px),radial-gradient(circle at 68% 22%,#ffffff 0 1px,transparent 1.5px),radial-gradient(circle at 84% 52%,#d3b8ff 0 1px,transparent 1.5px),radial-gradient(circle at 57% 76%,#ffffff 0 1px,transparent 1.5px),radial-gradient(ellipse at 72% 30%,#7a45ff22 0 11%,transparent 31%),radial-gradient(ellipse at 28% 68%,#ff5f9d18 0 10%,transparent 30%),linear-gradient(180deg,#030510 0%,#090f2a 58%,#111e3c 100%)}
#citadel[data-theme=space] #field::before{background:radial-gradient(circle at 18% 32%,#fff 0 1px,transparent 1.4px),radial-gradient(circle at 47% 18%,#8cecff 0 1px,transparent 1.4px),radial-gradient(circle at 74% 64%,#fff 0 1px,transparent 1.4px),radial-gradient(circle at 90% 28%,#ff9fcc 0 1px,transparent 1.4px);filter:none;opacity:.55;animation:tankSkyDrift 80s linear infinite}
#citadel[data-theme=space] #field::after{background:radial-gradient(ellipse at 50% 100%,#3154a52d 0 8%,#151e4a1c 35%,transparent 66%);opacity:.72}

#citadel[data-theme=marble] #field{background:radial-gradient(circle at 76% 16%,#fff4cfcc 0 4%,#fff4cf38 5% 13%,transparent 24%),linear-gradient(180deg,#91aab7 0%,#c8d3d3 48%,#eee4d2 80%,#b9ae9c 100%)}
#citadel[data-theme=wood] #field{background:radial-gradient(circle at 75% 16%,#ffe2a8cc 0 4%,#ffe2a83d 5% 14%,transparent 25%),linear-gradient(180deg,#7c9ba6 0%,#b9a276 46%,#e8bf77 79%,#795038 100%)}
#citadel[data-theme=crystal] #field{background:radial-gradient(circle at 73% 15%,#fff1d5c4 0 4%,#fff1d532 5% 13%,transparent 24%),linear-gradient(180deg,#76a9c7 0%,#a9d9de 48%,#e0e5ff 78%,#859bc0 100%)}
#citadel[data-theme=porcelain] #field{background:radial-gradient(circle at 76% 15%,#fff3d2c7 0 4%,#fff3d235 5% 13%,transparent 24%),linear-gradient(180deg,#89acc5 0%,#c5d7df 48%,#f2eadf 80%,#91a8b9 100%)}

#citadel[data-theme=laser] .primary,#citadel[data-theme=laser] .view-toggle,#citadel[data-theme=laser] .mobile-status,#citadel[data-theme=laser] .theme-card[aria-pressed=true]{box-shadow:0 0 10px color-mix(in srgb,var(--mint) 25%,transparent),0 0 18px color-mix(in srgb,var(--orange) 10%,transparent),inset 0 0 10px color-mix(in srgb,var(--gold) 8%,transparent)}
.theme-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:980px){.theme-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){.theme-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.theme-card:last-child{grid-column:auto}}
@media(max-width:380px){.theme-grid{grid-template-columns:1fr}.theme-card:last-child{grid-column:auto}}


/* v5.1 material-theme reduced-motion lock */
#citadel.reduce-motion[data-theme=laser] #field::before,#citadel.reduce-motion[data-theme=space] #field::before{animation:none!important}
@media(prefers-reduced-motion:reduce){#citadel[data-theme=laser] #field::before,#citadel[data-theme=space] #field::before{animation:none!important}}


/* v5.2 cinematic world beyond the battlefield — decorative only, never collision-authoritative. */
.world-sky,.world-horizon,.weather-backdrop{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.world-sky{z-index:0;opacity:.88}
.world-horizon{z-index:1;top:34%;opacity:.72;filter:saturate(.94)}
.weather-backdrop{z-index:1;opacity:0}
.world-sky::before,.world-sky::after{content:'';position:absolute;pointer-events:none}
.world-sky::before{
 width:min(15vw,170px);aspect-ratio:1;right:17%;top:10%;border-radius:50%;
 background:radial-gradient(circle,#fff7cc 0 30%,#ffe7a882 31% 46%,#ffd88222 47% 64%,transparent 66%);
 filter:blur(.2px);opacity:.72;
}
.world-sky::after{
 left:-15%;right:-15%;top:8%;height:42%;
 background:
  radial-gradient(ellipse at 15% 36%,color-mix(in srgb,var(--sky-cloud) 30%,transparent) 0 7%,transparent 8%),
  radial-gradient(ellipse at 43% 22%,color-mix(in srgb,var(--sky-cloud) 22%,transparent) 0 8%,transparent 9%),
  radial-gradient(ellipse at 72% 42%,color-mix(in srgb,var(--sky-cloud) 26%,transparent) 0 9%,transparent 10%);
 opacity:.60;filter:blur(9px);animation:worldCloudDrift 58s linear infinite;
}

/* Industrial / grounded horizons */
#citadel[data-theme=iron] .world-horizon{
 background:
  linear-gradient(135deg,transparent 0 52%,#3c4c49aa 53% 68%,transparent 69%) 0 100%/230px 150px repeat-x,
  linear-gradient(225deg,transparent 0 54%,#53635daa 55% 70%,transparent 71%) 110px 100%/250px 175px repeat-x,
  linear-gradient(180deg,transparent 0 63%,#29393554 82%,transparent 100%);
}
#citadel[data-theme=realistic] .world-horizon{
 background:
  linear-gradient(135deg,transparent 0 51%,#59655f9a 52% 70%,transparent 71%) 0 100%/270px 170px repeat-x,
  linear-gradient(225deg,transparent 0 53%,#6a736a82 54% 72%,transparent 73%) 140px 100%/300px 200px repeat-x,
  linear-gradient(180deg,transparent 0 62%,#424a466e 84%,transparent 100%);
 opacity:.62;
}
#citadel[data-theme=jungle] .world-horizon{
 background:
  radial-gradient(ellipse at 50% 100%,#154c2caa 0 48%,transparent 49%) 0 100%/88px 122px repeat-x,
  radial-gradient(ellipse at 50% 100%,#276c3ca0 0 45%,transparent 46%) 42px 100%/105px 150px repeat-x,
  linear-gradient(180deg,transparent 0 60%,#123a2466 82%,transparent 100%);
 opacity:.78;
}
#citadel[data-theme=animated] .world-horizon{
 background:
  linear-gradient(135deg,transparent 0 52%,#3f756eb0 53% 70%,transparent 71%) 0 100%/210px 130px repeat-x,
  linear-gradient(225deg,transparent 0 54%,#6c9a72a8 55% 72%,transparent 73%) 105px 100%/230px 155px repeat-x,
  linear-gradient(180deg,transparent 0 65%,#3d696064 88%,transparent 100%);
 opacity:.68;filter:saturate(1.05);
}
#citadel[data-theme=colorful] .world-horizon{
 background:
  repeating-linear-gradient(90deg,transparent 0 48px,#6f54a87c 49px 62px,transparent 63px 94px),
  linear-gradient(180deg,transparent 0 52%,#4b34706b 71%,#24193a55 88%,transparent 100%);
 mask-image:linear-gradient(180deg,transparent 0 32%,#000 62%,#000 100%);
 opacity:.54;
}

/* Signature material horizons */
#citadel[data-theme=siberia] .world-horizon{
 background:
  linear-gradient(135deg,transparent 0 48%,#8ea9b7d0 49% 66%,#eff5f4e8 67% 74%,transparent 75%) 0 100%/250px 205px repeat-x,
  linear-gradient(225deg,transparent 0 50%,#708d9dc0 51% 69%,#f8fbfae6 70% 77%,transparent 78%) 125px 100%/300px 245px repeat-x,
  linear-gradient(180deg,transparent 0 66%,#7f9cab55 90%,transparent 100%);
 opacity:.88;
}
#citadel[data-theme=marble] .world-horizon{
 background:
  repeating-linear-gradient(90deg,transparent 0 72px,#9b93869c 73px 81px,#d4cabba8 82px 92px,transparent 93px 145px),
  linear-gradient(180deg,transparent 0 55%,#aa9e8b55 77%,transparent 100%);
 mask-image:linear-gradient(180deg,transparent 0 33%,#000 58%,#000 100%);
 opacity:.66;
}
#citadel[data-theme=wood] .world-horizon{
 background:
  conic-gradient(from 225deg at 50% 100%,transparent 0 25%,#3a271cbb 0 50%,transparent 0) 0 100%/105px 160px repeat-x,
  conic-gradient(from 225deg at 50% 100%,transparent 0 25%,#5c3a24a8 0 50%,transparent 0) 50px 100%/125px 185px repeat-x,
  linear-gradient(180deg,transparent 0 62%,#3c281b66 85%,transparent 100%);
 opacity:.76;
}
#citadel[data-theme=crystal] .world-horizon{
 background:
  conic-gradient(from 225deg at 50% 100%,transparent 0 25%,#52c3d49e 0 50%,transparent 0) 0 100%/118px 168px repeat-x,
  conic-gradient(from 225deg at 50% 100%,transparent 0 25%,#ba70d49c 0 50%,transparent 0) 58px 100%/142px 205px repeat-x,
  linear-gradient(180deg,transparent 0 61%,#6d81b05d 88%,transparent 100%);
 filter:saturate(1.08);opacity:.74;
}
#citadel[data-theme=porcelain] .world-horizon{
 background:
  repeating-linear-gradient(90deg,transparent 0 80px,#244f7d7d 81px 86px,#d5d2c8a8 87px 98px,transparent 99px 155px),
  linear-gradient(180deg,transparent 0 58%,#6c82915a 81%,transparent 100%);
 mask-image:linear-gradient(180deg,transparent 0 34%,#000 60%,#000 100%);
 opacity:.58;
}

/* Photon and cosmic worlds keep the backdrop dramatic but readable. */
#citadel[data-theme=laser] .world-sky{
 background:
  radial-gradient(circle at 18% 28%,#42e8f51a 0 5%,transparent 18%),
  radial-gradient(circle at 80% 32%,#ff5db918 0 6%,transparent 20%),
  radial-gradient(circle at 55% 76%,#8f6cff18 0 7%,transparent 22%);
}
#citadel[data-theme=laser] .world-sky::before{background:radial-gradient(circle,#fff1bf 0 18%,#ffc273b8 20% 32%,#ff5db93d 34% 48%,transparent 62%);opacity:.46}
#citadel[data-theme=laser] .world-horizon{
 background:
  repeating-linear-gradient(90deg,transparent 0 84px,#42e8f529 85px 87px,transparent 88px 166px),
  repeating-linear-gradient(0deg,transparent 0 40px,#ff5db920 41px 42px,transparent 43px 80px),
  linear-gradient(180deg,transparent 0 54%,#8f6cff22 70%,#06102255 88%,transparent 100%);
 opacity:.58;
}
#citadel[data-theme=space] .world-sky{
 background:
  radial-gradient(circle at 15% 18%,#ffffff 0 1px,transparent 1.5px),
  radial-gradient(circle at 32% 42%,#9de8ff 0 1px,transparent 1.5px),
  radial-gradient(circle at 67% 21%,#ffffff 0 1px,transparent 1.5px),
  radial-gradient(circle at 84% 58%,#d6b8ff 0 1px,transparent 1.5px),
  radial-gradient(ellipse at 76% 27%,#704cff24 0 10%,transparent 30%),
  radial-gradient(ellipse at 27% 70%,#ff5f9d1d 0 9%,transparent 29%);
}
#citadel[data-theme=space] .world-sky::before{width:min(18vw,205px);right:12%;top:8%;background:radial-gradient(circle at 38% 36%,#91caff 0 11%,#5d59b9 29%,#32276c 52%,#120d2c 67%,transparent 69%);box-shadow:-70px 58px 0 -45px #d07cff99;opacity:.82}
#citadel[data-theme=space] .world-sky::after{opacity:.22;filter:blur(16px)}
#citadel[data-theme=space] .world-horizon{background:radial-gradient(ellipse at 50% 100%,#2d4eaa45 0 8%,#1a275f2d 36%,transparent 68%);opacity:.68}

/* Weather now continues into the world behind the board instead of stopping at the battlefield edge. */
#citadel[data-weather=rain] .weather-backdrop,#citadel[data-weather=storm] .weather-backdrop{
 opacity:.42;
 background:repeating-linear-gradient(104deg,transparent 0 21px,#d8efff2d 22px 23px,transparent 24px 47px);
 animation:worldRain .72s linear infinite;
}
#citadel[data-weather=storm] .weather-backdrop{opacity:.56;filter:brightness(.78)}
#citadel[data-weather=snow] .weather-backdrop{
 opacity:.62;
 background:
  radial-gradient(circle,#fff 0 1.5px,transparent 2px) 0 0/48px 48px,
  radial-gradient(circle,#eaf6ff 0 1px,transparent 1.7px) 21px 14px/64px 64px;
 animation:worldSnow 11s linear infinite;
}
#citadel[data-weather=dust] .weather-backdrop{
 opacity:.42;
 background:linear-gradient(110deg,transparent 0 15%,#d8a65b24 35%,#c9985340 58%,transparent 84%);
 filter:blur(10px);animation:worldDust 13s ease-in-out infinite alternate;
}
#citadel[data-weather=smoke] .weather-backdrop,#citadel[data-weather=ash] .weather-backdrop{
 opacity:.36;
 background:
  radial-gradient(ellipse at 15% 75%,#555c5b52 0 8%,transparent 28%),
  radial-gradient(ellipse at 55% 65%,#68645d42 0 10%,transparent 34%),
  radial-gradient(ellipse at 85% 78%,#575b5a50 0 8%,transparent 30%);
 filter:blur(16px);animation:worldSmoke 18s ease-in-out infinite alternate;
}
#citadel[data-weather=embers] .weather-backdrop{
 opacity:.55;
 background:
  radial-gradient(circle,#ffb65d 0 1px,transparent 1.8px) 0 0/52px 62px,
  radial-gradient(circle,#ff7248 0 1px,transparent 1.8px) 23px 19px/71px 79px;
 animation:worldEmbers 8s linear infinite;
}

@keyframes worldCloudDrift{from{transform:translate3d(-2%,0,0)}to{transform:translate3d(9%,1%,0)}}
@keyframes worldRain{from{background-position:0 -40px}to{background-position:-18px 80px}}
@keyframes worldSnow{from{background-position:0 -40px,21px -20px}to{background-position:20px 100px,5px 135px}}
@keyframes worldDust{from{transform:translateX(-4%)}to{transform:translateX(6%)}}
@keyframes worldSmoke{from{transform:translateX(-3%) scale(1)}to{transform:translateX(4%) scale(1.06)}}
@keyframes worldEmbers{from{background-position:0 70px,23px 90px}to{background-position:10px -80px,3px -110px}}

#citadel.reduce-motion .world-sky::after,#citadel.reduce-motion .weather-backdrop{animation:none!important}
@media(prefers-reduced-motion:reduce){.world-sky::after,.weather-backdrop{animation:none!important}}

/* Softer exposure on the new material worlds, leaving the already-strong classic fields alone. */
#citadel[data-theme=marble] .field-vignette{box-shadow:inset 0 0 72px 7px #786e5e38,inset 0 -58px 78px -46px #5d554b42}
#citadel[data-theme=wood] .field-vignette{box-shadow:inset 0 0 74px 8px #321e1338,inset 0 -62px 84px -46px #21130b55}
#citadel[data-theme=space] .field-vignette{box-shadow:inset 0 0 68px 6px #536cff1c,inset 0 -54px 80px -46px #02040d4c}
#citadel[data-theme=crystal] .field-vignette{box-shadow:inset 0 0 72px 7px #8be9f12a,inset 0 -56px 78px -46px #56628d3b}
#citadel[data-theme=porcelain] .field-vignette{box-shadow:inset 0 0 72px 7px #ffffff28,inset 0 -58px 80px -46px #586c7b40}


/* v5.3 premium camera and universal control surface */
.control-legend{
 position:absolute;left:50%;bottom:12px;transform:translateX(-50%);z-index:13;
 display:flex;align-items:center;gap:9px;max-width:min(820px,calc(100vw - 36px));
 padding:7px 8px 7px 11px;border:1px solid color-mix(in srgb,var(--line) 76%,transparent);
 background:color-mix(in srgb,var(--ink2) 88%,transparent);backdrop-filter:blur(8px);
 box-shadow:0 8px 25px #0004;color:var(--muted);font:700 7px var(--mono);letter-spacing:.55px;
 pointer-events:auto;transition:opacity .18s,border-color .18s,background-color .18s;
}
.control-legend>b{color:var(--mint);letter-spacing:1.2px;white-space:nowrap}
.control-legend>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.control-legend>button{flex:0 0 auto;width:25px;height:25px;border:1px solid var(--line);background:color-mix(in srgb,var(--ink) 86%,transparent);color:var(--gold);font:800 11px var(--mono)}
.control-legend.expanded{max-width:min(920px,calc(100vw - 28px));padding:10px 12px}
.control-legend.expanded>span{white-space:normal;line-height:1.45;overflow:visible}
#citadel[data-input=gamepad] .control-legend{border-color:color-mix(in srgb,var(--mint) 55%,var(--line))}
#citadel[data-input=touch] .control-legend{border-color:color-mix(in srgb,var(--gold) 42%,var(--line))}
.touch-camera-tools{
 position:absolute;left:50%;bottom:max(21px,env(safe-area-inset-bottom));transform:translateX(-50%);
 display:flex;gap:6px;pointer-events:auto;
}
.touch-camera-tools button{
 min-width:72px;padding:8px 9px;border:1px solid color-mix(in srgb,var(--mint) 48%,var(--line));
 background:color-mix(in srgb,var(--ink2) 84%,transparent);color:var(--paper);
 font:700 7px var(--mono);letter-spacing:1px;touch-action:manipulation;backdrop-filter:blur(6px);
}
.touch-camera-tools button:active{transform:translateY(1px);filter:brightness(1.22)}
#scene{touch-action:none}
#citadel[data-view=menu] #scene{cursor:grab}
#citadel[data-view=game]:not(.immersive) #scene{cursor:crosshair}
#citadel[data-view=game]:not(.immersive) #scene:active,#citadel[data-view=menu] #scene:active{cursor:grabbing}

@media(pointer:coarse),(max-width:900px){
 .control-legend{bottom:calc(174px + env(safe-area-inset-bottom));max-width:calc(100vw - 28px);font-size:6.4px;padding:6px 7px 6px 9px}
 .control-legend>b{letter-spacing:.7px}
 .control-legend>button{width:23px;height:23px}
}
@media(max-width:600px) and (orientation:portrait){
 .control-legend{bottom:calc(118px + env(safe-area-inset-bottom));left:12px;right:12px;transform:none;max-width:none;gap:6px}
 .control-legend>span{font-size:6px;letter-spacing:.15px}
 .control-legend.expanded{left:10px;right:10px;max-width:none}
 .touch-camera-tools{bottom:max(12px,env(safe-area-inset-bottom));flex-direction:column;gap:4px}
 .touch-camera-tools button{min-width:66px;padding:7px 6px;font-size:6px}
}
@media(max-height:540px) and (orientation:landscape){
 .control-legend{bottom:5px;left:50%;right:auto;transform:translateX(-50%);max-width:48vw;padding:5px 7px;font-size:5.8px}
 .control-legend>b{display:none}.control-legend>button{width:21px;height:21px}
 .touch-camera-tools{bottom:18px}.touch-camera-tools button{min-width:62px;padding:6px;font-size:6px}
}


/* v5.4 twelve-tank garage */
.armory-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:3px;max-height:166px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}
.armory-tabs button{min-width:0;flex:none;padding:9px 6px;font-size:8px;line-height:1.2}
.armory-tabs button[data-enemy]{grid-column:1/-1;flex-basis:auto}
@media(max-width:900px){.armory-tabs{grid-template-columns:repeat(3,minmax(0,1fr));max-height:150px}.armory-tabs button{padding:8px 5px;font-size:7px}}
@media(max-height:540px) and (orientation:landscape){.armory-tabs{grid-template-columns:repeat(4,minmax(0,1fr));max-height:94px}.armory-tabs button{padding:6px 4px;font-size:6.5px}}
@media(max-width:600px) and (orientation:portrait){.armory-tabs{grid-template-columns:repeat(3,minmax(0,1fr));max-height:116px}.armory-tabs button{padding:7px 4px;font-size:6.5px}}
