/* DEBATA — style aplikacji. Paleta zweryfikowana; akcenty czerwień/niebieski TYLKO dla oponentów.
   Chrom UI neutralny; przyciski .btn-soft; bold tylko dla tytułów; zero czarnych wypełnień. */
:root{
  interpolate-size:allow-keywords;
  --paper:#f4f1ea; --bg:#ece7dc; --ink:#2f2e2b; --muted:#7c766c; --soft:#6f6f69;
  --line:#e0d9cb; --card:#fbf9f4; --hl:#f1efe7;
  --btn-bg:#f1efe7; --btn-br:#9a988f; --btn-hv:#e3e1d8;
  --op1:#ff0046; --op2:#0061ff; --kibic:#f2a01c; --neutral:#8a8578;
  --radius:14px; --shadow:0 1px 3px rgba(0,0,0,.06),0 8px 22px rgba(0,0,0,.05);
  --ico:41px;   /* rozmiar ikony nagłówka — steruje strefą ochronną i wysokością paska (2×--ico) */
}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  background:#f7f4ec;color:var(--ink);line-height:1.5;-webkit-font-smoothing:antialiased}
.hidden{display:none!important}
/* iOS: blokada double-tap-zoom na kontrolkach (np. szybkie +/- w stepperach). touch-action jest respektowane przez Safari — w przeciwieństwie do user-scalable=no/maximum-scale, które nowe iOS ignoruje */
button,a,label,summary,input,select,textarea,.stepper,.seg2{touch-action:manipulation}

/* ---------- LOGIN ---------- */
.loginWrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}
.loginCard{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:40px 28px 28px;width:100%;max-width:400px;box-shadow:var(--shadow)}
.loginCard .top{display:flex;align-items:center;gap:24px;margin-bottom:30px}
.loginCard .logo{width:62px;height:62px;border-radius:12px}
.loginCard h1{font-size:19px;margin:0;flex:1}
.loginCard p.lead{color:var(--muted);font-size:13.5px;margin:6px 0 20px}
.loginCard label{display:block;font-size:12.5px;color:var(--muted);margin:0 0 6px}
.loginCard input[type=email],.loginCard input[type=text]{width:100%;font:inherit;font-size:15px;padding:11px 13px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink)}
.loginCard input:focus{outline:none;border-color:var(--soft)}
.loginCard input#pin{letter-spacing:6px;text-align:center;font-variant-numeric:tabular-nums}
.loginCard .btn{width:100%;margin-top:14px}
.linkbtn{background:none;border:0;color:var(--muted);font-size:12.5px;cursor:pointer;margin-top:12px;font-family:inherit;text-decoration:underline}
.msg{min-height:18px;font-size:12.5px;margin-top:12px;color:var(--muted)}
.msg.err{color:var(--op1)}
.dev{font-size:12.5px;color:var(--muted);margin-top:8px}

/* ---------- LOGO ---------- */
.logo{width:var(--ico,41px);height:var(--ico,41px);border-radius:8px;display:block;flex:none}

