:root {
  
  --pv-panel: var(--pv-color-views-panel);
  --pv-line: var(--pv-color-views-line);
  --pv-ink: var(--pv-color-views-ink);
  --pv-dim: var(--pv-color-views-dim);
  --pv-faint: var(--pv-color-views-faint);
  --pv-or: var(--pv-color-signal-accent);
  --pv-cy: var(--pv-color-res-cristal);
  --pv-vert: var(--pv-color-views-vert);
  --pv-rouge: var(--pv-color-signal-danger);
}



#pv-dock {
  
  
  position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 49;
  display: flex; gap: 6px; padding: 5px;
  min-width: 0; max-width: calc(100vw - 24px); width: fit-content; margin: 0 auto;
  overflow-x: auto; overscroll-behavior-x: contain;
  scrollbar-width: none;                 
  background: var(--pv-color-views-dockBg); border: 1px solid var(--pv-line);
  border-top-color: var(--pv-color-signal-accentA22);
  border-radius: 999px;
  
  box-shadow: 0 12px 32px var(--pv-color-overlay-blackA450);
}
#pv-dock::-webkit-scrollbar { display: none; }
#pv-dock > * { flex: 0 0 auto; }         
#pv-dock button {
  appearance: none; border: 1px solid transparent; background: none; cursor: pointer;
  color: var(--pv-dim); font: 500 var(--cs-2)/1 inherit; letter-spacing: .02em;
  padding: 8px 13px; border-radius: 999px; display: flex; align-items: center; gap: 7px;
  transition: color .15s, background .15s, border-color .15s;
}
#pv-dock button:hover { color: var(--pv-ink); background: var(--pv-color-overlay-whiteA060); }
#pv-dock button.on { color: var(--pv-or); background: var(--pv-color-signal-accentA12); border-color: var(--pv-color-signal-accentA35); }
#pv-dock .pv-i { font-size: var(--cs-3); line-height: 1; }
@media (max-width: 720px) { #pv-dock .pv-lbl { display: none; } #pv-dock button { padding: 9px 10px; } }


body:not([data-scale="planet"]) #pv-dock button[data-id="ressources"],
body:not([data-scale="planet"]) #pv-dock button[data-id="badania"],
body:not([data-scale="planet"]) #pv-dock button[data-id="armia"],
body:not([data-scale="planet"]) #pv-dock button[data-id="gouverneur"],
body:not([data-scale="planet"]) #pv-dock button[data-id="populacja"] {
  display: none;
}


#pv-dock button.hud-dim,
#fab-fleet.hud-dim,
.fab-x.hud-dim {
  opacity: .38; filter: saturate(.5);
  transition: opacity .25s ease, filter .25s ease;
}
#pv-dock button.hud-dim:hover, #fab-fleet.hud-dim:hover, .fab-x.hud-dim:hover,
#pv-dock button.hud-dim:active, #fab-fleet.hud-dim:active, .fab-x.hud-dim:active {
  opacity: .72;
}
@media (prefers-reduced-motion: reduce) {
  .hud-dim { transition: none; }
}


.pv-win {
  position: fixed; z-index: 46; width: 340px; max-width: calc(100vw - 24px);
  
  background: var(--pv-color-views-winBg); border: 1px solid var(--pv-line); border-radius: 12px;
  box-shadow: 0 24px 64px var(--pv-color-overlay-blackA620);
  color: var(--pv-ink); font-size: var(--cs-3); overflow: hidden;
  animation: pv-in .16s ease-out;
}
@keyframes pv-in { from { opacity: 0; transform: translateY(6px) scale(.985); } }

.pv-win::before {
  content: ''; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  opacity: .05; mix-blend-mode: overlay; border-radius: inherit;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 180px 180px;
}
.pv-win > * { position: relative; z-index: 1; }
.pv-win.pv-wide { width: 620px; }
.pv-win header {
  display: flex; align-items: center; gap: 10px; cursor: grab; user-select: none;
  padding: 10px 12px; border-bottom: 1px solid var(--pv-line);
  background: linear-gradient(180deg, var(--pv-color-overlay-whiteA035), transparent);
}
.pv-win header.pv-drag { cursor: grabbing; }
.pv-win header h3 {
  margin: 0; flex: 1; font: 600 var(--cs-2)/1.2 'Clash Display', inherit; letter-spacing: .06em; text-transform: uppercase;
}
.pv-win header button {
  appearance: none; background: none; border: none; cursor: pointer; color: var(--pv-faint);
  font-size: var(--cs-4); line-height: 1; padding: 2px 4px; border-radius: 5px;
}
.pv-win header button:hover { color: var(--pv-ink); background: var(--pv-color-overlay-whiteA070); }
.pv-body { padding: 12px; max-height: min(62vh, 520px); overflow: auto; overscroll-behavior: contain; }
.pv-win.pv-min .pv-body { display: none; }

