:root{--bg:#080e1b;--card:#111c30;--card2:#172740;--border:#30435e;--orange:#ff9c3d;--blue:#60a5fa;--muted:#a5b6d0;--text:#f2f6ff}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(ellipse at 75% 0,#20365855,transparent 40%),var(--bg);color:var(--text);font:13px Inter,Arial,sans-serif}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button{cursor:pointer}.wrap{width:min(1380px,calc(100% - 36px));margin:auto}.nav{background:#101b2d;border-bottom:1px solid var(--border)}.navrow{min-height:70px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{font:900 27px 'Barlow Condensed',sans-serif}.brand span{color:var(--orange)}.navright{display:flex;gap:22px;align-items:center;font-weight:700}.navright a:hover{color:var(--orange)}.hero{position:relative;overflow:hidden;min-height:220px;margin:22px 0 17px;padding:35px 36px;border:1px solid #466389;border-radius:12px;background:linear-gradient(90deg,#081324 0%,#081324ef 42%,#08132445 100%),url('/images/maniagrania/cs16.webp') center 35%/cover}.eyebrow{color:var(--orange);font-weight:800;font-size:11px;letter-spacing:1.2px}.hero h1{font:900 clamp(38px,5vw,64px)/.95 'Barlow Condensed',sans-serif;margin:14px 0}.hero h1 span{color:var(--orange)}.hero p{max-width:560px;line-height:1.7;color:#c1d0e6}.games{display:flex;gap:9px;overflow-x:auto;padding:0 0 15px;scrollbar-color:#496383 #0e1929}.game{flex:0 0 auto;min-width:108px;border:1px solid var(--border);background:#15243b;border-radius:8px;padding:12px;text-align:center;font-weight:800}.game.active{border-color:var(--orange);background:#392b25;color:#ffba75}.game.soon{color:#a9b8cf}.game small{display:block;font-size:9px;font-weight:500;color:#9eacc3;margin-top:5px}.game:hover{border-color:#ff9c3d}.ad{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;background:linear-gradient(105deg,#38281e,#182338 75%);border:1px solid #a36935;border-radius:11px;padding:20px 24px;margin:4px 0 20px}.ad h2{font:900 26px 'Barlow Condensed',sans-serif;margin:5px 0}.ad p{color:#cfbead;margin:0;font-size:12px}.ad a{background:linear-gradient(120deg,#ffb14b,#ff8127);color:#17171d;border-radius:7px;padding:13px 20px;font-weight:800}.ad a:hover{filter:brightness(1.1)}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0 0 20px}.stat{border:1px solid var(--border);background:var(--card);border-radius:9px;padding:16px}.stat strong{display:block;font:800 25px 'Barlow Condensed',sans-serif}.stat span{font-size:11px;color:var(--muted)}.panel{background:var(--card);border:1px solid var(--border);border-radius:11px;overflow:hidden;margin-bottom:20px}.panelhead{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;padding:20px;border-bottom:1px solid var(--border);background:linear-gradient(95deg,#192c48,#111c30)}.panelhead h2{font:900 27px 'Barlow Condensed',sans-serif;margin:0}.panelhead h2 span{color:var(--orange)}.panelhead p{margin:6px 0 0;font-size:11px;color:var(--muted)}.demo-label{border:1px solid #9b713d;color:#ffc178;border-radius:5px;padding:7px 10px;font-size:10px;font-weight:800}.filters{display:grid;grid-template-columns:minmax(200px,2fr) repeat(2,minmax(125px,1fr));gap:12px;padding:16px 20px;border-bottom:1px solid var(--border)}.filters input,.filters select{min-width:0;width:100%;background:#0b1628;color:#e9f1ff;border:1px solid #3d5677;border-radius:7px;padding:12px}.table-scroll{overflow-x:auto}table{width:100%;border-collapse:collapse;white-space:nowrap;text-align:left}th{padding:13px 14px;background:#0d1a2c;color:#9fb5d2;font-size:10px;text-transform:uppercase;letter-spacing:.5px}td{padding:14px;border-top:1px solid #293c55;font-size:11px;color:#c1d0e5}tbody tr:hover{background:#192b46}.rank{font:900 20px 'Barlow Condensed',sans-serif;color:#ffb04e}.name{font-weight:800;color:#fff;font-size:12px}.sub{font-size:10px;color:#8fa2be;margin-top:5px}.chip{font-size:10px;color:#ffd19c;border:1px solid #855e36;background:#3b2b20;border-radius:4px;padding:4px 6px;font-weight:800}.muted{color:var(--muted)}.progress{height:4px;width:66px;background:#30435e;border-radius:5px;margin-top:6px;overflow:hidden}.progress i{height:100%;display:block;background:linear-gradient(90deg,#438fff,#47d3c4)}.table-footer{border-top:1px solid var(--border);padding:17px 20px;text-align:center}.more{border:1px solid #ff9c3d;background:#f9902b;color:#131b28;border-radius:7px;padding:12px 23px;font-weight:800}.more:hover{background:#ffb254}.more[hidden]{display:none}.count{color:var(--muted);font-size:11px;margin:12px 0 0}.notice{padding:13px 20px;border-top:1px solid var(--border);color:#9faec5;font-size:11px;line-height:1.6}.extras{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-bottom:30px}.placeholder{padding:20px;min-height:115px}.placeholder h3{font:800 22px 'Barlow Condensed',sans-serif;margin:0 0 12px}.placeholder p{color:var(--muted);line-height:1.6;margin:0}.footer{border-top:1px solid var(--border);padding:25px 0;color:#92a2ba;text-align:center;font-size:11px}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--orange);outline-offset:3px}@media(max-width:800px){.stats{grid-template-columns:repeat(2,1fr)}.filters{grid-template-columns:1fr}.navright{gap:10px;font-size:11px}.extras{grid-template-columns:1fr}.hero{padding:30px 20px}.ad{align-items:flex-start}}@media(max-width:480px){.wrap{width:calc(100% - 22px)}.brand{font-size:21px}.navright{gap:8px}.stats{gap:7px}.stat{padding:12px}.hero{min-height:250px}}

/* Hybrid 2030 monitoring dashboard */
.monitor-grid{display:grid;grid-template-columns:1.12fr 1fr;gap:15px;margin-bottom:16px}.monitor-panel{padding:19px 20px;min-width:0}.monitor-panel h3{font:900 24px 'Barlow Condensed',sans-serif;margin:0 0 5px}.monitor-panel .hint{color:var(--muted);font-size:11px;margin:0 0 15px}.monitor-top{display:flex;align-items:center;justify-content:space-between;gap:12px}.monitor-tag{color:#ffba75;border:1px solid #a36a3b;border-radius:5px;font-size:10px;padding:5px 8px}.bars{height:156px;display:flex;align-items:flex-end;gap:3px;border-bottom:1px solid #48617e;background:repeating-linear-gradient(to top,transparent 0,transparent 37px,#2a4059 38px);padding:8px 2px 0}.bar{flex:1;min-width:2px;border-radius:2px 2px 0 0;background:linear-gradient(0deg,#0c9b75,#46e4a6);height:var(--h);transform-origin:bottom;animation:rise .8s both;animation-delay:var(--delay)}.bar.warning{background:linear-gradient(#ffbb55,#f28b2f)}.bar.down{background:linear-gradient(#ff625c,#b72f3e)}@keyframes rise{from{transform:scaleY(.12)}to{transform:scaleY(1)}}.axis{display:flex;justify-content:space-between;color:#8da4c2;font-size:10px;margin-top:9px}.legend{display:flex;gap:14px;flex-wrap:wrap;color:#adbed3;font-size:10px;margin-top:13px}.dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:5px;background:#40d995}.dot.warn{background:#ffa52e}.dot.off{background:#ee4b54}.donut-layout{display:flex;align-items:center;gap:22px;justify-content:center;padding:6px 0}.donut{width:170px;aspect-ratio:1;border-radius:50%;background:conic-gradient(#2b435f 0 100%);display:grid;place-items:center;flex-shrink:0;animation:pop .65s ease-out}.donut-inner{width:118px;aspect-ratio:1;border-radius:50%;background:#111c30;display:flex;flex-direction:column;align-items:center;justify-content:center}.donut-inner strong{font:900 31px 'Barlow Condensed',sans-serif}.donut-inner span{color:var(--muted);font-size:10px}.donut-list{min-width:125px;display:grid;gap:15px}.donut-list div{display:flex;align-items:center;justify-content:space-between;gap:15px;font-size:11px}.donut-list b{color:#dce8f9}@keyframes pop{from{opacity:.2;transform:scale(.85)}to{opacity:1;transform:scale(1)}}.events{list-style:none;padding:0;margin:0}.events li{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid #2a3e57}.events li:last-child{border-bottom:0}.event-icon{width:31px;height:31px;display:grid;place-items:center;border-radius:8px;background:#243a53;color:#ffb451;flex-shrink:0}.event-copy{flex:1;min-width:0}.event-copy strong{font-size:11px}.event-copy small{display:block;color:var(--muted);margin-top:4px;font-size:10px}.event-time{font-size:10px;color:#91a7c3}.status-history{display:grid;gap:9px;margin-top:18px}.history-row{display:grid;grid-template-columns:85px 1fr;gap:8px;align-items:center;font-size:11px;color:#adc0d8}.history-squares{display:flex;gap:3px}.history-squares i{flex:1;height:22px;min-width:3px;border-radius:2px;background:#20334a;border:1px solid #34506e}.history-squares i.active{background:#24c87f;border-color:#39e69a}.history-squares i.warning{background:#ff9b31;border-color:#ffb14b}.history-squares i.down{background:#e84c58;border-color:#f8757d}.stable-table{width:100%}.stable-table th,.stable-table td{padding:11px 9px}.stable-table .good{color:#4be6a4;font-weight:800}.spark{width:86px;height:27px;display:block}.spark polyline{fill:none;stroke:#40dd95;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}.spark.bad polyline{stroke:#f1a13e}.dashboard-notice{background:#17263c;border:1px solid #3a5677;border-radius:8px;color:#bfd0e5;font-size:11px;line-height:1.7;padding:13px 16px;margin-bottom:18px}.refresh-demo{border:1px solid #426da1;background:#152e4a;color:#b6d8ff;border-radius:6px;padding:8px 12px;font-weight:700}.refresh-demo:hover{background:#204367}.refresh-demo:disabled{opacity:.65;cursor:wait}.demo-pulse{animation:pulseDemo .7s ease-in-out}@keyframes pulseDemo{50%{opacity:.35}}.trendsvg{width:76px;height:24px;display:block}.trendsvg polyline{fill:none;stroke:#44dca0;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.trendsvg .baseline{stroke:#334a66;stroke-width:1}.sort-btn{border:0;background:transparent;color:inherit;font:inherit;font-weight:inherit;cursor:pointer;padding:0}.sort-btn:hover{color:#ffb35b}tr[hidden]{display:none!important}@media(max-width:850px){.monitor-grid{grid-template-columns:1fr}.donut-layout{justify-content:flex-start}}@media(max-width:500px){.monitor-panel{padding:15px}.donut{width:130px}.donut-inner{width:90px}.donut-list{gap:8px}.history-row{grid-template-columns:65px 1fr}.history-squares{gap:2px}}
@media(prefers-reduced-motion:reduce){.bar,.donut,.demo-pulse{animation:none!important}}

/* ManiaGrania CS 1.6 — poprawki jakości V4 */
.hero {
  min-height: 310px;
  display: flex;
  align-items: center;
  padding: 38px 42px;
  isolation: isolate;
  background:
    linear-gradient(90deg, #071323 0%, #071323f5 35%, #08172cbd 60%, #07132325 100%),
    radial-gradient(ellipse at 80% 40%, #2d71b342, transparent 56%),
    url('/images/maniagrania/cs16.webp') 78% 42% / cover no-repeat;
  box-shadow: inset 0 0 75px #060d1e8a, 0 16px 45px #0003;
}
.hero::before {
  content:""; position:absolute; inset:0; pointer-events:none; z-index:-1;
  background:linear-gradient(120deg, transparent 25%, #4a89cd13 65%, transparent 100%);
}
.hero-content { max-width: 660px; position:relative; z-index:1; }
.hero h1 { font-size:clamp(43px,5.3vw,73px); letter-spacing:.2px; text-shadow:0 3px 24px #000a; }
.hero p { font-size:13px; max-width:530px; }
.hero-meta {display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.hero-meta span {font-size:10px;letter-spacing:.7px;font-weight:800;padding:7px 10px;
  border:1px solid #4a6686;background:#0b1c30d9;border-radius:5px;color:#c5d8f3}
.games {display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;overflow:visible;padding:0 0 18px}
.game {min-width:0;min-height:80px;display:flex;align-items:center;gap:10px;text-align:left;padding:10px;
  transition:transform .15s ease,border-color .15s ease,background .15s ease}
.game:hover {transform:translateY(-2px);background:#1c304c}
.game-icon {width:42px;height:46px;flex:0 0 42px;display:grid;place-items:center;
  border-radius:7px;background:linear-gradient(145deg,#304f78,#0a1425);
  color:#fff;font:900 16px 'Barlow Condensed',sans-serif;letter-spacing:-.5px;
  box-shadow:inset 0 1px #ffffff30,0 5px 14px #0004}
.game-label {min-width:0;font-size:12px;line-height:1.3}
.game small {font-size:9px;line-height:1.3}
.game-cs .game-icon,.game-cs2 .game-icon {background:linear-gradient(135deg,#f5a52b,#75410f)}
.game-mc .game-icon,.game-valheim .game-icon {background:linear-gradient(135deg,#5ca04d,#193e32)}
.game-rust .game-icon,.game-dayz .game-icon {background:linear-gradient(135deg,#d45a43,#552626)}
.game-fivem .game-icon,.game-samp .game-icon,.game-mta .game-icon {background:linear-gradient(135deg,#5c83d5,#232e6c)}
.game-terraria .game-icon,.game-ark .game-icon,.game-gmod .game-icon {background:linear-gradient(135deg,#9871bd,#3b315b)}
.not-set {display:inline-block;font-size:10px;color:#ff8188;border:1px solid #9e424b;background:#3b1d2b;border-radius:5px;padding:7px 9px;font-weight:700}.forum-link{display:inline-block;font-size:10px;color:#74f2a7;border:1px solid #2f9964;background:#123d32;border-radius:5px;padding:7px 9px;font-weight:800}.forum-link:hover{background:#1c5b43}
.vote-btn {background:#17273c;border:1px solid #38516f;color:#a8bad2;border-radius:5px;padding:7px 9px;white-space:nowrap}
.vote-btn:disabled {opacity:.75;cursor:not-allowed}
.vote-caption {display:block;color:#8b9eb7;font-size:9px;margin-top:4px}
@media(max-width:1200px){.games{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:760px){.games{grid-template-columns:repeat(3,minmax(0,1fr))}.hero{min-height:300px;padding:30px 22px;
  background:linear-gradient(90deg,#071323 0%,#071323e8 60%,#07132375),url('/images/maniagrania/cs16.webp') center/cover}}
@media(max-width:520px){.games{grid-template-columns:repeat(2,minmax(0,1fr))}.hero h1{font-size:42px}
  .game{min-height:72px}.game-icon{width:37px;flex-basis:37px;height:40px}}
@media(prefers-reduced-motion:reduce){.game{transition:none}}

/* ManiaGrania — ranking CS 1.6, 8 kolumn */
#lista .filters { grid-template-columns: minmax(0,2fr) minmax(150px,1fr); }
#lista .table-scroll { width:100%; max-width:100%; overflow-x:auto; }
#lista .ranking-table { width:100%; min-width:780px; table-layout:fixed; border-collapse:collapse; }
#lista .ranking-table th, #lista .ranking-table td { min-width:0; overflow:hidden; text-overflow:ellipsis; vertical-align:middle; }
#lista .ranking-table th:nth-child(1) { width:5%; }
#lista .ranking-table th:nth-child(2) { width:29%; }
#lista .ranking-table th:nth-child(3) { width:17%; }
#lista .ranking-table th:nth-child(4) { width:13%; }
#lista .ranking-table th:nth-child(5) { width:9%; }
#lista .ranking-table th:nth-child(6) { width:12%; }
#lista .ranking-table th:nth-child(7) { width:6%; }
#lista .ranking-table th:nth-child(8) { width:9%; }
#lista .ranking-table .name { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; white-space:normal; overflow-wrap:anywhere; line-height:1.4; }
#lista .ranking-table .server-address { overflow-wrap:anywhere; white-space:normal; }
#lista .ranking-table .server-map { overflow-wrap:anywhere; white-space:normal; }
#lista .ranking-table .chip { display:inline-block; max-width:100%; white-space:normal; overflow-wrap:anywhere; }
#lista .ranking-table .empty-row td { text-align:center; padding:25px; }
@media(max-width:700px) { #lista .filters { grid-template-columns:1fr; } }
/* Przywrócenie grafik w nawigacji gier */

.games .game-poster-tile {
    position: relative;
    display: flex;
    align-items: flex-end;
    overflow: hidden;
    min-height: 125px;
    background-image: var(--poster);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.games .game-poster-tile .poster-caption {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 12px;
    background: linear-gradient(
        to top,
        rgba(0, 0, 0, 0.85),
        rgba(0, 0, 0, 0)
    );
}

.games .game-poster-tile .poster-caption strong,
.games .game-poster-tile .poster-caption small {
    color: #fff;
}
.stats { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
@media(max-width:600px) { .stats { grid-template-columns:1fr; } }
.games .game-poster-tile { background-image:var(--poster)!important; background-size:cover!important; background-position:center!important; background-repeat:no-repeat!important; }
.monitor-grid .bars .bar { flex:1 1 4px; min-width:3px; height:var(--h,100%); align-self:end; display:block; background:#40d995; }
.monitor-grid .bars .bar.down { background:#ee4b54; }
.monitor-grid .history-squares { display:flex; flex-wrap:wrap; gap:3px; }
.monitor-grid .history-squares i { display:block; width:9px; height:14px; border-radius:2px; background:#40d995; }
.monitor-grid .history-squares i.down { background:#ee4b54; }

/* ==============================================================
   ManiaGrania 2030 | Statystyki CS 1.6 — korekta UI
   Nie zmienia danych, monitoringu ani nawigacji.
   ============================================================== */

/* Panele: poprawne zachowanie elementów w dwukolumnowym gridzie */
.monitor-grid { align-items: stretch; }
.monitor-grid > * { min-width: 0; max-width: 100%; }
.monitor-grid .monitor-panel { min-width: 0; overflow: hidden; }
.monitor-grid .monitor-top { min-width: 0; }
.monitor-grid .monitor-top h3 { min-width: 0; overflow-wrap: anywhere; }

/* Historia pomiarów: każdy odczyt ma własny, wąski słupek.
   Przy jednym odczycie nie tworzymy fałszywej linii 24-godzinnej. */
.monitor-grid .bars {
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    gap: 5px;
    height: 170px;
    width: 100%;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 14px 8px 0;
    border-bottom: 1px solid #405874;
    border-radius: 8px 8px 0 0;
    background: repeating-linear-gradient(
        to top, transparent 0, transparent 37px,
        rgba(113,151,194,.13) 38px
    );
    scrollbar-width: thin;
}
.monitor-grid .bars .bar {
    flex: 0 0 9px !important;
    width: 9px;
    min-width: 9px !important;
    max-width: 9px;
    height: var(--h, 100%);
    align-self: flex-end;
    border-radius: 3px 3px 0 0;
    background: linear-gradient(0deg, #159c78, #45dfa4);
    box-shadow: 0 0 12px rgba(50,215,155,.12);
}
.monitor-grid .bars .bar.down {
    background: linear-gradient(0deg, #ad3043, #f36b74);
    box-shadow: 0 0 10px rgba(243,107,116,.12);
}
.monitor-grid .bars .bar.warning {
    background: linear-gradient(0deg, #bd7427, #ffb858);
}
.monitor-grid .axis { gap: 5px; }
.monitor-grid .legend { margin-top: 12px; }

/* Stabilność: tabela ma się mieścić w panelu bez przewijania
   wymuszonego przez wielowyrazowe nazwy serwerów. */
.monitor-grid .stable-table,
.monitor-panel .stable-table {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    table-layout: fixed;
    border-collapse: collapse;
    white-space: normal;
}
.monitor-grid .stable-table th,
.monitor-grid .stable-table td,
.monitor-panel .stable-table th,
.monitor-panel .stable-table td {
    min-width: 0;
    padding: 12px 9px;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
    white-space: normal;
}
.monitor-grid .stable-table th:first-child,
.monitor-grid .stable-table td:first-child,
.monitor-panel .stable-table th:first-child,
.monitor-panel .stable-table td:first-child {
    width: 38px;
    text-align: center;
}
.monitor-grid .stable-table th:last-child,
.monitor-grid .stable-table td:last-child,
.monitor-panel .stable-table th:last-child,
.monitor-panel .stable-table td:last-child {
    width: 105px;
    text-align: right;
    white-space: nowrap;
}
.monitor-grid .stable-table td:nth-child(2),
.monitor-panel .stable-table td:nth-child(2) {
    overflow-wrap: anywhere;
    word-break: normal;
    line-height: 1.45;
    font-weight: 650;
    color: #e9f2ff;
}
.monitor-grid .stable-table tbody tr,
.monitor-panel .stable-table tbody tr {
    transition: background-color .15s ease;
}
.monitor-grid .stable-table tbody tr:hover,
.monitor-panel .stable-table tbody tr:hover {
    background: rgba(85,137,191,.09);
}

/* Historia statusów: wąskie segmenty, bez wymuszonego rozciągania */
.monitor-grid .history-squares { min-width: 0; }
.monitor-grid .history-squares i { flex: 0 0 9px; }

@media (max-width: 620px) {
    .monitor-grid .bars { gap: 3px; height: 145px; }
    .monitor-grid .bars .bar { flex-basis: 7px !important; width: 7px; min-width: 7px !important; max-width: 7px; }
    .monitor-grid .stable-table th,
    .monitor-grid .stable-table td,
    .monitor-panel .stable-table th,
    .monitor-panel .stable-table td { padding: 10px 5px; font-size: 10px; }
    .monitor-grid .stable-table th:last-child,
    .monitor-grid .stable-table td:last-child,
    .monitor-panel .stable-table th:last-child,
    .monitor-panel .stable-table td:last-child { width: 76px; }
}