/* ---------- BUTTONS (.btn-soft) ---------- */
.btn{border:0.5px solid var(--btn-br);background:var(--btn-bg);color:var(--ink);border-radius:8px;padding:9px 14px;font-size:14px;cursor:pointer;font-family:inherit}
.btn:hover{background:var(--btn-hv)}
.btn:focus{outline:none;border-color:var(--soft)}
.btn:disabled{opacity:.5;cursor:default}
.btn.sm{padding:7px 12px;font-size:12.5px}
.livehead .ttsBtn{margin-left:auto;flex:none;display:inline-flex;align-items:center;justify-content:center;width:37px;height:37px;padding:0;border:0;background:transparent;color:var(--ink);cursor:pointer;opacity:1;transition:opacity .15s}   /* 🔊 audio on/off — SVG w nagłówku Dyskusji; .muted → przekreślony */
.livehead .ttsBtn svg{width:27px;height:27px}
.livehead .ttsBtn:hover{opacity:.7}
.livehead .ttsBtn.muted .ico-on{display:none}
.livehead .ttsBtn.muted .ico-off{display:inline-flex}
.bubbleTts{position:absolute;top:-3px;right:0;z-index:2;display:inline-flex;align-items:center;justify-content:center;width:37px;height:37px;padding:0;border:0;background:transparent;color:var(--ink);cursor:pointer;opacity:1}  /* 🔊 odsłuch kwestii — z-index:2 nad .who (opacity=kontekst stackingu); hover natychmiast (bez transition) */
.bubbleTts svg{width:27px;height:27px}
.bubbleTts:hover{opacity:.6}
/* toggle ikony: domyślnie głośnik; gdy .on (odtwarza) — przekreślony głośnik */
.ico-on,.ico-off{display:inline-flex;align-items:center;justify-content:center}
.ico-off{display:none}
.on .ico-on{display:none}
.on .ico-off{display:inline-flex}
/* wybór audio on/off w oknie startowym — prawy górny róg; .muted → przekreślony */
.startCard{position:relative}
/* Okno „Uruchom": pasek audio NAD przyciskami — wygląd jak KAFEL ROLI (Kibic): napis „Audio" z lewej, przełącznik z prawej */
.scAudioRow{display:flex;align-items:center;gap:10px;margin-top:22px;padding:9px 15px;background:var(--card);border:0.5px solid var(--btn-br);border-radius:var(--radius);font-size:14px;cursor:pointer;user-select:none}
.scAudioRow>label{flex:1;min-width:0;color:var(--ink);cursor:pointer}
.scAudioRow:focus{outline:none;border-color:var(--soft)}
.scAudioRow+.expBtns{margin-top:16px}   /* mniejszy odstęp paska audio do przycisków (nadpisuje domyślne 32px) */
.admToggles{display:flex;flex-direction:column;gap:13px;margin:2px 0 8px}   /* przełączniki Biblioteka/Audio — wyciągnięte przed „Limity" */
/* Diagnostyka (sekcja panelu admina) — stan Pipera + rejestr wyjątków; paleta apki, font ≥12px */
.diagCount{font-weight:700;color:var(--ink)}
.diagPiper{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.diagPiperStat{font-size:12.5px;color:var(--muted);overflow-wrap:anywhere}
.diagMetrics{margin-bottom:10px}
.diagMet{display:flex;flex-direction:column;gap:4px;font-size:12.5px;border:0.5px solid var(--btn-br);border-radius:10px;padding:8px 10px;background:var(--card)}
.diagMetT{font-size:12px;letter-spacing:.02em;text-transform:uppercase;color:var(--muted)}
.diagFilters{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.diagFilters .chip{font-size:12px;padding:4px 11px;border:0.5px solid var(--btn-br);border-radius:20px;background:var(--card);color:var(--ink);cursor:pointer}
.diagFilters .chip.on{background:var(--hl);font-weight:700}
.diagList{display:flex;flex-direction:column;gap:6px;max-height:340px;overflow:auto}
.diagRow{border:0.5px solid var(--btn-br);border-radius:10px;padding:7px 10px;font-size:12.5px;background:var(--card);cursor:pointer}
.diagHead{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.diagT{color:var(--muted);font-variant-numeric:tabular-nums}
.diagCat{font-size:12px;text-transform:uppercase;letter-spacing:.03em;color:var(--soft)}
.diagRow.diag-error .diagCat{font-weight:700;color:var(--ink)}
.diagMsg{flex:1;min-width:0;overflow-wrap:anywhere}
.diagN{color:var(--soft)}
.diagDet{display:none;white-space:pre-wrap;overflow-wrap:anywhere;margin:6px 0 0;font-size:12px;color:var(--muted)}
.diagRow.open .diagDet{display:block}
.diagEmpty{font-size:12.5px;padding:6px 2px}
.diagBtns{display:flex;gap:10px;margin-top:12px}
/* Głosy (audio) — 4 wzorce, admin stroi pitch/rate */
.vpHint{font-size:12px;margin-bottom:10px;line-height:1.4}
.vpRow{padding:14px 0;border-top:1px solid var(--line)}
.vpRow:first-of-type{border-top:0}
/* Obsada głosów (persony) — I4 Etap 2, WG MAKIETY V7: wiersze z parametrami read-only + ▶ odsłuch */
.pcLegend{font-size:12px;color:var(--muted);margin:2px 0 10px;line-height:1.9}
.grpAcc{border-top:1px solid var(--line)}
.grpAcc>summary{display:flex;align-items:center;gap:8px;padding:11px 0;cursor:pointer;list-style:none;font-weight:700;font-size:14px}
.grpAcc>summary::-webkit-details-marker{display:none}
.grpAcc .grpCount{font-weight:400;font-size:12px;color:var(--muted)}
.grpAcc>summary .chev{margin-left:auto;transition:transform .2s}
.grpAcc[open]>summary .chev{transform:rotate(90deg)}
.grpBody{padding-bottom:6px}
.catHead{font-size:12px;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);font-weight:700;padding:11px 0 4px;border-bottom:1px solid var(--line);margin-bottom:2px}
.catHead .catCount{font-weight:400;text-transform:none;letter-spacing:0}
.personaRow{display:grid;grid-template-columns:1fr auto auto 46px;align-items:center;gap:10px;padding:9px 0;border-top:1px solid var(--line)}
.personaRow:first-of-type{border-top:0}
.personaRow.off{opacity:.5}
.personaName{display:flex;align-items:center;gap:8px;font-size:14px;min-width:0}
.personaName input{flex:0 0 auto;width:16px;height:16px;cursor:pointer;accent-color:var(--soft)}
.personaBase{color:var(--muted);font-size:12.5px}
.grpBody .eng,.pcLegend .eng{display:inline-block;font-size:12px;padding:2px 7px;border-radius:6px;border:0.5px solid var(--line);color:var(--soft);white-space:nowrap;background:var(--hl)}
.personaLangs{font-size:12px;letter-spacing:.03em;color:var(--muted);white-space:nowrap;min-width:56px;text-align:right}
.personaPlay{display:flex;justify-content:flex-end}
.personaPlay .btn{padding:6px 12px;font-size:15px;line-height:1}
.vpHead{display:flex;align-items:center;justify-content:flex-start;gap:12px;margin-bottom:8px}
.vpName{flex:0 0 150px;font-size:12.5px}   /* stała szerokość → przyciski ▶ równo w kolumnie */
.vpSteps{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.vpSteps .vpk{font-size:12px;color:var(--muted)}
.vpSteps .stepper .v{min-width:34px;text-align:center}
.vpSample{padding:4px 10px;line-height:1;transform:scale(0.8)}
/* Kafel „Temperatura": tabela jak w „Głosy" — nagłówki Głośność/Tempo, ▶ w ostatniej kolumnie */
#heatAudioTile .haGridHead,#heatAudioTile .haRow{display:grid;grid-template-columns:1fr 94px 94px 42px;align-items:center;gap:4px}
#heatAudioTile .haGridHead{font-size:12px;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);padding-bottom:8px;border-bottom:1px solid var(--line);margin-bottom:2px}
#heatAudioTile .haGridHead span:not(:first-child):not(:last-child){text-align:center}
#heatAudioTile .haRow{padding:10px 0;border-top:1px solid var(--line)}
#heatAudioTile .haRow:first-of-type{border-top:0}
#heatAudioTile .haName{font-size:15px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}   /* jak imiona w Głosach (.pvVName 15px) */
#heatAudioTile .haRow .stepper{justify-self:center}
#heatAudioTile .haRow .stepper button{width:30px}
#heatAudioTile .haRow .stepper .v{min-width:30px}
#heatAudioTile .haPlay{display:flex;justify-content:flex-end}
/* Brzmienie READ-ONLY (Temperatura/Żywość) — edycja przeniesiona do Studia/labu; panel tylko prezentuje */
#heatAudioTile .haGridRO .haGridHead,#heatAudioTile .haGridRO .haRow{grid-template-columns:1fr 94px 94px}
#heatAudioTile .haGridRO .haGridHead span:not(:first-child){text-align:center}
#heatAudioTile .haGridRO .haRow .v{text-align:center;min-width:0}
.vpStepsRO{gap:6px 18px}
.brzStudio{font-size:12px;margin-top:10px;line-height:1.45}
#heatAudioTile .haPlay .vpSample{padding:7px 13px;font-size:17px;transform:none;color:var(--soft)}
/* Głosy Piper: układ DWUKOLUMNOWY — rząd = głos, kolumny „Młodsi" (lewa) i „Starsi" (prawa) */
.pvGridHead,.pvRow2{display:grid;grid-template-columns:1fr 60px 60px 62px;align-items:center}
.pvGridHead{font-size:12px;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);padding-bottom:8px;border-bottom:1px solid var(--line);margin-bottom:2px}
.pvGridHead span:not(:first-child){text-align:center}
.pvRow2{padding:9px 0;border-top:1px solid var(--line)}
.pvRow2:first-of-type{border-top:0}
.pvVName{display:flex;align-items:center;gap:8px;font-size:15px;min-width:0}
.pvPlay{display:flex;justify-content:flex-end;align-items:center}   /* ▶ do prawej krawędzi wiersza */
.pvPlay .piperPrev{flex:0 0 auto;padding:7px 15px;line-height:1;font-size:17px;color:var(--soft)}   /* ikona uruchamiania: -5% i jaśniejsza strzałka (nie czarna) */
.piperPrev.playing{background:var(--hl);border-color:var(--muted);font-weight:700;animation:pvPulse 1.1s ease-in-out infinite}   /* stan „gra" po naciśnięciu */
.piperPrev:disabled{opacity:.4;cursor:default}   /* zablokowane podczas grania innego podglądu */
@keyframes pvPulse{0%,100%{opacity:1}50%{opacity:.5}}
.pvGen{flex:0 0 auto;width:18px;text-align:center;font-size:14px;font-weight:700;color:var(--muted)}   /* jednoliterowy znacznik płci (K/M) przed nazwą */
.pvVName .pvEnable{flex:0 0 auto;width:15px;height:15px;margin:0 1px 0 0;cursor:pointer}   /* włącz/wyłącz głos (nieniszcząco) */
.vF0{flex:0 0 auto;color:var(--muted);font-size:12px}                                       /* zmierzone F0 [Hz] */
.vLic{flex:0 0 auto;font-size:12px;line-height:1}                                           /* status licencji głosu */
.vLicOk{color:var(--muted)} .vLicWarn{color:var(--kibic);font-weight:700}                   /* czysty (szary ✓) vs community (amber ⚠) */
.pvRow2.pvOff{opacity:.55}                                                                   /* głos wyłączony — wygaszony, toggle nadal klikalny */
.pvCell{display:flex;justify-content:center;align-items:center;margin:0;cursor:pointer}
.pvCell input{width:21px;height:21px;cursor:pointer;accent-color:#c2bcb1}   /* powiększone; jasny warm-grey = kolor „włączonego" przełącznika apki (spójne, nie niebieski oponentów) */

/* segment (język / stanowisko) */
.seg2{display:inline-flex;border:1px solid var(--line);border-radius:999px;overflow:hidden;background:#faf8f3}
.seg2 button{border:0.5px solid transparent;background:transparent;padding:5px 14px;font-size:12.5px;cursor:pointer;color:var(--muted);font-family:inherit}
.seg2 button.on{background:var(--btn-hv);color:var(--ink);border:0.5px solid var(--btn-br)}
.seg2 button + button{box-shadow:inset 1px 0 0 var(--line)}   /* sekcje segmentu rozdzielone cienką szarą linią (jak obwódka); inset zamiast border — nie znika pod stanem .on */

/* przełącznik języka aplikacji: flaga + dropdown (pasek i logowanie) */
.langwrap{position:relative;display:inline-flex}
.flag{border:1px solid var(--line);background:#faf8f3;border-radius:999px;padding:6px 12px;cursor:pointer;font-size:14px;display:inline-flex;gap:7px;align-items:center;font-family:inherit}
.flag b{font-weight:normal;font-size:12.5px;color:var(--muted)}
.flag .car{color:var(--neutral);font-size:12.5px;margin-left:-1px}
.langmenu{position:absolute;right:0;top:calc(100% + 6px);background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:5px;min-width:182px;z-index:60;display:none}
.langmenu.open{display:block}
.langmenu button{display:flex;align-items:center;gap:10px;width:100%;border:0;background:transparent;padding:8px 10px;border-radius:8px;font-size:13px;cursor:pointer;color:var(--ink);font-family:inherit;text-align:left}
.langmenu button:hover:not(:disabled){background:var(--hl)}
.langmenu button.on{background:var(--btn-hv)}
.langmenu button:disabled{cursor:not-allowed;color:var(--muted)}
.langmenu .fl{font-size:16px}
.langmenu .ck{margin-left:auto;color:var(--neutral)}
.langmenu .soon{margin-left:auto;font-size:12.5px;color:var(--neutral);border:1px solid var(--line);border-radius:6px;padding:1px 6px}
.seg2 button:disabled{opacity:.4;cursor:not-allowed}
/* Temperatura sporu — kontrolka na czele „Dyskusji": pełna szerokość + podpisy, miękka i oddzielona od stepperów (na próbę, wariant 3 „segmenty"). */
.heatctl{margin-top:10px;margin-bottom:16px;padding-bottom:20px;border-bottom:1px solid var(--line)}
.heatctl>label{display:block;font-size:13px;margin-bottom:13px}
.seg2.heatseg{display:flex;width:100%;background:#faf8f3}
.seg2.heatseg button{flex:1;padding:8px 4px;font-size:12px}
/* Płeć/Wiek/Teza — trzy kontrolki RÓWNEJ szerokości: etykieta stała 56px z lewej, segment wypełnia wiersz (zgodnie z makietą). Zakres tylko .agerow — NIE rusza „Dyskusji". */
.prow.agerow>label{flex:0 0 56px}
.prow.agerow>.seg2{width:auto;flex:1}
.prow.agerow>.inp{flex:1;width:auto}   /* pole Imię wypełnia wiersz jak segmenty */
.seg2.ageseg{display:flex}
.seg2.ageseg button{flex:1;padding:6px 4px;line-height:1.25}
.seg2.ageseg .an{display:block;font-size:12px}
.seg2.ageseg .ar{display:block;font-size:12px}   /* przedział tak samo czytelny jak nazwa (bez przygaszenia) */
.req{color:var(--muted);font-weight:400;margin-left:1px}   /* znacznik pola wymaganego — neutralny (czerwień zarezerwowana dla oponentów) */
.roleTile.roleOff .req{display:none}                        /* rola wyłączona → brak wymogu → znacznik znika (przełącznik toggluje .roleOff) */
.reqLegend{font-size:12px;color:var(--muted);margin:2px 12px 8px}
.heatctl .rhint{margin-top:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.helpBtn{border:1px solid var(--line);background:#faf8f3;border-radius:999px;width:32px;height:32px;cursor:pointer;font-size:15px;color:var(--muted)}
.helpBtn,.maintabs .help{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}   /* „?": long-press bez natywnego callout/zaznaczenia (gest dok. albo bezczynny u nie-admina) */
.toolbar .helpBtn{display:none}   /* desktop: pomoc jest w pasku zakładek; na mobile pokazana niżej */
/* Okrągły szary przycisk konta (inicjał): lewy klik/tap → Moje konto; prawy klik/long-press → Panel admina (admin). Zamiast dawnego „Wyloguj". */
.acctAvatar{border:1px solid var(--line);background:#faf8f3;color:var(--muted);border-radius:999px;width:32px;height:32px;padding:0;cursor:pointer;font-size:14px;font-family:inherit;line-height:1;display:inline-flex;align-items:center;justify-content:center;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}   /* kolory jak przycisk „?" (.helpBtn) */
.acctAvatar:hover{color:var(--ink)}

/* ---------- APP SHELL ---------- */
.toolbar{position:sticky;top:0;z-index:20;background:#fff;border-bottom:1px solid var(--line);display:flex;gap:10px;align-items:center;padding:calc(var(--ico)/2) 16px calc(var(--ico)/2) calc(var(--ico)/2);flex-wrap:wrap}
.toolbar h1{font-size:15px;margin:0 auto 0 0;font-weight:400;letter-spacing:.3px;display:inline-flex;align-items:center;gap:0}
.toolbar h1 .wm{font-family:inherit;font-weight:400;font-size:25px;letter-spacing:0;line-height:1;margin-left:calc(var(--ico)/2)}
.toolbar h1 .tagline{font-family:inherit;font-style:normal;font-weight:400;font-size:25px;color:var(--ink);letter-spacing:0;line-height:1}
.toolbar h1 .tagline::before{content:"\00a0\2013\00a0"}
.toolbar h1 .wmAI{font-family:inherit;font-weight:400;font-size:25px;color:var(--ink);letter-spacing:0;line-height:1;margin-left:.3em}
/* Układ jak w makiecie: desktop = Ustawienia (panel boczny) obok Debaty; mobile = dolne zakładki. */
.shell{display:grid;grid-template-columns:408px 1fr;max-width:1148px;margin:0 auto;height:calc(100vh - 2*var(--ico) - 1px)}
.side{border-right:1px solid var(--line);background:#f7f4ec;padding:8px 14px 24px;overflow-y:auto;scrollbar-width:none;min-width:0}
.side::-webkit-scrollbar{width:0;height:0}
.sideHead{display:none}   /* etykieta „USTAWIENIA" zbędna — ukryta (kolumna jest oczywista) */
.main{min-width:0;display:flex;flex-direction:column;overflow:hidden}   /* kolumna na całą wysokość: zakładki u góry, treść/pasek niżej */
.maintabs{display:flex;gap:24px;align-items:center;padding:0 16px;border-bottom:1px solid var(--line);background:#f7f4ec;position:sticky;top:0;z-index:10}
.maintabs button{border:none;background:none;color:var(--muted);padding:12px 6px;font-size:16px;cursor:pointer;font-family:inherit;border-bottom:2px solid transparent;margin-bottom:-1px;transition:color .2s,border-color .2s}   /* tytuły zakładek = jak tytuły 1. poziomu akordeonu (.tile>summary 16px); tylko desktop — maintabs ukryte na mobile */
.maintabs button:hover{color:var(--ink)}
.maintabs button.on{color:var(--ink);border-bottom-color:var(--ink)}
/* „nowe" udostępnienia: bursztynowy pasek w GÓRNEJ krawędzi zakładki „Historia" (inset — bez przesuwania układu) */
.maintabs button[data-mt="hist"].hasnew{box-shadow:inset 0 3px 0 var(--kibic)}
.maintabs .help{margin:0 0 0 auto;padding:0;border:1px solid var(--line);background:var(--card);border-radius:50%;width:34px;height:34px;font-size:16px;line-height:1;color:var(--muted);cursor:pointer;flex:none}
.maintabs .help:hover{color:var(--ink)}
.mainbody{flex:1;min-height:0;overflow-y:scroll;padding:14px 18px}   /* Historia/karta startowa. overflow-y:scroll = ZAWSZE cienki 4px pasek → STAŁA szerokość (bez skoku „wąskie na pusto / szersze po wypełnieniu"; Safari na pusto rezerwował klasyczny ~15px zamiast 4px z scrollbar-gutter) */
.mainbody.mb-live{overflow:hidden;padding:0;display:flex;flex-direction:column}   /* debata na żywo: nie przewija się samo — dzieli się na obszar wiadomości + pasek */
.livescroll{flex:1;min-height:0;overflow-y:scroll;padding:14px 18px}   /* przewijany obszar wiadomości (nad paskiem); overflow-y:scroll = ZAWSZE cienki 4px pasek → stała szerokość, jak w .mainbody */
/* cienki, szary pasek przewijania (panel treści + wiadomości) */
.mainbody::-webkit-scrollbar,.livescroll::-webkit-scrollbar,.helpPanel::-webkit-scrollbar,.aboutCard::-webkit-scrollbar{width:4px}
.mainbody::-webkit-scrollbar-thumb,.livescroll::-webkit-scrollbar-thumb,.helpPanel::-webkit-scrollbar-thumb,.aboutCard::-webkit-scrollbar-thumb{background:var(--line);border-radius:4px}
.mainbody::-webkit-scrollbar-track,.livescroll::-webkit-scrollbar-track,.helpPanel::-webkit-scrollbar-track,.aboutCard::-webkit-scrollbar-track{background:transparent}
/* Cienki jasnoszary pasek — pozostałe kontenery z przewijaniem (Diagnostyka + modale Biblioteki/Materiałów), spójnie z resztą */
.diagList::-webkit-scrollbar,.libfcols::-webkit-scrollbar,.libkatwrap::-webkit-scrollbar,.matro::-webkit-scrollbar{width:4px}
.diagList::-webkit-scrollbar-thumb,.libfcols::-webkit-scrollbar-thumb,.libkatwrap::-webkit-scrollbar-thumb,.matro::-webkit-scrollbar-thumb{background:var(--line);border-radius:4px}
.diagList::-webkit-scrollbar-track,.libfcols::-webkit-scrollbar-track,.libkatwrap::-webkit-scrollbar-track,.matro::-webkit-scrollbar-track{background:transparent}
.diagList,.libfcols,.libkatwrap,.matro{scrollbar-width:thin;scrollbar-color:var(--line) transparent}

/* podgląd Historii: link „‹ wróć" (prawy górny) + pływak „↑" (prawy dolny), wzorzec z konkurs-foto, paleta DEBATY */
.histback{color:var(--muted);text-decoration:none;font-size:13px;white-space:nowrap;cursor:pointer}
.histback:hover{color:var(--ink)}
.totop{position:fixed;bottom:20px;right:20px;width:42px;height:42px;border-radius:50%;background:var(--btn-bg);border:1px solid var(--btn-br);color:var(--ink);font-size:20px;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:var(--shadow);z-index:19;opacity:0;pointer-events:none;transition:opacity .5s ease}
.totop.show{opacity:.55;pointer-events:auto}
.totop.show:hover{opacity:.95;background:var(--btn-hv)}

/* Historia: szukanie + sortowanie (combo) — kontrolki w standardzie apki (.inp) */
.histbar{margin:2px 0 6px}
.histrow{display:flex;gap:8px;align-items:center}
.histrow>input[type=text].inp{flex:1;min-width:0;max-width:50%;padding:4px 11px}
.histsort{margin-left:auto;padding:4.5px 20px;border:0.5px solid var(--btn-br);border-radius:9px;background:var(--btn-bg);color:var(--ink);font:inherit;font-size:14px;cursor:pointer;text-align:center;white-space:nowrap}
.histsort:hover{background:var(--btn-hv)}
.histsort:focus{outline:none;border-color:var(--btn-br);box-shadow:none}
.histimport{flex:none;padding:4.5px 20px;border:0.5px solid var(--btn-br);border-radius:9px;background:var(--btn-bg);color:var(--ink);font:inherit;font-size:14px;cursor:pointer;white-space:nowrap}
.histimport:hover{background:var(--btn-hv)}
.histimport:focus{outline:none;border-color:var(--btn-br);box-shadow:none}
.impbadge{display:inline-block;margin-top:5px;font-size:12.5px;color:var(--muted);border:1px solid var(--line);background:#faf8f3;border-radius:999px;padding:2px 10px}
.heatChip{color:var(--ink)}   /* chip temperatury (klasyfikacja debaty) — ton ciemniejszy niż plakietki stanu; kolor neutralny (czerwień/niebieski zarezerwowane dla oponentów) */
.histempty{display:flex;flex-direction:column;align-items:center;gap:16px;padding:24px 0}

/* modal „na telefonie" (QR) — panel admina, tylko DEV */
.qrmodal-bg{position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:60;display:flex;align-items:center;justify-content:center;padding:20px}
.qrmodal-bg[hidden]{display:none}
.qrmodal{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);width:100%;max-width:300px;padding:16px}
.qrbody{text-align:center}
.qrimg{width:160px;height:160px;background:#fff;border:1px solid var(--line);border-radius:8px;padding:6px}
.qrurl{font-size:13px;color:var(--ink);word-break:break-all;font-variant-numeric:tabular-nums;margin-top:10px}

/* Publiczny widok linku (read-only, bez konta) — reużywa .bubble/.live/.tile z reszty apki */
body.pub #app{height:100dvh;overflow-y:auto}                        /* strona linku przewija się TU (poza app-shell) */
body.pub #app::-webkit-scrollbar{width:3px}
body.pub #app::-webkit-scrollbar-thumb{background:var(--neutral);border-radius:3px}
body.pub #app::-webkit-scrollbar-track{background:transparent}
body.pub .totop{bottom:20px}                                       /* strona linku nie ma zakładek — pływak nisko */
.pubwrap{max-width:760px;margin:0 auto;padding:16px;--ico:calc(41px * 1.2)}   /* logo publiczne +20%; --ico steruje też strefą ochronną i skalą odstępów */
.pubhead{display:flex;align-items:center;gap:0;padding:calc(var(--ico)/2) 2px calc(var(--ico)/2) 5px;border-bottom:1px solid var(--line)}   /* nagłówek jak w apce: logo + „Debata – poligon argumentów AI" w jednej linii */
.pubhead h1{margin:0;font-weight:400;letter-spacing:.3px;display:inline-flex;align-items:center;gap:0}
.pubhead h1 .wm{font-weight:400;font-size:25px;line-height:1;margin-left:calc(var(--ico)/2)}
.pubhead h1 .tagline{font-weight:400;font-size:25px;color:var(--ink);line-height:1}
.pubhead h1 .tagline::before{content:"\00a0\2013\00a0"}
.pubhead h1 .wmAI{font-weight:400;font-size:25px;color:var(--ink);line-height:1;margin-left:.3em}
.pubbrandcol{display:flex;flex-direction:column;gap:4px;min-width:0}   /* DEBATA + copy w kolumnie przy logo, wyrównane do lewej */
.pubbrand{font-weight:700;letter-spacing:.5px;color:var(--ink);font-size:24px;line-height:1}
.pubtag{font-size:15px;color:var(--muted);line-height:1.35}   /* copy pod DEBATA */
.pubro{text-align:right;font-size:12.5px;color:var(--muted);margin:8px 0 22px}   /* licznik POD separatorem, z prawej (12,5px = ujednolicony najmniejszy rozmiar) */
.pubcard{max-width:420px;margin:14vh auto;text-align:center;padding:24px;border:1px solid var(--line);border-radius:var(--radius);background:var(--card)}
.pubcard .pubbrand{display:block;margin-bottom:6px}

/* Sekcja „Link publiczny" w oknie Udostępnianie */
/* Kafelek: „usuń" w JEDNEJ linii z chipami (flex; align-items:center wyśrodkowuje; margin-left:auto dosuwa
   w prawo do tekstu „Pokaż" = 12,5px = padding 12 + border 0,5 przycisku). Chipy z odstępem (gap, nie sklejają się).
   Gdy brak chipów — „usuń" sam w tej linii. */
.histBadges{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-top:5px}
.histBadges .impbadge{margin-top:0}
.histBadges .dellink{margin-left:auto;padding-right:12.5px}
.dellink{color:var(--muted);font-size:12.5px;text-decoration:underline;cursor:pointer}
/* Okno „Link publiczny": QR centralnie + podpis, przyciski na dole jak w Eksport/Udostępnianie */
.linkQrWrap{text-align:center;margin:16px 0 4px}
.linkqr{width:200px;height:200px;background:#fff;border:1px solid var(--line);border-radius:8px;padding:8px}
.linkCap{font-size:12.5px;color:var(--muted);margin-top:8px}
.linkRevokeRow{margin-top:6px}
.revlink{color:var(--muted);font-size:12.5px;text-decoration:underline;cursor:pointer}

/* ===== Biblioteka — NIEKLIKALNY szkielet (wizualizacja planu iteracji) ===== */
.lib{}   /* Biblioteka — pełni interaktywna (dawna makieta inertna usunięta) */
.libhint{color:var(--muted);font-size:13px;padding:10px 2px}
.libcount{color:var(--muted);font-size:12.5px;margin:0 2px 10px 16px}   /* lewa krawędź wyrównana z tekstem tezy na kaflu (15px padding .body + 1px border) */
.librow{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:11px 14px;margin-bottom:8px;font-size:14px;color:var(--ink);line-height:1.4}
.libsearchrow{display:flex;gap:10px;margin-bottom:16px}
.libsearch{flex:1;font:inherit;font-size:15px;padding:11px 14px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--muted)}
.libsearch:focus{outline:none;border-color:var(--soft)}   /* bez niebieskiego focus-ringu — jak reszta pól */
.libfiltbtn{display:none}
.libsplit{display:grid;grid-template-columns:224px 1fr;gap:22px}
.libfilters{border-right:1px solid var(--line);padding-right:18px}
.libfilters h3{font-size:13px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);margin:0 0 14px}
.libfgroup{margin-bottom:14px}
.libflabel{font-size:12px;color:var(--muted);margin-bottom:6px}
.libfilters .seg2{display:flex;flex-wrap:wrap;border:0;background:transparent;gap:6px}
.libfilters .seg2 button{border:1px solid var(--line);background:#faf8f3;border-radius:999px}
.libfilters .seg2 button+button{box-shadow:none}
.libcatrow{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.libcatchip{font-size:12px;padding:3px 10px;border:1px solid var(--btn-br);background:var(--btn-hv);color:var(--ink);border-radius:999px}
.libffoot{margin-top:8px}
.libmeta{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:13px;margin:0 2px 12px}
.libsort{margin-left:auto;padding:6px 14px;border:.5px solid var(--btn-br);border-radius:9px;background:var(--btn-bg);color:var(--ink);font-size:13px}
.libcard{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px 18px;margin-bottom:14px}
.libcrow{display:flex;gap:16px;align-items:flex-start}
.libcmain{flex:1;min-width:0}
.libteza{font-size:15.5px;font-weight:600;margin:0 0 10px;line-height:1.35}
.libchips{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:8px}
.libchip{font-size:12px;padding:2px 10px;border:1px solid var(--line);background:var(--hl);color:var(--soft);border-radius:999px}
.libchip.off{color:var(--neutral)}
.libcats{font-size:12px;color:var(--neutral);margin-bottom:9px}
.libsnip{font-size:13px;color:var(--muted);margin:0;line-height:1.5}
.libhit{background:#efe4c9;border-radius:3px;padding:0 2px}
.libcact{flex:none;display:flex;align-items:center}
.libmore{display:block;margin:6px auto 0;background:none;border:none;color:var(--muted);font-size:13px}
/* Biblioteka — zwarta karta wyniku (styl Historii) + meta + snippet */
.libtile .libttl{font-size:14px;font-weight:600;overflow-wrap:anywhere;line-height:1.4}
.liblang{font-weight:600;color:var(--muted);font-size:12px}
.libmeta2{font-size:12px;color:var(--neutral);margin-top:3px}
.libtile .libsnip{margin-top:5px}
.libfcols{flex-wrap:wrap;max-height:60vh;overflow:auto}   /* Filtr: 7 grup → zawijanie kolumn */
.libkatwrap{display:flex;flex-wrap:wrap;gap:8px;max-height:52vh;overflow:auto;margin:2px 0}   /* Kategoria: pigułki zawijane */
.sfCard .scHead{margin-top:8px}                 /* Filtr/Kategoria: tytuł +8px od górnej krawędzi */
.sfCard .libkatwrap{margin-top:22px}            /* Kategorie: tytuł → chipy +20px */
.libpv{display:flex;flex-direction:column;height:min(78vh,560px)}   /* STAŁA wysokość okna — nie skacze przy rozwijaniu materiałów */
.confirmCard.libpv{background:var(--paper)}   /* tło modala o ton ciemniejsze od kafelków (--card) — kafelki są jaśniejsze */
.libpv .scHead{margin:15px 0}   /* +15px odstępu z góry i z dołu od tytułu */
.libpv .libpvteza{font-size:15px;font-weight:600;line-height:1.35;margin:0 0 12px;color:var(--ink);flex:none}
.libpvmats{flex:1 1 auto;min-height:0;overflow:auto;display:block;scrollbar-width:thin;scrollbar-color:#d6d6d6 transparent}   /* modal stałej wysokości — przewija się na poziomie listy, materiały rozwijają się w pełni (standard) */
.libpvmats::-webkit-scrollbar{width:3px;height:3px}
.libpvmats::-webkit-scrollbar-thumb{background:#d6d6d6;border-radius:3px}
.libpvmats::-webkit-scrollbar-track{background:transparent}
/* Podgląd tezy: sekcje materiałów jako KAFELKI (border+radius+tło) + Zamknij po prawej */
.libpvmats .matacc{border:1px solid var(--line);border-radius:10px;background:var(--card)}
.libpvmats .matacc + .matacc{margin-top:10px}   /* odstęp między kaflami (zamiast flex gap) */
.libpvmats .matacc>summary{padding:10px 12px}
.libpvmats .matacc .matbody{padding:0 12px 10px}
/* Otwarty materiał: body ma max-height liczone w JS (matAccOpen), sam się przycina (overflow:auto) → przewija się WEWNĄTRZ (widoczny pasek 3px), bez zewnętrznego paska. NIE dawać overflow na <details> — psuje animację ::details-content. */
.libpv .expBtns{display:flex;justify-content:flex-end;margin-top:16px}
.libpvmat{border:1px solid var(--line);border-radius:8px;padding:10px 12px;background:var(--card)}
.libpvmathd{font-size:12px;color:var(--muted);margin-bottom:4px}
.libpvmattx{font-size:13px;line-height:1.5;color:var(--ink);white-space:pre-wrap}

/* dolny pasek zakładek — tylko mobile */
.tabbar{display:none}

@media (max-width:859px){
  .libsplit{grid-template-columns:1fr;gap:0}
  .libfilters{display:none}
  .libfiltbtn{display:inline-flex;align-items:center;flex:none}
  .toolbar h1 .tagline,.toolbar h1 .wmAI{display:none}
  /* APP-SHELL: cała apka = kolumna na wysokość ekranu (100dvh); przewija się TYLKO środek — nagłówek i zakładki STOJĄ.
     Dzięki temu na iOS nie skacze pasek adresu ani zakładki, a Pauza/Wznów nie „wędrują". Logowanie (body.login) wyjęte. */
  body:not(.login):not(.pub) #app{display:flex;flex-direction:column;height:100vh;height:100dvh;overflow:hidden}
  .toolbar{flex:none}
  .shell{grid-template-columns:1fr;flex:1;min-height:0;height:auto;overflow:hidden;margin:0;max-width:none}   /* margin:0 (nie auto!) — jako element flex #app auto-marginesy kurczyły shell do treści i centrowały → skok w poziomie przy rozwijaniu */
  .side{border-right:0;padding:6px 14px 14px}
  .sideHead{display:none}
  .maintabs{display:none}
  .toolbar .helpBtn{display:inline-flex;align-items:center;justify-content:center}
  .mainbody{padding:8px 14px 14px}
  .livescroll{padding:8px 14px}
  .livectrl{padding:10px 14px}
  .totop{bottom:82px}   /* nad zakładkami */
  /* pokazuj jedną sekcję wg aktywnej zakładki (body.mtab-*) */
  .side{display:none} .main{display:none}
  body.mtab-set .side{display:block}
  body.mtab-disc .main, body.mtab-hist .main, body.mtab-lib .main{display:flex}   /* flex, nie block — main to kolumna z wewnętrznym przewijaniem (app-shell) */
  .tabbar{display:flex;flex:none;border-top:1px solid var(--line);background:#f7f4ec}
  .tabbar button{flex:1;border:0;background:transparent;padding:9px 4px 12px;font-size:13.5px;color:var(--muted);cursor:pointer;
    display:flex;flex-direction:column;gap:4px;align-items:center;font-family:inherit}
  .tabbar button + button{border-left:1px solid var(--line)}
  .tabbar button .ic{display:flex;align-items:center;justify-content:center;height:26px;line-height:1;font-size:21px}
  .tabbar button .ic svg{width:24px;height:24px;display:block}
  .tabbar button.on{color:var(--ink);background:#ece7dc}
  .tabbar button[data-mt="hist"].hasnew{box-shadow:inset 0 3px 0 var(--kibic)}   /* bursztynowy pasek w górnej krawędzi zakładki */
  .histrow>input[type=text].inp{padding:7px 11px}   /* mobile: szukanie 37px (desktop 31px) */
  .histsort{padding:6.5px 18px}                      /* mobile: padding poziomy jak Import obok */
  .histimport{padding:6.5px 18px}                     /* mobile: Import wyrównany wysokością */
}
@media (max-width:420px){
  .histimport .imEll{display:none}                    /* wąski ekran: „Import…" → „Import" (oszczędność miejsca) */
}

/* ---------- KAFELKI ---------- */
.tile{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);margin:9.6px 0;overflow:hidden}   /* odstęp między kaflami −20% (12→9.6) */
.tile>summary{list-style:none;cursor:pointer;padding:10.5px 15px;display:flex;align-items:center;gap:10px;font-weight:400;color:var(--ink);font-size:16px}   /* menu 1. poziomu = jak aktywna zakładka (16px, waga 400, ink); wysokość kafla −10% (padding pion. 13→10.5) */
.tile>summary::-webkit-details-marker{display:none}
.tile>summary .tname{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tile>summary .tname.thesisSet{display:flex;align-items:baseline;font-style:italic}   /* teza: kursywa + cudzysłów (placeholder „Teza" bez) */
.tile>summary .tname.thesisSet::before{content:"„";flex:none}     /* cudzysłowy = osobne flex-itemy → zawsze widoczne, nawet gdy tekst przycięty */
.tile>summary .tname.thesisSet::after{content:"”";flex:none}
.tile>summary .tname.thesisSet .thVal{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}   /* to TYLKO ten tekst dostaje wielokropek */
.matro{white-space:pre-wrap;font-size:12.5px;line-height:1.45;color:var(--ink);max-height:280px;overflow:auto;margin-top:8px;padding:8px 10px;background:var(--card);border:1px solid var(--line);border-radius:8px}   /* PDF/link: pobrana treść (read-only) w akordeonie Materiały */
.tile>summary .chev{margin-left:auto;color:var(--muted);transition:.2s}
.tile>summary .switch+.chev{margin-left:10px}
.tile>summary .matcount{flex:none;font-size:12.5px;font-weight:600;color:var(--muted)}
.matacc{border-top:1px solid var(--line)}
.tile .body>.matacc:first-child{border-top:none}   /* bez podwójnego separatora — .body ma już własny border-top */
.matacc>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:8px;padding:9px 0;font-size:13px;outline:none}   /* outline:none — bez niebieskiego focus-ringu (jak reszta pól apki) */
.matacc>summary::-webkit-details-marker{display:none}
.matacc>summary .fname{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.matacc[open]>summary .fname{white-space:normal;overflow:visible;text-overflow:clip}   /* po rozwinięciu pełny tytuł zawija się na tyle wierszy, ile trzeba */
.matacc>summary .matvis{flex:none;font-size:12.5px;color:var(--muted)}
.matacc>summary .chev{flex:none;color:var(--muted);transition:.2s}
.matacc[open]>summary .chev{transform:rotate(90deg)}
.matacc .matbody{white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px;padding:0 2px 10px}   /* bez max-height/overflow — rozwija się do pełnej treści (standard jak .tile .body); animację robi matAccOpen */
.matacc .matbody .matctl{display:flex;align-items:center;gap:8px;padding:2px 0 8px}   /* wiersz kontrolek w body akordeonu: widoczność + usuń */
.matacc .matbody .matlink{font-size:12.5px;color:var(--soft);word-break:break-all}
.tile[open]>summary .chev{transform:rotate(90deg)}
.tile .body{padding:6px 15px 16px;border-top:1px solid var(--line)}
/* Ulubione — serduszko: lista (klik) i podgląd (odczyt). Puste ♡ = neutralne, włączone ♥ = żółty --kibic. */
.histtile{position:relative}
.histtile .body>div:first-of-type{padding-right:40px}   /* strefa ochronna: teza (pierwszy div; przed nią jest przycisk serca) nie wchodzi pod serduszko */
.favBtn{position:absolute;top:8px;right:10px;z-index:2;border:0;background:transparent;cursor:pointer;line-height:0;padding:2px 4px;font-family:inherit}
.favRO{display:inline-flex;line-height:0}
.favIco{display:block}
.favBtn .favIco{width:20px;height:20px}
.favRO .favIco{width:20px;height:20px}
.favIco path{fill:none;stroke:#c2bcb1;stroke-width:1;stroke-linejoin:round}
.favBtn:hover .favIco path{stroke:#c2bcb1}
.favBtn.on .favIco path,.favRO.on .favIco path{fill:#c2bcb1;stroke:#c2bcb1}
/* Rola opcjonalna (Kibic/Sędzia): ON = zwykły kafelek; OFF nieco jaśniejszy + mocniej wyszarzona nazwa; kropka roli BEZ zmian; przełącznik aktywny */
.tile.roleTile.roleOff{background:#fdfcf9;border-color:var(--line)}
.tile.roleOff>summary{cursor:default}
.tile.roleOff>summary .tname{color:#b3ada2}
.tile.roleOff>summary .chev{visibility:hidden}
/* Parametr wyszarzony (np. długość werdyktu, gdy Sędzia OFF) */
.dimmed{opacity:.45;pointer-events:none}
.dot{width:15.4px;height:15.4px;border-radius:50%;flex:none}   /* kolorowe kropki ról przy postaciach (10→14→15.4, +10%) */
.dot.op1{background:var(--op1)} .dot.op2{background:var(--op2)} .dot.kibic{background:#c2bcb1} .dot.neutral{background:var(--neutral)} .dot.judge{background:#33b34d} .dot.mod{background:#fff;border:1.2px solid var(--muted);box-sizing:border-box}
.muted{color:var(--muted);font-size:12.5px}
.tileHint{font-size:12.5px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);margin:16px 0 4px}

/* pola */
.field{margin:12px 0}
.field>label{display:block;font-size:12.5px;color:var(--muted);margin:0 0 6px}
input[type=text].inp,input[type=password].inp,textarea.inp,select.inp{width:100%;font:inherit;font-size:14px;padding:9px 11px;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--ink)}
textarea.inp{resize:none;min-height:56px;overflow:hidden;box-sizing:border-box}   /* memo: rośnie do treści (JS sizeMatText), bez własnego paska */
.inp:focus{outline:none;border-color:var(--soft)}

/* wiersz suwaka (range) — kolor per rola przez --sc */
select.inp.mini{padding:5px 9px;font-size:13px}
.prow>.seg2,.prow>select.inp.mini{width:150px;margin-left:auto}
.prow>.seg2 button{flex:1;padding-left:0;padding-right:0}
.srow{display:flex;align-items:center;gap:10px;margin:8px 0;font-size:13px}
.srow>label{flex:none;width:128px;color:var(--muted)}
.srange{flex:1;min-width:0;margin:0;-webkit-appearance:none;appearance:none;height:5px;border-radius:5px;background:var(--line);outline:none}
.srange::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:17px;height:17px;border-radius:50%;background:#fff;border:2px solid var(--sc,var(--soft));cursor:pointer;box-shadow:0 1px 2px rgba(0,0,0,.2)}
.srange::-moz-range-thumb{width:17px;height:17px;border-radius:50%;background:#fff;border:2px solid var(--sc,var(--soft));cursor:pointer}
.sval{flex:none;width:22px;text-align:center;color:var(--ink);font-variant-numeric:tabular-nums}

/* stepper */
.prow{display:flex;align-items:center;gap:10px;margin:2px 0}
.prow>label{flex:1;font-size:13px}
/* Zakres werdyktu — inline (etykieta z lewej, segment z prawej), przyciski zawijaja sie do 2 wierszy (wariant B). Mobile: etykieta tez sie zawija (wariant D, ponizej w @media). */
.vrow{display:flex;align-items:center;gap:10px;margin-top:14px}
.vrow>label{flex:none;width:128px;font-size:13px}   /* szerokość etykiety jak w suwaku (.srow>label) */
.vrow>.seg2{flex:1;min-width:0}   /* chip werdyktu: lewy początek jak przy suwakach; prawa krawędź sięga krawędzi kafla (usunięty dopełniacz .vrow::after) — jak kontrolki powyżej */
.vrow>.seg2 button{flex:1;line-height:1.12;padding:5px 6px;white-space:normal}
.stepper{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#fff}
.stepper button{border:0;background:#faf8f3;width:32px;height:32px;font-size:17px;line-height:1;cursor:pointer;color:var(--ink);font-family:inherit}
.stepper button:hover{background:var(--hl)}
.stepper .v{min-width:78px;text-align:center;font-size:13px;font-variant-numeric:tabular-nums}
/* Tempo tekstu (Moje konto): steper równy „Wyloguj" — flex:0 1 170px + wys.36 (kurczy się z oknem tak samo) */
.stepper.spd{flex:0 1 170px;min-width:0;height:36px;border:0.5px solid var(--btn-br);border-radius:8px}
.stepper.spd button{flex:0 0 44px;height:36px;width:auto;font-size:16px}
.stepper.spd .v{flex:1;min-width:0;font-size:13px}
.rhint{font-size:12.5px;color:var(--muted);margin:5px 0 0 1px}

/* przełącznik */
/* Przełącznik roli — wypełnienie, bez ramki; odcienie dobrane w PREVIEW/przelaczniki.html (OFF #ebe9de / ON #c2bcb1) */
.switch{margin-left:auto;width:40px;height:23px;border-radius:999px;background:#ebe9de;position:relative;flex:none;transition:.2s;cursor:pointer}
.switch::after{content:"";position:absolute;top:2px;left:2px;width:19px;height:19px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.25);transition:.2s}
.switch.on{background:#c2bcb1}
.switch.on::after{left:18px}
#judgeSwitch.on{background:#33b34d}

/* pill / chip */
.pill{display:inline-block;font-size:12.5px;padding:2px 9px;border-radius:999px;background:#efe9dd;color:var(--muted);margin:2px 4px 2px 0}
.pill.stancePill{font-size:13.5px;padding:5px 13px;color:var(--ink)}
.warnline{font-size:12.5px;color:var(--op1);background:#ffe6ec;border:1px solid #ffc2d1;border-radius:9px;padding:7px 10px;margin-top:8px}

/* materiały */
.mat{display:flex;align-items:center;gap:8px;padding:8px 0;border-top:1px solid var(--line);font-size:12.5px}
#matList .mat:first-child{border-top:none}
.mat .fname{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.matcard{flex-direction:column;align-items:stretch;gap:6px}
.mhead{display:flex;align-items:center;gap:8px}
.mstatusrow{display:flex;align-items:center;gap:8px}
.matstate{flex:1;min-width:0;font-size:12.5px;color:var(--muted)}
.matstate.err{color:var(--op1)} .matstate.warn{color:#e08a00}
.matclaude{flex:none}
.mattrunc{font-size:12.5px;color:#e08a00;padding:0 0 4px}   /* notka „przycięto" tuż pod materiałem */
.matdone{font-size:12.5px;color:#33b34d;padding:0 0 4px}   /* notka sukcesu OCR (zielona) tuż pod materiałem */
.ocrbtns{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap}   /* decyzja OCR: Anuluj/Użyj/Ponów pod częściowym tekstem */
.mocrpre{margin:6px 0 2px;max-height:180px;overflow:auto;background:#fff;border:1px solid var(--line);border-radius:6px;padding:8px;font-size:12.5px;line-height:1.4;white-space:pre-wrap;word-break:break-word;scrollbar-width:thin;scrollbar-color:#d6d6d6 transparent}
.mocrpre::-webkit-scrollbar{width:3px;height:3px}
.mocrpre::-webkit-scrollbar-thumb{background:#d6d6d6;border-radius:3px}
.mocrpre::-webkit-scrollbar-track{background:transparent}
.vis{flex:none;font-size:12.5px;height:29px;line-height:1;padding:0 32px 0 13px;border-radius:999px;border:1px solid var(--line);color:var(--muted);cursor:pointer;font-family:inherit;-webkit-appearance:none;appearance:none;background:#faf8f3 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%237c766c' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center}   /* height+appearance:none → Safari (który ignoruje padding na natywnym select) też respektuje wysokość; własna strzałka */
.vis:focus{outline:none;border-color:var(--soft)}
.drop{display:flex;flex-direction:column;align-items:center;gap:4px;border:1px dashed #cfc9ba;border-radius:8px;padding:16px 12px;font-size:12.5px;color:#7a6f55;text-align:center;cursor:pointer;background:#f1efe7;transition:.15s;margin-top:10px}
.matmemo{width:100%;margin-top:12px;min-height:44px;resize:none;overflow:hidden;line-height:1.45}
.matactions{display:flex;gap:8px;align-items:center;margin-top:8px}
.matactions #matAdd{margin-left:auto}
#matMsg:empty{display:none}   /* pusty komunikat pod przyciskami nie rezerwuje miejsca (bez pustej luki) */
.cfgActions{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:22px 0}
.cfgActRight{display:inline-flex;gap:8px}
.discEmpty{margin-top:auto;color:var(--muted);font-size:13px;text-align:center;padding:10px 0 4px}
#thesisDisp{font-size:16px;margin:6px 0 14px;overflow-wrap:anywhere}
.discBody.empty{align-items:center;justify-content:center;text-align:center}
.discBody.empty .discLbl,.discBody.empty .discHint{display:none}
.discBody.empty #thesisDisp{font-size:15px;color:var(--muted);margin:0;padding:16px}
.mattext{width:100%;box-sizing:border-box;margin:2px 0 6px;font-size:13px;font-family:inherit;color:var(--ink);background:var(--card);border:1px solid var(--line);border-radius:8px;padding:8px;min-height:56px;resize:vertical;overflow:hidden;line-height:1.45}
.mattext:focus{outline:none;border-color:var(--soft)}
.matdel{flex:none;margin-left:auto}   /* przycisk „Usuń" dosunięty do prawej (widoczność zostaje z lewej) */
.matdel:hover{color:var(--op1)}       /* czerwień na hover — afordancja usuwania */
.matcopy{flex:none;margin-left:auto}  /* „Kopiuj" pcha grupę przycisków w prawo */
.matcopy + .matdel{margin-left:0}     /* „Usuń" tuż przy „Kopiuj" (bez drugiego auto-marginesu, inaczej dzielą lukę po równo) */
.drop:hover{border-color:rgba(0,0,0,.4)}
.drop.dragover{border-color:rgba(0,0,0,.6);background:rgba(0,0,0,.04);color:var(--ink)}
.emptyState{color:var(--muted);font-style:italic;font-size:13px}

/* baner demo — trwały element powłoki. Zwój wysokości px→0 w JS (dokładnie jak akordeon kafli, tileCollapse),
   transitionend sprząta. height:0 = prawdziwe zero → brak resztki (grid zostawiał min-content dziecka). */
.demoWrap{overflow:hidden;margin:12px 0}
.demoWrap.collapsed{height:0;margin:0}
.demoBanner{display:flex;align-items:center;gap:8px;background:#f1efe7;border:1px solid #e2ddd2;border-radius:12px;padding:11px 13px}
.demoBanner .demoTxt{flex:1;font-size:12.5px;color:#6f6f69;line-height:1.4}
.demoClose{border:0;background:transparent;color:var(--muted);font-size:18px;line-height:1;cursor:pointer;padding:2px 4px}

/* zużycie / cennik / koszt */
.tokbar{display:flex;gap:14px;flex-wrap:wrap;font-size:12.5px;color:var(--muted);background:#fff;border:1px solid var(--line);border-radius:10px;padding:9px 12px;margin-bottom:6px}
.tokbar b{color:var(--ink);font-weight:normal;font-variant-numeric:tabular-nums}
/* tabela zużycia per rola */
.usetab{table-layout:fixed}
.usetab th,.usetab td{padding:5px 5px}
.usetab .tot td{border-top:2px solid var(--btn-br);color:var(--ink)}
.usetab .tot td:first-child{color:var(--muted)}
.usetab .role{gap:5px}
/* cennik podrzędny (zwijany, przygaszony) */
.subcen{margin-top:10px}
.subcen>summary{list-style:none;cursor:pointer;font-size:12.5px;color:var(--ink);text-transform:uppercase;letter-spacing:.4px;padding:4px 0}
.subcen>summary::-webkit-details-marker{display:none}
.subcen>summary::before{content:"› ";color:var(--soft)}
.subcen[open]>summary::before{content:"⌄ "}
.subcen .cennik{opacity:.85}
.cennik{width:100%;border-collapse:collapse;margin-top:10px;font-size:12.5px}
.cennik th,.cennik td{text-align:left;padding:6px 8px;border-bottom:1px solid var(--line)}
.cennik th{font-size:12.5px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted)}
.cennik td.num{text-align:right;font-variant-numeric:tabular-nums;color:var(--ink)}
.cennik th.num{text-align:right}
.cennik .role{display:inline-flex;align-items:center;gap:6px}
.costline{display:flex;justify-content:space-between;font-size:12.5px;color:var(--muted);padding:6px 8px;border-top:1px solid var(--line)}
.costline b{color:var(--ink);font-variant-numeric:tabular-nums;font-weight:normal}

/* admin — kolory jak zwykły kafel (bez wyróżnienia) */
.acctMe{display:flex;flex-direction:column;gap:12px;margin:6px 0 20px}
.acctMe>.acctEmail{padding:9px 11px 0;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.acctMe>input.inp{width:100%}
.acctNameRow{display:flex;align-items:center;gap:10px;margin:6px 0;justify-content:space-between}   /* imię z lewej, Wyloguj z prawej; oba kurczą się by się zmieścić */
.acctNameRow>input.inp{flex:0 1 170px;min-width:0;height:36px;padding:0 10px;box-sizing:border-box;text-align:center}   /* imię wyśrodkowane; równe „Wyloguj", kurczy się by się zmieścić */
.acctNameRow>#logoutBtn{flex:0 1 170px;min-width:0;height:36px;padding:0;box-sizing:border-box;display:flex;align-items:center;justify-content:center}   /* Wyloguj: równy polu imienia, dosunięty do prawej (space-between), kurczy się razem — zawsze mieści się na stronie */
.acctGroups{font-size:14px;padding-left:11px;overflow-wrap:anywhere}
.acctGrpLbl{color:var(--muted)}
.acctMe #demoReopen{align-self:flex-start;margin:2px 0 0;width:170px;max-width:calc(50% - 5px);height:36px;padding:0 10px;box-sizing:border-box;display:flex;align-items:center;justify-content:center}   /* jak pole imienia: 170px, ale kurczy się do połowy wiersza na wąskim oknie */
#acctMod{background:var(--hl)}
#acctMod:focus{background:#fff;outline:none}
.acctSaved{flex:none;font-size:12.5px;color:var(--soft);opacity:0;transition:opacity .2s;white-space:nowrap}
.acctSaved.show{opacity:1}
.subwrap{overflow:hidden}
.subwrap>input.inp{margin-top:10px}
.acctHead{font-size:12.5px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);margin:6px 0 2px}
.acct{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:8px;row-gap:2px;padding:9px 0;border-top:1px solid var(--line);font-size:12.5px}
.acct .em{min-width:0;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.acct .acctuse{color:var(--muted);font-size:12.5px;font-variant-numeric:tabular-nums;white-space:nowrap}
.acct .role{margin-left:auto}
.role{flex:none;font-size:12.5px;padding:1px 8px;border-radius:999px;border:1px solid var(--line);color:var(--muted);background:#fff}
.role.owner{color:#1a52cc;border-color:#bcd4ff;background:#e6efff}   /* delikatnie jasnoniebieski (odcień op2) */
.role.active{color:#1e6b3c;border-color:#bfe0cb;background:#eaf5ee}   /* delikatnie jasnozielony (odcień Sędziego) */
/* Panel admina — wiersz konta z kontrolkami BYO (klucz app/własny, override, self-cap, suspend) */
.byoacct{flex-direction:column;align-items:stretch;gap:6px}
.byoacct .acctHd{display:flex;align-items:baseline;column-gap:8px}
.byoacct .acctHd .acctuse{margin-right:auto}   /* zużycie tuż przy mailu (po lewej); spycha przełącznik do prawej krawędzi */
.byoacct .acctHd .switch{margin-left:0}   /* neutralizuje .switch{margin-left:auto} — inaczej dwa auto-marginesy i przełącznik nie trzyma się prawej */
.byoctl{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.byoctl .seg2.sm button{padding:3px 10px;font-size:12.5px}
/* Stepper limitu debat w wierszu konta (–/+). „Własny": aktywny. „Apka": ta sama szerokość, ale przyciski niewidoczne → liczba wyrównana pod stepperem niżej. */
.bystep{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:#fff}
.bystep button{border:0;background:#faf8f3;width:24px;height:26px;font-size:15px;line-height:1;cursor:pointer;color:var(--ink);font-family:inherit}
.bystep button:hover{background:var(--hl)}
.bystep .v{min-width:36px;text-align:center;font-size:12.5px;font-variant-numeric:tabular-nums;color:var(--ink)}
.bystep.fixed{border-color:transparent;background:transparent}
.bystep.fixed button{visibility:hidden}
.bystep.fixed .v{color:var(--muted)}
.byoctl .seg2 button:focus{outline:none}
.byoctl .switch{margin-left:auto}
.byoacct.susp{opacity:.55}
.byoacct.susp .acctHd .em{text-decoration:line-through}
/* Kafel „Klucz API" (BYO) — tylko dla key_mode='own' */
.keyMasked{font-variant-numeric:tabular-nums;letter-spacing:1px;font-size:14px;color:var(--ink);padding:6px 0}
.keyStat{font-size:12.5px;margin:2px 0 10px}
.keyStat.active{color:#1e6b3c}
.keyStat.paused{color:var(--muted)}
.keyStat.none{color:var(--op1)}   /* brak klucza / błąd testu — czerwień jak .msg.err */
.keyTile #keyInput{margin-bottom:10px}
.keyBtns{display:flex;gap:8px;justify-content:flex-end;margin-bottom:24px}
.role.admin{color:var(--ink);border-color:#e2ddd2;background:#f1efe7}
.inviteRow{display:flex;gap:8px;margin:12px 0 4px}
.inviteRow input{flex:1;border:1px solid var(--line);border-radius:8px;padding:8px 11px;font:inherit;font-size:12.5px;background:#fff;color:var(--ink)}
.inviteRow input:focus{outline:none;border-color:var(--soft)}
.over{color:#c81e4a}

/* GRUPY — panel admina */
.grp{border-top:1px solid var(--line);padding:9px 0}
.grpRow{display:flex;align-items:center;gap:8px}
.grpTitle{font-size:14px;color:var(--ink);flex:1;min-width:0;overflow-wrap:anywhere}
.grpActs{display:flex;gap:12px;flex:none}
.linkbtn{border:0;background:none;padding:0;font:inherit;font-size:12.5px;color:#1f3a68;cursor:pointer}
.linkbtn:hover{text-decoration:underline;color:#12244a}
.grpName{width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:8px;padding:7px 10px;font:inherit;font-size:13px;background:#fff;color:var(--ink)}
.grpName:focus{outline:none;border-color:var(--soft)}
.grpChips{display:flex;flex-wrap:wrap;gap:5px;margin-top:5px}
.grpChip{font-size:12.5px;color:var(--ink);background:var(--hl);border:1px solid var(--line);border-radius:999px;padding:2px 9px}
.grpMems{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:7px}
.grpMem{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;color:var(--ink);cursor:pointer}
.grpMem input{margin:0;cursor:pointer}
.grpEditBtns{display:flex;gap:8px;margin-top:9px}
.grpNew{border-top:1px solid var(--line);margin-top:6px;padding-top:10px}
.grpNewHd{font-size:12.5px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);margin:0 0 7px}
/* GRUPY — sekcja w Historii (udostępnione, read-only) */
.grpSec{margin-top:18px}
.tile.shared{box-shadow:inset 3px 0 0 var(--neutral)}   /* trwały szary pasek z lewej = „udostępniona" (od/do) */
.tile.shared.unread{box-shadow:inset 3px 0 0 var(--kibic)}   /* nieprzeczytana otrzymana debata: pasek POMARAŃCZOWY (szarzeje po otwarciu) */
.tile.unread{box-shadow:inset 3px 0 0 var(--kibic)}   /* „nowe nagranie" na WŁASNEJ (nieudostępnionej) debacie: ten sam bursztynowy pasek (gaśnie po otwarciu) */
/* Modal „Udostępnianie" — chipy grup (jak Eksport, jedna kolumna) + zakres */
.shareThesis{font-size:13px;color:var(--muted);margin:2px 0 4px;padding-bottom:10px;overflow-wrap:anywhere;line-height:1.4}
.expChips.shareChips{margin-top:17px}   /* odstęp przed pierwszym chipem grupy (wyższa specyficzność niż .expChips) */
.shareScope{margin-top:12px;font-size:12.5px;color:var(--ink)}
.shareScope b{color:var(--ink)}

/* zakładka Debata/Historia — placeholder */
.placeholder{text-align:center;color:var(--muted);padding:48px 16px;font-size:14px}

/* debata na żywo — bąble */
.livehead{display:flex;align-items:center;gap:10px;margin:4px 0 10px;position:relative}
.livehead .th{flex:1;min-width:0;font-size:15px;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* Znacznik temperatury — neutralny chip (paleta); wpasowany w wiersz nagłówka, tak samo w żywej debacie i w podglądzie Historii (ta sama szerokość okna) */
.heatchip{font-size:12px;padding:4px 11px;border:0.5px solid var(--btn-br);border-radius:20px;background:var(--card);color:var(--ink);white-space:nowrap;flex:none}
.live{display:flex;flex-direction:column;position:relative}
/* Oznaczenie „głos AI" (art. 50) — stała plakietka przy odsłuchu + znikający pasek przy pierwszym odsłuchu */
.aiplayrow{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.aivoice{font-size:12px;padding:3px 11px;border:0.5px solid var(--btn-br);border-radius:20px;background:var(--card);color:var(--soft);white-space:nowrap;flex:none}
.aivoicebar{font-size:12.5px;color:var(--ink);background:var(--hl);border:1px solid var(--line);border-radius:10px;padding:8px 12px;margin-bottom:8px;transition:opacity .4s}
.aivoicebar.hide{opacity:0}
/* Historia: globalny odsłuch CAŁOŚCI ▶/■ — przycisk jak podgląd w panelu „Głosy"; prawy górny róg obszaru dyskusji (przy 1. dymku, do góry) */
.live>.histPlay{position:absolute;top:6px;right:0;z-index:3;padding:7px 12px;line-height:1;font-size:15px;color:var(--soft)}
.histPlay.playing{background:var(--hl);border-color:var(--muted);font-weight:700;animation:pvPulse 1.1s ease-in-out infinite}
/* Historia: ikona w dymku = pasywny WSKAŹNIK odsłuchu (świeci tylko na aktualnie czytanej kwestii), NIE przełącznik */
.bubbleTts.bubbleInd{pointer-events:none;cursor:default;opacity:0;transition:opacity .15s}
.bubbleTts.bubbleInd.on{opacity:1;animation:pvPulse 1.1s ease-in-out infinite}
.bubbleInd .ico-on{display:inline-flex}   /* wskaźnik = ZWYKŁY głośnik (nie przekreślony), nawet przy .on */
.bubbleInd .ico-off{display:none}
/* PACING (2A): filler oczekiwania — falujące kropki, gdy audio jeszcze się przygotowuje (start / luka / przed werdyktem) */
/* Czekadełko neutralne: małe, WYŚRODKOWANE u góry (pierwszy dymek wchodzi w to samo miejsce), delikatne ease-in */
.bubble.pacefiller{max-width:64px;background:var(--card);border:0.5px solid var(--btn-br);opacity:.85;padding:12px 14px;margin-left:auto;margin-right:auto;animation:paceFillIn .45s ease-in-out both}
@keyframes paceFillIn{from{opacity:0;transform:translateY(-4px) scale(.97)} to{opacity:.85;transform:none}}
.pacejudge{animation:paceFillIn .45s ease-in-out both}   /* werdykt: zielone okno Sędziego wjeżdża tym samym ruchem */
.pacejudge .dots{margin-top:5px}
@media (prefers-reduced-motion:reduce){.bubble.pacefiller,.pacejudge{animation:none}}
/* Licznik kwestii: numer w prawym-dolnym rogu dymka oponenta (op1/op2), do odwołań; ciemnoszary, cienka obwódka */
.bubble.numbered{padding-bottom:24px}
.qnum{position:absolute;right:6px;bottom:5px;font-size:12px;line-height:1.25;color:#3a3936;border:0.5px solid var(--btn-br);border-radius:9px;padding:1px 7px;background:rgba(255,255,255,.55);letter-spacing:.02em}
/* PACING: nowe zdanie pojawia się z delikatnym rozjaśnieniem (łagodzi „skokowe" wejście); inline → tylko opacity (bez skoków układu) */
.paceSent{animation:paceSentIn .35s ease-out both}
@keyframes paceSentIn{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.paceSent{animation:none}}
.bubble{border-radius:14px;padding:10px 13px;margin:7px 0;max-width:86%;font-size:14px;box-shadow:0 1px 3px rgba(0,0,0,.06);white-space:pre-wrap;position:relative}
.bubble .who{font-size:12.5px;margin-bottom:3px;opacity:.85;padding-right:38px}   /* miejsce na przycisk 🔊 (2×) w prawym górnym rogu */
.bubble .who .dot{display:inline-block;vertical-align:middle;position:relative;top:-1px}
.b-op1{background:#ffe6ec;border:1px solid #ffc2d1;margin-right:auto} .b-op1 .who{color:var(--op1)}
.b-op2{background:#e6efff;border:1px solid #bcd4ff;margin-left:auto} .b-op2 .who{color:var(--op2)}
.b-kibic{background:#f3f1ec;border:1px dashed #b8b1a2;margin:7px auto;max-width:76%;font-style:italic;color:#615c52;font-size:13px}
/* KROK 2 Iteracja 2 — odtwarzanie NAGRANIA (re-watch): kwestie chowane i odsłaniane w rytm zegara audio; bieżąca w delikatnym ringu */
.live.replaying .bubble:not(.revealed){display:none}
.live.replaying .bubble.revealed{animation:paceSentIn .3s ease-out both}
.live .bubble.rcur{box-shadow:0 0 0 2px var(--line),0 2px 8px rgba(0,0,0,.08)}
@media (prefers-reduced-motion:reduce){.live.replaying .bubble.revealed{animation:none}}
/* PWA: pasek „nowa wersja" (bursztyn jak Kibic) */
#updbar{position:fixed;top:0;left:0;right:0;z-index:9999;box-sizing:border-box;min-height:40px;display:flex;justify-content:center;align-items:center;gap:12px;background:#fdf3e8;border-bottom:1px solid var(--kibic);padding:8px 14px;box-shadow:0 2px 12px rgba(0,0,0,.14);color:#7a5a2e;font-size:13px}
#updbar .updtxt{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#updbar .updbtn{border:1px solid var(--kibic);background:#fff;color:#7a5a2e;border-radius:999px;padding:5px 14px;font-size:13px;cursor:pointer;font-family:inherit;white-space:nowrap}
#updbar .updx{border:0;background:none;color:#7a5a2e;font-size:16px;line-height:1;cursor:pointer;padding:0 2px}
.b-judge{background:#eaf5ee;border:1px solid #bfe0cb;margin:10px 0} .b-judge .who{color:#1e6b3c}
.b-moderator{background:#fff;border:1px solid var(--line);margin:8px auto;width:86%} .b-moderator .who{color:#5a554c}
.b-moderator.modin{animation:modin .45s ease both}
@keyframes modin{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
/* v2.2b — wizualne wcięcie w słowo: bąbel wcinający LEKKO NACHODZI na urwaną turę (wchodzi w słowo),
   siada na wierzchu (późniejszy w DOM + z-index) z miękkim cieniem, urwany myślnik wyblakły. */
.bubble.cutoff{margin-bottom:0;padding-bottom:20px}
.bubble.cutin{margin-top:-15px;z-index:2;box-shadow:0 -3px 10px rgba(0,0,0,.07),0 1px 3px rgba(0,0,0,.06)}
.bubble .cutdash{opacity:.8}
/* roboczy status serwera głosu w oknie „Uruchom" (budzę… / gotowy / obudzony (X s)) */
.scWake{font-size:12px;color:var(--muted);text-align:center;margin:8px 0 0;min-height:1.1em}
.scVoxRow{font-size:12px;color:var(--muted);text-align:center;line-height:1.35}
.scRow.scCost .scCostItem{font-weight:400;margin-top:2px}   /* koszt: nagłówek pogrubiony, pozycje (Agenci AI / Odsłuch audio) w osobnych wierszach */
.modbar{display:flex;flex-direction:column;gap:8px;width:100%}
.modmemo{width:100%;border:1px solid var(--line);border-radius:11px;padding:10px 12px;font:inherit;font-size:14px;background:#fff;resize:none;overflow:hidden;line-height:1.45;min-height:52px;color:var(--ink)}
.modmemo:focus{outline:none;border-color:var(--line)}
.modfoot{display:flex;align-items:center;gap:12px}
.modcnt{margin-left:auto;font-size:12.5px;color:var(--muted)}
.modmsg{font-size:12.5px;line-height:1.4;color:var(--op1)}   /* komunikat blokady kwestii Moderatora (czerwień jak .msg.err) */
.modmsg:empty{display:none}
.stepseg button{padding-top:6px;padding-bottom:6px}   /* segment Zwykły/Krokowy ~5% wyższy */
/* Wskaźnik „myślę" agenta: trzy czarne falujące kropki. */
.dots{display:inline-flex;gap:4px;align-items:flex-end;margin-left:4px;vertical-align:1px}
.dots i{width:5px;height:5px;border-radius:50%;background:var(--ink);animation:dotwave 1.1s ease-in-out infinite}
.dots i:nth-child(2){animation-delay:.16s}
.dots i:nth-child(3){animation-delay:.32s}
@keyframes dotwave{0%,60%,100%{transform:translateY(0);opacity:.35} 30%{transform:translateY(-5px);opacity:1}}
.livectrl{flex:none;display:flex;gap:8px;justify-content:flex-end;padding:10px 18px 20px}   /* pasek przyklejony do dołu panelu (stopka pod przewijanymi wiadomościami); Pauza/Wznów po prawej; +10px odstępu od dolnej krawędzi */
.livemsg{font-size:12.5px;color:var(--op1);margin-top:8px}

/* panel pomocy */
.helpBackdrop{position:fixed;inset:0;background:rgba(0,0,0,.25);z-index:49;opacity:0;pointer-events:none;transition:.25s}
.helpBackdrop.open{opacity:1;pointer-events:auto}
.helpPanel{position:fixed;top:0;right:0;bottom:0;width:552px;max-width:92vw;background:#fff;border-left:1px solid var(--line);box-shadow:-8px 0 30px rgba(0,0,0,.12);z-index:50;transform:translateX(100%);transition:.25s;overflow:auto;padding:0}
@media (max-width:859px){ .helpPanel{width:100vw;max-width:100vw} }
.helpPanel.open{transform:none}
.helpPanel h2{font-size:16px;margin:0 0 8px} .helpPanel h3{font-size:13px;margin:16px 0 3px}
.helpPanel p{font-size:12.5px;color:#5a554c;margin:3px 0;line-height:1.5}
.helpdl{list-style:none;padding:0;margin:4px 0 0}
.helpdl li{font-size:12.5px;color:#5a554c;margin:4px 0;line-height:1.45;display:flex;gap:2px;flex-wrap:wrap;align-items:baseline}
.helpdl .k{color:var(--ink)}
.helpdl li .dot{align-self:center;margin-right:6px}
.verfoot{text-align:center;font-size:12.5px;color:var(--muted);padding:30px 0 14px;letter-spacing:.3px}
.histActions{display:flex;gap:8px;margin-top:22px;flex-wrap:wrap;justify-content:flex-end}
.confirmBackdrop{position:fixed;inset:0;background:rgba(0,0,0,.25);z-index:60;display:flex;align-items:center;justify-content:center;padding:20px;animation:bdIn .16s ease}
.confirmCard{background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);max-width:360px;width:100%;padding:22px 22px 18px;animation:cardIn .18s ease}
@keyframes bdIn{from{opacity:0}to{opacity:1}}
@keyframes cardIn{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.confirmBackdrop,.confirmCard{animation:none}}
.confirmCard p{font-size:14px;color:var(--ink);margin:0 0 18px;line-height:1.5}
.confirmCard .row{display:flex;justify-content:flex-end;gap:10px}
.startCard{max-width:368px;text-align:left}
.startCard .scHead{font-weight:600;font-size:15px;margin-bottom:12px}
.startCard .scBody{margin-bottom:16px}
.startCard .scRow{font-size:13px;color:var(--ink);margin:7px 0;line-height:1.45;overflow-wrap:anywhere}
.startCard .scRow b{color:var(--ink)}
.startCard .scRow.scDebateLbl{margin:3px 0 0;padding-left:7px}           /* „Debata": wyrównana do „Koszt" (7px) + mały odstęp od górnej krawędzi. Specyficzność .scRow.scDebateLbl > .scRow, inaczej .scRow{margin:18px} nadpisywało */
.startCard .scDebateLbl+.scThesis{margin:6px 0 16px}                     /* teza: 6px pod „Debata", 16px do separatora (nadpisuje .scRow{margin:18px}) */
.startCard .scThesis{font-style:italic;font-size:16px;font-weight:400;padding-left:7px}   /* teza: kursywa + większa czcionka, w cudzysłowie; wyrównana z „Debata"/„Koszt" */
.startCard .scWarn{background:var(--hl);border-radius:8px;padding:7px 9px;color:var(--soft)}
.startCard .scCost{margin-top:10px;border-top:1px solid var(--line);padding-top:10px}
/* Okno „Uruchom": teza+koszt luźno; temperatura i audio jako ULOTNE paski na całą szerokość */
.startCard .scRow{margin:18px 0}
.startCard .scCost{margin-top:16px;padding-top:19px;padding-left:7px}   /* „Koszt": wyrównany w lewo z „Temperatura sporu"; odstęp teza→separator 16px, separator→Koszt 19px; kreska na całą szerokość */
.startCard .scWarn{margin:14px 0}
.startCard .scHeat{margin-top:44px}
.startCard .scBody+.scHeat{margin-top:34px}                                   /* odstęp koszt → pierwsza kontrolka (Temperatura) */
.startCard .scHeat>label{display:block;font-size:13px;margin:0 0 11px 7px}     /* etykieta „Temperatura sporu" minimalnie w prawo */
.startCard .scHeat .seg2.heatseg{width:100%}
.startCard .scHeat .rhint{text-align:center;margin:11px 0 0;line-height:1.4}   /* opis poziomu temperatury zawija się w pełni (pełne zdania po wydłużeniu w ETAP 2 Krok 4) */
.startCard .scAudioSeg button{text-transform:lowercase}                        /* „audio włączone/wyłączone" małą literą */
.startCard .scHeat+.expBtns{margin-top:52px}
/* Modal „O aplikacji" — nagłówek + marka + rozwijane kafelki-wyspy (rozszerza .confirmCard) */
.aboutCard{position:relative;max-width:460px;text-align:left;padding:26px 18px 14px;max-height:84vh;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--line) transparent}   /* cienki jasnoszary pasek — jak Przewodnik/mainbody */
.aboutClose{position:absolute;top:26px;right:18px;border:0;background:none;color:var(--muted);font-size:13.5px;cursor:pointer;text-decoration:underline;padding:2px 0}   /* pozycja jak wcześniej (prawy górny róg); tytuł O aplikacji + separator usunięte */
.aboutBrand{display:flex;align-items:center;gap:14px;padding:2px 56px 14px 2px;border-bottom:1px solid var(--line);margin-bottom:12px}   /* ikona/tytuł/wersja podsunięte do góry; padding-right = miejsce na „zamknij" */
.aboutBrand svg{width:52px;height:52px;flex:none;border-radius:12px}
.aboutName{font-weight:600;font-size:19px;line-height:1.2}
.aboutAI{margin-left:.3em}
.aboutVer{font-size:12px;color:var(--muted);margin-top:3px}
.aboutVerLine{color:var(--muted);font-size:12.5px;margin-top:8px}   /* nr wersji przeniesiony do kafla „Technologia" */
.aboutTile{border:1px solid var(--line);border-radius:12px;background:var(--card);margin-bottom:10px;overflow:hidden}
.aboutTile summary{list-style:none;cursor:pointer;padding:13px 15px;font-size:16px;color:var(--ink);display:flex;justify-content:space-between;align-items:center}   /* menu 1. poziomu */
.aboutTile summary::-webkit-details-marker{display:none}
.aboutTile summary::after{content:"›";color:var(--muted);transition:transform .2s;margin-left:10px;font-size:16px}
.aboutTile[open] summary::after{transform:rotate(90deg)}
.aboutTileBody{padding:0 15px 13px;font-size:13px;color:var(--soft);line-height:1.55}
.aboutTileBody p{margin:0 0 8px} .aboutTileBody p:last-child{margin:0}
.aboutTileBody a{color:var(--op2);text-decoration:none}
.aboutTileBody ul{margin:4px 0 0;padding-left:18px} .aboutTileBody li{margin:2px 0}
.aboutTileBody .btn{margin-top:2px}
.aboutlink{color:var(--muted);text-decoration:underline;cursor:pointer}
.loginAboutRow{text-align:center;margin-top:14px;font-size:12.5px}
/* Modal eksportu — chipy ✓ (format + zawartość) w jednym oknie */
.expCard{max-width:368px;text-align:left;padding:14px 20px 24px}
.expLbl{font-size:12.5px;color:var(--muted);padding-left:15px;margin:6px 0 0}
.expLbl.expLbl2{margin-top:26px}
.expChips{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.expChip{display:inline-flex;align-items:center;justify-content:flex-start;text-align:left;border:1px solid var(--line);background:#faf8f3;color:var(--ink);border-radius:999px;padding:7px 15px;font-size:12.5px;cursor:pointer;font-family:inherit}
.expChip::before{content:"✓";width:13px;flex:none;margin-right:7px;text-align:center;visibility:hidden}
.expChip.on{background:var(--hl);color:var(--ink);border-color:var(--btn-br)}
.expChip.on::before{visibility:visible}
.expChip.absent{opacity:.55;pointer-events:none}
.expChip.fixed{cursor:default}   /* chip stały (zawsze eksportowany) — wygląda „on", ale nieklikalny */
.impFname{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px;color:var(--soft);padding-left:6px;margin:4px 0 26px;word-break:normal;overflow-wrap:normal;line-height:1.4}
.expFnameMid{margin:16px 0 34px}
.expCard > .expChips[data-row="fmt"]{margin-top:16px}
.expScope .expChip{grid-column:1}
.expScope.off{opacity:.5;pointer-events:none}
.expBtns{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:32px}
.expBtns .btn{padding-top:7px;padding-bottom:7px;text-align:center}
/* Modal „Sortuj i filtruj" — dwie kolumny w karcie .expCard */
.sfCols{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:14px 0 2px}
.sfCol{display:flex;flex-direction:column;gap:6px}
.sfHead{font-size:12.5px;color:var(--muted);margin-bottom:2px}
.sfOpt{display:flex;align-items:center;justify-content:space-between;gap:8px;text-align:left;border:1px solid var(--line);background:#faf8f3;color:var(--ink);border-radius:8px;padding:7px 10px;font-size:12.5px;cursor:pointer;font-family:inherit}
.sfOpt:hover{background:var(--hl)}
.sfOpt.on{background:var(--btn-hv);border-color:var(--btn-br)}
.sfCount{color:var(--muted);font-size:12.5px;font-variant-numeric:tabular-nums;flex:none}
/* Pas „Temperatura sporu" — pełna szerokość pod kolumnami, skala zimno→gorąco (licznik pod etykietą) */
.sfHeatRow{margin:14px 0 2px}
.sfHeatRow .sfHead{margin-bottom:6px}
.sfHeatOpts{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
/* Przyciski temperatury: DWUSTANOWE (wielokrotny wybór), każdy 1/4 szerokości; ptaszek u góry = zaznaczony (miejsce zarezerwowane, by wysokość nie skakała) */
.heatTog{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border:1px solid var(--line);background:#faf8f3;color:var(--ink);border-radius:8px;padding:6px 4px;font-size:12.5px;cursor:pointer;font-family:inherit;text-align:center}
.heatTog:hover{background:var(--hl)}
.heatTog.on{background:var(--btn-hv);border-color:var(--btn-br)}
.heatTog .htCheck{visibility:hidden;font-weight:700;line-height:1;font-size:12.5px}
.heatTog.on .htCheck{visibility:visible}
.heatTog .sfCount{color:var(--muted)}
/* Telemetria — tabelki (proxy strukturalny + próbki jakości): wyrównane kolumny liczb, nagłówki wyszarzone */
.telTab{width:100%;border-collapse:collapse;font-size:13px;margin:2px 0}   /* fonty jak w Temperaturze/Głosach */
.telTab th{font-weight:400;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.03em;text-align:right;padding:0 0 8px;white-space:nowrap}
.telTab th:first-child{text-align:left}
.telTab td{padding:9px 0;border-top:1px solid var(--line);text-align:right;font-variant-numeric:tabular-nums;color:var(--ink)}
.telTab td:first-child{text-align:left;font-size:15px}   /* nazwy poziomów jak w Temperaturze (.haName 15px) */
.telTab td.telEmpty{text-align:center;color:var(--muted)}
.telFoot{font-size:12px;margin-top:5px}
.histsort.filtered::after{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--ink);margin-left:7px;vertical-align:middle}
.helpPanel .helpfoot{margin-top:32px;padding-top:12px;border-top:1px solid var(--line);font-size:12.5px;color:var(--muted);text-align:left;line-height:1.7}
.helpfoot a{color:var(--muted)}
/* Lista parametrów: bullety, nazwa ciemna, opis w tej samej linii (bez łamania po nazwie). */
.helpdl.bul{list-style:disc;padding-left:18px}
.helpdl.bul li{display:list-item;flex-wrap:nowrap;margin:5px 0}
.helpdl.bul li::marker{color:var(--neutral)}
.helpdl.bul .k{color:var(--ink)}
/* PRZEWODNIK — sticky-nagłówek (wróć ← / marka + wersja po prawej), wyszukiwarka z nawigacją, TOC, akordeon */
.pvSticky{position:sticky;top:0;z-index:5;background:#fff;padding:calc(var(--ico)/2) 20px 10px calc(var(--ico)/2 - 1px);border-bottom:1px solid var(--line)}   /* odstępy ikony od góry/lewej jak w pasku aplikacji (--ico/2); −1px = lewy border panelu */
.pvBar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:25px}
.pvBack{font-size:13px;color:#1f3a68;cursor:pointer;text-decoration:none;white-space:nowrap;flex:none}
.pvBack:hover{text-decoration:underline;color:#12244a}
.pvBrand{display:flex;align-items:center;gap:0;min-width:0}                 /* ikona + tytuł jak w pasku aplikacji */
.pvBrand .logo{width:var(--ico,41px);height:var(--ico,41px)}               /* ikona identyczna jak w pasku aplikacji (.logo), border-radius z bazowego .logo */
.pvBrandTxt{display:flex;flex-direction:column;min-width:0;line-height:1.15}
.pvH{display:inline-flex;align-items:baseline;min-width:0}
.pvWm{font-size:25px;font-weight:400;line-height:1;letter-spacing:0;margin-left:calc(var(--ico)/2)}   /* „Debata” jak .wm w aplikacji */
.pvSub{font-size:25px;font-weight:400;line-height:1;color:var(--ink);white-space:nowrap}
.pvSub::before{content:"\00a0\2013\00a0"}                                   /* separator jak w tagline aplikacji */
.pvVer{font-size:12.5px;color:var(--muted);margin-left:calc(var(--ico)/2);margin-top:3px}
@media(max-width:430px){ .pvWm,.pvSub{font-size:20px} }                     /* wąskie ekrany: tytuł mieści się w jednym wierszu */
.pvSearch{display:flex;align-items:center;gap:8px}
.pvSearchIn{flex:0 0 50%;min-width:0}
#pvSearch{width:100%;box-sizing:border-box;padding:8px 11px;border:1px solid var(--line);border-radius:8px;background:var(--card);font:inherit;font-size:13px;color:var(--ink)}
#pvSearch:focus{outline:none;border-color:var(--btn-br)}
.pvSearchNav{flex:1;display:flex;align-items:center;gap:5px;min-width:0}
.pvClr,.pvNav{width:32px;height:32px;flex:none;border:1px solid var(--line);background:var(--btn-bg);border-radius:8px;color:var(--muted);font-size:15px;line-height:1;cursor:pointer;font-family:inherit;display:flex;align-items:center;justify-content:center}
.pvClr:hover,.pvNav:hover:not(:disabled){background:var(--btn-hv);color:var(--ink)}
.pvNav:disabled{opacity:.35;cursor:default}
.pvSearch:has(#pvSearch:placeholder-shown) .pvClr{opacity:.35;pointer-events:none}
.pvCount{margin-left:auto;font-size:12.5px;color:var(--muted);white-space:nowrap;text-align:right;min-width:46px}
.pvContent{padding:14px 20px 28px}
.pvToc{columns:2;column-gap:18px;margin:0 0 14px;padding:0 0 14px;border-bottom:1px solid var(--line)}
.pvTocA{display:block;break-inside:avoid;font-size:13.5px;color:#1f3a68;cursor:pointer;padding:3px 0;line-height:1.35;border-bottom:1px dotted transparent;width:max-content;max-width:100%}
.pvTocA:hover{color:#12244a;border-bottom-color:var(--muted)}
.pvSec{border-bottom:1px solid var(--line);scroll-margin-top:100px}
.pvSec:last-child{border-bottom:0}   /* bez podwójnego separatora przed stopką (footer ma własny border-top) */
.pvHead{width:100%;display:flex;align-items:center;gap:10px;padding:12px 2px;border:0;background:transparent;font:inherit;font-size:13.5px;font-weight:600;color:var(--ink);cursor:pointer;text-align:left}
.pvHead .pvT{flex:1}
.pvChev{color:var(--muted);transition:transform .2s}
.pvSec.open .pvChev{transform:rotate(90deg)}
.pvBody{overflow:hidden}
.pvInner{padding:0 0 10px}
mark.pvHi{background:var(--kibic);color:#3a2a08;border-radius:3px;padding:0 1px}
mark.pvHi.cur{background:#e58f00;color:#fff;outline:2px solid var(--ink);outline-offset:1px}   /* bieżące trafienie — wyróżnione bursztynem (czerwień/niebieski zarezerwowane dla oponentów) */
.pvInner>*:first-child{margin-top:0}
.pvBody p{font-size:12.5px;color:#5a554c;margin:0 0 8px;line-height:1.55}
.pvBody p:last-child{margin-bottom:8px}
/* Treść dokumentacji (SPEC → HTML): tabele, kod, cytaty, śródtytuły — scoped do panelu pv */
.pvInner table{border-collapse:collapse;width:100%;margin:10px 0;font-size:12.5px}
.pvInner th,.pvInner td{border:1px solid var(--line);padding:6px 9px;text-align:left;vertical-align:top;line-height:1.45}
.pvInner th{background:var(--hl);font-weight:600;color:var(--ink)}
.pvInner td{color:#5a554c}
.pvInner code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--hl);border-radius:4px;padding:1px 5px;font-size:12px}
.pvInner pre{background:var(--hl);border:1px solid var(--line);border-radius:8px;padding:10px 12px;overflow-x:auto;margin:10px 0}
.pvInner pre code{background:none;padding:0;font-size:12px;white-space:pre;line-height:1.5}
.pvInner blockquote{border-left:3px solid var(--btn-br);margin:10px 0;padding:3px 0 3px 12px;color:var(--soft)}
.pvInner blockquote br{display:block;content:"";margin-top:4px}
.pvInner h4{font-size:14px;font-weight:600;margin:14px 0 6px;color:var(--ink)}
.pvInner h5{font-size:13px;font-weight:600;margin:10px 0 4px;color:var(--ink)}
.pvInner ol{margin:2px 0 8px;padding-left:20px}
.pvInner ul{margin:2px 0 8px;padding-left:18px}
.pvInner li{font-size:12.5px;color:#5a554c;margin:4px 0;line-height:1.5}
.pvInner a{color:var(--op2);text-decoration:none}
.pvUp{position:fixed;bottom:22px;right:22px;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:var(--btn-bg);color:var(--soft);font-size:18px;line-height:1;display:none;align-items:center;justify-content:center;cursor:pointer;box-shadow:var(--shadow);z-index:52}
.helpPanel.open .pvUp{display:flex}
.helpPanel.acctWin .pvUp{display:none}            /* okna Moje konto/Panel admina: „↑" dopiero po zapełnieniu (przewinięciu) okna */
.helpPanel.acctWin.filled .pvUp{display:flex}
/* Dłuższe podtytuły („panel administratora") niż w Przewodniku/Dokumentacji — pozwól tytułowi zawinąć, „← wróć" trzymaj w prawym górnym rogu (nie nachodzą na siebie). Tylko te okna. */
.helpPanel.acctWin .pvBar{align-items:flex-start}
.helpPanel.acctWin .pvBack{margin-top:5px}   /* „← wróć" obniżone o 5px */
.helpPanel.acctWin .pvBrand{flex:1 1 auto;min-width:0}
.helpPanel.acctWin .pvH{flex-wrap:wrap}
.pvUp:hover{background:var(--btn-hv);color:var(--ink)}
.gul{margin:2px 0 8px;padding-left:18px}
.gul li{font-size:12.5px;color:#5a554c;margin:4px 0;line-height:1.45}
.gul li b{color:var(--ink);font-weight:600}
.gul li::marker{color:var(--neutral)}
.gdots{list-style:none;margin:2px 0 8px;padding:0}
.gdots li{font-size:12.5px;color:#5a554c;margin:5px 0;display:flex;align-items:center;gap:8px}