.pv-win.pv-pinned {
  left: 20px; top: 92px;
  
  bottom: max(calc(12px + var(--pv-dock-h, 0px)), 64px);
  display: flex; flex-direction: column; animation: none;
}
.pv-win.pv-pinned header { cursor: default; flex: none; }
.pv-win.pv-pinned .pv-body { max-height: none; flex: 1; }

.pv-win.pv-pinned.pv-min { bottom: auto; }


.pv-row { display: flex; justify-content: space-between; gap: 12px; padding: 6px 0; color: var(--pv-dim); }
.pv-row + .pv-row { border-top: 1px solid var(--pv-color-views-rowDividerA55); }
.pv-row b { color: var(--pv-ink); font-weight: 600; font-variant-numeric: tabular-nums; }
.pv-pos { color: var(--pv-vert); }
.pv-neg { color: var(--pv-rouge); }
.pv-note { margin: 10px 0 0; font-size: var(--cs-3); color: var(--pv-faint); line-height: 1.5; }


.pv-tabs { display: flex; gap: 6px; margin-bottom: 10px; flex-wrap: wrap; }
.pv-tabs span {
  font-size: var(--cs-2); padding: 6px 12px; border: 1px solid var(--pv-line); border-radius: 8px;
  color: var(--pv-dim); cursor: pointer;
}
.pv-tabs span.on { color: var(--pv-color-bg-void); background: var(--pv-or); border-color: var(--pv-or); font-weight: 700; }
table.pv-tab { width: 100%; border-collapse: collapse; font-size: var(--cs-3); }
table.pv-tab th {
  text-align: left; font: 600 10px/1 'Clash Display', inherit; letter-spacing: .13em;
  color: var(--pv-faint); padding: 0 8px 8px; border-bottom: 1px solid var(--pv-line); white-space: nowrap;
}
table.pv-tab td { padding: 9px 8px; border-bottom: 1px solid var(--pv-color-views-rowDivider); vertical-align: middle; }
table.pv-tab tr:hover td { background: var(--pv-color-overlay-whiteA018); }
.pv-b { display: flex; align-items: center; gap: 9px; }
.pv-g { width: 24px; height: 24px; border-radius: 6px; display: grid; place-items: center; font-weight: 700; font-size: var(--cs-2); color: var(--pv-color-bg-void); flex: none; }
.pv-lv { color: var(--pv-or); font-weight: 700; font-variant-numeric: tabular-nums; }
.pv-n { color: var(--pv-dim); font-variant-numeric: tabular-nums; white-space: nowrap; }
.pv-up {
  appearance: none; cursor: pointer; white-space: nowrap;
  font: 500 11.5px/1 inherit; padding: 6px 11px; border-radius: 7px;
  border: 1px solid var(--pv-color-signal-accentA42); color: var(--pv-or); background: var(--pv-color-signal-accentA09);
}
.pv-up:hover { background: var(--pv-color-signal-accentA17); }
.pv-up[disabled] { border-color: var(--pv-line); color: var(--pv-faint); background: none; cursor: not-allowed; }
.pv-empty { color: var(--pv-faint); font-size: var(--cs-3); padding: 14px 4px; line-height: 1.55; }


.pv-lyr {
  display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 8px;
  font-size: var(--cs-3); color: var(--pv-dim); cursor: pointer;
}
.pv-lyr:hover { background: var(--pv-color-overlay-whiteA040); color: var(--pv-ink); }
.pv-lyr.on { background: var(--pv-color-signal-accentA10); color: var(--pv-ink); box-shadow: inset 0 0 0 1px var(--pv-color-signal-accentA28); }
.pv-sw { width: 11px; height: 11px; border-radius: 3px; flex: none; }
.pv-scale { margin-top: 12px; padding-top: 11px; border-top: 1px solid var(--pv-line); }
.pv-scale i { display: block; height: 7px; border-radius: 4px; margin-bottom: 6px; font-style: normal; }
.pv-scale span { font-size: var(--cs-2); color: var(--pv-faint); }


.pv-sec { font: 600 var(--cs-1)/1 'Clash Display', inherit; letter-spacing: .14em; color: var(--pv-faint); margin: 14px 0 8px; }
.pv-sec:first-child { margin-top: 0; }
.pv-opt { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--pv-color-views-rowDivider); }
.pv-opt span { color: var(--pv-dim); font-size: var(--cs-3); }
.pv-seg { display: flex; gap: 4px; }
.pv-seg button {
  appearance: none; cursor: pointer; font: 500 var(--cs-2)/1 inherit; padding: 6px 10px; border-radius: 7px;
  border: 1px solid var(--pv-line); background: none; color: var(--pv-dim);
}
.pv-seg button.on { color: var(--pv-color-bg-void); background: var(--pv-or); border-color: var(--pv-or); font-weight: 700; }
.pv-sw-tog {
  appearance: none; cursor: pointer; width: 40px; height: 22px; border-radius: 999px; flex: none;
  border: 1px solid var(--pv-line); background: var(--pv-color-views-toggleTrack); position: relative; transition: background .16s;
}
.pv-sw-tog:after {
  content: ''; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%;
  background: var(--pv-faint); transition: transform .16s, background .16s;
}
.pv-sw-tog.on { background: var(--pv-color-signal-accentA22); border-color: var(--pv-color-signal-accentA50); }
.pv-sw-tog.on:after { transform: translateX(18px); background: var(--pv-or); }


