:root{--void:#03080d;--panel:rgba(7,20,27,.9);--cyan:#69e5dc;--amber:#ffbd69;--red:#ff665c;--green:#7ce0a8;--ink:#eaf5ef;--muted:#85a4a6;--font-display:"Microsoft YaHei UI","PingFang SC","Source Han Sans SC",sans-serif;--font-editorial:"STZhongsong","FZShuSong-Z01","Source Han Serif SC","SimSun",serif;--font-interface:"DengXian","Microsoft YaHei UI","Noto Sans SC",sans-serif;--font-tech:"Bahnschrift SemiCondensed","DIN Alternate","Cascadia Mono","Consolas",monospace;--display:var(--font-display);--text:var(--font-interface);--shadow:0 18px 70px rgba(0,0,0,.46)}
*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden;background:var(--void);color:var(--ink);font-family:var(--text);-webkit-font-smoothing:antialiased}button{font:inherit;color:inherit;border:0;cursor:pointer}.app-shell{height:100%;min-height:650px;display:grid;grid-template-rows:70px 1fr;background:radial-gradient(circle at 48% 42%,#0c2028 0,#061118 36%,#02070b 76%)}
.topbar{z-index:30;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 clamp(18px,3vw,54px);border-bottom:1px solid rgba(105,229,220,.15);background:linear-gradient(180deg,rgba(5,14,20,.98),rgba(4,11,16,.88));box-shadow:0 9px 28px rgba(0,0,0,.35)}.brand-lockup{display:flex;align-items:center;gap:13px}.brand-lockup canvas{width:46px;height:46px;image-rendering:pixelated}.brand-lockup strong{display:block;color:#ffe0a5;font-family:var(--display);font-size:24px;letter-spacing:.16em;line-height:1}.brand-lockup span{display:block;margin-top:7px;color:#5ebbb9;font-family:var(--display);font-size:9px;letter-spacing:.22em}.run-readout{text-align:center;min-width:215px}.run-readout strong{display:block;font-family:var(--display);font-size:27px;letter-spacing:.13em;font-variant-numeric:tabular-nums}.run-readout span{color:var(--muted);font-size:9px;letter-spacing:.16em}.run-readout span:first-child{color:var(--amber);margin-right:14px}.top-actions{display:flex;justify-content:flex-end;gap:8px}
.quiet-button,.icon-button{min-height:36px;padding:0 14px;border:1px solid rgba(105,229,220,.2);background:linear-gradient(180deg,rgba(19,42,49,.75),rgba(8,20,27,.84));color:#b7d2d1;font-family:var(--display);font-size:12px;letter-spacing:.08em;clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px);transition:.16s}.quiet-button:hover,.icon-button:hover{border-color:rgba(105,229,220,.65);color:#fff;filter:brightness(1.14)}.icon-button{display:flex;align-items:center;gap:8px}.icon-button b{font-weight:500}.speaker-icon{width:12px;height:14px;border-left:5px solid var(--cyan);border-top:5px solid transparent;border-bottom:5px solid transparent}.pause-icon{width:10px;height:13px;border-left:3px solid var(--cyan);border-right:3px solid var(--cyan)}
.game-frame{position:relative;width:min(calc((100vh - 92px)*1.7777),calc(100vw - 28px));height:min(calc(100vh - 92px),calc((100vw - 28px)*.5625));min-height:520px;align-self:center;justify-self:center;overflow:hidden;border:1px solid rgba(105,229,220,.28);background:#02070c;box-shadow:0 0 0 4px rgba(4,13,18,.9),0 0 0 5px rgba(255,189,105,.13),var(--shadow)}#game-canvas{position:absolute;inset:0;width:100%;height:100%;image-rendering:pixelated;cursor:none}.scanline{pointer-events:none;position:absolute;inset:0;z-index:4;opacity:.11;background:repeating-linear-gradient(180deg,transparent 0,transparent 3px,rgba(125,239,230,.07) 4px);mix-blend-mode:screen}.corner{position:absolute;z-index:12;width:23px;height:23px;pointer-events:none}.corner-tl{left:7px;top:7px;border-left:2px solid var(--cyan);border-top:2px solid var(--cyan)}.corner-tr{right:7px;top:7px;border-right:2px solid var(--cyan);border-top:2px solid var(--cyan)}.corner-bl{left:7px;bottom:7px;border-left:2px solid var(--amber);border-bottom:2px solid var(--amber)}.corner-br{right:7px;bottom:7px;border-right:2px solid var(--amber);border-bottom:2px solid var(--amber)}
.glass-panel{position:absolute;z-index:10;border:1px solid rgba(105,229,220,.22);background:linear-gradient(135deg,rgba(6,20,27,.91),rgba(4,14,20,.73));box-shadow:inset 0 1px rgba(255,255,255,.035),0 9px 30px rgba(0,0,0,.25);backdrop-filter:blur(5px)}.panel-label{display:flex;justify-content:space-between;margin-bottom:10px;color:#6aa4a5;font-family:var(--display);font-size:9px;letter-spacing:.17em}.panel-label b{color:var(--green);font-weight:500}.planet-panel{left:20px;top:22px;width:238px;padding:14px 16px 13px;border-left:2px solid var(--cyan)}.integrity-row{display:flex;justify-content:space-between;align-items:baseline}.integrity-row strong{font-family:var(--display);font-size:15px;letter-spacing:.07em}.integrity-row span{color:#b9d0cc;font-family:var(--display);font-size:12px}.meter{position:relative;height:6px;overflow:hidden;background:#0b181d;border:1px solid rgba(132,188,185,.13)}.meter i,.meter em{position:absolute;left:0;top:0;height:100%;display:block;transition:width .24s}.meter i{background:linear-gradient(90deg,#2db7ad,#75ecce)}.meter em{background:#69c9ff;opacity:.82}.integrity-row+.meter{margin-top:8px}.mini-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:10px;background:rgba(105,229,220,.09)}.mini-grid div{padding:7px 5px;background:rgba(5,16,22,.95);text-align:center}.mini-grid span{display:block;color:#65888a;font-size:8px}.mini-grid b{display:block;margin-top:2px;font-family:var(--display);font-size:13px;font-weight:500}
.level-panel{right:20px;top:22px;width:244px;display:flex;align-items:center;gap:13px;padding:12px;border-right:2px solid var(--amber)}.level-disc{width:48px;height:48px;display:grid;place-content:center;text-align:center;border:1px solid rgba(255,189,105,.52);transform:rotate(45deg);background:rgba(29,27,19,.77)}.level-disc>*{transform:rotate(-45deg)}.level-disc span{color:#a99372;font-size:7px}.level-disc b{color:#ffdaa0;font-family:var(--display);font-size:20px;line-height:1}.level-copy{flex:1}.level-copy span{display:block;margin-bottom:7px;color:#b9cfcb;font-family:var(--display);font-size:11px}.xp i{background:linear-gradient(90deg,#b87532,#ffd086)}.command-panel{right:20px;top:103px;width:244px;padding:12px 14px}.command-row{display:grid;grid-template-columns:44px 1fr auto;align-items:center;gap:7px;margin-top:6px;color:#a9c2c1;font-size:9px}.command-row kbd{padding:3px 5px;border:1px solid rgba(105,229,220,.29);background:#09171d;color:#d9efeb;font-family:var(--display);font-size:8px;text-align:center}.command-row i{color:var(--green);font-size:8px;font-style:normal}
.combat-dock{position:absolute;z-index:11;left:18px;right:18px;bottom:15px;display:grid;grid-template-columns:1fr 230px;align-items:end;gap:20px;pointer-events:none}.weapon-rack{display:flex;gap:7px}.weapon-chip{width:112px;height:52px;position:relative;display:grid;grid-template-columns:36px 1fr;align-items:center;gap:7px;padding:6px;border:1px solid rgba(105,229,220,.22);background:linear-gradient(180deg,rgba(10,27,34,.93),rgba(5,15,20,.92));box-shadow:0 7px 22px rgba(0,0,0,.23)}.weapon-chip.evolved{border-color:rgba(255,189,105,.68);box-shadow:inset 0 0 18px rgba(255,171,76,.09)}.weapon-chip canvas{width:34px;height:34px;image-rendering:pixelated}.weapon-chip strong{display:block;overflow:hidden;font-family:var(--display);font-size:10px;white-space:nowrap;text-overflow:ellipsis}.weapon-chip span{display:block;margin-top:3px;color:#6f9695;font-family:var(--display);font-size:8px}.ticks{position:absolute;left:48px;right:7px;bottom:6px;display:flex;gap:2px}.ticks i{height:2px;flex:1;background:#18333a}.ticks i.on{background:var(--cyan)}.evolved .ticks i.on{background:var(--amber)}.run-progress{padding:9px 11px;border:1px solid rgba(105,229,220,.18);background:rgba(4,15,20,.86)}.run-progress span,.run-progress b{font-family:var(--display);font-size:9px;font-weight:500}.run-progress b{float:right;color:#a5bebc}.run-progress .meter{margin-top:6px}.run-progress .meter i{background:linear-gradient(90deg,var(--cyan),var(--amber))}
.boss-bar{position:absolute;z-index:13;left:50%;top:22px;width:420px;transform:translateX(-50%);display:grid;grid-template-columns:130px 1fr 45px;align-items:center;gap:11px;padding:8px 12px;border:1px solid rgba(255,102,92,.55);background:rgba(22,8,10,.86)}.boss-bar span{color:#ffc0aa;font-family:var(--display);font-size:11px}.boss-bar .meter i{background:linear-gradient(90deg,#c73636,#ff8d59)}.boss-bar b{font-family:var(--display);font-size:10px}.hidden{display:none!important}.era-banner{position:absolute;z-index:20;left:50%;top:42%;width:440px;transform:translate(-50%,-50%);padding:25px 30px;border-top:1px solid var(--amber);border-bottom:1px solid var(--amber);background:linear-gradient(90deg,transparent,rgba(7,17,22,.96) 15%,rgba(7,17,22,.96) 85%,transparent);text-align:center;animation:bannerIn 2.8s both}.era-banner span{color:var(--amber);font-family:var(--display);font-size:9px;letter-spacing:.25em}.era-banner strong{display:block;margin:6px 0;color:#fff0cb;font-family:var(--display);font-size:31px;letter-spacing:.14em}.era-banner p{margin:0;color:#81b0ae;font-size:11px}.warning-ring{position:absolute;z-index:12;left:50%;top:50%;width:320px;height:320px;padding-top:13px;transform:translate(-50%,-50%);border:1px dashed rgba(255,102,92,.55);border-radius:50%;color:#ff8d75;font-family:var(--display);font-size:9px;letter-spacing:.23em;text-align:center;animation:warningPulse 1s infinite}.toast-stack{position:absolute;z-index:20;left:50%;top:118px;transform:translateX(-50%);display:grid;gap:6px}.toast{min-width:280px;padding:9px 16px;border-left:2px solid var(--amber);background:rgba(6,17,22,.92);box-shadow:0 7px 26px rgba(0,0,0,.3);font-size:10px;text-align:center;animation:toast 3.2s both}.toast b{color:var(--amber)}
.screen-layer{position:fixed;z-index:100;inset:0;display:none;place-items:center;background:rgba(2,7,11,.82);backdrop-filter:blur(8px)}.screen-layer.active{display:grid}.title-atmosphere{position:absolute;inset:0;background:radial-gradient(circle at 72% 52%,rgba(31,138,140,.17),transparent 25%),linear-gradient(115deg,rgba(255,183,92,.04),transparent 34%)}.title-atmosphere:after{content:"";position:absolute;right:8%;top:20%;width:min(47vw,700px);height:min(47vw,700px);border-radius:50%;border:1px solid rgba(105,229,220,.15);box-shadow:0 0 100px rgba(40,174,171,.09),inset -70px -40px 100px rgba(0,0,0,.8);background:radial-gradient(circle at 37% 34%,rgba(106,202,179,.28),rgba(19,80,86,.24) 30%,#07141b 63%,#02070b 65%)}.start-card{position:relative;width:min(620px,88vw);margin-right:min(35vw,540px);padding:36px 42px 32px;border-left:2px solid var(--amber);background:linear-gradient(120deg,rgba(5,16,22,.96),rgba(7,22,28,.88));box-shadow:0 25px 90px rgba(0,0,0,.43);clip-path:polygon(0 0,calc(100% - 26px) 0,100% 26px,100% 100%,20px 100%,0 calc(100% - 20px))}.eyebrow{color:var(--amber);font-family:var(--display);font-size:10px;letter-spacing:.24em}.start-card h1{margin:12px 0 14px;font-family:var(--display);font-size:clamp(42px,5vw,70px);line-height:.94}.start-card h1 em{color:#87ded4;font-style:normal}.lead{max-width:530px;margin:0;color:#9ab5b3;font-size:13px;line-height:1.85}.start-spec{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin:24px 0 14px;background:rgba(105,229,220,.12)}.start-spec div{padding:11px;background:#08171d}.start-spec span{display:block;color:#628a8b;font-size:8px}.start-spec strong{display:block;margin-top:5px;font-family:var(--display);font-size:11px}.legacy-strip{display:flex;justify-content:space-between;margin-bottom:16px;padding:9px 11px;border:1px solid rgba(255,189,105,.2);color:#7e9896;font-size:9px}.legacy-strip b{color:#d5ad74;font-weight:500}.primary-button{width:100%;min-height:58px;padding:0 22px;border:1px solid #74ded4;background:linear-gradient(100deg,#146d6c,#1b8580 55%,#b67d3e 160%);box-shadow:inset 0 1px rgba(255,255,255,.18),0 10px 32px rgba(34,157,152,.18);clip-path:polygon(13px 0,100% 0,100% calc(100% - 13px),calc(100% - 13px) 100%,0 100%,0 13px);text-align:left;transition:.18s;font-family:var(--display);font-size:17px;letter-spacing:.1em}.primary-button:hover{filter:brightness(1.15);transform:translateY(-1px)}.primary-button small{float:right;margin-top:4px;color:#c0e6df;font-size:8px}.start-note{margin-top:11px;color:#536f71;font-size:8px}.version-tag{position:absolute;right:28px;bottom:22px;color:#41676a;font-family:var(--display);font-size:8px;letter-spacing:.16em}
.upgrade-layer{background:radial-gradient(circle,rgba(11,36,43,.92),rgba(2,7,11,.95) 68%)}.upgrade-shell{width:min(1080px,92vw)}.upgrade-heading{text-align:center}.upgrade-heading h2{margin:6px 0 5px;font-family:var(--display);font-size:36px}.upgrade-heading p{margin:0;color:#759695;font-size:11px}.upgrade-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:28px}.upgrade-card{min-height:330px;padding:22px;border:1px solid rgba(105,229,220,.25);background:linear-gradient(155deg,rgba(13,35,42,.98),rgba(5,16,21,.98));box-shadow:0 20px 60px rgba(0,0,0,.3);clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,0 100%);text-align:left;transition:.18s}.upgrade-card:hover,.upgrade-card.focus{transform:translateY(-6px);border-color:rgba(105,229,220,.76)}.upgrade-card.evolution{border-color:rgba(255,189,105,.65);background:linear-gradient(155deg,rgba(43,31,18,.98),rgba(10,20,22,.98))}.card-top{display:flex;justify-content:space-between}.card-icon{width:72px;height:72px;border:1px solid rgba(105,229,220,.22);background:#07151b;image-rendering:pixelated}.card-number{display:grid;place-items:center;width:27px;height:27px;border:1px solid rgba(105,229,220,.3);color:#95c9c5;font-family:var(--display)}.upgrade-card .kind{display:block;margin-top:24px;color:var(--cyan);font-family:var(--display);font-size:9px;letter-spacing:.17em}.upgrade-card.evolution .kind{color:var(--amber)}.upgrade-card h3{margin:7px 0 5px;font-family:var(--display);font-size:22px}.upgrade-card .rank{color:#648b8c;font-family:var(--display);font-size:10px}.upgrade-card p{min-height:56px;margin:14px 0;color:#9bb5b2;font-size:11px;line-height:1.65}.effect-line{padding:10px;border-left:2px solid var(--cyan);background:rgba(105,229,220,.05);color:#c5ded8;font-family:var(--display);font-size:11px}.evolution .effect-line{border-color:var(--amber)}.synergy-line{margin-top:12px;color:#708f8e;font-size:9px}.reroll-row{display:flex;justify-content:center;align-items:center;gap:15px;margin-top:19px;color:#638080;font-size:9px}
.compact-layer .dialog-card{width:min(470px,88vw);padding:34px;border:1px solid rgba(105,229,220,.28);background:linear-gradient(145deg,#0b2028,#061117);box-shadow:var(--shadow);text-align:center;clip-path:polygon(16px 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%,0 16px)}.dialog-card h2{margin:8px 0;font-family:var(--display);font-size:33px}.dialog-card>p{margin:0 0 22px;color:#84a3a2;font-size:11px;line-height:1.7}.dialog-card .quiet-button{margin-top:9px;width:100%}.result-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin:18px 0;background:rgba(105,229,220,.1)}.result-stats div{padding:11px 5px;background:#08181e}.result-stats span{display:block;color:#658586;font-size:8px}.result-stats b{display:block;margin-top:4px;font-family:var(--display);font-size:17px}.monument-earned{margin-bottom:16px;padding:11px;border:1px solid rgba(255,189,105,.25);color:#ddbb84;font-size:10px}.codex-layer{place-items:stretch;background:#031016}.codex-shell{margin:70px auto 20px;width:min(1120px,94vw);overflow:auto}.codex-shell>header{position:sticky;top:0;z-index:2;display:flex;justify-content:space-between;align-items:center;padding:18px 22px;border-bottom:1px solid rgba(105,229,220,.2);background:#07171e}.codex-shell h2{margin:4px 0 0;font-family:var(--display);font-size:28px}.codex-content{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:16px;background:#041016}.codex-entry{padding:16px;border:1px solid rgba(105,229,220,.16);background:#081920}.codex-entry span{color:var(--cyan);font-family:var(--display);font-size:9px;letter-spacing:.14em}.codex-entry h3{margin:6px 0;font-family:var(--display);font-size:17px}.codex-entry p{margin:0;color:#789998;font-size:10px;line-height:1.7}.codex-entry b{display:block;margin-top:9px;color:#d1b17c;font-size:9px;font-weight:500}
@keyframes bannerIn{0%{opacity:0;transform:translate(-50%,-50%) scaleX(.7)}15%,75%{opacity:1;transform:translate(-50%,-50%) scaleX(1)}100%{opacity:0}}@keyframes warningPulse{50%{opacity:.35;transform:translate(-50%,-50%) scale(1.04)}}@keyframes toast{0%{opacity:0;transform:translateY(-8px)}10%,78%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-6px)}}
@media(max-width:1000px){.topbar{grid-template-columns:1fr auto}.run-readout{display:none}.command-panel{display:none}.planet-panel{transform:scale(.86);transform-origin:top left}.level-panel{transform:scale(.86);transform-origin:top right}.weapon-chip{width:92px}.combat-dock{grid-template-columns:1fr 170px}.start-card{margin-right:0}.title-atmosphere:after{opacity:.35}.upgrade-cards{gap:9px}.upgrade-card{min-height:300px;padding:16px}.codex-content{grid-template-columns:repeat(2,1fr)}}@media(max-width:720px){.topbar{height:58px;padding:0 10px}.app-shell{grid-template-rows:58px 1fr;min-height:450px}.brand-lockup canvas{width:36px;height:36px}.brand-lockup strong{font-size:18px}.brand-lockup span,.top-actions .quiet-button,.icon-button b{display:none}.game-frame{width:100vw;height:calc(100vh - 58px);min-height:0;border-left:0;border-right:0}.planet-panel{left:8px;top:8px}.level-panel{right:8px;top:8px;width:185px}.combat-dock{left:7px;right:7px;bottom:7px;display:block}.run-progress{display:none}.weapon-chip{width:75px;height:44px;grid-template-columns:28px 1fr}.weapon-chip canvas{width:27px;height:27px}.weapon-chip strong{font-size:8px}.ticks{left:39px}.start-card{padding:24px}.start-spec{grid-template-columns:1fr}.upgrade-cards{grid-template-columns:1fr;max-height:67vh;overflow:auto}.upgrade-card{min-height:210px}.codex-content{grid-template-columns:1fr}}
.game-frame:fullscreen{width:100vw;height:100vh;min-height:0;border:0;box-shadow:none;background:#02070c}.game-frame:fullscreen #game-canvas{width:100vw;height:100vh;object-fit:contain;background:#02070c}.weapon-chip.empty{opacity:.38;border-style:dashed;background:rgba(5,15,20,.55)}.weapon-chip.empty:after{content:"待部署";grid-column:1/3;color:#577477;font-family:var(--display);font-size:9px;letter-spacing:.12em;text-align:center}

/* Four font roles keep narrative, controls and telemetry visually distinct. */
body,button{font-family:var(--font-interface)}
.start-card h1,.brand-lockup strong,.primary-button,.upgrade-card h3,.dialog-card h2,.result-card h2{font-family:var(--font-display);font-weight:800;letter-spacing:-.035em}
.mode-briefing h2,.codex-entry h3,.archive-content h2{font-family:var(--font-editorial);font-weight:700;letter-spacing:.02em}
.eyebrow,.briefing-index,.briefing-copy>span,.briefing-meta dt,.panel-label,.run-readout,.level-data,.card-index,.card-kind,.version,.objective-panel,.weapon-chip small{font-family:var(--font-tech);font-variant-numeric:tabular-nums;letter-spacing:.12em}
.start-card h1{margin-bottom:15px}

/* Selected mode replaces the static pitch and changes as the player browses. */
.mode-briefing{position:relative;display:grid;grid-template-columns:58px minmax(0,1fr) 138px;gap:14px;align-items:stretch;min-height:118px;margin:0 0 14px;padding:15px 0 14px;border-top:1px solid rgba(99,230,215,.16);border-bottom:1px solid rgba(99,230,215,.16);overflow:hidden}
.mode-briefing:after{content:"";position:absolute;left:0;bottom:-1px;width:34%;height:1px;background:linear-gradient(90deg,var(--amber),transparent)}
.briefing-index{display:flex;flex-direction:column;justify-content:space-between;color:var(--amber);font-size:10px;writing-mode:vertical-rl;transform:rotate(180deg);border-left:1px solid rgba(255,196,95,.45);padding-left:9px}
.briefing-index i{display:block;width:1px;height:28px;background:linear-gradient(var(--amber),transparent)}
.briefing-copy{align-self:center;min-width:0}.briefing-copy>span{display:block;margin-bottom:5px;color:var(--cyan);font-size:8px}.mode-briefing h2{margin:0 0 7px;color:var(--ink);font-size:20px;line-height:1.18}.mode-briefing p{margin:0;color:#a9c1bd;font-size:11px;line-height:1.72}
.briefing-meta{display:grid;grid-template-rows:1fr 1fr;margin:0;border-left:1px solid rgba(99,230,215,.14)}.briefing-meta div{display:flex;flex-direction:column;justify-content:center;padding-left:13px}.briefing-meta div+div{border-top:1px solid rgba(99,230,215,.11)}.briefing-meta dt{color:var(--muted);font-size:7px}.briefing-meta dd{margin:4px 0 0;color:#d7e7e2;font:700 10px/1.35 var(--font-interface)}
.mode-briefing.is-changing .briefing-copy,.mode-briefing.is-changing .briefing-meta{animation:briefing-in .36s cubic-bezier(.2,.8,.2,1) both}.mode-briefing.is-changing .briefing-meta{animation-delay:.06s}@keyframes briefing-in{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
@media(max-width:720px){.mode-briefing{grid-template-columns:42px minmax(0,1fr);min-height:130px}.briefing-meta{grid-column:2;grid-template-columns:1fr 1fr;grid-template-rows:none;border-left:0;border-top:1px solid rgba(99,230,215,.12)}.briefing-meta div{padding:8px 10px 0 0}.briefing-meta div+div{border-top:0}.mode-briefing h2{font-size:18px}}

/* Rarity is communicated by the frame only; card copy describes the action. */
.upgrade-card{--rarity:#b87345;position:relative;border-color:color-mix(in srgb,var(--rarity) 72%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--rarity) 15%,transparent),0 20px 60px rgba(0,0,0,.3)}
.upgrade-card:after{content:"";position:absolute;inset:7px;border:1px solid color-mix(in srgb,var(--rarity) 23%,transparent);clip-path:polygon(0 0,100% 0,100% 100%,0 100%);pointer-events:none}
.upgrade-card.rarity-bronze{--rarity:#b87345}.upgrade-card.rarity-silver{--rarity:#c3d0d8;background:linear-gradient(155deg,rgba(20,34,40,.98),rgba(6,16,21,.98))}.upgrade-card.rarity-gold{--rarity:#ffd166;background:linear-gradient(155deg,rgba(42,32,17,.98),rgba(8,18,21,.98))}.upgrade-card.rarity-link{--rarity:#ff5969;background:linear-gradient(155deg,rgba(48,16,25,.98),rgba(9,15,21,.98))}
.upgrade-card:hover,.upgrade-card.focus{border-color:var(--rarity);box-shadow:0 0 0 1px color-mix(in srgb,var(--rarity) 34%,transparent),0 25px 65px rgba(0,0,0,.42)}
.upgrade-card .card-index{color:color-mix(in srgb,var(--rarity) 76%,#789795)}.upgrade-card .card-kind{color:var(--rarity);font-family:var(--font-interface);font-weight:700;letter-spacing:.08em}.upgrade-card>strong{color:var(--rarity)}

/* Reserve the rotated badge's real visual footprint so telemetry never overlaps it. */
.level-panel{display:grid;grid-template-columns:68px minmax(0,1fr);align-items:center;gap:7px}
.level-disc{justify-self:center;flex:none}.level-disc span{display:none}.level-disc b{font-size:21px}
.level-copy{min-width:0;padding-left:3px}.level-copy span{margin-bottom:7px;font-family:var(--font-interface);font-size:10px;font-weight:700;line-height:1.25;letter-spacing:.01em;white-space:nowrap}
@media(max-width:720px){.level-panel{grid-template-columns:58px minmax(0,1fr);gap:4px}.level-copy span{font-size:9px}}

/* Strong visual rarity hierarchy without printing rarity names on the card. */
.upgrade-card{border-width:2px;isolation:isolate;overflow:hidden}.upgrade-card:before{content:"";position:absolute;z-index:0;left:-45%;top:-20%;width:34%;height:145%;transform:skewX(-18deg);pointer-events:none}.upgrade-card>*{position:relative;z-index:1}
.upgrade-card.rarity-bronze{border-color:#a9683f;box-shadow:inset 0 0 0 1px rgba(210,130,76,.13),0 18px 46px rgba(0,0,0,.32)}.upgrade-card.rarity-bronze:after{inset:8px;border-color:rgba(201,121,72,.2)}
.upgrade-card.rarity-silver{border-color:#d5e0e6;box-shadow:inset 0 0 0 2px rgba(177,207,222,.18),0 0 20px rgba(174,211,228,.13),0 21px 54px rgba(0,0,0,.38)}.upgrade-card.rarity-silver:after{inset:6px;border-color:rgba(218,235,242,.34)}.upgrade-card.rarity-silver:before{background:linear-gradient(90deg,transparent,rgba(220,244,255,.09),transparent)}
.upgrade-card.rarity-gold{border-color:#ffd166;box-shadow:inset 0 0 0 2px rgba(255,196,75,.22),0 0 28px rgba(255,178,49,.22),0 24px 62px rgba(0,0,0,.42)}.upgrade-card.rarity-gold:after{inset:5px;border-color:rgba(255,222,133,.48)}.upgrade-card.rarity-gold:before{background:linear-gradient(90deg,transparent,rgba(255,224,142,.2),transparent);animation:rarity-sweep 3.8s ease-in-out infinite}
.upgrade-card.rarity-link{border-color:#ff5265;box-shadow:inset 0 0 0 2px rgba(255,52,82,.25),0 0 34px rgba(255,43,78,.28),0 24px 66px rgba(0,0,0,.45)}.upgrade-card.rarity-link:after{inset:4px;border-color:rgba(255,121,139,.55)}.upgrade-card.rarity-link:before{left:-35%;width:42%;background:linear-gradient(90deg,transparent,rgba(255,67,98,.24),transparent);animation:rarity-sweep 2.5s ease-in-out infinite}
.upgrade-card.rarity-silver .card-kind{color:#e0edf2}.upgrade-card.rarity-gold .card-kind{color:#ffe39b;text-shadow:0 0 10px rgba(255,199,75,.35)}.upgrade-card.rarity-link .card-kind{color:#ff9bab;text-shadow:0 0 12px rgba(255,55,88,.45)}
@keyframes rarity-sweep{0%,22%{left:-45%;opacity:0}38%{opacity:1}62%,100%{left:120%;opacity:0}}