:root{color-scheme:dark;--bg:#0b1018;--panel:#141c28;--line:#2b3545;--muted:#a3afc0;--accent:#dfbd7f;--font:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 85% 0,#25374e44,transparent 40%),#0b1018;color:#eef2f8;font:14px/1.55 var(--font);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}button,input,select,textarea{font:inherit}button{cursor:pointer;min-height:38px;padding:9px 14px;color:#e8edf5;background:#202b3a;border:1px solid #3c485c;border-radius:8px;font-size:12px;font-weight:500;line-height:1.3;transition:background .15s,border-color .15s,transform .15s}button:hover{background:#2b394c;border-color:#76849a}button:active{transform:translateY(1px)}button:disabled{opacity:.38;cursor:default}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:3px}button[hidden],[hidden]{display:none!important}p{margin:0;color:var(--muted)}.primary{color:#191d24;background:linear-gradient(#ead09e,#c4a164);border-color:#e2c087;font-weight:600;box-shadow:inset 0 1px #fff5,0 4px 14px #0002}.primary:hover{background:#efd4a0;border-color:#f3dcaf}.muted{color:#a5b2c6;background:transparent;border-color:transparent}.muted:hover{background:#253144;border-color:#3b4b62}
header{max-width:1480px;height:92px;margin:auto;padding:0 44px;display:flex;align-items:center;justify-content:space-between;gap:18px;border-bottom:1px solid #dfbd7f25}.brand{display:flex;align-items:center;gap:13px;color:#eef2f8;text-decoration:none;font-weight:600;font-size:15px;letter-spacing:-.2px}.brand small{display:block;color:#c8ac7b;font-size:12px;font-weight:400;letter-spacing:.15px;margin-top:2px}.logo{display:grid;place-items:center;width:42px;height:47px;color:#20242b;background:linear-gradient(150deg,#f0dbb0,#a7844a);clip-path:polygon(50% 0,100% 17%,100% 72%,50% 100%,0 72%,0 17%);font-weight:700;font-size:25px}.local{color:#a5b2c5;font-size:12px}.local i{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--accent);margin-right:7px;box-shadow:0 0 10px #dfbd7f40}main{max-width:1480px;margin:auto;padding:38px 44px 0}
.intro{position:relative;display:flex;align-items:center;justify-content:space-between;gap:36px;padding:8px 0 34px;margin-bottom:26px;border-bottom:1px solid var(--line)}.hero-copy{min-width:0}.mode-tag{display:flex;align-items:center;gap:10px;margin-bottom:20px;font-size:11px;font-weight:600;letter-spacing:1.2px;color:#bcc9da}.mode-tag span{width:18px;height:2px;background:var(--accent)}.mode-tag b{color:#5a6b82;font-weight:400;padding:0 3px}.eyebrow{font-size:11px;font-weight:500;line-height:1.65;letter-spacing:.6px;color:var(--accent)}h1{font-family:var(--font);font-size:clamp(40px,4.5vw,62px);font-weight:600;line-height:1.07;letter-spacing:-2.1px;margin:13px 0 19px}h1 em{font-style:normal;color:var(--accent)}.intro p{font-size:14px;line-height:1.8;color:#acb9ca}.hero-aside{display:flex;flex-direction:column;align-items:center;gap:21px;flex-shrink:0}.hero-emblem{position:relative;width:150px;color:#c9a86b;filter:drop-shadow(0 0 25px #dfbd7f12)}.hero-emblem svg{display:block;width:100%}.hero-emblem span{position:absolute;top:64px;left:-62px;font-size:9px;letter-spacing:2.2px;color:#7e90a9;transform:rotate(-90deg)}.actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.actions button{min-height:42px;font-size:13px;padding:10px 15px}#share{background:#29281f;border-color:#796744;color:#ead3a8}.section-code{color:#a58e66;font-size:11px;font-weight:500;margin-right:7px;letter-spacing:.3px}
.builds{background:linear-gradient(110deg,#172130,#121b28);border:1px solid #303e53;border-radius:12px;padding:18px 20px;margin-bottom:22px;box-shadow:0 8px 25px #0002}.builds-top{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:13px}.builds-top strong{font-size:14px;font-weight:600}.builds-top>span{font-size:12px;color:#a3b0c4}.build-controls{display:flex;flex-wrap:wrap;gap:8px}.build-controls select,.filters select{color:#e3eaf4;background:#111a26;border:1px solid #3c4960;border-radius:8px;padding:10px 12px;font:13px var(--font)}.build-controls select{flex:1;min-width:210px}.build-controls button{font-size:12px}#shared-notice{color:#dfc28a;font-size:13px;line-height:1.7;margin-top:14px}
.workspace{background:#101924;border:1px solid #3b4a60;border-top:2px solid #c9a66c;border-radius:12px;overflow:hidden;box-shadow:0 16px 45px #0004}.board-top{padding:18px 20px;display:flex;align-items:center;justify-content:space-between;gap:12px;background:linear-gradient(110deg,#1c293b,#151f2e);border-bottom:1px solid #334259}.board-code{flex-shrink:0;margin:0}.board-top>input{background:transparent;color:#edf2f9;border:0;min-width:120px;flex:1;width:40%;font-size:19px;line-height:1.4;font-weight:600;letter-spacing:-.35px}.board-top>div{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end}.board-top button{font-size:12px;padding:8px 10px;min-height:34px}#player-badge{display:flex;align-items:center;flex-wrap:wrap;gap:12px;background:#172131;border-bottom:1px solid #334259;padding:12px 20px;color:var(--accent)}.player-caption{font-size:10px;color:#a0b0c6;letter-spacing:.8px}#player-nick{font-size:17px;font-weight:600}#player-rating{font-size:12px;color:#ead3a8;background:#302d25;border:1px solid #736449;border-radius:7px;padding:5px 10px}
.tier{display:flex;border-top:1px solid #2d3c50;min-height:94px}.tier:first-child{border-top:0}.tier-side{width:122px;flex-shrink:0;background:linear-gradient(110deg,#1e2a3a,#15202e);border-left:3px solid var(--tier);border-right:1px solid #334358;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:8px}.tier-label{width:100%;min-height:35px;color:var(--tier);background:transparent;border:0;border-radius:5px;font:600 31px/1.15 var(--font);padding:0;text-shadow:none}.tier-label:hover{background:#ffffff08;border:0}.tier-name{width:100%;background:transparent;color:#cbd5e3;border:0;border-bottom:1px solid transparent;border-radius:0;font-size:11px;text-align:center;font-weight:400;line-height:1.5;padding:4px 0}.tier-name::placeholder{color:#94a3b8;opacity:1}.tier-name:hover,.tier-name:focus{border-bottom-color:#8999b0}.tier-zone{display:flex;gap:6px;flex-wrap:wrap;align-content:flex-start;min-width:0;flex:1;padding:7px;background:linear-gradient(90deg,#15202c70,#101924)}.tier-zone:empty:after{content:'Перетащите танки сюда';align-self:center;margin:auto 16px;font-size:12px;color:#879ab2}.tier-zone.over,.catalog.over{background:#dfbd7f12;outline:2px dashed var(--accent);outline-offset:-3px}.board-bottom{display:flex;justify-content:space-between;gap:12px;background:#101824;border-top:1px solid #2e3d51;padding:13px 20px;font-size:12px;color:#a3b0c3}#progress{color:var(--accent);white-space:nowrap;font-variant-numeric:tabular-nums}
.card{position:relative;isolation:isolate;flex-shrink:0;width:116px;height:80px;min-height:0;border:1px solid #40516a;border-radius:7px;padding:0;overflow:hidden;background:radial-gradient(ellipse at 45% 25%,#3b4d63,#1b2735 75%);box-shadow:inset 0 1px #ffffff0a;cursor:grab;transition:transform .15s,border-color .15s,box-shadow .15s}.card img{position:absolute;inset:-15% 0 0;width:100%;height:112%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 6px 5px #0005)}.card .name{position:absolute;bottom:0;left:0;width:100%;padding:18px 4px 6px;color:#f0f4fa;background:linear-gradient(transparent,#080e17f5);font:500 11px/1.25 var(--font);text-align:center;pointer-events:none;letter-spacing:0}.card .missing{position:absolute;top:14px;left:0;right:0;text-align:center;font-size:11px;color:#bac5d4}.card:hover{border-color:#dfbd7f;background:radial-gradient(ellipse at 45% 25%,#4a5d74,#233244 75%);box-shadow:0 4px 16px #0004,0 0 0 1px #dfbd7f20;transform:translateY(-2px)}.card.selected{outline:2px solid #dfbd7f;outline-offset:1px;border-color:#dfbd7f;box-shadow:0 0 14px #dfbd7f20}.card.dragging{opacity:.35}
.hangar{padding-top:34px}.hangar-head{display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid #2d3a4d;padding-bottom:18px;margin-bottom:18px}.hangar .eyebrow{color:#b39b76;font-size:11px;letter-spacing:.5px}h2{font:600 25px/1.3 var(--font);letter-spacing:-.6px;margin:5px 0 0}h2 span{display:inline-block;font:500 12px/1.4 var(--font);background:#1e2c3f;border:1px solid #3a4d66;color:#c4d1e4;padding:3px 8px;border-radius:6px;vertical-align:middle;margin-left:7px}.search{display:flex;gap:10px;align-items:center;background:#111b29;color:var(--accent);border:1px solid #3c4c65;border-radius:9px;padding:9px 13px;font-size:23px}.search input{border:0;outline:0;background:transparent;color:#eef2f8;font-size:13px;width:230px}.search input::placeholder{color:#a0b0c6}.filters{display:flex;align-items:end;flex-wrap:wrap;gap:12px;margin-bottom:21px}.filters label{display:flex;flex-direction:column;gap:7px;font-size:12px;color:#afbbcc;letter-spacing:0}.filters select{min-width:200px;cursor:pointer}.filters select:hover{border-color:#8091ab}#filter-summary{font-size:12px;color:#a6b5ca;margin-left:auto;padding-bottom:10px;font-variant-numeric:tabular-nums}.catalog{display:grid;grid-template-columns:repeat(auto-fill,minmax(138px,1fr));gap:11px;min-height:94px;padding-bottom:14px}.catalog .card{width:100%;height:110px}.catalog .card img{inset:-12% 0 0;height:112%}.catalog .card .name{font-size:12px;line-height:1.3;padding:20px 6px 9px}#empty{padding:26px;text-align:center;font-size:14px}
#selection{position:sticky;bottom:14px;z-index:5;display:flex;gap:12px;justify-content:center;align-items:center;max-width:100%;margin:12px auto;padding:12px 15px;color:#eddbb7;background:#202e40;border:1px solid #9d885f;border-radius:10px;box-shadow:0 10px 30px #0007}#selected-name{font-size:13px}#quick-tiers{display:flex;gap:5px}#quick-tiers button{background:var(--tier);color:#17202c;min-height:30px;padding:5px 10px;font-weight:600;border-radius:5px}#deselect{min-height:30px;padding:5px 8px}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:10;display:none;max-width:90vw;padding:13px 22px;background:#e8cfa0;color:#202632;border:1px solid #f0d9b2;border-radius:10px;box-shadow:0 12px 40px #0006;font-size:13px}
dialog{width:calc(100% - 30px);max-width:560px;padding:28px;border:1px solid #53647d;border-top:2px solid #d5b47c;border-radius:15px;background:linear-gradient(135deg,#202e42,#131e2d);color:#eef2f8;box-shadow:0 30px 100px #0008}dialog::backdrop{background:#050a12d9;backdrop-filter:blur(6px)}dialog h2{margin:0 0 14px;font-size:25px}dialog p{font-size:14px;line-height:1.7;margin:10px 0 20px}dialog label{display:block;margin-bottom:8px;font-size:13px;color:#bac6d7}dialog textarea,#player-dialog input{width:100%;background:#0f1926;border:1px solid #4b5c76;border-radius:8px;color:#eef2f8;padding:11px;font-size:14px}dialog textarea{resize:vertical;font-size:13px}#player-dialog input{display:block;margin-bottom:17px}.dialog-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:18px}#copy-status{color:#e7cea1;margin-bottom:0}
footer{display:flex;justify-content:space-between;gap:15px;margin-top:34px;padding:23px 0;border-top:1px solid #343d49;color:#96a5ba;font-size:12px}.footer-brand{font-size:11px;letter-spacing:.4px;color:#b5c1d1}.footer-brand b{color:var(--accent);padding:0 7px}
@media(max-width:1100px){.intro{gap:22px}.hero-aside{max-width:320px}.actions{justify-content:center}.board-top{flex-wrap:wrap}.board-top>input{min-width:200px}.board-top>div{flex-grow:1}.builds-top{align-items:start}.builds-top>span{max-width:45%;text-align:right}}
@media(max-width:760px){header{height:80px;padding:0 16px;gap:12px}.brand{font-size:13px;gap:10px}.brand small{font-size:10px;letter-spacing:0}.logo{width:34px;height:39px;font-size:22px}.local{font-size:10px;max-width:112px;text-align:right;line-height:1.5}.local i{width:4px;height:4px;margin-right:4px}main{padding:26px 14px 0}.intro{display:block;padding:0 0 26px;margin-bottom:22px}.mode-tag{font-size:11px;letter-spacing:.8px;max-width:220px;margin-bottom:19px}.eyebrow{font-size:11px;letter-spacing:.25px;max-width:245px;line-height:1.6}h1{font-size:clamp(34px,9vw,52px);line-height:1.1;letter-spacing:-1.3px;margin:15px 0 18px}.intro p{font-size:13px;line-height:1.75}.hero-aside{max-width:none;align-items:start}.hero-emblem{position:absolute;right:0;top:6px;width:86px;opacity:.45;pointer-events:none}.hero-emblem span{display:none}.actions{justify-content:start;gap:7px;margin-top:23px}.actions button{font-size:12px;min-height:40px;padding:10px 12px}.builds{padding:16px 14px}.builds-top{flex-direction:column;gap:7px}.builds-top>span{font-size:11px;text-align:left;max-width:none}.build-controls{gap:7px}.build-controls select{flex-basis:100%;min-width:0;width:100%;font-size:13px}.build-controls button{padding:9px 11px;font-size:12px}.board-top{padding:15px 12px;gap:11px}.board-code{font-size:11px}.board-top>input{font-size:17px;min-width:0;flex-basis:calc(100% - 46px);width:calc(100% - 46px)}.board-top>div{justify-content:start;width:100%}.board-top button{font-size:11px}.tier-side{width:83px;padding:5px}.tier-label{font-size:28px}.tier-name{font-size:10px}.tier-zone{gap:5px;padding:6px}.tier{min-height:87px}.tier-zone:empty:after{font-size:11px;margin:auto 10px}.card{width:96px;height:73px}.card .name{font-size:10px}.board-bottom{padding:12px;flex-direction:column;gap:5px;font-size:11px}#player-badge{padding:12px;gap:9px}.player-caption{font-size:10px}#player-nick{font-size:16px}.hangar{padding-top:28px}.hangar-head{gap:10px;align-items:end}.hangar .eyebrow{font-size:10px;letter-spacing:0}h2{font-size:24px}.search{padding:8px 10px;gap:7px;border-radius:8px}.search input{width:132px;font-size:12px}.filters{gap:10px}.filters label{flex:1;min-width:135px;font-size:12px}.filters select{width:100%;min-width:0;font-size:12px;padding:10px 8px}#filter-summary{font-size:11px}.catalog{grid-template-columns:repeat(auto-fill,minmax(108px,1fr));gap:8px}.catalog .card{height:94px}.catalog .card .name{font-size:11px;line-height:1.25;padding:18px 4px 7px}#selection{flex-wrap:wrap;gap:8px;padding:10px}#quick-tiers{flex-wrap:wrap;justify-content:center}#quick-tiers button{padding:5px 9px}footer{flex-direction:column;gap:7px;font-size:11px}.footer-brand{font-size:10px}dialog{padding:23px}dialog p{font-size:13px}}
@media(max-width:390px){.local{max-width:90px;font-size:9px}.brand{font-size:12px}.hero-emblem{width:68px;top:12px;opacity:.3}.search input{width:109px}.actions button{padding:9px 10px}h1{font-size:34px}.catalog{grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}}
@media(prefers-reduced-motion:reduce){button,.card{transition:none}}

footer{flex-wrap:wrap}.privacy-note{flex-basis:100%;margin:0;max-width:100%;font-size:12px;line-height:1.75;color:#a3afc0;letter-spacing:0}@media(max-width:760px){.privacy-note{font-size:11px}}

.author-note{flex-basis:100%;margin:0;font-size:12px;line-height:1.75;color:#a3afc0}.author-note strong{font-weight:600;color:#dce5f1}.author-note a{color:var(--accent);text-decoration:none;text-underline-offset:3px}.author-note a:hover{text-decoration:underline}.author-note a:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:3px}
html.tank-drag-scroll{scroll-behavior:auto!important;overflow-anchor:none}.drag-scroll-hint{position:fixed;left:0;right:0;z-index:20;pointer-events:none;text-align:center;font:500 12px/1.5 var(--font);color:#f4dfb7;padding:16px;background:linear-gradient(#0b1018f5,#0b1018c0,transparent);text-shadow:0 1px 4px #000}#drag-scroll-up{top:0;border-top:2px solid var(--accent)}#drag-scroll-down{bottom:0;border-bottom:2px solid var(--accent);background:linear-gradient(transparent,#0b1018c0,#0b1018f5)}

.tank-context-menu{position:fixed;z-index:60;width:252px;max-width:calc(100vw - 16px);overflow-y:auto;padding:7px;background:#172231f5;backdrop-filter:blur(16px);border:1px solid #53637a;border-radius:12px;box-shadow:0 14px 45px #0009;color:#eef2f8;font-family:var(--font);overscroll-behavior:contain}.tank-menu-title{padding:6px 9px 10px;font-size:12px;font-weight:600;line-height:1.4;color:#b9c6d8;overflow-wrap:anywhere;border-bottom:1px solid #344358;margin-bottom:5px}.tank-menu-item{display:flex;align-items:center;gap:10px;width:100%;min-height:38px;padding:5px 8px;background:transparent;border:1px solid transparent;border-radius:7px;text-align:left;font:500 13px/1.4 var(--font);color:#e6edf7}.tank-menu-item:hover,.tank-menu-item:focus-visible{background:#30415b;border-color:#637794;outline:none;transform:none}.tank-menu-item:disabled{opacity:1;cursor:default;color:#9aabc1;background:#ffffff04}.tank-menu-tier{display:grid;place-items:center;flex-shrink:0;width:28px;height:28px;border-radius:5px;background:var(--tier);color:#15202c;font-size:14px;font-weight:700}.tank-menu-name{flex:1;min-width:0;overflow-wrap:anywhere}.tank-menu-check{color:#dfbd7f;font-size:14px}.tank-menu-item:last-child{margin-top:5px;border-top:1px solid #344358;border-radius:0 0 7px 7px;padding-top:9px}