.pv-swatch-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(30px, 1fr)); gap: 8px; padding: 4px 0; }
.pv-swatch {
  appearance: none; cursor: pointer; width: 30px; height: 30px; border-radius: 8px; padding: 0;
  background: var(--sw); border: 2px solid transparent; transition: transform .12s, border-color .12s;
}
.pv-swatch:hover { transform: scale(1.1); }
.pv-swatch.on { border-color: var(--pv-ink); box-shadow: 0 0 0 2px var(--pv-color-overlay-blackA400); }


@media (max-width: 720px) {
  .pv-win, .pv-win.pv-wide, .pv-win.pv-full {
    left: 8px !important; right: 8px; width: auto !important;
    top: auto !important; bottom: 62px !important; transform: none !important;
    max-height: 64vh; display: flex; flex-direction: column;
  }
  .pv-win header { cursor: default; }
  .pv-body { max-height: none; flex: 1; }
  
  table.pv-tab th:nth-child(3), table.pv-tab td:nth-child(3),
  table.pv-tab th:nth-child(4), table.pv-tab td:nth-child(4) { display: none; }
  table.pv-tab th, table.pv-tab td { padding: 8px 5px; font-size: 12px; }
  .pv-b { gap: 7px; }
  .pv-up { padding: 6px 9px; font-size: 11px; }
  #pv-dock { left: 8px; right: 8px; bottom: 8px; justify-content: space-between; }
}


body.pv-mode-registre #scene { filter: saturate(.25) brightness(.35); }
body.pv-mode-registre #hint, body.pv-mode-registre #fab-build, body.pv-mode-registre #fab-fleet { display: none !important; }
body.pv-mode-registre .pv-win.pv-full {
  left: 50% !important; top: 50% !important; transform: translate(-50%, -50%);
  width: min(880px, calc(100vw - 32px));
}
body.pv-mode-registre .pv-win.pv-full .pv-body { max-height: min(74vh, 700px); }


@media (pointer: coarse), (max-width: 779px) {
  #pv-dock button { min-height: 44px; min-width: 44px; justify-content: center; padding: 10px 12px; }
  .pv-win header button { min-height: 44px; min-width: 44px; padding: 4px 8px; }
  .pv-seg button { min-height: 44px; padding: 8px 12px; }
}


.gdp-struct { margin: 14px 0 6px; }

.xen-box { margin: 14px 0 6px; }
.xen-list { list-style: none; margin: 8px 0 6px; padding: 0; }
.xen-list li { display: flex; justify-content: space-between; gap: 12px;
  padding: 3px 0; border-bottom: 1px solid var(--pv-line); }
.xen-list li:last-child { border-bottom: 0; }
.xen-list code { font-size: .82em; opacity: .78; white-space: nowrap; }
.gdp-bars { display: flex; height: 10px; border-radius: 5px; overflow: hidden;
            background: var(--pv-color-surface-fill); margin: 6px 0; }
.gdp-b { display: block; height: 100%; transition: width .3s ease; }
.gdp-b.p1 { background: var(--pv-color-res-minerai); }
.gdp-b.p2 { background: var(--pv-color-res-metal); }
.gdp-b.p3 { background: var(--pv-color-signal-ok); }
.tech-row { display: flex; gap: 12px; align-items: flex-start; padding: 10px 0;
            border-top: 1px solid var(--pv-color-surface-line); }
.tech-row.on { background: var(--pv-color-surface-fillSoft); }
.tech-main { flex: 1; min-width: 0; }
.tech-side { text-align: right; white-space: nowrap; }
.tech-eff { color: var(--pv-color-signal-ok); font-size: var(--cs-3); margin: 2px 0 0; }

.tech-eff.off { color: var(--pv-color-text-dim); font-style: italic; }
.tech-perpetua { margin: 4px 0 18px; padding-bottom: 10px;
  border-bottom: 1px solid var(--pv-color-surface-line); }
.perp-badge { font-style: normal; font-size: var(--cs-2); letter-spacing: .04em;
  color: var(--cs-accent); border: 1px solid currentColor;
  border-radius: 3px; padding: 1px 5px; margin-left: 6px; vertical-align: middle; }
.tech-foot { opacity: .6; font-size: var(--cs-3); margin: 8px 0 0; }


.sto-row { display: flex; gap: 10px; align-items: flex-start; padding: 9px 0;
  border-bottom: 1px solid var(--pv-line); }
