/* Styl wspólny: stalowe ramy, czarne panele, czerwone światła wg referencji Topka. */
/* Ramki 9-slice zachowują geometrię narożników. Większa swoistość zastępuje
   dawne prostokątne border/inset-shadow, nie zmieniając rozmiaru ani tła kart. */
body .panel, body .topbar, body .bottom-dock > div {
  border-color: transparent;
  border-image: url('/ui/steel-frame.svg') 16 / 16px / 0 stretch;
  box-shadow: none;
}
body .panel::after, body .topbar::after { content: none; }
body #toast {
  border-color: transparent;
  border-image: url('/ui/toast-frame.svg') 12 / 12px / 0 stretch;
  box-shadow: none;
}
body #toast.error {
  border-color: transparent;
  border-image-source: url('/ui/toast-error-frame.svg');
}
:root{--accent:#dc392d;--muted:#b4b7b1;--line:#85857b55;--panel:#101212f5;color:#ecebe4;background:#111313}button,input,select,textarea{border-radius:0;accent-color:#d83729}button{position:relative;background:linear-gradient(180deg,#323533 0%,#191c1b 14%,#0b0d0d 83%,#252725 100%);border:1px solid #827f72;box-shadow:inset 0 0 0 2px #060707,inset 0 0 0 3px #4d4d4666;color:#e6e6df;text-shadow:0 1px 3px #000}button:hover{border-color:#e5b2a0;background:linear-gradient(#382523,#160e0e);box-shadow:inset 0 0 0 2px #080707,inset 0 0 0 3px #8c423b,0 0 12px #d9231528}button.primary,button.active,button[aria-pressed=true]{background:radial-gradient(ellipse at 50% 100%,#9b100b 0%,#440905 60%,#160604 100%);border-color:#ef7762;color:#fff8ec;box-shadow:inset 0 0 0 2px #170403,inset 0 0 0 3px #d8412c,0 0 14px #d3211830}button.primary:hover{background:linear-gradient(#68120e,#af2416);color:white}input,select,textarea{background:#080c0b;border:1px solid #6a6f66;color:#e8eae1;box-shadow:inset 0 1px 5px #000}input:focus-visible,button:focus-visible,a:focus-visible,select:focus-visible,canvas:focus-visible{outline:2px solid #f1634d;outline-offset:3px}input[type=range]{box-shadow:none;background:transparent;border:0}.eyebrow{color:#b8c2c0}.accent{color:#ef6251}.panel,.topbar,.bottom-dock>div{background:linear-gradient(135deg,#af392440,transparent 35px),linear-gradient(315deg,#a72b1c26,transparent 35px),repeating-linear-gradient(110deg,#ffffff02 0 1px,transparent 1px 5px),#101313f5;border:2px solid #76776d;box-shadow:inset 0 0 0 3px #020303,inset 0 0 0 4px #424941,0 4px 18px #0008;clip-path:polygon(12px 0,calc(100% - 12px) 0,100% 12px,100% calc(100% - 12px),calc(100% - 12px) 100%,12px 100%,0 calc(100% - 12px),0 12px)}.panel::after,.topbar::after{content:"";position:absolute;inset:6px;pointer-events:none;border:1px solid #b5b6a635;clip-path:polygon(9px 0,calc(100% - 9px) 0,100% 9px,100% calc(100% - 9px),calc(100% - 9px) 100%,9px 100%,0 calc(100% - 9px),0 9px)}.game-logo{width:440px;max-width:42vw;height:auto;filter:drop-shadow(0 5px 8px #0009)}#masthead{top:26px;left:27px;gap:3px;flex-direction:column;align-items:start}#masthead .version{padding-left:16px;color:#ddd;align-self:start}#menu{top:12%;bottom:auto;max-height:80vh;width:370px;padding:32px;background-color:#101212f0}#menu h1{font-size:26px;letter-spacing:.12em;font-weight:700;margin:17px 0 25px}#menu .fields{margin:18px 0}#menu>button{padding:18px 16px}#menu .rule{margin:20px 0}.workshop-link{background:linear-gradient(#222722,#090b0a);border:1px solid #74796b;margin-top:15px;padding:17px 12px;box-shadow:inset 0 0 0 3px #080a08}.resources{gap:30px}.resources>span{position:relative;padding-left:25px;font-size:9px}.resources>span::before{content:'◆';position:absolute;left:0;top:9px;font-size:18px;color:#a2cfdf;text-shadow:1px 2px 4px #000}.resources>span:nth-child(2)::before{color:#77d82c}.resources>span:nth-child(3)::before{content:'♟';color:#eee}.resources b{color:#fff;font-size:21px}.topbar{padding:15px 22px;left:26px;right:26px;top:22px}.compact{top:126px;left:26px;width:208px;background-color:#0d1010f5}.bottom-dock{left:292px;right:26px;bottom:64px;gap:18px;align-items:stretch}.bottom-dock>div{padding:17px 20px;flex:1}.bottom-dock>.primary{align-self:end;padding:18px;min-width:185px;text-align:center}#build-tools{gap:9px;margin:11px 0}#build-tools button{min-width:130px;min-height:62px;text-align:center}#build-tools button small{color:#bfe589}#build-tools #cancel-build{min-width:auto}#controls-help{font-size:10px;color:#b8c0b5}body.fpp .bottom-dock{left:26px}body.fpp .bottom-dock>div{flex:0 1 420px}#minimap-panel{position:absolute;left:26px;bottom:64px;width:244px;padding:13px;z-index:2}.minimap-heading{display:flex;align-items:center;justify-content:space-between;font-size:9px;letter-spacing:.1em;padding:0 2px 8px}.minimap-heading b{color:#fff;font-size:12px}.minimap-heading button{padding:3px 7px;font-size:14px;width:auto}#minimap{display:block;width:100%;height:auto;aspect-ratio:1;cursor:crosshair;border:1px solid #939381;touch-action:none}.minimap-footer{display:flex;justify-content:space-between;font-size:8px;letter-spacing:.04em;color:#adb5a7;margin-top:9px}#toast{background:#201b16f2;border:1px solid #ae8a62;box-shadow:inset 0 0 0 3px #100d0a;clip-path:polygon(8px 0,calc(100% - 8px) 0,100% 8px,100% calc(100% - 8px),calc(100% - 8px) 100%,8px 100%,0 calc(100% - 8px),0 8px)}#toast.error{background:#480904;border-color:#ef5840}footer{background:#0a0e0be0;border-color:#5c605866;color:#a8b3a3}.workshop-logo{display:block;width:180px;max-height:60px;object-fit:contain}body:has(#workshop-sidebar)>header{background:linear-gradient(#232622,#0b0f0d);border-bottom:2px solid #76776d;height:72px}body:has(#workshop-sidebar){grid-template-rows:72px 1fr;grid-template-columns:440px 1fr}#workshop-sidebar{position:relative;padding:27px 22px;background:repeating-linear-gradient(110deg,#ffffff02 0 1px,transparent 1px 5px),linear-gradient(90deg,#161b17,#0c100e);border-right:3px ridge #75796a}#workshop-sidebar .section{color:#bcc4b6;border-color:#66715f55}#workshop-sidebar output{color:#f0d7b4}#asset-picker{display:flex;justify-content:space-between;align-items:center;padding:18px 12px;margin-top:14px;font-size:12px;text-transform:none;letter-spacing:.02em}#asset-picker>span:last-child{color:#e05847;font-size:14px}.viewport-header>span{color:#d1d1c2;border-color:#787865;background:#14191488}.viewport-header .eyebrow{color:#bcbbb0}.view-tools button{font-size:9px}.view-tools button.active{border-color:#ef7762}#stats{background:#080d0bea;border-top:2px ridge #797e6e;color:#c2c5b5}#status{color:#b9d09e}#status.error{color:#ff6b52}#reticle{color:#ff5b40}#asset-library{position:absolute;inset:0;background:linear-gradient(140deg,#293029,#101511 55%);z-index:5;padding:22px 16px;display:flex;flex-direction:column;gap:13px;min-height:0;border-right:1px solid #a0a78c}.library-heading{display:flex;justify-content:space-between;align-items:center;padding:2px 2px 7px;font-size:12px;letter-spacing:.12em}.library-heading button{width:30px;padding:7px}.library-heading strong{font-weight:600}#asset-search{margin:0;padding:12px;font-size:12px}#asset-categories{display:flex;gap:5px;flex-wrap:wrap}#asset-categories button{width:auto;padding:8px 9px;font-size:8px}#asset-count{font-size:9px;color:#a3b29a;letter-spacing:.1em;padding:3px}#asset-results{overflow-y:auto;display:grid;grid-template-columns:1fr 1fr;gap:9px;align-content:start;min-height:0;flex:1;padding:2px}.asset-card{display:flex;flex-direction:column;text-align:center;align-items:center;white-space:normal;min-height:135px;padding:14px 7px;gap:9px}.asset-symbol{font-size:38px;font-weight:400;color:#b8c4b5;text-shadow:0 2px 0 #000,0 0 12px #9993;line-height:1.1}.asset-card strong{font-size:11px;letter-spacing:0;line-height:1.25}.asset-card small{font-size:7px;color:#adb19d;letter-spacing:.08em}.empty-library{grid-column:1/-1;color:#aab69f;font-size:12px}#asset-more{padding:11px;font-size:10px}#asset-results,#workshop-sidebar,#menu{scrollbar-color:#787b69 #11160f;scrollbar-width:thin}@media(max-height:760px){#menu{top:30px;bottom:50px;max-height:none;padding:25px}#menu h1{margin:12px 0 18px}#menu>button{padding:14px}#minimap-panel{width:210px;bottom:61px}.bottom-dock{left:254px}.compact{padding:14px;width:190px}#workshop-sidebar{padding:21px 18px}.section{margin-top:19px;padding-top:18px}}@media(max-width:1050px){.resources{gap:12px}.resources>span{padding-left:21px}.topbar strong{font-size:14px}.compact{width:185px}.bottom-dock{gap:9px;left:254px}.bottom-dock>div{padding:13px}.bottom-dock>.primary{min-width:140px;font-size:9px;padding:14px}#build-tools button{min-width:106px;padding:10px;font-size:9px}#minimap-panel{width:210px}#menu{right:24px}.game-logo{max-width:43vw}}@media(max-width:800px){.topbar{left:12px;right:12px}.compact{display:none}#minimap-panel{width:170px;left:12px;bottom:64px;padding:10px}.bottom-dock{left:194px;right:12px;flex-wrap:wrap}.bottom-dock>div{width:100%}#build-tools button{min-width:90px;font-size:8px}.resources>span{font-size:7px}.resources b{font-size:15px}.resources>span::before{font-size:14px}.topbar strong{font-size:10px}.topbar .eyebrow{font-size:7px}.topbar #leave{font-size:7px}}@media(max-width:650px){#menu{left:15px;right:15px;top:25px;bottom:50px;width:auto;max-height:none}.game-logo{display:none}.bottom-dock{left:174px}#minimap-panel{width:150px}.minimap-heading{font-size:7px}.minimap-footer{font-size:6px}.topbar{gap:8px;padding:15px 12px}.resources{gap:7px}.resources>span{padding-left:0}.resources>span::before{display:none}#build-tools{flex-wrap:wrap}.bottom-dock>.primary{width:100%}.workshop-logo{width:145px}#asset-library{padding:15px 9px}.asset-card{min-height:112px}.asset-card strong{font-size:10px}}

/* ==== Main menu: logo nad panelem, uklad i styl w duchu Warcraft 3 ==== */
#menu-column{position:absolute;right:38px;top:26px;width:392px;max-height:calc(100vh - 52px);display:flex;flex-direction:column;gap:12px;pointer-events:none}
#menu-column #masthead{position:static;top:auto;left:auto;display:flex;flex-direction:column;align-items:flex-end;gap:2px;pointer-events:none}
#menu-column #masthead .version{align-self:flex-end;padding:0 4px 0 0;color:#cfd6cf}
#menu-column .game-logo{content:url('/Gfx/Logo2.png');width:100%;max-width:380px;height:auto;filter:drop-shadow(0 6px 12px #000b)}
#menu-column #menu{position:static;top:auto;right:auto;bottom:auto;left:auto;width:auto;max-height:none;flex:1 1 auto;min-height:0;overflow:auto;padding:26px;pointer-events:auto}
body.playing #menu-column{display:none}
#menu h1{text-align:center;font-size:28px;letter-spacing:.17em;font-weight:700;color:#f3dcb3;text-shadow:0 2px 0 #000,0 0 22px #d8a24a55;margin:2px 0 14px}
#menu .rule{height:2px;margin:0 0 22px;background:linear-gradient(90deg,transparent,#c9a15a,#efce8c,#c9a15a,transparent)}
#menu::after{border-color:#c9a15a55}
#menu>button{width:100%;text-align:center;font-size:13px;letter-spacing:.15em;padding:18px 16px;margin-bottom:10px}
#menu>button span{float:none;display:inline;margin-left:9px}
#menu #connection{display:block;margin:6px 0 0;font-size:8px;letter-spacing:.1em}
#menu>button:hover{border-color:#e8c583;background:linear-gradient(#3b2f1a,#171208);box-shadow:inset 0 0 0 2px #080707,inset 0 0 0 3px #8c6f3b,0 0 12px #d8a24a33}
#menu>button.primary{background:radial-gradient(ellipse at 50% 100%,#8a5a12 0%,#3d2707 60%,#140d04 100%);border-color:#e8c583;color:#fff6e4;box-shadow:inset 0 0 0 2px #170f03,inset 0 0 0 3px #d8a24a,0 0 16px #d8a24a33}
#menu>button.primary:hover{background:linear-gradient(#7a4e12,#c98f2a);color:#fff}
/* Akcje menu mają tę samą ściętą geometrię ramy co DEPLOY. */
#menu #nick{margin-bottom:28px}
#menu>button{border:2px solid transparent;border-image:var(--mn-frame);clip-path:var(--mn-clip);box-shadow:none}
#menu>button:hover{border-image-source:var(--mn-frame-gold);box-shadow:none}
#menu>button.primary{border-image-source:var(--mn-frame-gold);box-shadow:none}
@media(max-height:780px){#menu-column{top:14px;max-height:calc(100vh - 28px);gap:8px}#menu-column .game-logo{max-width:320px}#menu-column #menu{padding:18px}#menu h1{font-size:22px;margin-bottom:8px}#menu>button{padding:14px}}
@media(max-width:1050px){#menu-column{width:344px;right:24px}#menu-column .game-logo{max-width:344px}}
@media(max-width:650px){#menu-column{left:15px;right:15px;top:15px;width:auto;max-height:calc(100vh - 30px)}#menu-column .game-logo{display:none}#menu>button{padding:14px}}

/* ==== Modal (JOIN / OPTIONS) i przycisk warsztatu ==== */
#workshop-button{position:absolute;top:26px;left:38px;z-index:3;display:inline-flex;align-items:center;gap:9px;padding:10px 14px;font-size:10px;font-weight:700;letter-spacing:.13em;color:#cfd6cf;background:#0b0f0ecc;border:1px solid #ffffff2b;text-decoration:none}
#workshop-button:hover{border-color:#e8c583;color:#fff}
#workshop-button{border:1px solid transparent;border-image:var(--mn-frame-sm);clip-path:var(--mn-clip-sm)}
#workshop-button:hover{border-image-source:var(--mn-frame-sm-gold)}
@media(max-width:650px){#menu-column{max-height:calc(100vh - 78px)}}
#workshop-button .dev-tag{background:#dc392d;color:#fff;font-size:8px;letter-spacing:.14em;padding:2px 6px}
body.playing #workshop-button{display:none}
/* Przyciski DEV ukryte publicznie (js/dev-mode.js): [hidden] musi wygrać z display:inline-flex powyżej. */
#workshop-button[hidden],#debug-button[hidden]{display:none!important}
.modal{position:fixed;inset:0;z-index:20;display:flex;align-items:center;justify-content:center;background:#04070699;backdrop-filter:blur(4px)}
.modal .modal-panel{position:relative;width:min(640px,92vw);max-height:86vh;overflow:auto;padding:24px}
.modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px}
.modal-close{width:auto;padding:5px 11px;font-size:12px;text-align:center;line-height:1}
.modal h2{text-align:center;font-size:20px;letter-spacing:.15em;color:#f3dcb3;text-shadow:0 2px 0 #000;margin:4px 0 18px}
.browser-toolbar{display:flex;gap:10px;margin-bottom:14px}
.browser-toolbar input{margin:0;flex:1}
.browser-toolbar button{width:auto;padding:11px 16px;font-size:10px;text-align:center}
.server-row{display:grid;grid-template-columns:1.8fr .7fr .8fr auto;gap:12px;align-items:center;padding:13px 14px;margin-bottom:8px;background:#0b0f0ecc;border:1px solid #ffffff1c}
.server-row.placeholder{opacity:.5}
.server-row .server-name strong{font-size:12px;letter-spacing:.06em}
.server-row .server-name small{display:block;color:#9aa9ab;font-size:8px;letter-spacing:.1em;margin-top:3px}
.server-row>div{font-size:10px;letter-spacing:.08em;color:#c8cfc4}
.server-row button{width:auto;padding:9px 15px;font-size:9px;text-align:center;margin:0}
/* JOIN: bez statusu polaczenia; OPTIONS: bez ikony */
#browse #connection{display:none}
#menu>button#options span{display:none}
/* Wiekszy, staly modal browsera z ozdobnym scrollem w stylu UI */
#join-modal .modal-panel{width:min(780px,94vw);height:min(660px,88vh);overflow:hidden;display:flex;flex-direction:column}
#join-modal #rooms{flex:1 1 auto;min-height:0;max-height:none;overflow-y:auto;padding-right:5px;scrollbar-width:thin;scrollbar-color:#9a8552 #0a0d0c}
#join-modal #rooms::-webkit-scrollbar{width:12px}
#join-modal #rooms::-webkit-scrollbar-track{background:#0a0d0c;border:1px solid #ffffff14}
#join-modal #rooms::-webkit-scrollbar-thumb{background:linear-gradient(#8a7a52,#453a24);border:2px solid #0a0d0c}
#join-modal #rooms::-webkit-scrollbar-thumb:hover{background:linear-gradient(#c9a15a,#6b5a34)}

/* ==== HUD dowodzenia: porzadki wg uwag ==== */
/* Bez naglowka "COLONIAL FORCES / COMMAND CENTER" i wskazowek WASD. */
body.playing #commander-panel .command-heading{display:none}
body.playing #commander-panel .command-hints{display:none}
/* Panel surowcow: czyste kafelki z kolorowym paskiem zamiast ikon. */
body.playing #commander-panel .resources{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;width:100%}
body.playing #commander-panel .resources span{position:relative;display:flex;flex-direction:column;gap:3px;padding:9px 10px;background:linear-gradient(180deg,#171c1d,#0a0d0e);border:1px solid #ffffff12;border-left:3px solid #6b6f66;font-size:8px;letter-spacing:.14em;color:#9aa5a0}
body.playing #commander-panel .resources span::before{display:none}
body.playing #commander-panel .resources span:nth-child(1){border-left-color:#e0a24a}
body.playing #commander-panel .resources span:nth-child(2){border-left-color:#77d82c}
body.playing #commander-panel .resources span:nth-child(3){border-left-color:#8fd0e6}
body.playing #commander-panel .resources b{font-size:18px;font-weight:600;color:#f2e6cc;letter-spacing:0;line-height:1;white-space:nowrap}
/* Minimapa: tylko przycisk centrowania, bez "TACTICAL / N" i stopki z rozmiarem/wspolrzednymi. */
body.playing #commander-panel .minimap-heading{justify-content:flex-end;padding:0 2px 7px}
body.playing #commander-panel .minimap-heading>span,body.playing #commander-panel .minimap-heading>b{display:none}
body.playing #commander-panel .minimap-footer{display:none}
body.playing #commander-panel #minimap-home{display:grid;place-items:center;width:26px;height:26px;min-height:0;padding:0;color:#d6e2de;background:#0b1413d9;border:1px solid #879b8b88;box-shadow:0 1px 4px #000a;clip-path:polygon(5px 0,100% 0,100% calc(100% - 5px),calc(100% - 5px) 100%,0 100%,0 5px)}body.playing #commander-panel #minimap-home::before,body.playing #commander-panel #minimap-home::after{display:none}body.playing #commander-panel #minimap-home:hover{color:#fff;background:#1a2622ee;border-color:#dc392d}body.playing #commander-panel #minimap-home svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
/* Kategorie budowy rowno w rzedzie. */
body.playing #commander-panel #command-sections{gap:6px}
body.playing #commander-panel #command-sections button{display:grid;place-items:center;min-height:40px;padding:8px 4px;font-size:10px;letter-spacing:.1em;text-align:center}

/* ==== Warsztat: biblioteka jako lista grupowana po typach (kolory) ==== */
#asset-results{display:flex;flex-direction:column;gap:4px;align-content:stretch;padding:2px}
.asset-group{display:flex;align-items:center;gap:9px;margin:15px 2px 3px;font-size:9px;letter-spacing:.18em;font-weight:700;color:#c6ccc0}
.asset-group:first-child{margin-top:2px}
.asset-group::before{content:'';width:4px;height:13px;background:#8f968c}
.asset-card{display:flex;flex-direction:row;align-items:center;gap:11px;width:100%;min-height:0;padding:10px 12px;text-align:left;white-space:normal;border-left:3px solid #6b6f66;background:#0d1418}
.asset-symbol{flex:0 0 auto;width:22px;font-size:17px;line-height:1;text-align:center;color:#c3ccc3;text-shadow:none}
.asset-card strong{flex:1 1 auto;font-size:12px;font-weight:600;letter-spacing:.02em;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.asset-card small{flex:0 0 auto;font-size:8px;letter-spacing:.1em;color:#93a2a4}
.asset-group[data-category=weapons],.asset-card[data-category=weapons]{--type:#e0832f}
.asset-group[data-category=buildings],.asset-card[data-category=buildings]{--type:#6f9fd8}
.asset-group[data-category=characters],.asset-card[data-category=characters]{--type:#e0b64a}
.asset-group[data-category=props],.asset-card[data-category=props]{--type:#7fbf6a}
.asset-group[data-category=enemies],.asset-card[data-category=enemies]{--type:#c76bd0}
.asset-group[data-category=vehicles],.asset-card[data-category=vehicles]{--type:#5fc6c0}
.asset-group[data-category=armor],.asset-card[data-category=armor]{--type:#aab6c0}
.asset-group[data-category]{color:var(--type,#c6ccc0)}
.asset-group[data-category]::before{background:var(--type,#8f968c)}
.asset-card[data-category]{border-left-color:var(--type,#6b6f66)}
.asset-card[data-category]:hover{border-left-color:#f0c98a}

.modal-note{font-size:10px;line-height:1.6;color:#9aa9ab;margin:16px 0 0}
/* Ustawienia głośności: menu główne (OPTIONS) i menu ESC w grze mają jeden wygląd. */
.volume-settings{display:grid;gap:20px;margin-top:6px}
#field-menu .volume-settings{margin-top:22px;border-top:1px solid #8c988044;padding-top:20px}
.volume-setting,.volume-toggle{font-size:10px;font-weight:700;letter-spacing:.14em;color:#c8cfc4}
.volume-setting{display:grid;gap:10px}
.volume-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.volume-head output{color:#f3dcb3;letter-spacing:.06em;font-variant-numeric:tabular-nums}
.volume-setting input[type=range]{-webkit-appearance:none;appearance:none;display:block;width:100%;height:18px;margin:0;padding:0;background:transparent;border:0;box-shadow:none;cursor:pointer}
.volume-setting input[type=range]::-webkit-slider-runnable-track{height:6px;border:1px solid #6a6f66;background:linear-gradient(90deg,#d83729 var(--fill,0%),#080c0b var(--fill,0%))}
.volume-setting input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:18px;margin-top:-7px;background:#e6e6df;border:1px solid #060707;box-shadow:0 0 0 1px #d83729}
.volume-setting input[type=range]::-moz-range-track{height:6px;border:1px solid #6a6f66;background:#080c0b}
.volume-setting input[type=range]::-moz-range-progress{height:6px;background:#d83729}
.volume-setting input[type=range]::-moz-range-thumb{width:12px;height:18px;border-radius:0;background:#e6e6df;border:1px solid #060707;box-shadow:0 0 0 1px #d83729}
.volume-setting input[type=range]:hover::-webkit-slider-thumb{background:#fff8ec}
.volume-toggle{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-top:18px;border-top:1px solid #85857b55}
.volume-toggle button{width:auto;min-width:140px;padding:10px 14px;font-size:9px;text-align:center}
.ao-levels{display:flex;gap:4px}
.volume-toggle .ao-levels button{min-width:48px;padding:10px 10px}
.ao-levels button[aria-pressed=true]{background:#d83729;border-color:#f06a54;color:#fff8ec}
@media(max-width:650px){#workshop-button{top:auto;bottom:15px;left:15px;padding:8px 10px;font-size:9px}.server-row{grid-template-columns:1.4fr auto auto;gap:8px}.server-row>div:nth-child(3){display:none}}
/* Nazwy mechanik w opisach: kolor według kategorii (zasoby zgodnie z docs/UI-CURRENCY.md). */
.kw{font-weight:700;white-space:nowrap}
.kw-ability{color:#ffc76b}
.kw-structure{color:#f0d7a0}
.kw-crystal{color:var(--currency-crystal,#85d9ff)}
.kw-credits{color:var(--currency-credits,#bfe589)}
.kw-unit{color:#9fe3b0}
.kw-upgrade,.kw-effect{color:#ff9f6b}
/* Hasło pod logo (DESIGN „Tożsamość”, 2026-09-26): czym jest gra w jednej linijce. */
/* Panel O z menu głównego (0.27.6): nagrywanie przed meczem i wczytanie nagrania (docs/REPLAY.md). Pod MODEL WORKSHOP. */
#debug-button{position:absolute;top:72px;left:38px;z-index:3;display:inline-flex;align-items:center;gap:9px;padding:10px 14px;font-size:10px;font-weight:700;letter-spacing:.13em;color:#cfd6cf;background:#0b0f0ecc;border:1px solid transparent;border-image:var(--mn-frame-sm);clip-path:var(--mn-clip-sm);box-shadow:none;cursor:pointer}
#debug-button:hover{border-image-source:var(--mn-frame-sm-gold);box-shadow:none;color:#fff}
body.playing #debug-button,body.campaign-open #debug-button,body.loading-game #debug-button{display:none}