/* Kolory do wyboru (js/20-kolory.js). Domyślny jest squashparkowy (złoty) z css/style.css i css/uklad.css.
   Każdy kolor ma wersję ciemną i jasną. Wnętrza kart są jaśniejsze od tła karty (bez czarnych ramek). */

html.uklad{--logo:#8c6c3f}
html.uklad[data-color]{--pat:color-mix(in srgb,var(--acc) 8%,transparent);--me:color-mix(in srgb,var(--acc) 16%,transparent);
 --glow1:color-mix(in srgb,var(--hot) 18%,transparent);--ban1:color-mix(in srgb,var(--acc) 18%,transparent);--ban2:color-mix(in srgb,var(--acc) 3%,transparent)}
.uklad .logo{background:var(--logo)}

/* zieleń kortu */
html.uklad[data-color="kort"]{--bg:#121813;--surf:#19221b;--surf2:#222e24;--inset:#212c23;--line:#2e3c30;--tx:#e9f2ea;--mu:#9db0a0;
 --acc:#5cb87a;--acc-d:#2f7a4a;--hot:#b4e05c;--on-acc:#07140b;--on-st:#0b130c;--logo:#2f7a4a}
html.uklad[data-color="kort"][data-theme="light"]{--bg:#f1f6f0;--surf:#ffffff;--surf2:#e2ece1;--inset:#ecf3eb;--line:#d2e0d1;--tx:#15231a;--mu:#56695a;
 --acc:#2b7445;--acc-d:#7fb894;--hot:#3f7a0c;--on-acc:#ffffff;--on-st:#ffffff;--logo:#2b7445}

/* granat */
html.uklad[data-color="granat"]{--bg:#10141d;--surf:#171d29;--surf2:#202838;--inset:#1f2736;--line:#2c3549;--tx:#e8edf6;--mu:#9ba6bb;
 --acc:#6b97f0;--acc-d:#3a64b8;--hot:#ffc44d;--on-acc:#0a1020;--on-st:#0d1220;--logo:#2f4f95}
html.uklad[data-color="granat"][data-theme="light"]{--bg:#f2f5fa;--surf:#ffffff;--surf2:#e3e9f4;--inset:#edf1f8;--line:#d4dcea;--tx:#141b2a;--mu:#55617a;
 --acc:#2a55b5;--acc-d:#8aa6e2;--hot:#9a5c00;--on-acc:#ffffff;--on-st:#ffffff;--logo:#2a55b5}

/* czerwień */
html.uklad[data-color="czerwien"]{--bg:#181011;--surf:#211718;--surf2:#2c1f20;--inset:#2b1e1f;--line:#3d2b2c;--tx:#f6eae9;--mu:#b8a09e;
 --acc:#e8695e;--acc-d:#a83a32;--hot:#ffb547;--on-acc:#1c0907;--on-st:#170c0b;--logo:#a83a32}
html.uklad[data-color="czerwien"][data-theme="light"]{--bg:#faf3f2;--surf:#ffffff;--surf2:#f3e3e1;--inset:#f8eeed;--line:#e8d4d2;--tx:#2a1514;--mu:#785a57;
 --acc:#b3352b;--acc-d:#e39088;--hot:#a35200;--on-acc:#ffffff;--on-st:#ffffff;--logo:#b3352b}

/* morski */
html.uklad[data-color="morski"]{--bg:#0f1717;--surf:#152121;--surf2:#1d2b2b;--inset:#1c2a2a;--line:#283b3b;--tx:#e6f2f1;--mu:#98b1af;
 --acc:#45bfb3;--acc-d:#24857c;--hot:#ffd060;--on-acc:#051514;--on-st:#0a1414;--logo:#1f7a72}
html.uklad[data-color="morski"][data-theme="light"]{--bg:#f0f7f6;--surf:#ffffff;--surf2:#dff0ee;--inset:#eaf5f4;--line:#cde3e0;--tx:#122524;--mu:#4c6a67;
 --acc:#1b7a71;--acc-d:#7cc3bb;--hot:#965a00;--on-acc:#ffffff;--on-st:#ffffff;--logo:#1b7a71}

/* --- panel „Wygląd” --- */
.looks{position:absolute;right:0;top:calc(100% + 8px);z-index:45;width:min(340px,calc(100vw - 32px));padding:16px;background:var(--surf);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);animation:rise .2s both;cursor:default}
.looks h3{margin:0 0 8px;font-size:14px;color:var(--mu);font-weight:600}
.looks .modes{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:14px}
.looks .modes button{min-height:40px;border:1px solid var(--line);border-radius:10px;background:var(--inset);color:var(--tx);font:600 13px/1.1 var(--fb);cursor:pointer;padding:6px}
.looks .modes button[aria-pressed=true]{border-color:var(--acc);background:var(--acc);color:var(--on-acc)}
.looks .sw{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.looks .sw button{display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px 2px;border:1px solid transparent;border-radius:12px;background:none;color:var(--tx);font:600 11px/1.1 var(--fb);cursor:pointer}
.looks .sw button[aria-pressed=true]{border-color:var(--acc);background:var(--inset)}
.looks .sw i{width:34px;height:34px;border-radius:50%;display:block;background:linear-gradient(135deg,var(--c1) 0 50%,var(--c2) 50% 100%);box-shadow:0 0 0 2px var(--surf),0 0 0 3px var(--line)}
.looks .note{margin:12px 0 0;font-size:12px;color:var(--mu)}
.swrap{position:relative}
@media (max-width:720px){
 .looks{position:fixed;left:8px;right:8px;top:auto;bottom:calc(76px + env(safe-area-inset-bottom,0px));width:auto}
 .looks.nobar{bottom:calc(12px + env(safe-area-inset-bottom,0px))}
}

/* --- czytelne liczby w wykresach (mapa godzin, pasek wyników) --- */
.uklad .heat b.hv{background:var(--surf);color:var(--tx);border-radius:6px;padding:1px 5px;font-size:12px;line-height:1.3}
.uklad .seg i.dk b{color:#fff}

/* --- zakładka Liga: wykresy schowane pod „Pokaż” --- */
.uklad details.more>summary{cursor:pointer;font:700 22px/1.15 var(--fd);letter-spacing:.02em;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:10px}
.uklad details.more>summary::-webkit-details-marker{display:none}
.uklad details.more>summary::after{content:"Pokaż";font:600 13px/1 var(--fb);color:var(--tx);border:1px solid var(--line);border-radius:10px;padding:9px 12px}
.uklad details.more[open]>summary::after{content:"Ukryj"}
.uklad details.more>summary h2{margin:0}
.uklad .isl-s .grid{grid-template-columns:1fr}

/* --- poprawki kontrastu w jasnym motywie --- */
.uklad .tabs button[aria-selected=true],.uklad .tabs .morebtn[aria-selected=true]{color:var(--tx)}
.uklad .tabs button[aria-selected=true] .ti,.uklad .tabs .morebtn[aria-selected=true] .ti{color:var(--hot)}
html.uklad[data-theme="light"]:not([data-color]){--hot:#a35c00;--acc:#7d5f35}
html.uklad[data-theme="light"] .seg i.dk b{color:var(--tx)}
.uklad .isl-track{align-items:start}
.uklad .isl-s{min-height:0}
.uklad .brand b{white-space:nowrap}