.sto-row:last-child { border-bottom: 0; }
.sto-ic { font-size: var(--cs-4); line-height: 1.2; color: var(--c); width: 22px; text-align: center; flex: 0 0 22px; }
.sto-main { flex: 1 1 auto; min-width: 0; }
.sto-top { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; }
.sto-top b { font-size: var(--cs-3); }
.sto-val { font-size: 12.5px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.sto-val i { font-style: normal; opacity: .55; }
.sto-val.neg, .sto-sub .neg { color: var(--danger); }
.sto-bar { height: 4px; border-radius: 3px; background: var(--pv-color-overlay-whiteA080); margin: 5px 0 4px; overflow: hidden; }
.sto-bar span { display: block; height: 100%; border-radius: 3px; }
.sto-sub { display: flex; justify-content: space-between; gap: 10px; font-size: var(--cs-1); opacity: .7;
  font-variant-numeric: tabular-nums; }
.sto-row.full .sto-val { color: var(--danger); }
.sto-row.flow .sto-top b { opacity: .9; }


.mod-box { margin: 14px 0 6px; }
.mod-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 6px; }
.mod-slots { font-size: var(--cs-1); opacity: .6; }
.mod-row { display: flex; gap: 9px; align-items: center; padding: 7px 0;
  border-bottom: 1px solid var(--pv-line); }
.mod-row:last-of-type { border-bottom: 0; }
.mod-ic { font-size: 16px; color: var(--c); width: 20px; text-align: center; flex: 0 0 20px; }
.mod-main { flex: 1 1 auto; min-width: 0; }
.mod-top { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; }
.mod-top b { font-size: var(--cs-3); }
.mod-n { font-size: var(--cs-2); opacity: .55; font-variant-numeric: tabular-nums; }
.mod-sub { display: flex; gap: 8px; font-size: var(--cs-1); opacity: .75; font-variant-numeric: tabular-nums; }
.mod-sat { color: var(--danger); opacity: .9; }

.btn.tiny { padding: 5px 9px; font-size: var(--cs-1); border-radius: 8px; flex: 0 0 auto; min-height: 34px; width: auto; }
.btn.tiny.off { opacity: .4; pointer-events: none; }



.tech-branch { margin: 18px 0 0; }
.tech-branch:first-of-type { margin-top: 8px; }
.tech-bhead { display: flex; justify-content: space-between; align-items: baseline;
  gap: 12px; padding: 6px 0 4px; border-bottom: 1px solid var(--pv-color-surface-lineStrong);
  letter-spacing: .06em; font-size: var(--cs-3); text-transform: uppercase; }
.tech-bhead b { color: var(--cs-accent); }
.tech-bhead span { color: var(--pv-color-text-dim); font-variant-numeric: tabular-nums; }

.tech-row.locked { opacity: .62; }
.tech-row.locked .tech-main b { color: var(--pv-color-text-dim); }
.tech-need { margin: 4px 0 0; font-size: var(--cs-3); color: var(--pv-color-signal-warn); }
.tech-need b { color: inherit; }



.tech-tabs { display: flex; gap: 6px; margin: 10px 0 2px;
  overflow-x: auto; scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch; }
.tech-tab { flex: 0 0 auto; min-width: 92px; scroll-snap-align: start;
  display: flex; flex-direction: column;
  gap: 2px; padding: 8px 10px; cursor: pointer; font: inherit; text-align: left;
  letter-spacing: .07em; font-size: var(--cs-3); text-transform: uppercase;
  background: var(--pv-color-surface-fillSoft);
  border: 1px solid var(--pv-line);
  border-radius: 4px; color: var(--pv-color-text-dim); }
.tech-tab i { font-style: normal; font-variant-numeric: tabular-nums; opacity: .75; }
.tech-tab:hover { border-color: var(--cs-accent); }

.tech-tab.on { color: var(--pv-color-text-bright);
  border-color: var(--cs-accent);
  background: var(--pv-color-surface-tintA12); }
.tech-tab.on i { color: var(--cs-accent); opacity: 1; }


