.tank-shell{--ember:#ff9b50;--cyan:#62e6ce;color:#edf0e9;min-height:100svh;font-family:var(--font-sans);background:#080b0d;position:relative;overflow-x:hidden}.tank-keyart{z-index:0;filter:saturate(.82);background:linear-gradient(90deg,#06090bfa,#06090bad 52%,#06090bf0),url(/chu-han-realm-pages/_next/static/tank-battle-frontier-v1.png) 50% 36%/cover;position:fixed;inset:0}.tank-keyart:after{content:"";background:radial-gradient(circle at 50% 48%,#0000 0 22%,#000000b8 78%),repeating-linear-gradient(0deg,#0000 0 3px,#ffffff03 4px);position:absolute;inset:0}.tank-shell>:not(.tank-keyart){z-index:1;position:relative}.tank-header{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#080b0de3;border-bottom:1px solid #ff9b5038;grid-template-columns:1fr auto 1fr;align-items:center;height:88px;padding:0 clamp(16px,3vw,52px);display:grid}.tank-home{color:#bdc4be;letter-spacing:.12em;font-weight:800;text-decoration:none}.tank-brand{align-items:center;gap:14px;display:flex}.tank-brand>span{border:1px solid var(--ember);width:56px;height:56px;font:700 29px var(--font-serif);color:#ffd4a5;clip-path:polygon(50% 0,92% 21%,92% 78%,50% 100%,8% 78%,8% 21%);background:linear-gradient(145deg,#ff9b5026,#0000);place-items:center;display:grid}.tank-brand small,.tank-mission>p,.tank-intel>p,.tank-curtain>small,.tank-result>small,.tank-rules>small{letter-spacing:.28em;color:var(--cyan);font-size:9px}.tank-brand h1{font:700 28px var(--font-serif);letter-spacing:.18em;margin:3px 0 0}.tank-tools{justify-self:end;gap:8px;display:flex}.tank-tools button,.tank-pause{color:#dce1db;cursor:pointer;background:#0e1313cc;border:1px solid #ff9b5040;padding:11px 15px}.tank-layout{grid-template-columns:minmax(220px,270px) minmax(440px,740px) minmax(215px,270px);align-items:start;gap:20px;max-width:1640px;margin:auto;padding:22px clamp(14px,2.5vw,40px) 30px;display:grid}.tank-mission,.tank-intel{background:linear-gradient(145deg,#181c1bf5,#080c0ded);border:1px solid #ff9b502e;padding:24px;box-shadow:0 30px 80px #00000073}.tank-mission h2,.tank-intel h2{font:700 29px var(--font-serif);margin:8px 0}.tank-mission>span{color:#9ca59f;font-size:12px}.tank-chapters{gap:6px;margin:22px 0 17px;display:grid}.tank-chapters button{text-align:left;color:#78817c;cursor:pointer;background:0 0;border:0;border-left:2px solid #ff9b5021;grid-template-columns:38px 1fr;align-items:center;padding:8px 10px;display:grid}.tank-chapters button b{font:700 17px var(--font-serif)}.tank-chapters button small{font-size:11px}.tank-chapters button.active{color:#ffd09a;border-color:var(--ember);background:linear-gradient(90deg,#ff9b501a,#0000)}.tank-levels{grid-template-columns:repeat(5,1fr);gap:6px;display:grid}.tank-levels button{color:#8b948e;cursor:pointer;background:#101616;border:1px solid #ffffff14;flex-direction:column;justify-content:center;align-items:center;min-height:45px;font-weight:800;display:flex}.tank-levels button small{color:#5e6762;font-size:6px}.tank-levels button.active{border-color:var(--ember);color:#fff0d6;background:#ff9b501f;box-shadow:0 0 22px #ff9b501a}.tank-levels button:disabled{opacity:.3}.tank-record{border-top:1px solid #ffffff14;grid-template-columns:1fr 1fr;margin-top:18px;padding-top:15px;display:grid}.tank-record span{flex-direction:column;display:flex}.tank-record small{color:#727c77;font-size:9px}.tank-record b{color:#e7bf8f;margin-top:3px}.tank-hud{background:#090e0ff2;border:1px solid #ff9b5038;grid-template-columns:repeat(5,1fr);display:grid}.tank-hud span{border-right:1px solid #ffffff12;padding:11px 12px}.tank-hud span:last-child{border:0}.tank-hud small{color:#6f807b;letter-spacing:.14em;font-size:7px;display:block}.tank-hud b{color:#ebd4ac;margin-top:4px;font-size:14px;display:block}.tank-canvas-frame{background:#090d0e;border:1px solid #ff9b5066;border-top:0;padding:8px;position:relative;box-shadow:0 36px 90px #000,inset 0 0 35px #ff9b500a}.tank-canvas-frame canvas{object-fit:contain;width:100%;height:auto;max-height:calc(100svh - 235px);display:block}.tank-canvas-frame:before{content:"";pointer-events:none;position:absolute;inset:8px;box-shadow:inset 0 0 40px #000000a6}.tank-curtain{text-align:center;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:radial-gradient(circle,#232a27d4,#06090af7 70%);place-content:center;justify-items:center;padding:28px;display:grid;position:absolute;inset:8px}.tank-curtain h2{font:700 clamp(31px,5vw,54px) var(--font-serif);color:#f2d3a5;margin:12px 0}.tank-curtain p{color:#adb4ae;max-width:430px;line-height:1.8}.tank-curtain button,.tank-result .primary,.tank-rules .primary{border:1px solid var(--ember);color:#ffe2be;letter-spacing:.12em;cursor:pointer;background:linear-gradient(135deg,#ff9b504d,#20221c);margin-top:16px;padding:14px 24px;font-weight:900;box-shadow:0 12px 30px #ff7a371f}.tank-curtain.compact h2{font-size:36px}.tank-status{background:#090e0ff2;border:1px solid #ff9b5033;border-top:0;grid-template-columns:110px 1fr auto;align-items:center;gap:12px;min-height:48px;padding:0 13px;display:grid}.tank-status>span{background:#202827;height:4px}.tank-status>span i{background:linear-gradient(90deg,var(--cyan),var(--ember));height:100%;box-shadow:0 0 12px var(--cyan);transition:width .25s;display:block}.tank-status p{color:#aeb6af;margin:0;font-size:12px}.tank-status b{color:#f0be80;font-size:11px}.tank-intel ol{gap:9px;margin:20px 0;padding:0;list-style:none;display:grid}.tank-intel li{background:#ffffff06;border:1px solid #ffffff12;align-items:center;gap:11px;padding:9px;display:flex}.tank-intel li>i{clip-path:polygon(20% 0,80% 0,100% 25%,88% 100%,12% 100%,0 25%);background:#4c2924;width:34px;height:34px;position:relative;box-shadow:inset 0 0 0 2px #f17b54}.tank-intel li>i.siege{background:#40231f;box-shadow:inset 0 0 0 4px #bd6a4e}.tank-intel li>i.ace{background:#362248;box-shadow:inset 0 0 0 2px #d58cff}.tank-intel li span{flex-direction:column;display:flex}.tank-intel li b{font:700 15px var(--font-serif);color:#e9dfce}.tank-intel li small{color:#77817d;font-size:9px;line-height:1.5}.tank-upgrades{border-left:2px solid var(--cyan);background:#62e6ce0d;flex-direction:column;gap:6px;padding:14px;display:flex}.tank-upgrades b{color:#aaf5e4}.tank-upgrades span{color:#8b9994;font-size:10px}.tank-pause{justify-content:space-between;width:100%;margin-top:15px;display:flex}.tank-pause kbd{color:#707a76;font-size:9px}.tank-mobile-controls{display:none}.tank-overlay{-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);background:#050708d6;place-items:center;padding:18px;display:grid;inset:0;z-index:20!important;position:fixed!important}.tank-result,.tank-rules{text-align:center;background:linear-gradient(145deg,#202622,#080d0e);border:1px solid #ff9b5075;width:min(680px,100%);padding:clamp(26px,5vw,52px);position:relative;box-shadow:0 45px 110px #000}.tank-result>i{font:700 36px var(--font-serif);color:#ffd09b;border:1px solid var(--ember);clip-path:polygon(50% 0,92% 21%,92% 78%,50% 100%,8% 78%,8% 21%);background:#ff9b5014;place-items:center;width:84px;height:84px;margin:18px auto;font-style:normal;display:grid}.tank-result h2,.tank-rules h2{font:700 40px var(--font-serif);margin:18px 0 8px}.tank-result>p{color:#a6aea8}.tank-result>div{border:1px solid #ffffff14;grid-template-columns:repeat(3,1fr);margin:25px 0;display:grid}.tank-result>div span{border-right:1px solid #ffffff14;flex-direction:column;padding:15px;display:flex}.tank-result>div span:last-child{border:0}.tank-result>div b{color:#f0bd80;font-size:22px}.tank-result>div small{color:#77817b}.tank-result nav{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.tank-result nav a,.tank-result nav button{color:#e1e6df;cursor:pointer;background:#151b19;border:1px solid #ffffff21;padding:13px 17px;text-decoration:none}.tank-result nav .primary{border-color:var(--ember);margin:0}.tank-rules{text-align:left}.tank-rules>.close{color:#fff;background:0 0;border:1px solid #ffffff1a;width:42px;height:42px;font-size:23px;position:absolute;top:14px;right:14px}.tank-rules ol{grid-template-columns:1fr 1fr;gap:10px;padding:0;list-style:none;display:grid}.tank-rules li{background:#ffffff09;grid-template-columns:42px 1fr;gap:12px;padding:15px;display:grid}.tank-rules li b{font:700 27px var(--font-serif);color:#f1b473}.tank-rules li span{color:#a1aaa4;font-size:12px;line-height:1.7}@media (max-width:1140px){.tank-layout{grid-template-columns:220px minmax(420px,1fr)}.tank-intel{display:none}}@media (max-width:760px){.tank-keyart{background:linear-gradient(#070a0bd6,#070a0bfa),url(/chu-han-realm-pages/_next/static/tank-battle-frontier-v1.png) 50% 5%/auto 45% no-repeat}.tank-header{grid-template-columns:auto 1fr auto;height:68px;padding:0 10px}.tank-brand{justify-self:center}.tank-brand>span{width:40px;height:40px;font-size:20px}.tank-brand h1{font-size:19px}.tank-brand small{display:none}.tank-home{font-size:12px}.tank-tools button:first-child{display:none}.tank-tools button{padding:9px;font-size:11px}.tank-layout{padding:8px 8px 136px;display:block}.tank-mission{grid-template-columns:1fr auto;align-items:center;margin-bottom:7px;padding:10px 12px;display:grid}.tank-mission>p,.tank-mission>span,.tank-chapters,.tank-record{display:none}.tank-mission h2{margin:0;font-size:19px}.tank-levels{scrollbar-width:none;max-width:calc(100vw - 145px);display:flex;overflow-x:auto}.tank-levels button{min-width:32px;min-height:31px;font-size:10px}.tank-levels button small{display:none}.tank-hud span{padding:8px 4px}.tank-hud small{font-size:5.5px}.tank-hud b{font-size:10px}.tank-canvas-frame{padding:4px}.tank-canvas-frame canvas{max-height:calc(100svh - 276px)}.tank-curtain{padding:17px;inset:4px}.tank-curtain h2{font-size:27px}.tank-curtain p{font-size:11px}.tank-status{grid-template-columns:64px 1fr auto;min-height:42px;padding:0 8px}.tank-status p{font-size:9px}.tank-mobile-controls{bottom:max(10px,env(safe-area-inset-bottom));pointer-events:none;justify-content:space-between;align-items:center;width:min(330px,100vw - 20px);display:flex;left:50%;transform:translate(-50%);z-index:8!important;position:fixed!important}.tank-dpad{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);pointer-events:auto;background:#080c0de6;border:1px solid #ff9b5045;border-radius:18px;grid-template:43px 43px 43px/53px 53px 53px;gap:3px;padding:7px;display:grid}.tank-dpad button,.tank-fire{color:#f5d2a0;touch-action:none;background:#17201e;border:1px solid #62e6ce38;border-radius:9px}.tank-dpad .up{grid-area:1/2}.tank-dpad .left{grid-area:2/1}.tank-dpad .right{grid-area:2/3}.tank-dpad .down{grid-area:3/2}.tank-fire{pointer-events:auto;width:92px;height:92px;font:800 18px var(--font-serif);border-radius:50%;box-shadow:inset 0 0 0 6px #ff9b5014,0 8px 28px #000}.tank-fire small{font:700 8px var(--font-sans);letter-spacing:.18em;color:#83908a;display:block}.tank-result,.tank-rules{max-height:92svh;padding:25px 18px;overflow:auto}.tank-result h2,.tank-rules h2{font-size:29px}.tank-result nav{grid-template-columns:1fr 1fr;display:grid}.tank-rules ol{grid-template-columns:1fr}.tank-rules .primary{width:100%}}@media (max-height:700px) and (min-width:761px){.tank-header{height:66px}.tank-layout{padding-top:10px}.tank-mission,.tank-intel{padding:16px}.tank-canvas-frame canvas{max-height:calc(100svh - 175px)}}@media (prefers-reduced-motion:reduce){.tank-status>span i{transition:none}}.tank-canvas-frame canvas{cursor:crosshair;touch-action:none}.tank-curtain em{color:#ffcb88;font-style:normal;font:700 15px var(--font-serif);letter-spacing:.07em}.tank-intel li>i.commander{clip-path:polygon(50% 0,88% 14%,100% 52%,78% 100%,22% 100%,0 52%,12% 14%);background:#6b5017;box-shadow:inset 0 0 0 3px #ffd05f}@media (min-width:761px){.tank-shell{height:100svh;min-height:0;overflow:hidden}.tank-header{height:70px;padding-inline:clamp(14px,2vw,32px)}.tank-brand>span{width:44px;height:44px;font-size:24px}.tank-brand h1{font-size:23px}.tank-brand small{font-size:8px}.tank-tools button{padding:9px 12px}.tank-layout{grid-template-columns:minmax(182px,228px) minmax(360px,1fr) minmax(182px,228px);align-items:stretch;gap:12px;height:calc(100svh - 70px);padding:10px clamp(10px,1.4vw,22px) 12px}.tank-mission,.tank-intel{height:100%;min-height:0;padding:15px;overflow:auto}.tank-mission h2,.tank-intel h2{margin:5px 0;font-size:24px}.tank-chapters{gap:3px;margin-top:12px}.tank-chapters button{padding:5px 8px}.tank-levels{gap:4px;margin:10px 0}.tank-levels button{min-height:34px}.tank-record{margin-top:10px;padding-top:10px}.tank-console{grid-template-rows:auto minmax(0,1fr) auto;height:100%;min-height:0;display:grid}.tank-hud span{padding:8px 6px}.tank-hud b{font-size:12px}.tank-canvas-frame{justify-content:center;align-items:center;min-height:0;padding:6px;display:flex}.tank-canvas-frame canvas{aspect-ratio:1;width:auto;max-width:100%;height:100%;max-height:100%}.tank-curtain{padding:18px;inset:6px}.tank-curtain h2{margin:8px 0;font-size:clamp(28px,4vh,42px)}.tank-curtain p{margin:8px 0;line-height:1.55}.tank-curtain button{margin-top:9px;padding:11px 20px}.tank-status{min-height:40px;padding-inline:11px}.tank-intel ol{gap:5px;margin:11px 0}.tank-intel li{padding:6px}.tank-upgrades{padding:10px}.tank-pause{margin-top:9px}}@media (min-width:761px) and (max-width:1140px){.tank-layout{grid-template-columns:minmax(178px,214px) minmax(360px,1fr)}}@media (min-width:761px){.tank-header{height:64px}.tank-layout{height:calc(100svh - 64px)}.tank-brand small{display:none}.tank-hud small{font-size:9px}.tank-hud b{font-size:14px}}.tank-status b{text-align:right;max-width:250px;line-height:1.25}.tank-upgrades span{line-height:1.65}@media (max-width:760px){.tank-hud b{line-height:1.25}.tank-status{gap:7px}.tank-status b{white-space:normal;max-width:112px;font-size:8px}.tank-status p{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}}.tank-curtain{z-index:3;text-align:left;-webkit-backdrop-filter:none;backdrop-filter:none;background:linear-gradient(90deg,#080b0cfa 0%,#0c1111ed 38%,#0a0e0f75 60%,#070a0b14 100%),linear-gradient(#0000 42%,#06090ae6);place-content:end start;justify-items:start;padding:clamp(24px,4vw,52px)}.tank-curtain>*{max-width:440px}.tank-curtain h2{text-shadow:0 4px 28px #000;margin:8px 0 5px}.tank-curtain em{border-left:2px solid var(--ember);background:#0c0f0ead;padding:4px 8px}.tank-curtain p{color:#c2c9c3;text-shadow:0 2px 10px #000;margin:9px 0;line-height:1.58}.tank-curtain.compact{text-align:center;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#070a0be0;place-content:center;justify-items:center}.tank-levels button.landmark{background:linear-gradient(145deg,#ff9b5029,#101616);border-color:#ff9b508c}.tank-levels button.landmark small{color:#ffc27f}.tank-map-actions{align-items:center;gap:10px;width:min(440px,100%);margin:2px 0 4px;display:flex}.tank-curtain .tank-map-actions button{box-shadow:none;color:#b5fff1;letter-spacing:.07em;background:#081716e0;border:1px solid #62e6ce66;margin:0;padding:7px 11px;font-size:10px}.tank-map-actions span{color:#81918b;font-size:9px}.tank-curtain>small{overflow-wrap:anywhere}.tank-briefing-controls{flex-wrap:wrap;gap:6px;margin:4px 0 2px;display:flex}.tank-briefing-controls span{color:#92a29c;background:#091111c7;border:1px solid #62e6ce33;padding:5px 8px;font-size:9px}.tank-briefing-controls kbd{color:#ffc27f;font:700 8px var(--font-sans);margin-right:4px}.tank-loadout{grid-template-columns:repeat(3,1fr);gap:6px;width:min(440px,100%);margin:7px 0 5px;display:grid}.tank-curtain .tank-loadout button{min-width:0;min-height:48px;box-shadow:none;color:#83918b;text-align:left;letter-spacing:0;background:#091010d1;border:1px solid #ff9b5033;grid-template-columns:26px 1fr;align-items:center;gap:6px;margin:0;padding:6px 8px;display:grid}.tank-loadout button>b{color:#bd8253;width:24px;height:24px;font:700 11px var(--font-serif);clip-path:polygon(50% 0,92% 21%,92% 78%,50% 100%,8% 78%,8% 21%);border:1px solid;place-items:center;display:grid}.tank-loadout button>span{color:#c5ccc6;min-width:0;font:700 10px/1.2 var(--font-serif);white-space:nowrap;flex-direction:column;display:flex}.tank-loadout button small{color:#69756f;font:500 7px/1.35 var(--font-sans)}.tank-curtain .tank-loadout button.active{border-color:var(--ember);color:#ffd5a6;box-shadow:inset 0 -2px var(--ember),0 0 20px #ff9b501a;background:linear-gradient(135deg,#753f1eb8,#0f1d1be6)}.tank-loadout button.active>b,.tank-loadout button.active>span{color:#ffe1b9}.tank-loadout button.active small{color:#9fe4d5}.tank-event-card{z-index:5;border:1px solid #ff9b5080;border-left:3px solid var(--ember);pointer-events:none;background:linear-gradient(120deg,#0d1212f7,#131d1beb);grid-template-columns:48px 1fr;align-items:center;gap:12px;width:min(366px,100% - 36px);min-height:76px;padding:12px;animation:3.4s both tankEvent;display:grid;position:absolute;top:18px;left:18px;box-shadow:0 18px 50px #0009,inset 0 1px #ffffff0a}.tank-event-card>i{color:#ffbd76;width:46px;height:46px;font:700 20px var(--font-serif);clip-path:polygon(50% 0,92% 21%,92% 78%,50% 100%,8% 78%,8% 21%);border:1px solid;place-items:center;font-style:normal;display:grid;box-shadow:inset 0 0 18px #ff9b501a,0 0 20px #ff9b501f}.tank-event-card>span{flex-direction:column;gap:2px;min-width:0;display:flex}.tank-event-card small{color:#66a99d;letter-spacing:.28em;font-size:6px}.tank-event-card b{color:#f4dcc0;font:700 18px var(--font-serif);letter-spacing:.08em}.tank-event-card em{color:#aab5ae;font:normal 10px/1.45 var(--font-sans)}.tank-event-card.shield>i,.tank-event-card.wingman>i{color:#8de8ff}.tank-event-card.repair>i{color:#8affc1}.tank-event-card.rapid>i,.tank-event-card.danger>i{color:#ff8b65}.tank-event-card.pierce>i,.tank-event-card.armor>i{color:#ffe183}.tank-event-card.win{border-color:#f5c773}.tank-event-card.lose,.tank-event-card.danger{border-color:#d05545}.tank-effect-rack{z-index:4;pointer-events:none;gap:5px;display:flex;position:absolute;bottom:13px;right:13px}.tank-effect-rack span{color:#68746f;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#070b0bd1;border:1px solid #80918933;align-items:center;gap:5px;min-width:61px;padding:5px 7px;font-size:8px;display:flex}.tank-effect-rack b{width:18px;height:18px;font:700 8px var(--font-serif);clip-path:polygon(50% 0,92% 21%,92% 78%,50% 100%,8% 78%,8% 21%);border:1px solid;place-items:center;display:grid}.tank-effect-rack span.active{color:#bcefe3;background:#0b2f2ae0;border-color:#62e6ce7a;box-shadow:0 0 18px #62e6ce1a}.tank-effect-rack span.active.armor,.tank-effect-rack span.active.pierce{color:#ffe0a4;background:#422d12e0;border-color:#ffc26c8f}.tank-effect-rack span.active.wingman{color:#c8efff;background:#0d2b3be6;border-color:#78d9ff9e}@keyframes tankEvent{0%{opacity:0;transform:translate(-24px)scale(.97)}8%,82%{opacity:1;transform:translate(0)scale(1)}to{opacity:0;transform:translateY(-8px)scale(.99)}}@media (max-width:760px){.tank-curtain{place-content:end start;padding:14px}.tank-curtain p{max-width:90%;font-size:10px}.tank-loadout{gap:3px;margin:4px 0}.tank-curtain .tank-loadout button{grid-template-columns:20px 1fr;gap:3px;min-height:40px;padding:4px}.tank-loadout button>b{width:19px;height:19px;font-size:8px}.tank-loadout button>span{font-size:8px}.tank-loadout button small{font-size:6px}.tank-briefing-controls span{padding:4px 5px;font-size:7px}.tank-event-card{grid-template-columns:38px 1fr;width:min(304px,100% - 16px);min-height:58px;padding:8px;top:8px;left:8px}.tank-event-card>i{width:36px;height:36px;font-size:16px}.tank-event-card b{font-size:14px}.tank-event-card em{font-size:8px}.tank-effect-rack{gap:3px;bottom:7px;right:7px}.tank-effect-rack span{min-width:0;padding:4px;font-size:0}.tank-effect-rack b{width:17px;height:17px;font-size:8px}.tank-tools{gap:3px}.tank-tools button{padding:8px 6px}.tank-map-actions span{display:none}.tank-curtain>small{letter-spacing:.1em;font-size:7px}.tank-result nav{grid-template-columns:repeat(2,1fr)}}.tank-result>div{grid-template-columns:repeat(4,1fr)}@media (max-width:560px){.tank-result>div{grid-template-columns:repeat(2,1fr)}.tank-result>div span:nth-child(2){border-right:0}.tank-result>div span:nth-child(-n+2){border-bottom:1px solid #ffffff14}}