.chn-row { padding: 8px 0; border-bottom: 1px solid var(--pv-line); }
.chn-main { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; }
.chn-main b { font-weight: 600; display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.chn-arrow { color: var(--pv-color-text-dim); margin: 0 2px; }
.chn-cap { font-variant-numeric: tabular-nums; color: var(--pv-color-text-dim); white-space: nowrap; }
.chn-row .sto-bar { margin: 5px 0 3px; }
.chn-row .sto-bar span { background: var(--pv-color-signal-ok); }
.chn-row.hungry .sto-bar span { background: var(--pv-color-signal-warn); }
.chn-row.hungry .sto-sub { color: var(--pv-color-signal-warn); }


.sil-table { display: grid; grid-template-columns: minmax(96px,1.3fr) repeat(5, minmax(64px,1fr)); gap: 3px 10px; }
.sil-table .sil-h { font-size: var(--cs-1); opacity: .6; text-transform: uppercase; letter-spacing: .04em;
  padding-bottom: 5px; margin-bottom: 3px; border-bottom: 1px solid var(--pv-color-surface-lineStrong); }
.sil-table .sil-name { display: flex; align-items: center; gap: 6px; font-size: var(--cs-3); min-width: 0; }
.sil-table .sil-name b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sil-table .sil-c { font-variant-numeric: tabular-nums; font-size: var(--cs-2); align-self: center;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 4px 0; border-bottom: 1px solid var(--pv-line); }
.sil-table .sil-name { padding: 4px 0; border-bottom: 1px solid var(--pv-line); }
.sil-table .sil-c.neg { color: var(--danger); }
.sil-table .sil-c.pos { color: var(--pv-color-signal-ok); }
.sil-table .sil-c.nieprzyp { color: var(--pv-color-signal-warn); font-weight: 600; }
@media (max-width: 480px) {
  .sil-table { grid-template-columns: 1fr; }
  .sil-table .sil-h { display: none; }
  .sil-table .sil-c { text-align: left; white-space: normal; }
  .sil-table .sil-c::before { content: attr(data-lbl) ': '; opacity: .6; font-variant-numeric: initial; }
}

.sil-eng { padding: 8px 0; border-bottom: 1px solid var(--pv-line); }
.sil-eng:last-child { border-bottom: 0; }
.sil-eng > summary { cursor: pointer; list-style: none; }
.sil-eng > summary::-webkit-details-marker { display: none; }
.sil-eng-top { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.sil-eng-top b { font-size: var(--cs-3); }
.sil-eng[open] > summary .sil-chevron { transform: rotate(90deg); }
.sil-chevron { display: inline-block; opacity: .5; transition: transform .15s; margin-right: 4px; width: 10px; }
.sil-eng:not(.sil-eng-exp) .sil-chevron { visibility: hidden; }
.sil-flows { font-size: var(--cs-1); opacity: .85; margin-top: 3px; font-variant-numeric: tabular-nums; }
.sil-flows .sil-in { color: var(--pv-color-signal-danger); }
.sil-flows .sil-out { color: var(--pv-color-signal-ok); }
.sil-mult { font-size: var(--cs-1); opacity: .55; margin-top: 2px; }
.sil-chip { display: inline-block; font-size: var(--cs-1); padding: 1px 7px; border-radius: 8px;
  border: 1px solid currentColor; white-space: nowrap; }
.sil-chip.ok { color: var(--pv-color-signal-ok); }
.sil-chip.deficyt { color: var(--pv-color-signal-danger); }
.sil-chip.sufit { color: var(--pv-color-signal-warn); }
.sil-kat-head { font-size: var(--cs-1); text-transform: uppercase; letter-spacing: .06em; opacity: .6;
  margin: 14px 0 2px; padding-bottom: 3px; border-bottom: 1px solid var(--pv-color-surface-lineStrong); }
.sil-kat-head:first-child { margin-top: 0; }
.sil-rozbicie { margin: 8px 0 2px 14px; padding: 6px 0 0; border-top: 1px dashed var(--pv-line); }
.sil-rozbicie-row { display: flex; justify-content: space-between; gap: 8px; font-size: var(--cs-1);
  padding: 3px 0; font-variant-numeric: tabular-nums; }
.sil-scroll { overflow-x: auto; }


.cp-tabs { display: flex; gap: 4px; flex-wrap: wrap; margin: 8px 0 6px; }
.cp-tab { display: inline-flex; align-items: center; gap: 6px; padding: 8px 11px;
  cursor: pointer; font: inherit; font-size: var(--cs-2); letter-spacing: .04em;
  text-transform: uppercase; border-radius: 3px;
  background: var(--pv-color-surface-fillSoft);
  border: 1px solid var(--pv-line);
  color: var(--pv-color-text-dim); }
.cp-tab i { font-style: normal; font-variant-numeric: tabular-nums; opacity: .7; }

.cp-tab u { text-decoration: none; font-variant-numeric: tabular-nums;
  color: var(--cs-accent); opacity: .9; }
.cp-tab u::before { content: '\00B7'; opacity: .5; margin: 0 3px 0 1px; }

.cp-tab:hover:not(.on) { border-color: var(--pv-color-signal-accentA45);
  background: var(--pv-color-surface-tintA10); color: var(--pv-color-views-hoverBorder); }
.cp-tab:focus-visible { outline: 2px solid var(--cs-accent); outline-offset: 2px; }
@media (pointer: coarse) { .cp-tab { min-height: 44px; padding: 10px 12px; } }
.cp-tab:hover { border-color: var(--cs-accent); }

.cp-tab.on { color: var(--pv-color-text-bright);
  border-color: var(--cs-accent);
  background: var(--pv-color-surface-tintA12); }
.cp-tab.on i { color: var(--cs-accent); opacity: 1; }


.hud-chip.food .res-glyph { --c: var(--pv-color-views-foodGlyph); }


.kz-row { margin: 6px 0; padding: 4px 0; border-bottom: 1px solid var(--pv-color-surface-tintA12); }
.kz-k { font-variant-numeric: tabular-nums; margin-right: 8px; opacity: .85; }
.kz-name { font-weight: 600; }
.kz-cite { display: block; opacity: .7; font-size: var(--cs-3); margin-top: 2px; }
.kz-unlocks { display: block; opacity: .85; font-size: var(--cs-3); margin-top: 2px; color: var(--cs-accent); font-style: normal; }
.kz-reached .kz-k, .kz-reached .kz-name { color: var(--cs-accent); }

.kz-spec { border-bottom-style: dashed; opacity: .7; }
.kz-spec .kz-k, .kz-spec .kz-name { color: var(--pv-faint); }
.kz-speclabel { display: block; margin-top: 2px; font-size: var(--cs-3); letter-spacing: .03em; text-transform: uppercase; opacity: .8; color: var(--pv-rouge); }
.kz-p { margin: 0 0 4px; font-size: var(--cs-4); }
.kz-ref { margin: 0 0 10px; opacity: .65; font-size: var(--cs-3); }


.kron-spark { display: block; margin: 4px 0 10px; opacity: .9; }

.kron-metric { margin: 2px 0 8px; }
.kron-metric-l { display: block; font-size: var(--cs-3); opacity: .65; margin-bottom: 2px; letter-spacing: .02em; }
.kron-metric .kron-spark { margin: 2px 0 4px; height: 40px; }
.kron-list { max-height: 50vh; overflow: auto; }
.kron-row { margin: 5px 0; padding: 4px 0; border-bottom: 1px solid var(--pv-color-surface-tintA12); font-size: var(--cs-4); }
.kron-row b { font-variant-numeric: tabular-nums; opacity: .8; margin-right: 4px; }


.pb-preview { margin-top: 6px; padding-top: 6px; border-top: 1px dashed var(--pv-color-surface-tintA18); }
.pb-preview-h { margin: 0 0 4px; font-size: var(--cs-3); opacity: .7; text-transform: uppercase; letter-spacing: .03em; }


.ap-tab { width: 100%; border-collapse: collapse; font-size: var(--cs-1); }
.ap-tab th { text-align: left; font-weight: 600; letter-spacing: .05em;
  text-transform: uppercase; font-size: .82em; padding: 4px 6px;
  color: var(--pv-color-text-dim);
  border-bottom: 1px solid var(--pv-color-surface-lineStrong); }
.ap-tab td { padding: 5px 6px; border-bottom: 1px solid var(--pv-line); }
.ap-row { cursor: pointer; }
.ap-row:hover td { background: var(--pv-color-surface-fillSoft); }
.ap-name { font-weight: 600; }
.ap-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ap-num.neg { color: var(--pv-color-signal-warn); }
.ap-al { color: var(--pv-color-text-dim); font-size: var(--cs-1); }
.ap-row.uwaga td:first-child { box-shadow: inset 3px 0 0 var(--pv-color-signal-warn); }
.ap-row.pilne td:first-child { box-shadow: inset 3px 0 0 var(--pv-color-signal-bad); }
.ap-row.pilne .ap-al { color: var(--pv-color-signal-bad); }


.tech-graf { overflow-x: auto; overflow-y: hidden; padding: 8px 2px 10px;
  margin: 4px 0 2px; -webkit-overflow-scrolling: touch; }
.tg-plotno { position: relative; }
.tg-svg { position: absolute; left: 0; top: 0; pointer-events: none; overflow: visible; }

.tg-l { fill: none; stroke: var(--pv-color-surface-lineStrong); stroke-width: 1.4; }
.tg-l.on { stroke: var(--pv-color-signal-ok); opacity: .55; }
.tg-l.hi { stroke: var(--cs-accent); stroke-width: 2.2; opacity: 1; }
.tg-n { position: absolute; display: flex; flex-direction: column; justify-content: center;
  gap: 1px; padding: 3px 7px; cursor: pointer; font: inherit; text-align: left;
  border-radius: 3px; overflow: hidden;
  background: var(--pv-color-surface-tintA12);
  border: 1px solid var(--pv-line);
  color: var(--pv-color-text-dim); }
.tg-n span { font-size: var(--cs-1); line-height: 1.15; white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis; }
.tg-n i { font-style: normal; font-size: 9px; opacity: .75; font-variant-numeric: tabular-nums; }
.tg-n.zdobyta { color: var(--pv-color-text-bright);
  border-color: var(--pv-color-signal-ok);
  box-shadow: inset 2px 0 0 var(--pv-color-signal-ok); }
.tg-n.wolna { color: var(--pv-color-text-bright); border-color: var(--cs-accent); }
.tg-n.zamknieta { opacity: .55; }
.tg-n.hi { border-color: var(--cs-accent);
  box-shadow: 0 0 0 1px var(--cs-accent); }

.tech-opens { margin: 3px 0 0; font-size: var(--cs-2); opacity: .92;
  display: flex; flex-wrap: wrap; gap: 4px; align-items: baseline; }
.tech-op { display: inline-block; padding: 0 6px; border-radius: 999px;
  border: 1px solid currentColor; white-space: nowrap; line-height: 1.5; }
.tech-op.b { color: var(--pv-color-signal-ok); }
.tech-op.j { color: var(--cs-accent); }

.tg-n.obca { border-style: dashed; opacity: .8; background: transparent; }
.tg-n.obca span { font-style: italic; }
.tg-n.obca::after { content: '›'; position: absolute; right: 5px; top: 50%;
  transform: translateY(-50%); font-size: var(--cs-3); opacity: .6; }
.tg-n.obca:hover { opacity: 1; border-style: solid; }
.tg-n:hover { border-color: var(--cs-accent); }

.tech-row.tech-ping { animation: techPing 1.4s ease-out; }
@keyframes techPing {
  0% { background: var(--pv-color-surface-tintA20); }
  100% { background: transparent; }
}


.cp-grp { border: 1px solid var(--panel-border); border-radius: 12px;
  margin: 0 0 8px; background: var(--pv-color-overlay-whiteA020); overflow: hidden; }
.cp-grp > summary {
  display: flex; align-items: center; flex-wrap: wrap; gap: 10px; cursor: pointer; list-style: none;
  padding: 10px 12px; user-select: none;
}

.cp-grp .grp-preview { flex-basis: 100%; display: flex; flex-wrap: wrap; gap: 5px; margin-top: 2px; }
.cp-grp .grp-pico { width: 20px; height: 20px; flex: 0 0 auto; border-radius: 6px;
  background: color-mix(in srgb, var(--c) 22%, transparent); color: var(--c);
  display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; }
.cp-grp .grp-pico.svg svg { width: 60%; height: 60%; display: block; }
.cp-grp .grp-pico.svg path { fill: none; stroke: currentColor; stroke-width: 1.6;
  stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.cp-grp .grp-pmore { flex: 0 0 auto; font-size: var(--cs-1); opacity: .6; align-self: center; padding: 0 2px; }
.cp-grp > summary::-webkit-details-marker { display: none; }
.cp-grp > summary::before {
  content: '▸'; opacity: .5; flex: 0 0 auto; transition: transform .15s ease; font-size: var(--cs-2);
}
.cp-grp[open] > summary::before { transform: rotate(90deg); }
.cp-grp > summary:hover { background: var(--pv-color-overlay-whiteA050); }
.cp-grp .grp-t { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; line-height: 1.2; }
.cp-grp .grp-t { font-weight: 650; letter-spacing: .02em; }
.cp-grp .grp-l { font-style: normal; font-weight: 400; font-size: var(--cs-2); opacity: .5; margin-top: 2px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cp-grp .grp-n { flex: 0 0 auto; font-size: var(--cs-1); opacity: .6; text-align: right; letter-spacing: .02em; }
.cp-grp .grp-n b { display: block; font-size: var(--cs-3); opacity: .95; font-weight: 700; }
.cp-grp .grp-n.moz b { color: var(--pv-color-emit-gold); }
.cp-grp .grp-d { margin: 0 12px 8px; font-size: var(--cs-3); opacity: .62; line-height: 1.45;
  border-left: 2px solid var(--panel-border); padding-left: 9px; }
.cp-grp .cp-row:last-child { border-bottom: 0; }
@media (max-width: 780px) {
  .cp-grp .grp-l { display: none; }
  .cp-grp .grp-n { font-size: var(--cs-1); }
}


.jed-row.off { opacity: .55; }
.jed-akcje { flex: 0 0 auto; display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.jed-koszt { display: flex; gap: 6px; font-size: var(--cs-1); opacity: .8; }
.jed-btns { display: flex; gap: 4px; }
.jed-blok { font-size: var(--cs-1); opacity: .6; max-width: 130px; text-align: right; line-height: 1.25; }
.jed-cecha { opacity: .55; font-size: var(--cs-1); margin-top: 2px; }
.rola { font-size: var(--cs-1); padding: 1px 6px; border-radius: 999px; letter-spacing: .04em;
  border: 1px solid currentColor; }
.rola.szturm { color: var(--pv-color-emit-plasmaSkin); } .rola.ostrzal { color: var(--pv-color-signal-world); }
.rola.lowca { color: var(--pv-color-signal-ok); } .rola.garnizon { color: var(--pv-color-signal-violet); }
.rola-cykl { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; margin-top: 6px; }
.rola-cykl i { opacity: .45; font-style: normal; }
.sh-lock .btn { margin-top: 10px; }

.sh-warn { color: var(--danger); font-size: var(--cs-4); margin: 4px 0 0; }


.pv-wym { margin-top: 10px; padding-top: 8px; border-top: 1px solid var(--pv-line); }
.pv-wym-h { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 6px; }
.pv-wym-h b { letter-spacing: .04em; }
.pv-wym-h span { font-size: var(--cs-1); opacity: .6; }
.pv-wym-b { display: inline-block; margin: 0 4px 4px 0; padding: 4px 8px; border-radius: 8px;
  font-size: var(--cs-1); cursor: pointer; color: inherit;
  background: var(--pv-color-overlay-whiteA060); border: 1px solid var(--pv-line); }
.pv-wym-b:hover:not(.off) { background: var(--pv-color-overlay-whiteA130); }
.pv-wym-b.off { opacity: .38; cursor: default; }
.pv-wym-n { font-size: var(--cs-2); opacity: .55; line-height: 1.4; margin: 6px 0 0; }

.pv-wym-region { display: flex; justify-content: space-between; gap: 8px; margin: 0 0 6px;
  font-size: var(--cs-2); opacity: .7; }
.pv-wym-region span:last-child { font-variant-numeric: tabular-nums; }

.pv-wym-eksport { display: flex; align-items: center; gap: 6px; margin-top: 6px;
  font-size: var(--cs-1); cursor: pointer; opacity: .85; }
.pv-wym-eksport input { accent-color: var(--accent); }


.pv-mini {
  appearance: none; cursor: pointer; font: 600 var(--cs-1)/1 inherit;
  letter-spacing: .05em; padding: 4px 8px; border-radius: 3px;
  color: var(--pv-ink); background: var(--pv-color-views-miniBg);
  border: 1px solid var(--pv-line);
}
.pv-mini:hover { border-color: var(--pv-color-views-miniBorder); color: var(--pv-color-views-miniText); }


.pv-body > .pv-empty:only-child {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 12px; text-align: center; text-wrap: balance;
  min-height: min(46vh, 380px); max-width: 44ch; margin: 0 auto;
  font-size: var(--cs-4); line-height: 1.6; color: var(--pv-dim);
}
.pv-body > .pv-empty:only-child::before {
  content: ''; flex: none;
  width: 58px; height: 58px;
  background: color-mix(in srgb, var(--fak) 15%, transparent);
  clip-path: polygon(50% 0%, 93% 25%, 93% 75%, 50% 100%, 7% 75%, 7% 25%);
}


.pv-body:has(> .pv-lyr) {
  display: flex; flex-wrap: wrap; gap: 8px; align-content: flex-start;
}
.pv-body:has(> .pv-lyr) > .pv-lyr {
  flex: 1 1 220px; max-width: 300px; margin: 0;
  padding: 11px 12px; gap: 11px;
  border: 1px solid var(--pv-line);
  background: var(--pv-color-overlay-whiteA022);
}
.pv-body:has(> .pv-lyr) > .pv-lyr:hover { background: var(--pv-color-views-lyrHoverBg); }
.pv-body:has(> .pv-lyr) > .pv-lyr.on {
  border-color: color-mix(in srgb, var(--fak) 55%, transparent);
  background: color-mix(in srgb, var(--fak) 12%, transparent);
}

.pv-body:has(> .pv-lyr) > .pv-lyr .pv-sw {
  width: 16px; height: 16px; flex: 0 0 16px; border-radius: 4px;
}
.pv-body:has(> .pv-lyr) > .pv-note { flex: 1 0 100%; margin: 2px 0 0; }


#pv-win-ressources .pv-body {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 1px 28px; align-content: start;
}
#pv-win-ressources .pv-body > *:not(.pv-row) { grid-column: 1 / -1; }
#pv-win-ressources .pv-row { padding: 6px 10px; border-radius: 6px; }
#pv-win-ressources .pv-row:nth-of-type(odd) { background: var(--pv-color-overlay-whiteA022); }


.pv-tab tr.pv-grp td { background: var(--pv-color-views-grpHeaderBg); }
.pv-tab tr.pv-grp td:first-child { cursor: pointer; }
.pv-chev { display: inline-block; width: 13px; opacity: .6; }
.pv-cnt { opacity: .6; margin-left: 6px; font-size: .92em; }


.pv-search {
  display: block; width: 100%; box-sizing: border-box; margin: 0 0 8px;
  padding: 7px 10px; font: inherit;
  
  color: inherit; background: var(--pv-color-views-searchBg); border: none;
  border-radius: 6px;
}
.pv-search::placeholder { color: var(--pv-color-text-dim); }
.pv-search:focus { outline: none; border-color: var(--pv-color-emit-gold); }


.tech-graf.mega { max-height: 46vh; overflow: auto; }
.tg-pas { position: absolute; left: 0; border-left: 3px solid var(--pas); background: color-mix(in srgb, var(--pas) 7%, transparent); border-radius: 6px; pointer-events: none; }
.tg-pas.on { background: color-mix(in srgb, var(--pas) 14%, transparent); }
.tg-pas b { position: sticky; left: 6px; display: inline-block; padding: 3px 8px 0; font-size: 12px; color: var(--pas); text-shadow: 0 1px 2px var(--pv-color-overlay-blackA700); }
.tg-l.cross { stroke-dasharray: 5 4; opacity: .8; }




.pv-link { cursor: pointer; }
.pv-link:hover .pv-b > span:last-child { text-decoration: underline; }