/* ============================================================
   Projekt X — design „Sklo — Linie" (G2), čtyři vzhledy
   V galerii (od světlých po tmavé, anglické názvy od 5. 9. 2026):
   light = „Porcelain" (světlý, výchozí) · lavender = „Lavender Haze" (světlý, levandulová plocha, indigový akcent) ·
   cream = „Champagne" (světlý, krémová plocha, jantarový akcent) · dark = „Obsidian" (liquid black glass) ·
   violet = „Amethyst" (liquid glass s levandulovou aurorou) ·
   gold = „Black Gold" (liquid glass se zlatou aurorou; primární tlačítko má tmavý text --prim-ink).
   Přepíná se atributem <html data-theme="light|dark|lavender|violet|cream|gold">;
   volba uživatele v Nastavení → Vzhled aplikace.
   ============================================================ */

/* ---------- tokeny: SVĚTLÝ (výchozí) ---------- */
:root {
  --ink: #1d1d1f;            /* primární text */
  --mut: #6e6e73;            /* sekundární text */
  --faint: #9a9aa1;          /* mikro popisky, ikony */
  --dim: #72727c;            /* pomlčky, potlačené — 26. 9. 2026: ztmaveno z #a4a4aa (2,5:1) na ≥ 4,5:1 vůči bílé (přístupnost) */
  --line: #d2d2d7;           /* plné rámečky (inputy, tlačítka) */
  --hair: #c9cdd6;           /* vlásenkové linky */
  --acc: #2f6fed;            /* akcent (odkazy, aktivní, primární) */
  --acc-soft: rgba(47,111,237,0.08);
  --ok: #257a4a;  --ok-bg: rgba(46,125,79,0.10);  --ok-dot: #34a065;
  --err: #b8433a; --err-bg: rgba(217,74,63,0.10); --err-dot: #d94a3f;
  --warn: #b06514; --warn-bg: rgba(196,123,42,0.12); --warn-dot: #cf8a2f;
  --warn-line: #d9b25e; --err-line: #d98a83;
  --neu-bg: rgba(110,110,115,0.10);
  --well: #f4f2ee;           /* vnořené plochy (editační pásy) */
  --track: #e2e5ec;          /* dráhy progress barů */
  --hl: #fdf9f0;             /* zvýrazněný řádek (dnes) */
  --panel: #ffffff;          /* plné panely (modaly) */
  --card-bg: rgba(255,255,255,0.62);
  --card-line: rgba(255,255,255,0.75);
  --card-shadow: 0 10px 30px rgba(29,29,31,0.07), inset 0 1px 0 rgba(255,255,255,0.9);
  --btn-bg: rgba(255,255,255,0.72);
  --btn-line: #d2d2d7;
  --btn-shadow: 0 2px 8px rgba(29,29,31,0.05), inset 0 1px 0 rgba(255,255,255,0.9);
  --input-bg: rgba(255,255,255,0.8);
  --sb-bg: rgba(255,255,255,0.5);
  --sb-edge: #c9cdd6;
  --logo-g0: #2a5fd6; --logo-g1: #5d93ff; --logo-glyph: #ffffff; --logo-sh: rgba(47,111,237,0.28); --logo-edge: transparent;   /* ikona loga v barvě vzhledu (Marco 11. 9. 2026) */
  --sn-on-bg: rgba(255,255,255,0.85);
  --sn-on-shadow: 0 4px 12px rgba(29,29,31,0.06), inset 0 1px 0 rgba(255,255,255,0.95);
  --prim-bg: #2f6fed;
  --prim-ink: #ffffff;       /* text na primárním tlačítku (zlaté sklo ho má tmavý) */
  --prim-shadow: 0 8px 18px rgba(47,111,237,0.30), inset 0 1px 0 rgba(255,255,255,0.35);
  --body-bg: radial-gradient(900px 520px at 78% -12%, rgba(47,111,237,0.055), transparent 62%),
             radial-gradient(760px 460px at 6% 110%, rgba(47,111,237,0.045), transparent 62%),
             linear-gradient(180deg, #fbfbfd 0%, #eef1f7 100%);
  /* zpětná kompatibilita se staršími inline styly */
  --bg: #f2f3f7;
  --bar: #fbfcfe;   /* stavový řádek telefonu = změřená barva hlavičky .mhead vzhledu (#px_bar, viz mobilní brána) */
}

/* ---------- tokeny: TMAVÝ (liquid black glass) ---------- */
html[data-theme="dark"] {
  --ink: #f5f5f7;
  --mut: #a8a8b0;
  --faint: #7a7a84;
  --dim: #8a8a96;            /* 26. 9. 2026: zesvětleno z #5f5f6a (kontrast na tmavém pozadí ≥ 4,5:1) */
  --line: rgba(255,255,255,0.16);
  --hair: rgba(255,255,255,0.16);
  --acc: #7da6ff;
  --acc-soft: rgba(125,166,255,0.12);
  --ok: #5bd68a;  --ok-bg: rgba(48,209,88,0.13);  --ok-dot: #30d158;
  --err: #ff6b60; --err-bg: rgba(255,69,58,0.14); --err-dot: #ff453a;
  --warn: #f0a03a; --warn-bg: rgba(255,159,10,0.14); --warn-dot: #ff9f0a;
  --warn-line: rgba(255,159,10,0.45); --err-line: rgba(255,69,58,0.45);
  --neu-bg: rgba(255,255,255,0.11);
  --well: rgba(255,255,255,0.06);
  --track: rgba(255,255,255,0.12);
  --hl: rgba(125,166,255,0.07);
  --panel: #1c1c24;
  --card-bg: linear-gradient(118deg, rgba(255,255,255,0.14) 0%, rgba(255,255,255,0.055) 26%, rgba(255,255,255,0.03) 58%, rgba(255,255,255,0.07) 100%);
  --card-line: rgba(255,255,255,0.18);
  --card-shadow: 0 18px 44px rgba(0,0,0,0.5), 0 2px 8px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.25), inset 0 -1px 0 rgba(255,255,255,0.06);
  --btn-bg: linear-gradient(120deg, rgba(255,255,255,0.15) 0%, rgba(255,255,255,0.06) 100%);
  --btn-line: rgba(255,255,255,0.22);
  --btn-shadow: 0 4px 12px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.22);
  --input-bg: rgba(255,255,255,0.07);
  --sb-bg: linear-gradient(180deg, rgba(255,255,255,0.10) 0%, rgba(255,255,255,0.035) 42%, rgba(255,255,255,0.055) 100%);
  --sb-edge: rgba(255,255,255,0.16);
  --logo-g0: #1b3a85; --logo-g1: #3a6ad0; --logo-glyph: #ffffff; --logo-sh: rgba(0,0,0,0.45); --logo-edge: rgba(255,255,255,0.22);   /* Obsidian: hluboká modř (Marco 11. 9. 2026, varianta A) */
  --sn-on-bg: linear-gradient(120deg, rgba(255,255,255,0.18) 0%, rgba(255,255,255,0.07) 100%);
  --sn-on-shadow: 0 6px 16px rgba(0,0,0,0.45), inset 0 1px 0 rgba(255,255,255,0.28);
  --prim-bg: linear-gradient(180deg, #5c93ff 0%, #2f6bf0 100%);
  --prim-shadow: 0 12px 28px rgba(61,123,255,0.50), 0 2px 8px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.38);
  --body-bg: linear-gradient(112deg, rgba(255,255,255,0.05) 0%, rgba(255,255,255,0.012) 30%, transparent 46%),
             radial-gradient(860px 520px at 78% -12%, rgba(72,138,255,0.30), transparent 60%),
             radial-gradient(720px 480px at 3% 112%, rgba(118,88,255,0.24), transparent 62%),
             radial-gradient(560px 400px at 30% 16%, rgba(56,178,255,0.12), transparent 58%),
             radial-gradient(620px 440px at 97% 74%, rgba(64,120,255,0.13), transparent 62%),
             linear-gradient(180deg, #10101a 0%, #060609 100%);
  --bg: #0b0b10;
  --bar: #262736;
  color-scheme: dark;
}

/* ---------- tokeny: JEMNÁ LEVANDULE (světlý, dle plátna „vzhled Levandule" B) ---------- */
html[data-theme="lavender"] {
  --ink: #1c173d;
  --mut: #5c567e;
  --faint: #8b84ab;
  --dim: #665e88;            /* 26. 9. 2026: kontrast (bylo #a29bc1) */
  --line: #cdc2e3;
  --hair: #cbbfe6;
  --acc: #2e2fb4;            /* indigo z předlohy „ciao" */
  --acc-soft: rgba(46,47,180,0.08);
  --neu-bg: rgba(92,86,126,0.10);
  --well: #f1ecfa;
  --track: #e0d7f1;
  --hl: #f8f3ff;
  --panel: #ffffff;
  --card-bg: rgba(255,255,255,0.62);
  --card-line: rgba(255,255,255,0.75);
  --card-shadow: 0 10px 30px rgba(44,26,96,0.09), inset 0 1px 0 rgba(255,255,255,0.9);
  --btn-bg: rgba(255,255,255,0.72);
  --btn-line: #cdc2e3;
  --btn-shadow: 0 2px 8px rgba(44,26,96,0.06), inset 0 1px 0 rgba(255,255,255,0.9);
  --input-bg: rgba(255,255,255,0.8);
  --sb-bg: rgba(255,255,255,0.5);
  --sb-edge: #cbbfe6;
  --logo-g0: #2e2fb4; --logo-g1: #6d6ee6; --logo-glyph: #ffffff; --logo-sh: rgba(46,47,180,0.28); --logo-edge: transparent;
  --sn-on-bg: rgba(255,255,255,0.85);
  --sn-on-shadow: 0 4px 12px rgba(44,26,96,0.07), inset 0 1px 0 rgba(255,255,255,0.95);
  --prim-bg: #2e2fb4;
  --prim-shadow: 0 8px 18px rgba(46,47,180,0.30), inset 0 1px 0 rgba(255,255,255,0.35);
  --body-bg: radial-gradient(900px 540px at 78% -12%, rgba(255,255,255,0.55), transparent 60%),
             radial-gradient(760px 480px at 4% 110%, rgba(150,110,235,0.20), transparent 62%),
             radial-gradient(600px 420px at 96% 78%, rgba(240,170,220,0.16), transparent 60%),
             linear-gradient(180deg, #f4effc 0%, #e3d9f5 100%);
  --bg: #ebe3f7;
  --bar: #f9f5fe;
}

/* ---------- tokeny: TMAVÉ FIALOVÉ SKLO (liquid glass, dle plátna „vzhled Levandule" C) ---------- */
html[data-theme="violet"] {
  --ink: #f5f2fb;
  --mut: #b4accb;
  --faint: #877ea1;
  --dim: #9089ad;            /* 26. 9. 2026: kontrast (bylo #645b80) */
  --line: rgba(255,255,255,0.16);
  --hair: rgba(255,255,255,0.16);
  --acc: #c2b0ff;
  --acc-soft: rgba(194,176,255,0.12);
  --ok: #5bd68a;  --ok-bg: rgba(48,209,88,0.13);  --ok-dot: #30d158;
  --err: #ff6b60; --err-bg: rgba(255,69,58,0.14); --err-dot: #ff453a;
  --warn: #f0a03a; --warn-bg: rgba(255,159,10,0.14); --warn-dot: #ff9f0a;
  --warn-line: rgba(255,159,10,0.45); --err-line: rgba(255,69,58,0.45);
  --neu-bg: rgba(255,255,255,0.11);
  --well: rgba(255,255,255,0.06);
  --track: rgba(255,255,255,0.12);
  --hl: rgba(194,176,255,0.07);
  --panel: #1e1631;
  --card-bg: linear-gradient(118deg, rgba(255,255,255,0.14) 0%, rgba(255,255,255,0.055) 26%, rgba(255,255,255,0.03) 58%, rgba(255,255,255,0.07) 100%);
  --card-line: rgba(255,255,255,0.18);
  --card-shadow: 0 18px 44px rgba(0,0,0,0.5), 0 2px 8px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.25), inset 0 -1px 0 rgba(255,255,255,0.06);
  --btn-bg: linear-gradient(120deg, rgba(255,255,255,0.15) 0%, rgba(255,255,255,0.06) 100%);
  --btn-line: rgba(255,255,255,0.22);
  --btn-shadow: 0 4px 12px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.22);
  --input-bg: rgba(255,255,255,0.07);
  --sb-bg: linear-gradient(180deg, rgba(255,255,255,0.10) 0%, rgba(255,255,255,0.035) 42%, rgba(255,255,255,0.055) 100%);
  --sb-edge: rgba(255,255,255,0.16);
  --logo-g0: #3a2688; --logo-g1: #6b4fd0; --logo-glyph: #ffffff; --logo-sh: rgba(0,0,0,0.45); --logo-edge: rgba(255,255,255,0.22);   /* Amethyst: hluboká fialová (varianta A) */
  --sn-on-bg: linear-gradient(120deg, rgba(255,255,255,0.18) 0%, rgba(255,255,255,0.07) 100%);
  --sn-on-shadow: 0 6px 16px rgba(0,0,0,0.45), inset 0 1px 0 rgba(255,255,255,0.28);
  --prim-bg: linear-gradient(180deg, #a88fff 0%, #6d4de8 100%);
  --prim-shadow: 0 12px 28px rgba(139,108,255,0.50), 0 2px 8px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.38);
  --body-bg: linear-gradient(112deg, rgba(255,255,255,0.05) 0%, rgba(255,255,255,0.012) 30%, transparent 46%),
             radial-gradient(860px 520px at 78% -12%, rgba(170,130,255,0.40), transparent 60%),
             radial-gradient(720px 480px at 3% 112%, rgba(120,70,230,0.32), transparent 62%),
             radial-gradient(560px 400px at 30% 16%, rgba(235,150,230,0.14), transparent 58%),
             radial-gradient(620px 440px at 97% 74%, rgba(150,110,255,0.18), transparent 62%),
             linear-gradient(180deg, #181129 0%, #0a0714 100%);
  --bg: #0f0a1c;
  --bar: #31274a;
  color-scheme: dark;
}

/* ---------- tokeny: JEMNÁ ZLATÁ (světlý, dle plátna „Vzhledy Zelená a Zlatá" B2, Marco 5. 9. 2026) ---------- */
html[data-theme="cream"] {
  --ink: #2a2114;
  --mut: #6f6149;
  --faint: #9c8f74;
  --dim: #706548;            /* 26. 9. 2026: kontrast (bylo #b3a78e) */
  --line: #dfd3bb;
  --hair: #e0d5c0;
  --acc: #8f6210;            /* jantarová */
  --acc-soft: rgba(143,98,16,0.08);
  --neu-bg: rgba(111,97,73,0.10);
  --well: #f7f1e4;
  --track: #e9dfc9;
  --hl: #fdf8ec;
  --panel: #ffffff;
  --card-bg: rgba(255,255,255,0.62);
  --card-line: rgba(255,255,255,0.75);
  --card-shadow: 0 10px 30px rgba(80,55,10,0.09), inset 0 1px 0 rgba(255,255,255,0.9);
  --btn-bg: rgba(255,255,255,0.72);
  --btn-line: #dfd3bb;
  --btn-shadow: 0 2px 8px rgba(80,55,10,0.06), inset 0 1px 0 rgba(255,255,255,0.9);
  --input-bg: rgba(255,255,255,0.8);
  --sb-bg: rgba(255,255,255,0.5);
  --sb-edge: #e0d5c0;
  --logo-g0: #8f6210; --logo-g1: #cf9528; --logo-glyph: #ffffff; --logo-sh: rgba(143,98,16,0.28); --logo-edge: transparent;
  --sn-on-bg: rgba(255,255,255,0.85);
  --sn-on-shadow: 0 4px 12px rgba(80,55,10,0.07), inset 0 1px 0 rgba(255,255,255,0.95);
  --prim-bg: #8f6210;
  --prim-shadow: 0 8px 18px rgba(143,98,16,0.30), inset 0 1px 0 rgba(255,255,255,0.35);
  --body-bg: radial-gradient(900px 540px at 78% -12%, rgba(255,255,255,0.55), transparent 60%),
             radial-gradient(760px 480px at 4% 110%, rgba(230,190,90,0.22), transparent 62%),
             radial-gradient(600px 420px at 96% 78%, rgba(250,220,150,0.20), transparent 60%),
             linear-gradient(180deg, #fbf7ee 0%, #efe4cc 100%);
  --bg: #f5eedd;
  --bar: #fdf9f2;
}

/* ---------- tokeny: TMAVÉ ZLATÉ SKLO (liquid glass, dle plátna „Vzhledy Zelená a Zlatá" B) ---------- */
html[data-theme="gold"] {
  --ink: #faf6ee;
  --mut: #c4b89f;
  --faint: #9a8f76;
  --dim: #9c9078;            /* 26. 9. 2026: kontrast (bylo #766c56) */
  --line: rgba(255,255,255,0.16);
  --hair: rgba(255,255,255,0.16);
  --acc: #f2c86a;
  --acc-soft: rgba(242,200,106,0.12);
  --ok: #5bd68a;  --ok-bg: rgba(48,209,88,0.13);  --ok-dot: #30d158;
  --err: #ff6b60; --err-bg: rgba(255,69,58,0.14); --err-dot: #ff453a;
  --warn: #f0a03a; --warn-bg: rgba(255,159,10,0.14); --warn-dot: #ff9f0a;
  --warn-line: rgba(255,159,10,0.45); --err-line: rgba(255,69,58,0.45);
  --neu-bg: rgba(255,255,255,0.11);
  --well: rgba(255,255,255,0.06);
  --track: rgba(255,255,255,0.12);
  --hl: rgba(242,200,106,0.07);
  --panel: #241d10;
  --card-bg: linear-gradient(118deg, rgba(255,255,255,0.14) 0%, rgba(255,255,255,0.055) 26%, rgba(255,255,255,0.03) 58%, rgba(255,255,255,0.07) 100%);
  --card-line: rgba(255,255,255,0.18);
  --card-shadow: 0 18px 44px rgba(0,0,0,0.5), 0 2px 8px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.25), inset 0 -1px 0 rgba(255,255,255,0.06);
  --btn-bg: linear-gradient(120deg, rgba(255,255,255,0.15) 0%, rgba(255,255,255,0.06) 100%);
  --btn-line: rgba(255,255,255,0.22);
  --btn-shadow: 0 4px 12px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.22);
  --input-bg: rgba(255,255,255,0.07);
  --sb-bg: linear-gradient(180deg, rgba(255,255,255,0.10) 0%, rgba(255,255,255,0.035) 42%, rgba(255,255,255,0.055) 100%);
  --sb-edge: rgba(255,255,255,0.16);
  --logo-g0: #7a5a1c; --logo-g1: #bf933a; --logo-glyph: #fbf3dd; --logo-sh: rgba(0,0,0,0.45); --logo-edge: rgba(255,255,255,0.22);   /* Black Gold: staré zlato, krémový znak (varianta A) */
  --sn-on-bg: linear-gradient(120deg, rgba(255,255,255,0.18) 0%, rgba(255,255,255,0.07) 100%);
  --sn-on-shadow: 0 6px 16px rgba(0,0,0,0.45), inset 0 1px 0 rgba(255,255,255,0.28);
  --prim-bg: linear-gradient(180deg, #f3ca62 0%, #cf9528 100%);
  --prim-ink: #231a08;       /* bílý text na zlaté neprojde kontrastem */
  --prim-shadow: 0 12px 28px rgba(230,170,60,0.45), 0 2px 8px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.45);
  --body-bg: linear-gradient(112deg, rgba(255,255,255,0.05) 0%, rgba(255,255,255,0.012) 30%, transparent 46%),
             radial-gradient(860px 520px at 78% -12%, rgba(235,180,70,0.30), transparent 60%),
             radial-gradient(720px 480px at 3% 112%, rgba(200,120,40,0.24), transparent 62%),
             radial-gradient(560px 400px at 30% 16%, rgba(255,220,140,0.11), transparent 58%),
             radial-gradient(620px 440px at 97% 74%, rgba(220,160,60,0.15), transparent 62%),
             linear-gradient(180deg, #1a150c 0%, #090704 100%);
  --bg: #120e07;
  --bar: #332c1d;
  color-scheme: dark;
}

/* ---------- MLÉČNÉ SKLO (návrh A z plátna, Marco 20. 10. 2026): klidná matná skleněná tabule v barvě každého vzhledu ----------
   Místo neprůhledné plochy --well (v Porcelain teple šedobéžová) u rozkliknutých řádků: rezervace, úklid, detail hosta, pravidla oznámení.
   --glass-* = tabule, --glass-in-* = pole formuláře na ní (o stupeň plnější), --glass-row = jemné podbarvení otevřeného řádku.
   --well zůstává pro drobnosti (sekční řádky, víkendy v kalendáři…), kde by rozmazání kalilo mřížku. */
:root {
  --glass-bg: linear-gradient(180deg, rgba(255,255,255,0.74) 0%, rgba(238,244,255,0.58) 100%);
  --glass-filter: blur(28px) saturate(1.7);
  --glass-edge: rgba(255,255,255,0.92);
  --glass-shadow: 0 0 0 1px rgba(36,58,110,0.06), 0 12px 32px rgba(36,58,110,0.08), inset 0 1px 0 #ffffff;
  --glass-in-bg: rgba(255,255,255,0.92);
  --glass-in-line: rgba(36,58,110,0.12);
  --glass-in-shadow: inset 0 1px 2px rgba(29,29,31,0.04);
  --glass-row: rgba(47,111,237,0.06);
}
html[data-theme="lavender"] {
  --glass-bg: linear-gradient(180deg, rgba(255,255,255,0.70) 0%, rgba(243,236,255,0.52) 100%);
  --glass-edge: rgba(255,255,255,0.90);
  --glass-shadow: 0 0 0 1px rgba(44,26,96,0.07), 0 12px 32px rgba(44,26,96,0.10), inset 0 1px 0 #ffffff;
  --glass-in-line: rgba(44,26,96,0.14);
  --glass-row: rgba(46,47,180,0.06);
}
html[data-theme="cream"] {
  --glass-bg: linear-gradient(180deg, rgba(255,255,255,0.72) 0%, rgba(253,244,226,0.54) 100%);
  --glass-edge: rgba(255,255,255,0.90);
  --glass-shadow: 0 0 0 1px rgba(80,55,10,0.07), 0 12px 32px rgba(80,55,10,0.10), inset 0 1px 0 #ffffff;
  --glass-in-line: rgba(80,55,10,0.15);
  --glass-row: rgba(143,98,16,0.07);
}
html[data-theme="dark"], html[data-theme="violet"], html[data-theme="gold"] {
  --glass-filter: blur(30px) saturate(1.6);
  --glass-shadow: 0 16px 40px rgba(0,0,0,0.38), inset 0 1px 0 rgba(255,255,255,0.20), inset 0 -1px 0 rgba(255,255,255,0.04);
  --glass-in-bg: rgba(255,255,255,0.10);
  --glass-in-line: rgba(255,255,255,0.18);
  --glass-in-shadow: inset 0 1px 0 rgba(255,255,255,0.06);
}
html[data-theme="dark"] { --glass-bg: linear-gradient(180deg, rgba(255,255,255,0.09) 0%, rgba(150,175,255,0.04) 100%); --glass-edge: rgba(255,255,255,0.14); --glass-row: rgba(125,166,255,0.10); }
html[data-theme="violet"] { --glass-bg: linear-gradient(180deg, rgba(255,255,255,0.09) 0%, rgba(200,170,255,0.05) 100%); --glass-edge: rgba(255,255,255,0.15); --glass-row: rgba(194,176,255,0.10); }
html[data-theme="gold"] { --glass-bg: linear-gradient(180deg, rgba(255,255,255,0.085) 0%, rgba(255,215,140,0.04) 100%); --glass-edge: rgba(255,255,255,0.14); --glass-row: rgba(242,200,106,0.09); }
.glass-panel { background: var(--glass-bg); -webkit-backdrop-filter: var(--glass-filter); backdrop-filter: var(--glass-filter);
  border: 1px solid var(--glass-edge); box-shadow: var(--glass-shadow); border-radius: 16px; }
/* rozkliknutá rezervace / úklid: buňka průhledná, uvnitř samostatná tabule; otevřený řádek jemně podbarvený */
table.t tr.res-detail > td.glass-td, table.t tr.cln-edit > td.glass-td { background: transparent; border-top: 0; padding: .35rem 0 .7rem; }
table.t tr.res-detail > td.glass-td > .res-fwrap, table.t tr.cln-edit > td.glass-td > .glass-panel { padding: 1rem 1.15rem; }
table.t tr.res-open > td { background: var(--glass-row); }
table.t tr.res-open > td:first-child { border-radius: 12px 0 0 12px; }
table.t tr.res-open > td:last-child { border-radius: 0 12px 12px 0; }
.glass-panel input:not([type=checkbox]):not([type=radio]), .glass-panel select, .glass-panel textarea {
  background: var(--glass-in-bg); border-color: var(--glass-in-line); box-shadow: var(--glass-in-shadow); }
.glass-panel tr.gdet > td { background: var(--glass-row); }
/* osa Odbavení na skle: bez prstence v barvě --well (na skle by udělal neprůhledný kroužek), čára mezi tečkami se přeruší */
.glass-panel .ob-step { border-left: 0; }
.glass-panel .ob-step::before { left: -4px; box-shadow: none; }
.glass-panel .ob-step:not(:last-child)::after { content: ''; position: absolute; left: 0; width: 2px; top: calc(.62em + 14px); bottom: calc(4px - .62em); border-radius: 1px; background: var(--hair); }

/* ---------- základ ---------- */
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }   /* iOS: žádný šedý záblesk při klepnutí (Marco 8. 10. 2026, video) */
html, body { min-height: 100%; }
body {
  margin: 0;
  font: 15px/1.55 'Albert Sans', -apple-system, 'Segoe UI', Roboto, sans-serif;
  color: var(--ink);
  background: var(--body-bg) fixed;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
a { color: var(--acc); text-decoration: none; }
a:hover { text-decoration: underline; }
h1 { font-size: 1.05rem; font-weight: 600; letter-spacing: -0.01em; margin: 0 0 .35rem; }
h2 { font-size: 1.02rem; font-weight: 600; letter-spacing: -0.01em; margin: 1.4rem 0 .6rem; }
.sub { color: var(--mut); font-size: .9rem; margin: 0 0 1.1rem; }
.who { font-size: .8rem; color: var(--mut); font-weight: 400; }
.empty { color: var(--mut); font-size: .92rem; padding: .6rem 0; }

/* ---------- skleněná karta ---------- */
.card {
  background: var(--card-bg);
  backdrop-filter: blur(24px) saturate(1.55);
  -webkit-backdrop-filter: blur(24px) saturate(1.55);
  border: 1px solid var(--card-line);
  border-radius: 16px;
  box-shadow: var(--card-shadow);
  padding: 1.3rem 1.5rem;
  margin-bottom: 1.1rem;
}
.gcard {
  background: var(--well);
  border: 1px solid var(--card-line);
  border-radius: 12px;
  padding: .8rem 1rem;
  margin: .6rem 0;
}

/* ---------- formuláře ---------- */
label { display: block; font-size: .8rem; font-weight: 500; margin: .85rem 0 .3rem; color: var(--mut); }
input, select, textarea {
  width: 100%;
  padding: .6rem .75rem;
  border: 1px solid var(--btn-line);
  border-radius: 10px;
  font: inherit;
  font-size: .95rem;
  color: var(--ink);
  background: var(--input-bg);
}
input:focus, select:focus, textarea:focus {
  outline: 2px solid var(--acc);
  outline-offset: -1px;
  border-color: transparent;
}
/* přepínače a zaškrtávátka (Marco 22. 10. 2026): rámeček pole výše kreslil kolem kolečka čtverec — v okně Odhlásit se hned po otevření (pxDialog
   zaostří první pole), v Chromu i po kliknutí. Rámeček jen při ovládání klávesnicí a u přepínače kulatý. */
input[type="checkbox"]:focus, input[type="radio"]:focus { outline: none; }
input[type="checkbox"]:focus-visible, input[type="radio"]:focus-visible { outline: 2px solid var(--acc); outline-offset: 2px; }
input[type="radio"]:focus-visible { border-radius: 50%; }
input::placeholder, textarea::placeholder { color: var(--faint); }
/* Automatické vyplnění (klíčenka iPhonu, Chrome): prohlížeč dá poli vlastní světle žluté pozadí, písmo ale bere z vzhledu — v tmavém vzhledu
   bylo bílé písmo na žluté nečitelné (Marco 18. 10. 2026). Žlutou překryje vnitřní stín v barvě panelu (musí být neprůhledný), písmo dostane barvu
   vzhledu. Selektor nese stejné :not() jako pravidla polí, jinak by jejich box-shadow (stejná vlastnost) vyhrál. */
input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):-webkit-autofill { -webkit-text-fill-color: var(--ink); caret-color: var(--ink);
  box-shadow: 0 0 0 1000px var(--panel) inset; transition: background-color 9999s 0s; }
input[type="file"] { max-width: 100%; }
input[type="checkbox"], input[type="radio"] { width: auto; accent-color: var(--acc); }
/* jednotná výška všech polí (inputy byly vyšší než selecty) — !important přebíjí
   inline padding u starších selectů v markupu */
input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select {
  height: 2.5rem;
  padding-top: .4rem !important;
  padding-bottom: .4rem !important;
}

/* ---------- tlačítka ---------- */
button {
  width: 100%;
  margin-top: 1.05rem;
  padding: .68rem 1rem;
  border: 0;
  border-radius: 10px;
  background: var(--prim-bg);
  box-shadow: var(--prim-shadow);
  color: var(--prim-ink);
  font: inherit;
  font-size: .95rem;
  font-weight: 600;
  cursor: pointer;
}
@media (hover: hover) { button:hover { filter: brightness(1.06); } }   /* jen s myší — na dotyku by stav „hover“ zůstal viset po klepnutí */
/* přístupnost (26. 9. 2026): viditelný fokus při ovládání klávesnicí u tlačítek, odkazů a přepínačů (glass banery jsou tlačítka);
   pole formulářů mají vlastní zvýraznění rámečkem, proto tu nejsou */
button:focus-visible, a:focus-visible, [role="button"]:focus-visible, [tabindex]:focus-visible { outline: 2px solid var(--acc); outline-offset: 2px; }
.np-head-r button.mini { white-space: nowrap; }
/* import evidenční knihy (26. 9. 2026): mapování sloupců vlevo, náhled hostů vpravo */
.imp-grid { display: grid; grid-template-columns: minmax(360px, 1fr) minmax(0, 1.2fr); gap: 1.2rem; align-items: start; }
@media (max-width: 1100px) { .imp-grid { grid-template-columns: 1fr; } }
.imp-map { width: 100%; }
.imp-map th:nth-child(2), .imp-map td:nth-child(2) { min-width: 200px; }
.imp-map td select { width: 100%; min-width: 190px; }
.imp-map td:nth-child(3) { max-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.imp-prev td, .imp-prev th { white-space: nowrap; }
.imp-prev tr.imp-bad td { color: var(--danger, #b3261e); }
.np-news-item { padding: .9rem 0; border-top: 1px solid var(--line); }
.np-news-item:first-of-type { border-top: 0; padding-top: .4rem; }
.np-news-d { font-size: .82rem; color: var(--mut); display: flex; gap: .5rem; align-items: center; }
.np-news-item h3 { margin: .2rem 0 .35rem; font-size: 1rem; }
.np-news-item ul { margin: 0; padding-left: 1.2rem; }
.np-news-item li { margin: .15rem 0; }
.np-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--acc); vertical-align: middle; margin-left: .35rem; }
button:disabled { opacity: .55; cursor: default; filter: none; }
button.mini { width: auto; margin: 0; padding: .4rem .8rem; font-size: .84rem; border-radius: 9px; }
/* odkaz ve tvaru hlavního (plného) tlačítka — např. „Otevřít portál hosta" v nastavení apartmánu (18. 9. 2026) */
a.a-btn { display: inline-block; padding: .4rem .8rem; border-radius: 9px; background: var(--prim-bg); box-shadow: var(--prim-shadow); color: var(--prim-ink); font-size: .84rem; font-weight: 600; text-decoration: none; }
a.a-btn:hover { filter: brightness(1.06); text-decoration: none; }
button.sec, button.danger {
  background: var(--btn-bg);
  border: 1px solid var(--btn-line);
  box-shadow: var(--btn-shadow);
  color: var(--ink);
  font-weight: 500;
}
button.sec:hover, button.danger:hover { filter: none; border-color: var(--faint); }
button.danger { color: var(--err); }

/* ---------- zprávy, štítky ---------- */
.msg { margin-top: .9rem; padding: .6rem .8rem; border-radius: 10px; font-size: .9rem; display: none; }
.msg.err { display: block; background: var(--err-bg); color: var(--err); }
.msg.ok  { display: block; background: var(--ok-bg);  color: var(--ok); }
.msg.info { display: block; background: var(--warn-bg); color: var(--ink); line-height: 1.45; }  /* informativní hláška (co udělat) */
.msg.warn { display: block; background: var(--warn-bg); border: 1px solid var(--warn-line); color: var(--ink); line-height: 1.45; }
.msg .msg-url { color: inherit; font-weight: 600; text-decoration: underline; overflow-wrap: anywhere; }   /* odkaz v hlášce: přihlášení ve špatném prostředí (superadmin × aplikace, 2. 10. 2026) */
.tag {
  display: inline-block;
  padding: .18rem .6rem;
  border-radius: 999px;
  font-size: .76rem;
  font-weight: 600;
  background: var(--neu-bg);
  color: var(--mut);
  white-space: nowrap;
}
.tag.ok   { background: var(--ok-bg);   color: var(--ok); }
.tag.err  { background: var(--err-bg);  color: var(--err); }
.tag.warn { background: var(--warn-bg); color: var(--warn); }

/* ---------- tabulky ---------- */
table.t { width: 100%; border-collapse: collapse; font-size: .9rem; }
table.t th {
  text-align: left;
  font-size: .67rem;
  text-transform: uppercase;
  letter-spacing: 1.1px;
  font-weight: 600;
  color: var(--faint);
  padding: .45rem .5rem;
  border-bottom: 1px solid var(--hair);
}
table.t td { padding: .55rem .5rem; border-bottom: 1px solid var(--hair); vertical-align: top; }
table.t tr:last-child > td { border-bottom: 0; }
.tscroll { overflow-x: auto; }
.nw { white-space: nowrap; }
/* ⚠️ akční buňka NESMÍ mít display:flex — td by vypadl z tabulkového layoutu
   a spodní linky řádků by nenavazovaly (rozhozené čáry u tlačítek) */
.row-actions { text-align: right; white-space: nowrap; }
.row-actions .mini { margin-left: .4rem; }

/* ---------- onboarding seznam ---------- */
.onb { list-style: none; margin: 0; padding: 0; }
.onb li { display: flex; align-items: center; gap: .6rem; padding: .55rem .5rem; border-bottom: 1px solid var(--hair); }
.onb li:last-child { border-bottom: 0; }
.onb .ic { width: 1.5rem; text-align: center; }
.onb .dis { color: var(--faint); }
.onb .todo-link { margin-left: auto; }
.onb li.lnk { cursor: pointer; border-radius: 9px; }
.onb li.lnk:hover { background: var(--acc-soft); }

/* ---------- Přehled (dashboard „Sklo — Linie") ---------- */
.dash-head { display: flex; align-items: flex-start; gap: 1rem; flex-wrap: wrap; margin-bottom: 1.1rem; }
.dash-hi { font-size: 1.55rem; letter-spacing: -0.02em; margin: 0 0 .15rem; }
.dash-actions { display: flex; gap: .5rem; margin-left: auto; align-items: center; flex-wrap: wrap; }
.dash-intl-i, .dash-edit-i { display: none; }
.dash-edit-i svg { width: 16px; height: 16px; }
/* karta „Vyžaduje pozornost": každé upozornění je proklik k tématu (Marco 17. 9. 2026) */
.warn-go { color: var(--ink); text-decoration: none; border-bottom: 1px dotted var(--faint); cursor: pointer; }
.warn-go:hover, .warn-go:focus { color: var(--acc); border-bottom-color: var(--acc); }
.warn-go-arr { color: var(--acc); font-weight: 600; white-space: nowrap; }
.dash-tiles { margin-bottom: 1.1rem; }
/* mřížka čtverců a 4 velikosti banerů (Marco 27. 10. 2026 večer, návrh 1 „Widgety“) — viz oddíl „Banery — Widgety“ na konci souboru */
/* režim úprav: úchyt ⠿ (tah v mřížce), přepínač ½ / 1, ✕ skrýt; tažený baner = klon pod prstem, původní místo = čárkovaný stín */
.tile { position: relative; }
.tile.tile-edit { border: 1px dashed var(--acc); padding-top: 1.85rem; }
.tile-grip { position: absolute; top: .3rem; left: .35rem; z-index: 3; width: 22px; height: 22px; color: var(--acc); cursor: grab; touch-action: none; user-select: none; -webkit-user-select: none; }
.tile-grip svg { width: 18px; height: 18px; }
.tile-tools { position: absolute; top: .3rem; right: .35rem; z-index: 3; display: flex; align-items: center; gap: .3rem; }
.tile-sz { display: inline-flex; gap: 1px; padding: 2px; border-radius: 7px; background: var(--neu-bg); }
.tile-sz button { width: 26px; height: 20px; padding: 0; margin: 0; border: 0; border-radius: 5px; background: transparent; box-shadow: none; color: var(--faint); display: flex; align-items: center; justify-content: center; }
.tile-sz button.on { background: var(--sn-on-bg); box-shadow: var(--sn-on-shadow); color: var(--ink); }
.tile-sz svg { width: 14px; height: 14px; }
.tile-szfix { font-size: .64rem; white-space: nowrap; }
.tile-hide { width: 22px; height: 22px; padding: 0; margin: 0; border: 1px solid var(--btn-line); border-radius: 6px; background: var(--btn-bg); box-shadow: none; color: var(--mut); font-size: .68rem; line-height: 1; display: flex; align-items: center; justify-content: center; }
.tile.dragging { opacity: .35; border-style: dashed; }
/* tažená kopie = PLNÁ karta bez skla, průhlednosti, natočení a animací, posouvá se jen přes transform (Marco 26. 10. 2026, video ze Safari:
   kopie pulzujícího baneru „Čeká na UbyPort“ se vykreslila bíle-růžově, stránka přestala překreslovat a spadla — backdrop-filter na pohyblivé
   natočené poloprůhledné vrstvě je ve WebKitu drahý a nespolehlivý). Stín na původním místě taky bez skla a bez pulzování.
   Platí pro banery Přehledu, panely (i superadmin), dlaždice a karty Analytiky. */
.tile-clone, .dp-clone, .an2-clone { position: fixed; z-index: 100; pointer-events: none; margin: 0; transition: none; will-change: transform; }
.tile.tile-clone, .dp-clone > .card, .an2-kp.an2-clone, .an2-clone > .card { background-color: var(--bg); -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: 0 22px 48px rgba(0,0,0,.32); animation: none; }
.tile-clone *, .dp-clone *, .an2-clone * { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; animation: none !important; }
.tile.dragging, .tile-edit.tile-pulse, .an2-kp.dragging, .dpc.dp-ghost > .card, .an2-pc.an2-ghost > .card { -webkit-backdrop-filter: none; backdrop-filter: none; animation: none; }
.tile-edit.tile-pulse::after, .tile.tile-clone::after { content: none; }
.dash-chipwrap { margin-top: .2rem; }   /* čipy skrytých banerů a panelů v kartě úprav — PC i telefon (Marco 2. 10. 2026 večer) */
.dash-chipgrp { margin-bottom: .7rem; }
.dp-hide { flex: none; }
.tile-chips { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .4rem; }
.tile-chip { width: auto; margin: 0; display: inline-flex; align-items: center; gap: .3rem; padding: .25rem .7rem .25rem .55rem; border: 1px dashed var(--btn-line); border-radius: 999px; background: transparent; box-shadow: none; color: var(--mut); font-size: .78rem; font-weight: 500; }
.tile-chip b { color: var(--acc); font-weight: 700; }
.tile-chip:hover { border-color: var(--acc); color: var(--ink); filter: none; }
.tile-chip.on { border-style: solid; border-color: var(--acc); background: var(--acc-soft); color: var(--ink); font-weight: 600; }   /* zapnutý baner / panel (Marco 2. 10. 2026 večer) */
.tile {
  background: var(--card-bg);
  backdrop-filter: blur(24px) saturate(1.55);
  -webkit-backdrop-filter: blur(24px) saturate(1.55);
  border: 1px solid var(--card-line);
  border-radius: 14px;
  box-shadow: var(--card-shadow);
  padding: .9rem 1.1rem 1rem;
}
/* banery: jednotné zarovnání (Marco 4. 9. 2026) — popisek jako řádek (přepínač M/K/R vpravo), hodnota bez zalomení,
   podtext vždy u spodního okraje, seznamy s ořezem trojtečkou */
.tile { display: flex; flex-direction: column; min-width: 0; }
.tile-l { display: flex; align-items: center; gap: .3rem .6rem; flex-wrap: wrap; min-width: 0;
  font-size: .66rem; text-transform: uppercase; letter-spacing: 1.1px; font-weight: 600; color: var(--faint); }
.tile-l .tile-lsub { text-transform: none; letter-spacing: 0; font-weight: 500; }
.tile-v { font-size: 1.65rem; font-weight: 600; letter-spacing: -0.02em; margin: .3rem 0 .35rem; line-height: 1.15; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tile-v small { font-size: .95rem; font-weight: 500; color: var(--mut); letter-spacing: 0; white-space: normal; }
.tile-s { font-size: .78rem; color: var(--mut); margin-top: auto; padding-top: .35rem; }
.tile-s.warn { color: var(--warn); font-weight: 600; }
.dash-tsel { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: .3rem .8rem; }
.dash-tchk { display: flex; gap: .5rem; align-items: center; font-size: .92rem; font-weight: 400; color: var(--ink); margin: 0; }
.dash-ord { display: flex; gap: .4rem; align-items: center; padding: .18rem .3rem; border-radius: 8px; user-select: none; -webkit-user-select: none; }
.dash-ord .mini { padding: .12rem .5rem; font-size: .8rem; }
.dash-ord .tile-sz { margin-left: auto; flex: none; }
/* editor úvodní stránky: řádek jde přetáhnout na libovolné místo (Marco 4. 9. 2026); ⠿ = úchyt pro dotyk */
.dash-ordlist { display: flex; flex-direction: column; }
.dash-ord { cursor: grab; }
.dash-grip { color: var(--faint); font-size: 1.05rem; line-height: 1; padding: 0 .15rem; touch-action: none; cursor: grab; }
.dash-ord.dragging { opacity: .55; background: var(--acc-soft); outline: 1px dashed var(--acc); }
.dash-ordlist.dragging, .dash-ordlist.dragging * { cursor: grabbing; }
/* Přehled — panely ve volné mřížce (varianta C, Marco 4. 9. 2026): 12 sloupců × řádky 110 px */
.dash-panels { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-rows: 110px; gap: 14px; margin-bottom: 1.1rem; }
/* tah panelů (23. 10. 2026): prohlížeč při posunu panelů „ukotvuje“ stránku k panelu pod kurzorem a sám ji odroluje → tah se rozjel
   a panel skočil jinam, než kam ukazoval kurzor. Mřížky panelů (Přehled, Analytika, superadmin) proto nesmí být kotvou posunu. */
.dash-panels, .an2-grid, .sa-dgrid { overflow-anchor: none; }
.dpc { min-width: 0; position: relative; display: flex; }
.dpc > .card { flex: 1; min-width: 0; margin: 0; display: flex; flex-direction: column; overflow: hidden; }
.dp-body { flex: 1; min-height: 0; overflow: auto; }
.dpc > .card { position: relative; }
/* jen celé řádky (Marco 18. 10. 2026, prehled.js dpFit): řádky, které se do výšky panelu nevejdou, se skryjí a vpravo dole je odkaz do sekce */
.dp-cut { display: none !important; }
.dp-list > .dp-row:has(+ .dp-cut) { border-bottom: 0; }   /* poslední viditelný řádek bez dělicí linky */
.dp-more { position: absolute; right: 14px; bottom: 10px; z-index: 1; font-size: .74rem; font-weight: 600; color: var(--acc); text-decoration: none;
  background: var(--btn-bg); border: 1px solid var(--card-line); border-radius: 999px; padding: .12rem .6rem .18rem; box-shadow: var(--btn-shadow); }
.dp-more:hover { text-decoration: none; filter: brightness(1.05); }
.dp-more[hidden] { display: none; }
.dash-panels.edit .dp-more { right: 42px; }   /* v úpravách nepřekrývá roh pro změnu velikosti */
/* tah rohem pod nejmenší velikost panelu (výška 2, rezervace šířka 4 — Marco 18. 10. 2026): krátká bublina u kurzoru, proč to dál nejde */
.dp-tip { position: fixed; z-index: 120; width: 280px; padding: .55rem .75rem; border-radius: 11px; background: #1d1d1f; color: #fff; font-size: .8rem; line-height: 1.4;
  box-shadow: 0 12px 30px rgba(0,0,0,.25); pointer-events: none; }
.dash-panels.edit .dpc > .card { border-color: var(--acc); }
.dp-grip { color: var(--acc); cursor: grab; font-size: 1rem; line-height: 1; touch-action: none; user-select: none; -webkit-user-select: none; padding: 0 .15rem; }
/* roh pro změnu velikosti = viditelný modrý čtvereček (23. 10. 2026, stejně jako Analytika — tenký rámeček v rohu Marco neviděl) */
.dp-rs { position: absolute; right: 7px; bottom: 7px; width: 26px; height: 26px; border-radius: 8px; background: var(--acc); color: #fff; display: inline-flex; align-items: center; justify-content: center;
  cursor: nwse-resize; touch-action: none; user-select: none; -webkit-user-select: none; z-index: 3; box-shadow: 0 4px 12px rgba(36,58,110,.25); }
.dp-rs svg { width: 14px; height: 14px; }
.dp-rs:hover { filter: brightness(1.08); }
.dpc.dp-ghost > .card { opacity: .3; border-style: dashed; background: var(--acc-soft); }
.dpc.dp-ghost > .dp-rs { display: none; }
.dpc.dp-sizing > .card { box-shadow: 0 0 0 3px color-mix(in srgb, var(--acc) 25%, transparent); }
.dp-ph { border: 2px dashed var(--acc); background: var(--acc-soft); border-radius: 14px; display: flex; align-items: center; justify-content: center; color: var(--acc); font-size: .85rem; font-weight: 500; }
.dp-row { display: flex; align-items: center; gap: .6rem; padding: .42rem 4px; border-bottom: 1px solid var(--hair); }
.dp-row:last-child { border-bottom: 0; }
.dp-row.rowlink { cursor: pointer; }
.dp-row.rowlink:hover { background: var(--acc-soft); }
.dp-row .dp-t { flex: 1; min-width: 0; }
.dp-row .dp-t strong, .dp-row .dp-t .who { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dp-row .dp-t strong { font-size: .9rem; }
.dp-row .tag { white-space: nowrap; }
/* dvouřádkový záznam v užším panelu: 2. řádek = všechny stavy odbavení s malým popiskem */
.dp-row2 { flex-direction: column; align-items: stretch; gap: .3rem; padding: .5rem 0; }
.dp-tags { display: flex; flex-wrap: wrap; gap: .3rem .55rem; align-items: center; padding: 2px 0 2px 4px; } /* 4 px vlevo = místo pro pulzující kroužek štítku Probíhá */
.dp-tg { display: inline-flex; align-items: center; gap: .3rem; }
.dp-tg i { font-style: normal; font-size: .6rem; text-transform: uppercase; letter-spacing: .07em; color: var(--faint); font-weight: 600; white-space: nowrap; }
.dp-tags .tag { font-size: .7rem; padding: .1rem .45rem; }
.dp-tags > div { display: contents; }
@media (max-width: 760px) {
  .dash-panels { display: flex; flex-direction: column; }
  .dpc { grid-column: auto !important; grid-row: auto !important; }
  .dpc > .card { overflow: visible; }
  .dp-body { overflow: visible; }
}
/* Přehled: baner UbyPort pulzuje, když hosté přes 3 dny od příjezdu stále nejsou nahlášeni (Marco 4. 9. 2026) */
.tile-s.err { color: var(--err); font-weight: 600; }
/* pulz = kroužek (::after), který se zvětší a zprůhlední — mění se jen transform a opacity, takže ho kreslí grafika bez překreslování skla;
   dřív animovaný box-shadow překresloval baner 60× za sekundu, dokud byl Přehled otevřený (Safari: trvale ~10 % procesoru navíc; 26. 10. 2026) */
.tile-pulse { border-color: var(--err-dot); }
.tile-pulse::after { content: ''; position: absolute; inset: -1px; border-radius: inherit; border: 2px solid var(--err-dot); pointer-events: none; animation: px-tile 1.6s ease-in-out infinite; }
@keyframes px-tile { 0%, 100% { opacity: .85; transform: scale(1); } 60% { opacity: 0; transform: scale(1.045, 1.08); } }
@media (prefers-reduced-motion: reduce) { .tile-pulse::after { animation: none; opacity: 0; } }
/* přepínač období M/K/R v baneru + víceřádkové banery */
.tile-per { display: inline-flex; gap: 2px; margin-left: auto; vertical-align: middle; flex: 0 0 auto; }
.tile-per button { width: auto; margin: 0; padding: .05rem .42rem; font-size: .62rem; font-weight: 600;
  border: 1px solid var(--btn-line); border-radius: 6px; background: transparent; box-shadow: none; color: var(--mut); }
.tile-per button.on { background: var(--prim-bg); color: var(--prim-ink); border-color: transparent; }
.tile-rows { margin-top: .5rem; display: flex; flex-direction: column; gap: .32rem; min-width: 0; }
.tile-row { display: flex; gap: .5rem; align-items: center; font-size: .8rem; min-width: 0; overflow: hidden; }
.tile-rn { flex: 0 1 auto; max-width: 42%; min-width: 2.6rem; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: var(--mut); }
.tile-bar { flex: 1 1 3rem; height: 6px; border-radius: 3px; background: var(--track); overflow: hidden; min-width: 2rem; }
.tile-bar i { display: block; height: 100%; background: var(--acc); border-radius: 3px; }
.tile-row b { font-variant-numeric: tabular-nums; }
/* ---------- Finance → Výdaje, návrh 4 (Marco 21. 10. 2026): glass banery jednotek / období / typu, graf roku + čtyři čísla, seznam po skupinách.
   Graf a čísla jsou jedna mřížka nad seznamem v téže kartě → pravý okraj posledního čísla = pravý okraj seznamu. ---------- */
.fx-head { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin-bottom: .8rem; }
.fx-head h1 { margin: 0; font-size: 1.25rem; }
.fx-head h1 .who { font-size: .85rem; font-weight: 400; }
.fx-head .sp { flex: 1; }
.fx-hb { display: inline-flex; align-items: center; gap: .4rem; }
.fx-hb svg, .fx-type svg, .fx-fk svg { width: 13px; height: 13px; flex: none; }
.fx-apt { margin: 0 0 .7rem; }
.fx-tools { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; margin: 0 0 .9rem; }
.fx-tools .res-seg, .fx-ch .res-seg { display: inline-flex; flex-wrap: nowrap; margin: 0; }
.fx-tools .res-seg button, .fx-ch .res-seg button { flex: 0 0 auto; padding: .35rem .9rem; display: inline-flex; align-items: center; gap: .35rem; }
.fx-tools .sp { flex: 1; }
.fx-grid { display: grid; grid-template-columns: minmax(0, 1fr) 15.5rem; gap: 14px; align-items: stretch; margin: 0 0 1rem; }
/* graf, dlaždice čísel a prázdný stav Výdajů i Příjmů = MLÉČNÉ SKLO jako rozbalená rezervace (--glass-*), NIKDY --well — ve světlém
   vzhledu Porcelain je --well béžově šedé (Marco 21. 10. 2026 večer, opakovaně: „chci glass efekt mléčného skla“) */
.fx-chartc, .fx-kpi, .in-empty, .in-vat { background: var(--glass-bg); border: 1px solid var(--glass-edge); box-shadow: var(--glass-shadow);
  -webkit-backdrop-filter: var(--glass-filter); backdrop-filter: var(--glass-filter); }
.fx-chartc { min-width: 0; padding: .9rem 1.1rem .8rem; border-radius: 14px; }
.fx-ch { display: flex; align-items: center; gap: .6rem; margin-bottom: .4rem; }
.fx-ch h2 { margin: 0; font-size: .95rem; }
.fx-ch .sp { flex: 1; }
.fx-ch .res-seg button { padding: .25rem .75rem; font-size: .8rem; }
.fx-chart { display: block; width: 100%; height: auto; }
.fx-chart .fx-gl { stroke: var(--line); }
.fx-chart .fx-ax { font-size: 10.5px; fill: var(--faint); font-family: inherit; } .fx-chart .fx-ax.sel { fill: var(--acc); font-weight: 700; }
.fx-chart .fx-hl { fill: var(--acc-soft); }
.fx-chart .fx-bar.fut { opacity: .38; }
.fx-chart .fx-line { fill: none; stroke-width: 2.2; stroke-linejoin: round; } .fx-chart .fx-line.dash { stroke-width: 1.8; stroke-dasharray: 6 5; }
.fx-leg { display: flex; flex-wrap: wrap; gap: .3rem .9rem; font-size: .74rem; color: var(--mut); margin-top: .3rem; }
.fx-leg span { display: inline-flex; align-items: center; gap: .35rem; }
.fx-leg i { width: 9px; height: 9px; border-radius: 50%; display: inline-block; }
.fx-leg i.ln { width: 16px; height: 0; border-radius: 0; border-top: 2.2px solid; } .fx-leg i.ln.dash { border-top-style: dashed; }
.fx-kpis { display: grid; grid-template-rows: repeat(4, minmax(0, 1fr)); gap: 10px; min-width: 0; }
.fx-kpi { width: 100%; box-sizing: border-box; min-width: 0; padding: .65rem .9rem; border-radius: 14px; display: flex; flex-direction: column; justify-content: center; }
.fx-kv { font-size: 1.35rem; font-weight: 600; letter-spacing: -.02em; line-height: 1.2; margin: .15rem 0 .1rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fx-kv.ok { color: var(--ok); } .fx-kv.warn { color: var(--warn); }
.fx-ks { font-size: .74rem; color: var(--mut); display: flex; align-items: center; gap: .4rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fx-late { color: var(--err); }
.fx-pbar { flex: 0 1 6rem; height: 6px; border-radius: 3px; background: var(--track); overflow: hidden; } .fx-pbar i { display: block; height: 100%; background: var(--ok-dot); border-radius: 3px; }
table.fx-t { width: 100%; table-layout: fixed; }
table.fx-t td { vertical-align: middle; }
.fx-g td { padding: 0 !important; border-top: 1px solid var(--line); }
.fx-gb { width: 100%; margin: 0; display: flex; align-items: center; gap: .5rem; padding: .65rem .45rem .55rem; border: 0; border-radius: 0; background: transparent; box-shadow: none; color: var(--ink); font-size: .9rem; text-align: left; }
.fx-gb .sp { flex: 1; }
.fx-gch svg { width: 13px; height: 13px; color: var(--mut); transform: rotate(-90deg); transition: transform .2s; display: block; } .fx-gch.on svg { transform: none; }
.fx-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; flex: none; }
.fx-dot.err { background: var(--err-dot); } .fx-dot.warn { background: var(--warn-dot); } .fx-dot.ok { background: var(--ok-dot); } .fx-dot.neu { background: var(--faint); }
.fx-r.late { background: var(--err-bg); }
.fx-r.paid .fx-n b, .fx-r.paid .fx-am { color: var(--mut); }
.fx-n { cursor: pointer; }
.fx-n b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fx-n > span { display: block; font-size: .74rem; color: var(--faint); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top: .1rem; }
.fx-en svg { width: 12px; height: 12px; color: var(--warn); vertical-align: -1px; }
.fx-am { text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; }
.fx-chk { width: 22px; height: 22px; margin: 0; padding: 0; border-radius: 999px; border: 1.6px solid var(--hair); background: transparent; box-shadow: none; display: flex; align-items: center; justify-content: center; }
.fx-chk.on { border: 0; background: linear-gradient(180deg, #3ddc75, #22a654); box-shadow: 0 3px 10px rgba(48,209,88,.35); color: #fff; }
.fx-chk svg { width: 13px; height: 13px; }
.fx-unit, .fx-typ { display: inline-flex; align-items: center; gap: .3rem; max-width: 100%; padding: .1rem .55rem .1rem .45rem; border-radius: 999px; font-size: .72rem; font-weight: 600; white-space: nowrap; overflow: hidden; }
.fx-unit { background: var(--neu-bg); color: var(--mut); } .fx-unit span { overflow: hidden; text-overflow: ellipsis; }
.fx-typ.rec { background: var(--acc-soft); color: var(--acc); } .fx-typ.one { background: var(--warn-bg); color: var(--warn); }
.fx-unit svg, .fx-typ svg { width: 11px; height: 11px; flex: none; }
.fx-ed svg { width: 14px; height: 14px; }
.fx-tot td { border-top: 2px solid var(--line); padding-top: .6rem; }
.fx-mbar, .fx-mfil { display: none; }
.fx-sheet h2 { margin: 0 0 .5rem; font-size: 1rem; }
.fx-sl { font-size: .66rem; text-transform: uppercase; letter-spacing: 1px; font-weight: 600; color: var(--faint); margin: .7rem 0 .35rem; }
.fx-sheet .res-seg { margin: 0; }
.fx-sa { display: flex; gap: .5rem; margin-top: 1rem; } .fx-sa .mini { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: .35rem; } .fx-sa svg { width: 13px; height: 13px; }
.fx-badge { position: absolute; top: -5px; right: -5px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 99px; background: var(--err-dot); color: #fff; font: 700 10px/16px inherit; font-style: normal; text-align: center; box-sizing: border-box; }
.fx-form .grid2 { margin-top: .2rem; }
.fx-fk { margin: 0 0 .6rem; } .fx-fk button { display: inline-flex; align-items: center; justify-content: center; gap: .35rem; }
.fx-paidl { display: flex; align-items: center; gap: .5rem; margin-top: 1.9rem; font-weight: 500; }
.fx-paidl input { width: auto; margin: 0; }
table.fx-tplt .fx-am { text-align: right; }
/* ---------- Finance → Příjmy (Marco 21. 10. 2026, Profi): rozložení a prvky jako Výdaje (fx-*), navíc platformy, zdroj cen a seznam pobytů ---------- */
.in-src { display: inline-flex; align-items: center; gap: .35rem; font-size: .76rem; color: var(--mut); padding: .25rem .65rem; border-radius: 999px; background: var(--neu-bg); white-space: nowrap; }
.in-src svg { width: 13px; height: 13px; color: var(--ok); }
.in-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; flex: none; }
.in-up { color: var(--ok); } .in-down { color: var(--err); }
.fx-kv.err { color: var(--err); }
.fx-chart .fx-gl.zero { stroke: var(--mut); }
.in-note { display: flex; gap: .5rem; align-items: flex-start; font-size: .8rem; color: var(--mut); margin: -.3rem 0 .8rem; }
.in-note svg { width: 15px; height: 15px; flex: none; margin-top: .1rem; color: var(--acc); }
.in-empty { display: flex; gap: 1rem; align-items: flex-start; padding: 1.1rem 1.2rem; border-radius: 14px; }
/* Obrat pro DPH (21. 10. 2026): jeden řádek z mléčného skla mezi grafem a seznamem — neplátce = obrat roku proti 2 000 000 Kč, plátce = tržby bez DPH + DPH 12 % */
.in-vat { padding: .7rem 1rem .65rem; border-radius: 14px; margin: -.2rem 0 1rem; display: flex; flex-direction: column; gap: .3rem; }
.in-vl { display: flex; align-items: center; gap: .55rem .9rem; flex-wrap: wrap; min-width: 0; }
.in-vl > svg { color: var(--acc); flex: none; }
.in-vat.warn .in-vl > svg { color: var(--warn); } .in-vat.err .in-vl > svg { color: var(--err); }
.in-vk { font-size: .66rem; letter-spacing: .08em; text-transform: uppercase; color: var(--faint); font-weight: 600; white-space: nowrap; }
.in-vn { font-size: .85rem; white-space: nowrap; }
.in-vn b { font-size: .95rem; } .in-vn b.in-vb { font-size: 1.05rem; }
.in-vo { color: var(--faint); }
.in-vbar { flex: 1 1 8rem; min-width: 6rem; height: 8px; border-radius: 99px; background: var(--line); overflow: hidden; display: block; }
.in-vbar i { display: block; height: 100%; border-radius: 99px; }
.in-vat .sp { flex: 1; }
.in-vs { font-size: .76rem; color: var(--mut); padding-left: 1.6rem; line-height: 1.45; }
.in-vs > b { color: var(--err); font-weight: 600; }
.in-vmode { all: unset; cursor: pointer; color: var(--mut); white-space: nowrap; }
.in-vmode b { color: var(--ink); font-weight: 600; } .in-vmode:hover { color: var(--acc); }
.in-vmode:focus-visible { outline: 2px solid var(--acc); outline-offset: 2px; border-radius: 4px; }
.in-vopt { display: flex; gap: .6rem; align-items: flex-start; padding: .55rem .2rem; cursor: pointer; }
.in-vopt input { margin-top: .2rem; }
.in-vdlg table.t td, .in-vdlg table.t th { padding: .4rem .5rem; }
.in-empty > svg { width: 26px; height: 26px; flex: none; color: var(--acc); margin-top: .1rem; }
.in-empty p { margin: .3rem 0 .8rem; color: var(--mut); font-size: .88rem; max-width: 70ch; }
table.in-t th { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } table.in-t th.r { text-align: right; }
.in-r td { vertical-align: middle; }
.in-r b { font-weight: 600; }
.in-s { display: block; font-size: .74rem; color: var(--faint); font-weight: 400; margin-top: .1rem; }
.in-h b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.in-r.np td, .in-r.np .in-h b { color: var(--mut); }
.in-plat { display: inline-flex; align-items: center; gap: .4rem; font-size: .8rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.in-plat i { width: 8px; height: 8px; border-radius: 50%; flex: none; }
td.in-fee { color: var(--mut); font-weight: 500; }
tr.in-g { cursor: pointer; } tr.in-g td { border-top: 1px solid var(--line); vertical-align: middle; padding-top: .6rem; padding-bottom: .55rem; }
tr.in-g:hover td { background: var(--glass-row, var(--acc-soft)); }
.in-gb { margin: 0; padding: 0; border: 0; background: transparent; box-shadow: none; color: var(--ink); font-size: .9rem; display: inline-flex; align-items: center; gap: .5rem; width: auto; text-align: left; }
.in-gb .who { white-space: nowrap; }
.in-dl { display: inline-block; margin-left: auto; padding: .05rem .45rem; border-radius: 999px; font-size: .66rem; font-weight: 700; letter-spacing: 0; text-transform: none; }
.in-dl.up { background: var(--ok-bg); color: var(--ok); } .in-dl.down { background: var(--err-bg); color: var(--err); }
.fx-tools .res-seg.fx-type button .in-dot { margin-right: .1rem; }
@media (max-width: 920px) {
  .fx-head h1 { font-size: 1.05rem; width: 100%; }
  .fx-head .sp { display: none; }
  .fx-hb { flex: 1; justify-content: center; }
  .fx-tools { gap: .45rem; } .fx-tools .sp { display: none; }
  /* telefon (Marco 21. 10. 2026): filtry nezabírají obrazovku — hlavička karty, glass baner jednotek a řádek období/typu se nekreslí,
     místo nich jedna lišta (‹ období › · filtr · +) a ve spodním listu volby; aktivní filtr = jeden řádek s „zrušit filtr“ */
  .fin-head > p.sub { display: none; }
  .fx-card > .fx-head, .fx-card > .fx-apt, .fx-card > .fx-tools { display: none !important; }
  .fx-mbar { display: flex; align-items: center; gap: .45rem; margin: 0 0 .7rem; }
  .fx-mbar .an-stepper { flex: 1; justify-content: space-between; }
  .fx-mbar .an-stepper strong { font-size: .9rem; }
  .fx-mbar .ibtn { position: relative; width: 38px; height: 38px; border-radius: 11px; }
  .fx-mfil { display: flex; align-items: center; gap: .5rem; margin: -.25rem 0 .7rem; font-size: .76rem; color: var(--mut); }
  .fx-mfil span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .fx-mfil button { width: auto; margin: 0; padding: .2rem .6rem; border-radius: 99px; border: 1px solid var(--btn-line); background: var(--btn-bg); box-shadow: none; color: var(--acc); font-size: .74rem; font-weight: 600; }
  .fx-card { padding-top: .9rem; }
  .fx-grid { gap: 10px; margin-bottom: .7rem; }
  .fx-grid .fx-kpis { order: -1; gap: 8px; }
  .fx-kpi { padding: .5rem .7rem; border-radius: 12px; }
  .fx-kpi .tile-l { font-size: .58rem; }
  .fx-ks { font-size: .7rem; }
  .fx-chartc { padding: .65rem .7rem .55rem; }
  .fx-ch h2 { font-size: .86rem; }
  .fx-sheet .res-seg.fx-aptm { margin-bottom: 0; }
  .fx-sheet .fx-per, .fx-sheet .fx-type, .fx-sheet .fx-aptm { display: flex; flex-wrap: nowrap; width: 100%; grid-template-columns: none; border-radius: 999px; padding: 3px; }
  .fx-sheet .fx-per button, .fx-sheet .fx-type button { flex: 1 1 0; width: auto; min-width: 0; border-radius: 999px; }
  .fx-sheet .fx-aptm button { flex: 1 1 auto; width: auto; min-width: 0; border-radius: 999px; padding-inline: .5rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .fx-sheet .fx-per .seg-glide, .fx-sheet .fx-type .seg-glide, .fx-sheet .fx-aptm .seg-glide { border-radius: 999px; }
  /* glass banery období / typu / režimu grafu: na telefonu přes celou šířku v jednom řádku (obecné .res-seg je tu mřížka 2 sloupců) */
  .fx-card .fx-tools .res-seg, .fx-card .fx-ch .res-seg { display: flex; width: 100%; grid-template-columns: none; border-radius: 999px; padding: 3px; }
  .fx-card .fx-tools .res-seg button, .fx-card .fx-ch .res-seg button { flex: 1 1 0; width: auto; min-width: 0; border-radius: 999px; padding: .38rem .3rem; font-size: .8rem; justify-content: center; }
  .fx-card .fx-tools .res-seg .seg-glide, .fx-card .fx-ch .res-seg .seg-glide { border-radius: 999px; }
  .fx-card .fx-tools .an-stepper { flex: 1; justify-content: space-between; }
  .fx-card .fx-ch h2 { width: 100%; }
  .fx-grid { grid-template-columns: 1fr; }
  .fx-kpis { grid-template-columns: 1fr 1fr; grid-template-rows: none; }
  .fx-kv { font-size: 1.1rem; }
  .fx-ch { flex-wrap: wrap; }
  table.fx-t, table.fx-t tbody { display: block; width: 100%; }
  table.fx-t colgroup { display: none; }
  table.fx-t tr.fx-r { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; gap: .2rem .55rem; align-items: center; padding: .55rem .6rem; margin: .35rem 0; border: 1px solid var(--line); border-radius: 12px; background: var(--input-bg); }
  table.fx-t tr.fx-r.late { background: var(--err-bg); }
  table.fx-t tr.fx-r td { display: block; padding: 0; border: 0; }
  table.fx-t tr.fx-r td:nth-child(1) { grid-row: span 2; }
  table.fx-t tr.fx-r td:nth-child(3), table.fx-t tr.fx-r td:nth-child(4), table.fx-t tr.fx-r td:nth-child(5) { grid-column: 2; display: inline; }
  table.fx-t tr.fx-r td:nth-child(3) { grid-row: 2; } table.fx-t tr.fx-r td:nth-child(4), table.fx-t tr.fx-r td:nth-child(5) { display: none; }
  table.fx-t tr.fx-r td:nth-child(6) { grid-column: 3; grid-row: 1; }
  table.fx-t tr.fx-r td:nth-child(7) { grid-column: 3; grid-row: 2; text-align: right; }
  table.fx-t tr.fx-r td:nth-child(8) { display: none; }
  table.fx-t tr.fx-g, table.fx-t tr.fx-tot { display: block; } table.fx-t tr.fx-g td, table.fx-t tr.fx-tot td { display: block; }
  table.fx-t tr.fx-tot { display: flex; justify-content: space-between; } table.fx-t tr.fx-tot td:empty { display: none; }
  /* Příjmy na telefonu: karta pobytu — host a cena hosta nahoře, termín a výplata pod tím, byt a platforma dole */
  .in-card > .fx-head .in-src { display: none; }
  /* obrat pro DPH na telefonu: číslo a pruh na celou šířku, popis bez odsazení */
  .in-vat { padding: .65rem .8rem; }
  .in-vbar { flex-basis: 100%; order: 5; }
  .in-vl > .mini { order: 6; }
  .in-vat .sp { display: none; }
  .in-vs { padding-left: 0; }
  table.in-t tr.in-th { display: none; }
  table.in-t tr.in-r { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .15rem .6rem; align-items: center; padding: .55rem .7rem; margin: .35rem 0; border: 1px solid var(--line); border-radius: 12px; background: var(--input-bg); }
  table.in-t tr.in-r td { display: block; padding: 0; border: 0; min-width: 0; }
  table.in-t tr.in-r td:nth-child(1) { grid-column: 1; grid-row: 2; font-size: .8rem; } table.in-t tr.in-r td:nth-child(1) b { font-weight: 500; }
  table.in-t tr.in-r td:nth-child(1) .in-s { display: inline; } table.in-t tr.in-r td:nth-child(1) .in-s::before { content: ' · '; }
  table.in-t tr.in-r td:nth-child(2) { grid-column: 1; grid-row: 1; }
  table.in-t tr.in-r td:nth-child(3) { grid-column: 1; grid-row: 3; }
  table.in-t tr.in-r td:nth-child(4) { grid-column: 2; grid-row: 3; text-align: right; }
  table.in-t tr.in-r td:nth-child(5) { grid-column: 2; grid-row: 1; }
  table.in-t tr.in-r td:nth-child(5) .in-s { display: none; }
  table.in-t tr.in-r td:nth-child(6) { display: none; }
  table.in-t tr.in-r td:nth-child(7) { grid-column: 2; grid-row: 2; font-size: .78rem; color: var(--ok); }
  table.in-t tr.in-r td:nth-child(7):not(:empty)::before { content: attr(data-l) ' '; color: var(--faint); font-weight: 400; }
  table.in-t tr.in-tot td.in-fee { display: none; }
  table.in-t tr.in-g { display: flex; align-items: center; gap: .5rem; padding: .55rem .2rem; border-top: 1px solid var(--line); }
  table.in-t tr.in-g td { display: block; padding: 0; border: 0; } table.in-t tr.in-g td:first-child { flex: 1; min-width: 0; }
  table.in-t tr.in-g td:nth-child(2), table.in-t tr.in-g td:nth-child(3) { display: none; }
  table.in-t tr.in-g .in-gb .who { display: none; }
  .in-empty { flex-direction: column; gap: .5rem; }
}
/* Výdaje a výdělky na Přehledu (21. 10. 2026): tržby = --acc, výdaje = --warn, zisk = --ok; přepínač Σ celkem / ≡ po apartmánech vedle M/K/R */
.tile-view { display: inline-flex; gap: 1px; padding: 2px; border-radius: 7px; background: var(--neu-bg); flex: 0 0 auto; margin-left: auto; }
.tile-view + .tile-per { margin-left: .35rem; }
.tile-view button { width: 22px; height: 18px; margin: 0; padding: 0; border: 0; border-radius: 5px; background: transparent; box-shadow: none; color: var(--faint); display: flex; align-items: center; justify-content: center; }
.tile-view button.on { background: var(--sn-on-bg); box-shadow: var(--sn-on-shadow); color: var(--ink); }
.tile-view svg { width: 12px; height: 12px; }
.tile-v.pnl-pos { color: var(--ok); } .tile-v.pnl-neg { color: var(--err); }
.tile-v.pnl-pos small, .tile-v.pnl-neg small { color: var(--mut); }
b.pnl-pos { color: var(--ok); } b.pnl-neg { color: var(--err); }
.pnl-paid { display: flex; align-items: center; gap: .5rem; margin: .1rem 0 .2rem; }
.pnl-bar { flex: 0 1 6.5rem; min-width: 2.5rem; height: 5px; border-radius: 3px; background: var(--track); overflow: hidden; }
.pnl-paid .who { white-space: nowrap; }
.pnl-bar i { display: block; height: 100%; background: var(--ok-dot); border-radius: 3px; }
.tile-bar.pnl-be i { background: var(--warn-dot); } .tile-bar.pnl-be i.sh { background: var(--faint); }
.pnl-split { display: flex; height: 8px; border-radius: 99px; overflow: hidden; background: var(--track); margin: .2rem 0 .25rem; }
.pnl-split .e { background: var(--warn-dot); } .pnl-split .z { flex: 1; background: var(--ok-dot); }
.pnl-chart { display: block; width: 100%; height: auto; margin: .35rem 0 .1rem; }
.pnl-chart .pnl-hl { fill: var(--acc-soft); }
.pnl-chart .pnl-r { fill: var(--acc); } .pnl-chart .pnl-e { fill: var(--warn-dot); } .pnl-chart .fut { opacity: .35; }
.pnl-chart .pnl-zl { fill: none; stroke: var(--ok-dot); stroke-width: 2.2; stroke-linejoin: round; } .pnl-chart .pnl-zl.fut { stroke-dasharray: 4 4; opacity: .7; }
.pnl-chart .pnl-zd { fill: var(--ok-dot); }
.pnl-chart .pnl-ax { font-size: 10px; fill: var(--faint); font-family: inherit; } .pnl-chart .pnl-ax.cur { fill: var(--acc); font-weight: 700; }
.pnl-leg { display: flex; gap: .7rem; flex-wrap: wrap; font-size: .72rem; color: var(--mut); }
.pnl-leg span { display: inline-flex; align-items: center; gap: .3rem; }
.pnl-leg i { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.pnl-leg i.r { background: var(--acc); } .pnl-leg i.e { background: var(--warn-dot); } .pnl-leg i.z { background: var(--ok-dot); border-radius: 2px; height: 3px; width: 12px; }
.pnl-alist { display: flex; flex-direction: column; margin-top: .3rem; }
.pnl-arow { display: grid; grid-template-columns: minmax(5rem, 9rem) minmax(0, 1fr) auto; gap: .7rem; align-items: center; padding: .32rem 0; border-top: 1px solid var(--hair); font-size: .8rem; }
.pnl-arow .tile-rn { max-width: none; color: var(--ink); }
.pnl-ahead { border-top: 0; padding-top: 0; font-size: .66rem; text-transform: uppercase; letter-spacing: 1px; color: var(--faint); font-weight: 600; }
.pnl-ahead .pnl-leg { text-transform: none; letter-spacing: 0; font-weight: 500; }
.pnl-bars { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.pnl-bars i { display: block; height: 5px; border-radius: 3px; min-width: 2px; }
.pnl-bars i.r { background: var(--acc); } .pnl-bars i.e { background: var(--warn-dot); }
.pnl-more { grid-template-columns: 1fr auto auto; }
.tile-val { flex: 0 0 auto; white-space: nowrap; font-variant-numeric: tabular-nums; }
.tile-codes { display: flex; gap: .3rem; flex-wrap: wrap; align-items: center; min-width: 0; flex: 1 1 auto; }
.tile-codes .who { white-space: nowrap; }
.tile-tag { flex: 0 1 auto; min-width: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; }
.tile-cut { flex: 1 1 0; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tile-code { background: var(--neu-bg); border-radius: 7px; padding: .12rem .5rem; font-size: .74rem; color: var(--mut); white-space: nowrap; }
.tile-code b { color: var(--ink); letter-spacing: .08em; margin-left: .2rem; }
.tile-click { cursor: pointer; }
.tile-click:hover { border-color: var(--faint); }
/* průvodce — kompaktní dvousloupcová verze s progress barem */
.onb-head { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.onb-prog { margin-left: auto; display: flex; align-items: center; gap: .6rem; font-size: .9rem; color: var(--mut); }
.onb-prog strong { color: var(--ink); }
.onb-bar { width: 150px; height: 4px; border-radius: 2px; background: var(--track); overflow: hidden; display: inline-block; }
.onb-bar i { display: block; height: 100%; background: var(--acc); border-radius: 2px; }
.onb2 { display: grid; grid-auto-flow: column; grid-template-rows: repeat(3, auto); grid-template-columns: 1fr 1fr; column-gap: 2.6rem; }
.onb2 li:nth-child(3) { border-bottom: 0; }
.onb2 .ic2 { flex: 0 0 18px; width: 18px; height: 18px; border: 1.5px solid var(--line); border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center; font-size: 11px; }
.onb2 li.done .ic2 { background: var(--ok-dot); border-color: var(--ok-dot); }
.onb2 li.done .ic2::after { content: '✓'; color: #fff; font-weight: 700; }
.onb2 li.done .onb-t { text-decoration: line-through; color: var(--faint); }
.onb2 .onb-t { min-width: 0; }
@media (max-width: 920px) {
  .onb2 { grid-auto-flow: row; grid-template-rows: none; grid-template-columns: 1fr; }
  .onb2 li:nth-child(3) { border-bottom: 1px solid var(--hair); }
  .onb2 li:last-child { border-bottom: 0; }
}

/* ---------- tabulka rezervací (.rest) ----------
   Pravidlo: VŠECHNY informace viditelné bez vodorovného posuvníku.
   Desktop: buňky se smí zalamovat (štítky vč.), rozsah pobytu drží .nw
   segmenty. Mobil ≤920 px: řádky se skládají do bloků s popisky. */
table.t.rest { width: 100%; }
.rest .tag { white-space: nowrap; }           /* stavové hlášky VŽDY na jednom řádku (pravidlo Marca) */
/* seznam rezervací: pevný layout — každá buňka JEDEN řádek; když se obsah
   nevejde, fitCells() automaticky ZMENŠÍ písmo buňky (nic se neořezává,
   tabulka se nikdy neroztáhne přes kartu a nikdy nezalamuje obsah) */
table.rest-res { table-layout: fixed; }
table.rest-res td { white-space: nowrap; overflow: hidden; }
/* Hlavička se smí zalomit a má menší písmo (16. 9. 2026, překlady): šířky sloupců jsou vyladěné na krátké
   české popisky, ale „Registration" nebo „Beherbergungsanzeige" jsou o půlku delší a bez tohohle se
   navzájem překrývaly. fitCells() zmenšuje písmo jen v buňkách, hlavičky se netýká. */
table.rest-res th { white-space: normal; overflow: hidden; line-height: 1.15; vertical-align: bottom;
  font-size: .6rem; letter-spacing: .6px; padding-left: .3rem; padding-right: .3rem;
  word-break: normal; overflow-wrap: normal; }
table.rest-res th:nth-child(1) { width: 14%; }   /* Host */
table.rest-res th:nth-child(2) { width: 9%; }    /* Apartmán */
table.rest-res th:nth-child(3) { width: 8.5%; }  /* Platforma */
table.rest-res th:nth-child(4) { width: 10.5%; } /* Termín */
table.rest-res th:nth-child(5) { width: 3.5%; }  /* Nocí */
table.rest-res th:nth-child(6) { width: 3.5%; }  /* Osob */
table.rest-res th:nth-child(7) { width: 7.5%; }  /* Stav */
table.rest-res th:nth-child(8) { width: 7.5%; }  /* Pozvánka */
table.rest-res th:nth-child(9) { width: 8.5%; }  /* Registrace */
table.rest-res th:nth-child(10) { width: 7.5%; } /* Instrukce */
table.rest-res th:nth-child(11) { width: 6.5%; } /* Portál */
table.rest-res th:nth-child(12) { width: 8.5%; } /* UbyPort */
table.rest-res th:nth-child(13) { width: 7.5%; } /* akce */
table.rest-res tr.res-detail > td { white-space: normal; overflow: visible; }
table.rest-res .row-actions { white-space: normal; overflow: visible; }
table.rest-res td { vertical-align: middle; }
table.rest-res .row-actions .mini { padding: .3rem .55rem; font-size: .78rem; }
table.rest-res .row-actions .mini { margin: 0 0 .25rem .25rem; }

/* přepínač Kalendář/Seznam + stavový segment (vzor Sierra, v našem designu) */
.res-view { position: relative; display: inline-flex; background: var(--neu-bg); border-radius: 999px; padding: 3px; }
.res-view button { position: relative; z-index: 1; width: auto; margin: 0; padding: .38rem 1rem; border: 0; border-radius: 999px;
  background: transparent; box-shadow: none; color: var(--mut); font-size: .86rem; font-weight: 500; }
.res-view button.on { color: var(--prim-ink); font-weight: 600; }
.res-seg { position: relative; display: flex; background: var(--neu-bg); border-radius: 999px; padding: 3px; margin: 0 0 .8rem; flex-wrap: wrap; }
.res-seg button { position: relative; z-index: 1; flex: 1 1 auto; width: auto; margin: 0; padding: .45rem 1rem; border: 0; border-radius: 999px;
  background: transparent; box-shadow: none; color: var(--mut); font-size: .88rem; font-weight: 500; white-space: nowrap; transition: color .18s; }
.res-seg button span { color: var(--faint); font-weight: 600; margin-left: .3rem; }
/* aktivní položka nemá vlastní pozadí — pod ní klouže sklo .seg-glide (glass baner, stejné jako v Nastavení; Marco 22. 9. 2026) */
.res-seg button.on { color: var(--ink); font-weight: 600; }
.res-seg button.on span { color: var(--acc); }

/* kalendář rezervací (gantt) — lišta = návrh 2 „Ovládací pruh + svátky v kalendáři“ (Marco 25. 10. 2026): kapsle bytu jako v Seznamu (.rz-aptf),
   ‹ období › ve skleněné kapsli, Dnes, délka 2 · 4 · 8 týdnů (glass baner .res-seg), legenda vpravo — když se nevejde, je pod kalendářem (calLegPlace) */
.calx-tb { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 0 0 .8rem; }
.calx-tb > .rz-aptf { flex: none; }
.calx-tb > .rz-aptf select { max-width: 15rem; text-overflow: ellipsis; }   /* šířka select = nejdelší volba → bez stropu by vytlačila legendu pod kalendář */
.calx-sp { flex: 1 1 0; min-width: 4px; }
.calx-dp { display: inline-flex; align-items: center; gap: 2px; height: 38px; padding: 3px; box-sizing: border-box; border-radius: 999px;
  background: var(--glass-bg); border: 1px solid var(--glass-edge); box-shadow: var(--glass-shadow); -webkit-backdrop-filter: var(--glass-filter); backdrop-filter: var(--glass-filter); }
.calx-dp > b { min-width: 9rem; padding: 0 .35rem; text-align: center; font-size: .9rem; font-weight: 650; letter-spacing: -.2px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.calx-nb { width: 30px; height: 30px; flex: none; margin: 0; padding: 0; border: 0; border-radius: 50%; background: transparent; box-shadow: none; color: var(--ink);
  display: inline-flex; align-items: center; justify-content: center; }
.calx-nb svg { width: 16px; height: 16px; }
.calx-nb:hover { background: var(--glass-row); filter: none; }
button.mini.calx-today { height: 38px; padding: 0 1rem; border-radius: 999px; flex: none; }
.res-seg.calx-wk { display: inline-flex; flex-wrap: nowrap; margin: 0; flex: none; }
.res-seg.calx-wk button { flex: none; padding: .4rem .8rem; font-size: .82rem; }
.calx-leg { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 2px 4px; }
.calx-leg.below { justify-content: flex-start; margin: .7rem 0 0 -6px; }
.calx-li { position: relative; display: inline-flex; }
.calx-li > button { display: inline-flex; align-items: center; gap: 6px; width: auto; height: 30px; margin: 0; padding: 0 8px 0 7px; border-radius: 999px;
  border: 1px solid transparent; background: transparent; box-shadow: none; color: var(--mut); font-size: .76rem; font-weight: 500; white-space: nowrap; cursor: pointer; }
.calx-li > button i { width: 12px; height: 12px; flex: none; border-radius: 4px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.14); }
.calx-li > button:hover, .calx-li > button.on { background: var(--glass-bg); border-color: var(--glass-edge); color: var(--ink); filter: none; }
/* výběr barvy z legendy (náhrada panelu „Barvy platforem“) — sklo jako bubliny ⓘ */
.calx-pop { position: absolute; top: calc(100% + 8px); left: 0; z-index: 45; width: 282px; max-width: calc(100vw - 32px); box-sizing: border-box; padding: 14px;
  border-radius: 16px; background: var(--stp-bg); border: 1px solid var(--stp-line); box-shadow: var(--stp-sh); color: var(--ink); text-align: left;
  -webkit-backdrop-filter: var(--glass-filter); backdrop-filter: var(--glass-filter); }
.calx-pop.up { top: auto; bottom: calc(100% + 8px); }
.calx-pop-h { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 12px; font-size: .86rem; }
.calx-pop-x { width: 28px; height: 28px; flex: none; margin: 0; padding: 0; border-radius: 50%; border: 1px solid var(--glass-edge); background: var(--glass-bg); box-shadow: none;
  color: var(--mut); display: inline-flex; align-items: center; justify-content: center; }
.calx-pop-x svg { width: 14px; height: 14px; }
.calx-sw { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
.calx-sw button { width: 100%; height: auto; aspect-ratio: 1; margin: 0; padding: 0; border: 0; border-radius: 9px; background: var(--c); box-shadow: inset 0 0 0 1px rgba(0,0,0,.16); cursor: pointer; }
.calx-sw button.on { outline: 2px solid var(--ink); outline-offset: 2px; }
.calx-pop-f { display: flex; align-items: center; gap: 8px; margin-top: 12px; }
.calx-pop-cu { display: inline-flex; align-items: center; gap: 8px; margin: 0; font-size: .8rem; font-weight: 600; color: var(--ink); cursor: pointer; }
.calx-pop-cu input[type="color"] { width: 28px; height: 28px; margin: 0; padding: 0; border: 0; border-radius: 8px; background: none; cursor: pointer; }
.calx-pop p { margin: 10px 0 0; font-size: .74rem; line-height: 1.45; color: var(--faint); }
/* mřížka z mléčného skla (ne --well — Marco: ve světlém vzhledu béžová) */
.calx { border: 1px solid var(--glass-edge); border-radius: 14px; overflow: hidden; background: var(--glass-bg); box-shadow: var(--glass-shadow); }
.calx-row { display: grid; align-items: stretch; border-top: 1px solid var(--hair); position: relative; }
.calx-row.calx-mon { border-top: 0; }
.calx-mcell { text-align: center; font-size: .68rem; font-weight: 600; letter-spacing: .8px; text-transform: uppercase;
  color: var(--acc); padding: .32rem 0; border-left: 1px solid var(--hair); overflow: hidden; white-space: nowrap; }
.calx-apt { grid-column: 1; padding: .55rem .7rem; font-weight: 600; font-size: .85rem;
  display: flex; align-items: center; min-height: 46px; overflow: hidden; white-space: nowrap; }
.calx-mon .calx-apt, .calx-head .calx-apt { min-height: 0; }
.calx-d { text-align: center; padding: .28rem 0 .3rem; overflow: hidden; position: relative; border-left: 1px solid var(--hair); }
.calx-d .calx-dw { display: block; font-size: .56rem; text-transform: uppercase; letter-spacing: .6px; color: var(--faint); }
.calx-d .calx-dn { display: inline-flex; align-items: center; justify-content: center; min-width: 1.45rem; height: 1.45rem;
  font-weight: 600; color: var(--ink); font-size: .78rem; border-radius: 999px; }
.calx-d .calx-dn.now { background: var(--prim-bg); color: var(--prim-ink); box-shadow: var(--prim-shadow); }
.calx-cell { min-height: 46px; border-left: 1px solid var(--hair); }
.calx-d.we, .calx-cell.we { background: var(--glass-row); }
.calx-d.today, .calx-cell.today { background: var(--acc-soft); }
/* státní svátek: červený kroužek u čísla, červená zkratka dne, podbarvený celý sloupec */
.calx-d.hol, .calx-cell.hol { background: color-mix(in srgb, var(--err-dot) 9%, transparent); }
.calx-d.hol .calx-dw { color: var(--err); }
.calx-d.hol .calx-dn { color: var(--err); box-shadow: inset 0 0 0 1.5px var(--err-dot); }
.calx-d.hol .calx-dn.now { color: var(--prim-ink); box-shadow: 0 0 0 2px var(--err-dot), var(--prim-shadow); }
/* řádek Svátky pod dny: štítek s názvem u dne svátku */
.calx-hlane .calx-apt.calx-hl-t { min-height: 34px; gap: 6px; font-size: .68rem; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; color: var(--err); }
.calx-hl-t svg { width: 13px; height: 13px; flex: none; }
.calx-hlane .calx-cell { min-height: 0; }
.calx-htag { z-index: 1; align-self: center; min-width: 0; display: flex; padding-left: 3px; }
.calx-htag.end { justify-content: flex-end; padding: 0 3px 0 0; }
.calx-htag span { display: inline-block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 3px 10px; border-radius: 999px;
  background: var(--err-bg); color: var(--err); font-size: .72rem; font-weight: 700; border: 1px solid color-mix(in srgb, var(--err-dot) 35%, transparent); }
.calx-bar { align-self: center; margin: 8px 5px; height: 30px; border-radius: 8px; color: #fff;
  font-size: .74rem; font-weight: 600; display: flex; align-items: center; gap: .35rem; padding: 0 .5rem;
  overflow: hidden; white-space: nowrap; cursor: pointer; z-index: 1;
  box-shadow: 0 0 0 2px var(--panel), 0 2px 6px rgba(0,0,0,.22); }   /* 18. 9. 2026: navazující rezervace (odjezd = příjezd) se nesmí slévat — mezera 10 px + lem v barvě podkladu */
html[data-theme="dark"] .calx-bar, html[data-theme="violet"] .calx-bar, html[data-theme="gold"] .calx-bar { box-shadow: 0 0 0 2px var(--card-bg), 0 2px 6px rgba(0,0,0,.35); }
.calx-bar b { font-weight: 700; opacity: .85; flex: none; }
.calx-bar b[hidden] { display: none; }
.calx-nm { flex: 1 1 auto; min-width: 0; overflow: hidden; }   /* jméno se zkracuje pravidlem calFitNames (rezervace.js), ne ořezem */
.calx-bar:hover { filter: brightness(1.08); }
.calx-bar.calx-overlap { outline: 2px dashed rgba(0,0,0,.45); outline-offset: -3px; }   /* dvojí obsazení: rezervace pod sebou a s červeným lemem */
/* 8 týdnů: užší dny */
.calx.dense .calx-bar { margin: 8px 2px; padding: 0 .3rem; font-size: .66rem; border-radius: 6px; }
.calx.dense .calx-d .calx-dn { min-width: 1.15rem; height: 1.2rem; font-size: .68rem; }
.calx.dense .calx-d .calx-dw { letter-spacing: 0; }
.calx-mob { display: none; }
.calx-mrow { display: flex; gap: .7rem; padding: .45rem .2rem; border-bottom: 1px solid var(--hair); align-items: flex-start; }
.calx-mrow.today { background: var(--acc-soft); border-radius: 8px; }
.calx-mrow.hol { background: color-mix(in srgb, var(--err-dot) 8%, transparent); border-radius: 8px; }
.calx-mrow.hol .calx-mday, .calx-mrow.hol .calx-mday .who { color: var(--err); }
.calx-mday { flex: 0 0 5.2rem; font-weight: 600; font-size: .85rem; }
.calx-mday .who { display: block; font-weight: 400; }
.calx-mx { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .35rem; }
.calx-mhol { display: inline-flex; align-items: center; align-self: flex-start; gap: 5px; padding: 3px 9px; border-radius: 999px; background: var(--err-bg); color: var(--err);
  font-size: .72rem; font-weight: 700; border: 1px solid color-mix(in srgb, var(--err-dot) 35%, transparent); }
.calx-mhol svg { width: 12px; height: 12px; flex: none; }
.calx-mchips { display: flex; gap: .3rem; flex-wrap: wrap; }
.calx-chip { color: #fff; border-radius: 7px; padding: .2rem .5rem; font-size: .74rem; font-weight: 600; cursor: pointer; }
@media (max-width: 920px) {
  .calx { display: none; }
  .calx-mob { display: block; }
  .calx-tb { gap: 8px; margin: .5rem 0 .6rem; }
  .calx-tb > .rz-aptf, .calx-tb > .calx-wk, .calx-tb > .calx-sp { display: none; }   /* telefon: filtr bytu = domeček v hlavičce, 14 dní pod sebou */
  .calx-tb > .calx-dp { flex: 1; justify-content: space-between; height: 40px; }
  .calx-dp > b { min-width: 0; }
  button.mini.calx-today { height: 40px; }
  .calx-leg.below { margin-top: .8rem; }
}
.res-fwrap { position: relative; }            /* detail rezervace — kotva pro zavírací ✕ */
.res-x { position: absolute; top: 0; right: 0; z-index: 2; padding: .3rem .62rem; font-size: .95rem; line-height: 1; }
#resForm.res-fwrap > .res-x { top: .9rem; right: .9rem; }   /* karta Nová rezervace: křížek s odstupem od rohu, ne nalepený (Marco 18. 9. 2026) */
/* rozkliknutá rezervace v tabulce (skleněná tabule): křížek uvnitř tabule zarovnaný s nadpisem, ne nalepený na její roh (Marco 21. 10. 2026) */
table.t tr.res-detail > td.glass-td > .res-fwrap > .res-x { top: .85rem; right: .9rem; }

/* ---------- detail rezervace: 2 sloupce + osa odbavení ---------- */
/* minmax(0, …): tabulka hostů vlevo (dlouhá jména, adresy) dřív roztáhla levý sloupec a osu odbavení
   vpravo zmáčkla do úzkého proužku — sloupce teď drží poměr a tabulka se láme/roluje uvnitř (Marco 17. 9. 2026) */
.rd-grid { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 0 1.6rem; align-items: start; }   /* 18. 9. 2026: levý sloupec (tabulka hostů) potřebuje víc místa než osa Odbavení (krátké řádky s tlačítky) */
/* Hosté v detailu rezervace = rozbalovací řádky (návrh A, 17. 9. 2026): hlavička s jménem, štítky a akcemi, po rozbalení karta
   se všemi údaji z check-inu ve 3 sloupcích */
/* Hosté v detailu rezervace — tabulka (návrh B, 18. 9. 2026): tlačítka se nelámou, na užší šířce jdou akce pod řádek */
table.t.gt td { vertical-align: middle; overflow-wrap: anywhere; white-space: normal; overflow: visible; }   /* detail leží v řádku seznamu (table.rest-res td = nowrap) — vnořená tabulka se musí zalamovat */   /* dlouhé adresy a čísla dokladů se zalomí, tabulka nikdy nepřeteče ze sloupce */
table.t.gt td.row-actions { white-space: nowrap; text-align: right; }   /* Upravit · Smazat vedle sebe; v užším sloupci (container query níže) pod sebe */
table.t.gt .mini { white-space: nowrap; margin: 0 0 .25rem .3rem; padding: .28rem .6rem; font-size: .8rem; }   /* tlačítka se nelámou po písmenech, jen pod sebe */
table.t.gt td:first-child { min-width: 8rem; position: relative; padding-left: 1.55rem; }   /* šipka rozbalení stojí mimo text, jméno i narození začínají na stejné svislici */
table.t.gt td:nth-child(2) { min-width: 10rem; }          /* doklad a adresa nesmí vyjít na tři řádky, jméno se o šířku podělí */
table.t.gt td:first-child strong, table.t.gt td:first-child > .who { overflow-wrap: normal; white-space: nowrap; }   /* jméno na jednom řádku, pod ním narození · kód státu */
table.t.gt .tag { white-space: nowrap; }                 /* štítky (chybí, nehlásí se) se nelámou po písmenech; šířku drží výpustka adresy a nowrap řádků */
table.t.gt img { max-width: 90px; }
table.t.gt .gadr { display: block; max-width: 15rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }   /* adresa na jeden řádek, celá v tooltipu a v rozbaleném detailu */
table.t.gt td:nth-child(2) > span:first-child { white-space: nowrap; }   /* PAS M115Z5207 se nerozpadne na dva řádky */
table.t.gt .tag.uby { white-space: nowrap; }                             /* „odesláno ✓ 29. 8. 2026" na jeden řádek */
table.t.gt tr.gdet > td { text-align: left; }
table.t.gt .chev2 { position: absolute; left: .55rem; top: .95rem; margin: 0; }
#r_guests { container-type: inline-size; overflow-x: auto; }             /* užší sloupec vedle osy Odbavení: tabulka se přizpůsobí, v nouzi posouvá, nikdy nepřeteče do osy */
table.t.gt .nosig { display: none; font-size: .66rem; padding: .05rem .4rem; vertical-align: 1px; }   /* jen v úzkém sloupci (viz container query níže) */
@container (max-width: 700px) {
  table.t.gt td:nth-child(3), table.t.gt th:nth-child(3) { display: none; }   /* podpis je v rozbaleném detailu */
  table.t.gt td.row-actions .mini { display: block; margin-left: 0; }         /* Upravit / Smazat pod sebe */
  table.t.gt .gadr { max-width: 11rem; }
  table.t.gt .nosig { display: block; width: max-content; margin: .2rem 0 0; }   /* chybějící podpis musí být vidět i bez sloupce — třetí řádek, řádek s tlačítky pod sebou je stejně vysoký */
}
.rd-h2 { margin-top: 1.1rem; }
.rd-grid > .rd-right .rd-h2 { margin-top: .2rem; }
.ob { margin: .2rem 0 0 .4rem; }
.ob-step { position: relative; padding: .4rem 0 .7rem 1.3rem; border-left: 2px solid var(--hair); }
.ob-step:last-child { padding-bottom: .2rem; }
.ob-step::before { content: ''; position: absolute; left: -6px; top: .62em; width: 10px; height: 10px;
  border-radius: 50%; background: var(--dim); box-shadow: 0 0 0 3px var(--well); }
.ob-step.ok::before { background: var(--ok-dot); }
.ob-step.warn::before { background: var(--warn-dot); }
.ob-step.err::before { background: var(--err-dot); }
.ob-h { display: flex; gap: .55rem; align-items: center; flex-wrap: wrap; font-weight: 700; font-size: .98rem; letter-spacing: -0.01em; }
.ob-a { display: flex; gap: .4rem; flex-wrap: wrap; margin-top: .4rem; }
.ob-a .mini, .ob-h .mini { padding: .28rem .6rem; font-size: .8rem; }
.ob-link { text-decoration: none; padding: .28rem .6rem; border: 1px solid var(--btn-line); border-radius: 9px;
  font-size: .8rem; color: var(--ink); background: var(--btn-bg); box-shadow: var(--btn-shadow); font-weight: 500; }
.ob-link:hover { text-decoration: none; border-color: var(--faint); }
.ob-note { color: var(--mut); font-size: .8rem; margin: .25rem 0 0; }
@media (max-width: 1150px) { .rd-grid { grid-template-columns: 1fr; } .rd-grid > .rd-right .rd-h2 { margin-top: 1.1rem; } }

/* ---------- Úklidy: horní lišta + panely ---------- */
.cl-bar { display: flex; gap: .45rem; align-items: center; flex-wrap: wrap; margin: .2rem 0 .7rem; }
/* ---------- Úklidy — horní karta podle návrhu 2, 2. kolo (Marco 21. 10. 2026): ovládání v jedné rovině, tabule Náklady a Vzkazy týmu
   na rozkrytí; tabule = MLÉČNÉ SKLO (--glass-*), ne --well ---------- */
.cl-head2 { display: flex; align-items: center; gap: .7rem; flex-wrap: wrap; margin: 0 0 1rem; }
.cl-head2 h1.pg { margin: 0 .35rem 0 0; }
.cl-head2 .sp { flex: 1; }
.cl-head2 .ibtn { width: 36px; height: 36px; border-radius: 10px; }
.cl-head2 .ibtn svg { width: 16px; height: 16px; }
.cl-head2 .cl-addb { display: inline-flex; align-items: center; gap: .35rem; padding: .48rem .9rem; }
.cl-head2 .cl-addb svg { width: 14px; height: 14px; }
.cl-pmode { display: inline-flex; flex-wrap: nowrap; margin: 0; }
.cl-pmode button { flex: 0 0 auto; padding: .35rem .9rem; }
.cl-top2 { display: flex; gap: 1rem; align-items: stretch; }   /* obě tabule vždy stejně vysoké (Marco 21. 10. 2026) */
.cl-gp { min-width: 0; padding: .9rem 1.05rem; border-radius: 16px; background: var(--glass-bg); border: 1px solid var(--glass-edge); box-shadow: var(--glass-shadow);
  -webkit-backdrop-filter: var(--glass-filter); backdrop-filter: var(--glass-filter); }
.cl-costp { flex: 1 1 auto; }
.cl-msgp { flex: 0 0 34rem; }
.cl-ch { display: flex; align-items: center; gap: 1rem; }
.cl-big { font-size: 1.85rem; font-weight: 600; letter-spacing: -.02em; line-height: 1.15; margin-top: .15rem; white-space: nowrap; font-variant-numeric: tabular-nums; }
.cl-big small { font-size: .88rem; font-weight: 500; color: var(--mut); letter-spacing: 0; }
.cl-prog { display: flex; flex-direction: column; align-items: flex-end; gap: .25rem; margin-left: auto; font-size: .82rem; white-space: nowrap; }
.cl-prog .bar, .cl-cr .bar { display: block; height: 7px; border-radius: 4px; background: var(--track); overflow: hidden; }
.cl-prog .bar { width: 11rem; }
.cl-prog .bar i, .cl-cr .bar i { display: block; height: 100%; background: var(--ok-dot); border-radius: 4px; }
.cl-cfoot { display: flex; align-items: center; gap: .6rem; margin-top: .75rem; font-size: .8rem; color: var(--mut); flex-wrap: wrap; }
.cl-cfoot .sp { flex: 1; }
.cl-top3 { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cl-top3 b { color: var(--ink); }
.cl-tg { display: inline-flex; align-items: center; gap: .35rem; width: auto; margin: 0; padding: .3rem .75rem; border-radius: 999px; border: 1px solid var(--btn-line);
  background: var(--btn-bg); box-shadow: var(--btn-shadow); color: var(--ink); font-size: .8rem; font-weight: 600; white-space: nowrap; }
.cl-tg svg { width: 13px; height: 13px; color: var(--mut); }
.cl-crows { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0 1.6rem; margin-top: .65rem; }
.cl-crows.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cl-cr { display: flex; align-items: center; gap: .6rem; padding: .38rem 0; border-top: 1px solid var(--line); font-size: .84rem; min-width: 0; }
.cl-cr .n { width: 5.5rem; flex: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cl-cr .bar { flex: 1 1 auto; min-width: 3rem; height: 6px; }
.cl-cr .s { width: 2.8rem; flex: none; color: var(--mut); font-size: .76rem; white-space: nowrap; }
.cl-cr .v { width: 5.6rem; flex: none; text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.cl-mh { display: flex; align-items: center; gap: .45rem; flex-wrap: wrap; }
.cl-mh > svg { width: 16px; height: 16px; color: var(--acc); flex: none; }
.cl-mh h2 { margin: 0 .2rem 0 0; font-size: 1rem; }
.cl-mh .sp { flex: 1; }
.cl-mtab { display: inline-flex; flex-wrap: nowrap; margin: 0; }
.cl-mtab button { flex: 0 0 auto; padding: .28rem .8rem; font-size: .8rem; }
.cl-mtab button span { color: var(--faint); margin-left: .2rem; }
.cl-ml { display: flex; align-items: center; gap: .5rem; margin-top: .6rem; font-size: .82rem; min-width: 0; }
.cl-ml .t { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cl-ml .t .c, .cl-mtx .c { color: var(--mut); }
.cl-ml .who { white-space: nowrap; }
.cl-mempty { margin: .6rem 0 0; font-size: .82rem; line-height: 1.45; color: var(--mut); overflow-wrap: anywhere; }   /* prázdná schránka: text se zalomí, nevyteče z tabule */
.cl-mk { text-transform: uppercase; letter-spacing: .4px; font-size: .66rem; }
.cl-mic { width: 30px; height: 30px; border-radius: 9px; flex: none; display: flex; align-items: center; justify-content: center; background: var(--neu-bg); color: var(--mut); }
.cl-mic svg { width: 15px; height: 15px; }
.cl-mic.sm { width: 24px; height: 24px; border-radius: 7px; } .cl-mic.sm svg { width: 12px; height: 12px; }
.cl-mic.err { background: var(--err-bg); color: var(--err); } .cl-mic.warn { background: var(--warn-bg); color: var(--warn); } .cl-mic.acc { background: var(--acc-soft); color: var(--acc); }
.cl-ml-list { margin-top: .4rem; }
.cl-mi { display: flex; gap: .7rem; padding: .7rem 0; border-top: 1px solid var(--line); }
.cl-mb { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .32rem; }
.cl-mt { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; }
.cl-mt .w { margin-left: auto; font-size: .74rem; color: var(--faint); white-space: nowrap; }
.cl-mtx { font-size: .86rem; line-height: 1.45; overflow-wrap: anywhere; }
.cl-ma { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; }
.cl-ma .sp { flex: 1; }
.cl-ma .mini { display: inline-flex; align-items: center; gap: .3rem; padding: .26rem .62rem; font-size: .78rem; }
.cl-ma .mini svg { width: 12px; height: 12px; }
.cl-mrep { display: flex; gap: .4rem; align-items: flex-start; font-size: .8rem; color: var(--acc); background: var(--acc-soft); border-radius: 9px; padding: .38rem .55rem; }
.cl-mrep svg { width: 13px; height: 13px; flex: none; margin-top: .15rem; }
.cl-mquote { padding: .55rem .7rem; border-radius: 10px; background: var(--glass-in-bg, var(--neu-bg)); border: 1px solid var(--line); margin: 0 0 .7rem; font-size: .86rem; }
.cl-rdlg textarea { width: 100%; padding: .6rem .7rem; border: 1px solid var(--line); border-radius: 9px; font: inherit; box-sizing: border-box; }
@media (max-width: 1180px) { .cl-top2 { flex-direction: column; align-items: stretch; } .cl-msgp { flex: none; width: 100%; } }
.cl-pop { position: relative; border: 1px solid var(--line); border-radius: 10px; padding: .9rem 1.1rem; margin: .4rem 0 .7rem; }
.cl-pop > .res-x { top: .65rem; right: .65rem; }  /* křížek s odstupem, ne nalepený na roh */
.cl-pills { display: flex; gap: .4rem; flex-wrap: wrap; margin: 0 0 .7rem; padding-right: 2.6rem; }
.rest tr.rowlink { cursor: pointer; }
.rest tr.rowlink:hover > td { background: var(--acc-soft); }
@media (min-width: 921px) and (max-width: 1500px) {
  table.t.rest { font-size: .85rem; }
  table.t.rest td { padding: .5rem .35rem; }
  table.t.rest th { padding: .4rem .35rem; }
  table.t.rest .tag { font-size: .72rem; padding: .16rem .5rem; }
}
/* užší desktopy: ještě kompaktnější, ať se tabulka vejde BEZ posuvníku —
   stavové hlášky zůstávají jednořádkové, zalomit se smí jen štítek Zdroj a tlačítka */
@media (min-width: 921px) and (max-width: 1430px) {
  table.t.rest { font-size: .8rem; }
  table.t.rest td { padding: .45rem .26rem; }
  table.t.rest th { padding: .35rem .26rem; letter-spacing: .8px; }
  table.t.rest .tag { font-size: .68rem; padding: .13rem .42rem; }
  table.t.rest .row-actions { white-space: normal; text-align: right; }
  table.t.rest .row-actions .mini { margin: 0 0 .3rem .3rem; padding: .26rem .5rem; font-size: .76rem; }
}
/* ---------- Mobil ≤ 920 px: tabulky jako karty (přepsáno 26. 9. 2026, mobilní optimalizace) ----------
   Dřív každá buňka = vlastní řádek „POPISEK   hodnota" → jedna rezervace zabrala celou obrazovku (Marco: „extrémně
   roztahané"). Nově buňky tečou za sebou jako text (popisek drobně před hodnotou), takže se záznam vejde do 2–4 řádků;
   akce jdou pod záznam. Konkrétní tabulky (rezervace, úklidy, poplatky) mají vlastní rozvržení níže. */
@media (max-width: 920px) {
  table.t.rest, table.t.rest tbody { display: block; width: 100%; }
  table.t.rest tr { display: block; border: 1px solid var(--hair); border-radius: 12px; margin: .5rem 0; padding: .45rem .8rem .5rem; line-height: 1.4; }
  table.t.rest tr:first-child { display: none; }     /* hlavička — popisky nesou buňky samy */
  table.t.rest td { display: inline-block; vertical-align: baseline; border-bottom: 0; padding: .05rem .55rem .05rem 0; max-width: 100%; white-space: normal; overflow-wrap: anywhere; font-size: .86rem; }
  table.t.rest td:empty { display: none; }
  table.t.rest td[data-l]::before { content: attr(data-l); font-size: .58rem; text-transform: uppercase; letter-spacing: .8px; font-weight: 600; color: var(--faint); margin-right: .3rem; white-space: nowrap; }
  table.t.rest td > .chev2 { margin-right: .1rem; }
  table.t.rest .tag { font-size: .7rem; padding: .12rem .45rem; }
  table.t.rest .row-actions { display: block; text-align: left; padding: .35rem 0 0; white-space: normal; }
  table.t.rest .row-actions .mini { margin: 0 .4rem .25rem 0; }
  table.t.rest td[colspan], table.t.rest tr.gdet > td, table.t.rest tr.msec > td { display: block; padding: .3rem 0; }
  table.t.rest tr.msec { border: 0; background: none; padding: .1rem 0; margin: .7rem 0 .1rem; }
  table.t.rest tr.msec > td { background: none; padding: 0; }
  table.t.rest tr.gdet { border-color: var(--acc); }
  table.t.rest tr.gdet > td { background: none; }
  table.t.rest tr.rowlink:hover > td, table.t.rest tr.rowx:hover td { background: transparent; }
  table.t.rest tr.res-detail { padding: 0; overflow: hidden; border-color: var(--acc); }
  table.t.rest tr.res-detail > td { display: block; }
  table.rest-res { table-layout: auto; }
  table.rest-res td { white-space: normal; overflow: visible; text-overflow: clip; }
  /* evidenční kniha: sloupce schované container query (adresa, doklad, osvobození) na mobilu zase vidět — karta má místa dost */
  table.rest-ev td:not([colspan]), table.rest-ev-all td:not([colspan]) { display: inline-block !important; }
  table.rest-ev tr.gdet > td, table.rest-ev-all tr.gdet > td { display: block !important; }
  table.rest-ev .nosig, table.rest-ev-all .nosig { display: inline-block; }
  /* evidenční kniha: jméno hned za pořadovým číslem (ve sloupcích je až za daty), odpuštěný poplatek = žlutá celá karta */
  table.t.rest.rest-ev tr, table.t.rest.rest-ev-all tr { display: flex; flex-wrap: wrap; align-items: baseline; gap: .05rem .55rem; }
  table.t.rest.rest-ev td, table.t.rest.rest-ev-all td { padding: 0; }
  table.t.rest.rest-ev td:nth-child(1), table.t.rest.rest-ev-all td:nth-child(1) { order: -3; }
  table.t.rest.rest-ev td:nth-child(2), table.t.rest.rest-ev-all td:nth-child(2) { order: -2; margin-right: -.3rem; }
  table.t.rest.rest-ev td:nth-child(5), table.t.rest.rest-ev td:nth-child(6), table.t.rest.rest-ev-all td:nth-child(6), table.t.rest.rest-ev-all td:nth-child(7) { order: -1; }
  table.t.rest.rest-ev td:nth-child(5), table.t.rest.rest-ev-all td:nth-child(6) { margin-right: -.3rem; }
  table.t.rest.rest-ev tr.gdet, table.t.rest.rest-ev-all tr.gdet, table.t.rest.rest-ev tr.msec, table.t.rest.rest-ev-all tr.msec { display: block; }
  table.t.rest.rest-ev tr:first-child, table.t.rest.rest-ev-all tr:first-child { display: none; }
  table.t.rest tr.ev-waiv { background: var(--warn-bg); }
  table.t.rest tr.ev-waiv td { background: none; }
  .tscroll:has(> table.t.rest), .tscroll:has(> table.cl-t) { overflow: visible; }   /* karty posuvník nepotřebují; ostatní tabulky ho mají dál */
  table.t.rest.inv-t td:first-child, table.t.rest.en-all td:first-child { display: block; font-size: .95rem; }   /* číslo dokladu / měřidlo jako nadpis karty */
  table.t.rest td br { display: none; }   /* dvouřádkové buňky (měřidlo + druh, dodavatel + produkt) tečou v jednom řádku */
  table.t.rest td br + .who::before { content: ' · '; }
  table.t.rest.en-all .en-alls, table.t.rest.en-all .en-fixd { display: inline; margin: 0; }
  table.t.rest.en-all .en-alls::before, table.t.rest.en-all .en-fixd::before { content: ' · '; color: var(--faint); }
  /* Rezervace: karta = jméno + stav vpravo · apartmán · platforma · termín · noci · osoby · pod tím štítky odbavení; celá karta se otevírá klepnutím */
  table.t.rest.rest-res tr { position: relative; padding: .5rem 1.6rem .55rem .8rem; }
  table.t.rest.rest-res tr.rowlink::after { content: '›'; position: absolute; right: .7rem; top: .35rem; color: var(--faint); font-size: 1.25rem; line-height: 1; }
  table.t.rest.rest-res tr.res-detail { padding: 0; }
  table.t.rest.rest-res td { display: inline; padding: 0; }
  table.t.rest.rest-res td:nth-child(1) { display: block; font-size: .95rem; padding-right: 6.2rem; margin-bottom: .1rem; }
  table.t.rest.rest-res td:nth-child(7) { position: absolute; right: 1.6rem; top: .55rem; }
  table.t.rest.rest-res td:nth-child(7)::before, table.t.rest.rest-res td:nth-child(3)::before, table.t.rest.rest-res td:nth-child(5)::before, table.t.rest.rest-res td:nth-child(6)::before { content: none; }
  table.t.rest.rest-res td:nth-child(2)::after, table.t.rest.rest-res td:nth-child(3)::after, table.t.rest.rest-res td:nth-child(4)::after, table.t.rest.rest-res td:nth-child(5)::after { content: ' · '; color: var(--faint); }
  table.t.rest.rest-res td:nth-child(6)::after { content: '\A'; white-space: pre; }
  table.t.rest.rest-res td:nth-child(n+8):nth-child(-n+12) { display: inline-block; margin: .3rem .55rem 0 0; padding: 0; }
  table.t.rest.rest-res td:nth-child(n+8):nth-child(-n+12)::before { margin-right: .25rem; }
  table.t.rest.rest-res td:nth-child(3) .tag { font-size: .78rem; padding: 0; background: none; color: var(--mut); }
  table.t.rest.rest-res td.row-actions { display: none; }
  table.t.rest.rest-res .mob-only { display: inline; }
  table.t.rest.rest-res .dt-only { display: none; }
}

/* ---------- přihlašovací obrazovky ---------- */
.wrap { max-width: 520px; margin: 9vh auto; padding: 0 1rem; }
.wrap .card { padding: 1.7rem 1.8rem; }
.wrap h1 { font-size: 1.45rem; letter-spacing: -0.02em; }
.links { margin-top: 1.1rem; font-size: .9rem; text-align: center; color: var(--mut); }
/* registrace (4. 10. 2026): souhlas = zaškrtávátko + JEDEN odstavec textu s odkazy (dřív byl každý odkaz samostatný sloupec flexu);
   vysvětlivka k názvu účtu pod polem; ověření Cloudflare se na úzkém telefonu nesmí vylít z karty */
.reg-hint { margin: .35rem 0 0; line-height: 1.45; }
.dash-tchk.reg-terms { align-items: flex-start; gap: .6rem; margin: 1rem 0 .2rem; font-size: .86rem; line-height: 1.5; cursor: pointer; }
.dash-tchk.reg-terms input { flex: 0 0 auto; margin: .2rem 0 0; width: 1.05rem; height: 1.05rem; }
.dash-tchk.reg-terms span { min-width: 0; }
.dash-tchk.reg-terms a { white-space: nowrap; }
/* řádek ověření „nejste robot“ (22. 10. 2026): mléčné sklo v našem vzhledu místo šedého okénka Cloudflaru v bílém pruhu; okénko Cloudflaru
   (appearance: interaction-only, 300 × 65) je uvnitř a ukáže se jen ve stavu .ask, se zaoblenými rohy */
/* 22. 10. 2026 večer (plátno „Ověření B · Okénko je celý řádek“): řádek má ve všech stavech výšku 65 px = výška okénka Cloudflaru
   (velikost „flexible“, 100 % šířky). Ve stavu „ask“ se hlavička schová a okénko je celým řádkem — sklo je jen rámeček kolem něj,
   jeho vlastní 1px šedý rámeček je posunutý pod náš (margin -1px + overflow hidden). Tlačítka pod řádkem tak neposkakují. */
.reg-cfrow { margin-top: .9rem; height: 65px; box-sizing: border-box; border-radius: 12px; overflow: hidden; display: flex; flex-direction: column; justify-content: center;
  background: var(--glass-bg); border: 1px solid var(--glass-edge); box-shadow: var(--glass-shadow); }
.reg-cfrow[hidden] { display: none; }
.reg-cfrow-h { display: flex; align-items: center; gap: .55rem; padding: 0 .8rem; font-size: .86rem; line-height: 1.35; }
.reg-cfrow-ic { flex: 0 0 auto; width: 22px; height: 22px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; }
.reg-cfrow-ic .reg-ic { width: 14px; height: 14px; color: currentColor; }
.reg-cfrow-t { flex: 1 1 auto; min-width: 0; font-weight: 500; }
.reg-cfrow-by { flex: 0 0 auto; font-size: .7rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--faint); }
.reg-cfrow.run .reg-cfrow-t { color: var(--mut); }
.reg-cfrow-spin { width: 14px; height: 14px; border-radius: 50%; border: 2px solid var(--acc-soft); border-top-color: var(--acc); animation: regSpin .8s linear infinite; }
@keyframes regSpin { to { transform: rotate(360deg); } }
.reg-cfrow.ok .reg-cfrow-ic { background: var(--ok); color: #fff; }
.reg-cfrow.ask .reg-cfrow-ic { background: var(--acc-soft); color: var(--acc); }
.reg-cfrow.warn .reg-cfrow-ic { background: var(--warn-bg); color: var(--warn); }
.reg-cfrow.bad .reg-cfrow-ic { background: var(--err-bg); color: var(--err); }
.reg-cfrow.bad .reg-cfrow-t { color: var(--err); }
.reg-cfrow.ask { border-color: color-mix(in srgb, var(--acc) 40%, transparent); }
.reg-cfrow.ask .reg-cfrow-h { display: none; }   /* okénko Cloudflaru nese vlastní text i logo — nic nezdvojovat */
.reg-cf { height: 0; overflow: hidden; }          /* mimo „ask“ okénko nezobrazujeme (po „Správně!“ stav říká náš řádek, token už máme) */
.reg-cfrow.ask .reg-cf { height: auto; margin: -1px; }
.reg-cfrow.cmp.ask { height: auto; padding: .6rem; align-items: center; }   /* compact 150 × 140 na velmi úzkém telefonu */
.reg-cfrow.cmp.ask .reg-cf { margin: 0; }
@media (max-width: 560px) {
  .wrap { margin: 4vh auto; }
  .wrap .card { padding: 1.35rem 1.15rem; }
  .dash-tchk.reg-terms a { white-space: normal; }
}
@media (max-width: 400px) { .wrap { padding: 0 .6rem; } }   /* ověření Cloudflare má nejméně 300 px — na telefonu 360 px se musí vejít do karty */

/* ---------- PŘIHLÁŠENÍ — „Ulice podle denní doby“ (Marco 16. 10. 2026, návrh 3 z plátna Přihlášení Ubyo; kód lgShell v app/js/prihlaseni.js) ----------
   Celostránková scéna: obloha podle fáze dne (.lg-rano / -den / -vecer / -noc), slunce nebo měsíc (.lg-orb — polohu na oblouku nastavuje JS),
   hvězdy jen v noci, dole ulice domů (SVG .lg-street; okna .on svítí večer a v noci, .lg-ready = rozsvícený prostřední dům po vyplnění).
   Barvy jsou pevné, nezávislé na vzhledu: přihlášení je vždy světlé (themeApply('light')) a karta má vlastní barvy polí, takže přepnutí
   na vzhled uživatele těsně před úvodní animací (lgLeave) není na kartě vidět. */
.wrap.lg-wrap { max-width: none; margin: 0; padding: 0; }
.lg { position: relative; overflow: hidden; min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; align-items: center;
  padding: 28px 40px 300px; box-sizing: border-box; color: #1d1d1f; }
.lg-rano { background: linear-gradient(180deg, #bcd3ff 0%, #e6e3f7 45%, #ffe0c2 82%, #fff0e0 100%); }
.lg-den { background: linear-gradient(180deg, #8fb8ff 0%, #c7dcff 50%, #eef3fc 100%); }
.lg-vecer { background: linear-gradient(180deg, #1f2a5c 0%, #4b3f86 40%, #c8708a 72%, #f2a477 90%, #f8c99a 100%); }
.lg-noc { background: linear-gradient(180deg, #050a1a 0%, #0c1734 55%, #162650 100%); }
.lg-sky { position: absolute; inset: 0; pointer-events: none; }
.lg-orb { position: absolute; left: 0; top: 0; width: 150px; height: 150px; border-radius: 50%; opacity: 0; transition: opacity .5s; will-change: transform;
  background: radial-gradient(circle, #fffbea 0%, #ffe9a8 22%, rgba(255, 214, 130, .5) 38%, rgba(255, 200, 120, 0) 70%); }
.lg-orb.on { opacity: 1; }
.lg-rano .lg-orb { background: radial-gradient(circle, #fff6d8 0%, #ffd38a 24%, rgba(255, 190, 110, .5) 40%, rgba(255, 200, 120, 0) 70%); }
.lg-vecer .lg-orb { width: 200px; height: 200px; background: radial-gradient(circle, #ffe3b0 0%, #ff9d5c 26%, rgba(255, 140, 80, .45) 42%, rgba(255, 120, 80, 0) 70%); }
.lg-moon .lg-orb { width: 58px; height: 58px; background: none; box-shadow: inset -15px 6px 0 0 #f3ecd6; filter: drop-shadow(0 0 16px rgba(243, 236, 214, .5)); }
.lg-stars { position: absolute; left: 0; right: 0; top: 0; height: 60%; display: none; }
.lg-stars i { position: absolute; width: 3px; height: 3px; border-radius: 50%; background: #fff; animation: lgTw 3.2s ease-in-out infinite; }
.lg-stars i:nth-child(3n) { width: 2px; height: 2px; }
.lg-noc .lg-stars { display: block; animation: lgFade 1.6s ease .9s both; }
@keyframes lgTw { 0%, 100% { opacity: .25; } 50% { opacity: 1; } }
@keyframes lgFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes lgRise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
/* výška ulice roste se šířkou (poměr kresby 1440 : 300), min-height = výška pro užší okna, kde „slice“ ořízne jen boky. Dřív pevných 300 px
   (230 na nižším notebooku): v okně širším než 1440 bodů se kresba zvětšila podle šířky a „slice“ jí usekl vršek — po zmenšení na 90 %
   (stránka je o 11 % širší) byly na notebooku střechy rovně seříznuté (Marco 20. 10. 2026). Kresba sahá až k y = 40 (máj), proto celá výška.
   V nízkém okně, kde by karta zakryla „váš“ dům, výšku přepíše lgFit (prihlaseni.js / sadmin.js) a po stranách se ukážou kopie ulice (lgTile). */
.lg-street { position: absolute; left: 0; bottom: 0; width: 100%; height: auto; aspect-ratio: 1440 / 300; min-height: 300px; display: block; pointer-events: none; }
.lg-street .b, .lg-street .f, .lg-street .w, .lg-street .g, .lg-street .d, .lg-street .c { transition: fill .8s; }
.lg-rano .lg-street .b { fill: #c9cce8; } .lg-rano .lg-street .f { fill: #a8b1d9; } .lg-rano .lg-street .w { fill: #eef0fb; } .lg-rano .lg-street .g, .lg-rano .lg-street .c { fill: #959fcd; } .lg-rano .lg-street .d { fill: #8790c2; }
.lg-den .lg-street .b { fill: #b7cbf0; } .lg-den .lg-street .f { fill: #93ade0; } .lg-den .lg-street .w { fill: #eef4ff; } .lg-den .lg-street .g, .lg-den .lg-street .c { fill: #7f99cf; } .lg-den .lg-street .d { fill: #7088bf; }
.lg-vecer .lg-street .b { fill: #3a3468; } .lg-vecer .lg-street .f { fill: #25254f; } .lg-vecer .lg-street .w { fill: #3b3d70; } .lg-vecer .lg-street .w.on { fill: #ffc56b; } .lg-vecer .lg-street .g, .lg-vecer .lg-street .c { fill: #1b1a3f; } .lg-vecer .lg-street .d { fill: #17173a; }
.lg-noc .lg-street .b { fill: #111c3c; } .lg-noc .lg-street .f { fill: #0a1230; } .lg-noc .lg-street .w { fill: #17244c; } .lg-noc .lg-street .w.on { fill: #ffcf7a; } .lg-noc .lg-street .g, .lg-noc .lg-street .c { fill: #060c22; } .lg-noc .lg-street .d { fill: #050a1c; }
.lg-street .hg { opacity: 0; transition: opacity 1s; }
.lg-ready .lg-street .hw { fill: #ffcf7a; } .lg-ready .lg-street .hg { opacity: 1; }
/* logo ve štítu + odchod ze scény po přihlášení (přílet loga, Marco 20. 10. 2026; introStart(cap, from) v prihlaseni.js): záře kolem loga
   ve štítu se rozsvítí s domem; .lg-going = scéna je už pod překryvem úvodní animace — karta, pozdrav a slunce zmizí, ulice klesne
   a logo ve štítu nahradí letící kopie v překryvu (stejná velikost i místo, proto se schová hned) */
.lg-street .lg-gg { opacity: 0; transition: opacity 1s; }
.lg-ready .lg-street .lg-gg { opacity: .5; }
.lg-going .lg-street .lg-gg { opacity: 1; transition: opacity .26s; }
.lg-going .lg-street .lg-gt { opacity: 0; }
.lg-going .lg-head, .lg-going .lg-hello, .wrap .lg-going .card.lg-card { animation: lgOut .35s ease forwards; }
@keyframes lgOut { from { opacity: 1; transform: none; filter: blur(0); } to { opacity: 0; transform: translateY(10px) scale(.985); filter: blur(4px); } }
.lg-going .lg-orb.on { opacity: 0; transition: opacity .6s; }
.lg-going .lg-stars, .lg-noc.lg-going .lg-stars { animation: pxiOut .6s ease forwards; }
.lg-going .lg-street { animation: lgSink 1.2s cubic-bezier(.5,0,.3,1) forwards; }
@keyframes lgSink { to { transform: translateY(14px); } }
/* ODHLÁŠENÍ — „Návrat domů“ (Marco 22. 10. 2026: návrh 2 z plátna Odhlášení 4KoeCbmARLUEt8RPVHBRfD; lgByeBegin / lgByeRun v prihlaseni.js).
   .px-bye-old = mizející aplikace (přesunutá z #root), .px-bye-fly = logo letící z menu do štítu (Web Animations). Na scéně: .lg-bye = výchozí stav
   (dům ještě svítí, štít prázdný), .lg-run = časová osa (s od vykreslení přihlášení, celé 2,8 s), .lg-landed = logo dosedlo, .lg-byed = po dohrání
   (zůstává rozloučení a při .lg-keep lucerna nade dveřmi). Prvky .lb v kresbě ulice jsou mimo odhlášení skryté. */
.px-bye-old { position: fixed; inset: 0; z-index: 9500; overflow: hidden; pointer-events: none; background: var(--body-bg); animation: pxByeOld .5s ease forwards; }
@keyframes pxByeOld { to { opacity: 0; filter: blur(10px); transform: scale(.985); } }
.px-bye-fly { position: fixed; z-index: 9600; pointer-events: none; }
.px-bye-fly div { width: 100%; height: 100%; transform-origin: 50% 50%; }
.px-bye-fly svg { display: block; width: 100%; height: 100%; overflow: visible; }
.lg-street .lb { display: none; }
.lg-bye .lg-street .lb-hl, .lg-bye .lg-street .lb-dl, .lg-bye .lg-street .lb-lk, .lg-bye.lg-keep .lg-street .lb-lan, .lg-byed.lg-keep .lg-street .lb-lan { display: inline; }
.lg-street .lb-hl, .lg-street .lb-dl { fill: #ffcf7a; }
.lg-street .lb-lan-b { fill: #ffe2a6; } .lg-street .lb-lan-r { fill: #5a5f78; }
.lg-bye .lg-street .hg { opacity: 1; }
.lg-bye .lg-street .lg-gg { opacity: .5; }
.lg-bye .lg-street .lg-gt { opacity: 0; }
.lg-bye.lg-landed .lg-street .lg-gt { opacity: 1; }
.lg-bye .lg-street .lb-lk { opacity: 0; }
.lg-bye .lg-orb { transition: opacity .8s ease .7s; }
.lg-run .lg-street { animation: lgByeStreet .9s cubic-bezier(.2, .7, .2, 1) both; }
@keyframes lgByeStreet { from { transform: translateY(14px); } to { transform: none; } }
.lg-run .lg-head { animation: lgRise .6s cubic-bezier(.2, .7, .2, 1) 1.95s both; }
.lg-run .lg-hello { animation-delay: 2.05s; }
.wrap .lg-run .card.lg-card { animation-delay: 2.17s; }
.lg-run .lg-street .lg-gg { animation: lgByeBeacon .8s ease 1.2s both; }
@keyframes lgByeBeacon { 0% { opacity: .5; } 28% { opacity: 1; } 100% { opacity: 0; } }
.lg-run .lg-street .hg { animation: pxiOut .7s ease 1.6s both; }
.lg-run .lg-street .lb-hl { animation: lgByeOff .3s linear both; }
.lg-run .lg-street .lb-hl1 { animation-delay: 1.55s; } .lg-run .lg-street .lb-hl2 { animation-delay: 1.7s; }
.lg-run .lg-street .lb-hl3 { animation-delay: 1.85s; } .lg-run .lg-street .lb-hl4 { animation-delay: 2s; }
/* centrála superadminu (sadmin.js): patra zhasínají shora dolů, přízemí se vchodem naposled */
.lg-run .lg-street .lb-fl1 { animation-delay: 1.5s; } .lg-run .lg-street .lb-fl2 { animation-delay: 1.64s; } .lg-run .lg-street .lb-fl3 { animation-delay: 1.78s; }
.lg-run .lg-street .lb-fl4 { animation-delay: 1.92s; } .lg-run .lg-street .lb-fl5 { animation-delay: 2.06s; }
@keyframes lgByeOff { 0% { opacity: 1; } 25% { opacity: .25; } 45% { opacity: .9; } 100% { opacity: 0; } }
.lg-run .lg-street .lb-dl { animation: pxiOut .22s ease 2.12s both; }
.lg-run .lg-street .lb-lk { transform-box: fill-box; transform-origin: 50% 50%; animation: lgByeLock .5s ease-in-out 2.25s both; }
@keyframes lgByeLock { 0% { opacity: 0; transform: scale(0) rotate(0); } 50% { opacity: 1; transform: scale(1.4) rotate(45deg); } 100% { opacity: 0; transform: scale(0) rotate(90deg); } }
.lg-keep .lg-street .lb-lan-g { animation: lgByeLan 2.6s ease-in-out infinite; }
@keyframes lgByeLan { 0%, 100% { opacity: 1; } 50% { opacity: .6; } }
@media (prefers-reduced-motion: reduce) { .lg-keep .lg-street .lb-lan-g { animation: none; } }
.lg-head { position: relative; z-index: 1; width: 100%; max-width: 1200px; display: flex; align-items: center; }
/* logo = odkaz na web v jazyce obrazovky (Marco 18. 10. 2026); klikací je jen logo se slovem, ne celý pruh hlavičky */
.lg-home { display: inline-flex; align-items: center; gap: 10px; color: inherit; text-decoration: none; border-radius: 10px; }
.lg-home:focus-visible { outline: 2px solid #4f8cff; outline-offset: 4px; }
.lg-head .sb-logo { width: 36px; height: 36px; border-radius: 9px; }
.lg-head .sb-word { color: #1d1d1f; }
.lg-head .sb-word svg { height: 22px; }
.lg-vecer .lg-head .sb-word, .lg-noc .lg-head .sb-word { color: #fff; }
.lg-hello { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 10px; margin-top: 34px; text-align: center;
  animation: lgRise .6s cubic-bezier(.2, .7, .2, 1) both; }
.wrap h1.lg-hi { margin: 0; font-size: 3.6rem; line-height: 1.05; font-weight: 700; letter-spacing: -.03em; color: #1d1d1f; }
.lg-sub { margin: 0; font-size: 1.12rem; line-height: 1.45; color: #454552; }
.lg-vecer h1.lg-hi, .lg-noc h1.lg-hi { color: #fff; text-shadow: 0 2px 18px rgba(5, 10, 26, .35); }
.lg-vecer .lg-sub, .lg-noc .lg-sub { color: rgba(255, 255, 255, .88); text-shadow: 0 1px 10px rgba(5, 10, 26, .3); }
/* karta = sklo (Marco 16. 10. 2026 večer: „více glass, malinko průhlednější, skleněně s jemným nádechem“): průsvitná výplň s jemným
   modrým nádechem, lesk vlevo nahoře (::before), světlá hrana a rozmazané pozadí. Ve dne světlé sklo s tmavým písmem; večer a v noci
   (.lg-dark) kouřové sklo se světlým písmem a skleněnými poli — světlé sklo by na tmavé obloze zešedlo. */
.wrap .card.lg-card { position: relative; z-index: 1; width: 100%; max-width: 420px; margin-top: 26px; padding: 1.6rem 1.85rem 1.4rem; border-radius: 24px; color: #1d1d1f;
  background: linear-gradient(150deg, rgba(255, 255, 255, .58) 0%, rgba(236, 243, 255, .30) 48%, rgba(255, 255, 255, .40) 100%); border: 1px solid rgba(255, 255, 255, .6);
  box-shadow: 0 24px 60px rgba(16, 32, 80, .16), inset 0 1px 0 rgba(255, 255, 255, .85), inset 0 -1px 0 rgba(255, 255, 255, .25), inset 0 0 24px rgba(255, 255, 255, .18);
  -webkit-backdrop-filter: blur(20px) saturate(1.8); backdrop-filter: blur(20px) saturate(1.8); animation: lgRise .6s cubic-bezier(.2, .7, .2, 1) .12s both; }
.wrap .card.lg-card::before { content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  background: radial-gradient(120% 70% at 0% 0%, rgba(255, 255, 255, .45), rgba(255, 255, 255, 0) 55%); }
.lg-card > * { position: relative; }   /* obsah nad leskem */
.wrap .card.lg-card.lg-solo { margin-top: 8vh; }
.lg-card > label:first-child { margin-top: 0; }
.lg-card label { color: #4a4a55; }
.lg-card .sub { color: #4a4a55; }
.lg-card input:not([type="checkbox"]):not([type="radio"]) { background: rgba(255, 255, 255, .72); border-color: rgba(255, 255, 255, .85); color: #1d1d1f; height: 2.75rem; border-radius: 12px;
  box-shadow: inset 0 1px 2px rgba(16, 32, 80, .06); }
.lg-card input::placeholder { color: #85858f; }
.lg-card .pw-eye { color: #5f5f69; }
.lg-card a { color: #2f6fed; }
.lg-card button:not(.pw-eye) { background: linear-gradient(180deg, #4a83f5 0%, #2f6fed 100%); color: #fff; border-radius: 12px;
  box-shadow: 0 10px 22px rgba(47, 111, 237, .32), inset 0 1px 0 rgba(255, 255, 255, .4); }
.wrap .lg-dark .card.lg-card { color: #fff; background: linear-gradient(150deg, rgba(255, 255, 255, .20) 0%, rgba(160, 190, 255, .09) 50%, rgba(255, 255, 255, .13) 100%);
  border-color: rgba(255, 255, 255, .24); box-shadow: 0 24px 60px rgba(0, 0, 12, .35), inset 0 1px 0 rgba(255, 255, 255, .32), inset 0 0 24px rgba(255, 255, 255, .06); }
.wrap .lg-dark .card.lg-card::before { background: radial-gradient(120% 70% at 0% 0%, rgba(255, 255, 255, .16), rgba(255, 255, 255, 0) 55%); }
.lg-dark .lg-card label, .lg-dark .lg-card .sub, .lg-dark .lg-card .dash-tchk, .lg-dark .lg-card .links, .lg-dark .lg-hint, .lg-dark .lg-new { color: rgba(255, 255, 255, .8); }
.wrap .lg-dark .lg-card h1 { color: #fff; }
.lg-dark .lg-card input:not([type="checkbox"]):not([type="radio"]) { background: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .28); color: #fff; box-shadow: inset 0 1px 2px rgba(0, 0, 0, .14); }
.lg-dark .lg-card input:focus { outline-color: #9cc0ff; }
.lg-dark .lg-card input::placeholder { color: rgba(255, 255, 255, .48); }
/* automatické vyplnění na přihlášení: dřív jen input:-webkit-autofill — slabší selektor než pravidlo polí výše, jehož box-shadow (vnitřní stín) vyhrál,
   takže žlutá zůstala a písmo bylo bílé (Marco 18. 10. 2026, iPhone večer). Ve dne bílé sklo s tmavým písmem, večer a v noci kouřové s bílým. */
.lg-card input:not([type="checkbox"]):not([type="radio"]):-webkit-autofill { -webkit-text-fill-color: #1d1d1f; caret-color: #1d1d1f; box-shadow: 0 0 0 1000px #f4f6fb inset; }
.lg-dark .lg-card input:not([type="checkbox"]):not([type="radio"]):-webkit-autofill { -webkit-text-fill-color: #fff; caret-color: #fff; box-shadow: 0 0 0 1000px rgb(52, 58, 104) inset; }
.lg-dark .lg-card .pw-eye, .lg-dark .lg-card .pw-eye:hover { color: rgba(255, 255, 255, .75); }
.lg-dark .lg-card .pw-eye.on { color: #9cc0ff; }
.lg-dark .lg-card a { color: #a9c6ff; }
.lg-dark .lg-card .msg.err, .lg-dark .lg-card .msg.ok, .lg-dark .lg-card .msg.info, .lg-dark .lg-card .msg.warn { background: rgba(255, 255, 255, .92); }   /* hláška čitelná i na tmavém skle */
.lg-pwrow { display: flex; align-items: baseline; justify-content: space-between; gap: .6rem; margin: .85rem 0 .3rem; }
.lg-pwrow label { margin: 0; }
.lg-pwrow a { font-size: .8rem; font-weight: 500; }
.lg-card button.lg-go { display: flex; align-items: center; justify-content: center; gap: .5rem; height: 3.05rem; font-size: 1rem; }
.lg-go .reg-ic { width: 18px; height: 18px; color: #fff; }
.lg-hint { margin: .65rem 0 0; text-align: center; font-size: .8rem; color: #4a4a55; }
.lg-new { margin-top: .9rem; padding-top: .9rem; border-top: 1px solid rgba(29, 29, 31, .1); text-align: center; font-size: .9rem; color: #4a4a55; }
.lg-dark .lg-new { border-top-color: rgba(255, 255, 255, .16); }
.lg-new a { font-weight: 500; }
.lg-card .links { color: #6e6e73; }
html[data-theme][data-lg="rano"] { --bar: #bcd3ff; } html[data-theme][data-lg="den"] { --bar: #8fb8ff; }
html[data-theme][data-lg="vecer"] { --bar: #1f2a5c; } html[data-theme][data-lg="noc"] { --bar: #050a1a; }
@media (max-width: 600px) {
  .lg { padding: 22px 16px 210px; }
  .lg-head { justify-content: center; }
  .lg-head .sb-logo { width: 32px; height: 32px; border-radius: 8px; }
  .lg-head .sb-word svg { height: 20px; }
  .lg-hello { margin-top: 26px; gap: 8px; }
  .wrap h1.lg-hi { font-size: 2.5rem; }
  .lg-sub { font-size: 1rem; max-width: 300px; }
  .wrap .card.lg-card { margin-top: 20px; padding: 1.3rem 1.2rem 1.2rem; }
  .wrap .card.lg-card.lg-solo { margin-top: 5vh; }
  .lg-street { min-height: 200px; }
  .lg-orb { width: 110px; height: 110px; }
  .lg-vecer .lg-orb { width: 150px; height: 150px; }
  .lg-moon .lg-orb { width: 44px; height: 44px; box-shadow: inset -11px 5px 0 0 #f3ecd6; }
}
@media (min-width: 601px) and (max-height: 820px) {   /* nižší notebook (1280 × 720/800): ulice musí zůstat vidět bez rolování */
  .lg { padding-bottom: 150px; }
  .lg-hello { margin-top: 16px; }
  .wrap h1.lg-hi { font-size: 3rem; }
  .wrap .card.lg-card { margin-top: 20px; }
  .lg-street { min-height: 230px; }
}
/* malý notebook (1280 × 720, 1366 × 768 s lištami prohlížeče, Marco 20. 10. 2026): hustší horní část a menší rezerva pod kartou — ulici
   tu stejně sníží lgFit, aby „váš“ dům byl celý pod kartou; 124 px = dům v polovině velikosti (220 × 0,5) + mezera, scéna se tak vejde bez rolování */
@media (min-width: 601px) and (max-height: 700px) {
  .lg { padding-top: 16px; padding-bottom: 124px; }
  .lg-hello { margin-top: 6px; }
  .wrap h1.lg-hi { font-size: 2.6rem; }
  .wrap .card.lg-card { margin-top: 14px; }
}
@media (prefers-reduced-motion: reduce) { .lg-hello, .wrap .card.lg-card, .lg-noc .lg-stars, .lg-stars i { animation: none; } }

/* ============================================================
   Rozvržení aplikace: levý sidebar + obsah
   ============================================================ */
.shell { display: flex; min-height: 100vh; }
.px-ptr { display: none; }   /* pás „přetažení = obnovit“ jen na telefonu (pravidla v mobilní bráně níže) */
#px_bar { display: none; }   /* pás pro barvu stavového řádku telefonu — jen v mobilní bráně níže (na počítači nic nemění) */
/* Telefon: stránka se nikdy neposouvá do stran (Marco 8. 10. 2026, nahrávka Přehledu v Safari na iPhonu: celý Přehled i s hlavičkou
   šel odtáhnout doleva a obsah byl vpravo seříznutý). Obal .shell případný přetok do šířky ořízne (clip = bez posuvníku a bez vlivu
   na lepivou hlavičku .mhead — hidden by z obalu udělal rolovací prvek a hlavička by přestala držet), kořen dokumentu vodorovné
   rolování zakáže a dotyk smí stránkou jen rolovat svisle nebo ji zvětšovat. Jen za mobilní bránou, PC zobrazení se nemění. */
@media (max-width: 920px) {
  html { overflow-x: hidden; }
  body { touch-action: pan-y pinch-zoom; overscroll-behavior-y: contain; }   /* contain: nativní „táhni dolů = obnovit“ (Chrome na Androidu) vypnuté — má ho aplikace sama (start.js pullRefresh) */
  .shell { overflow-x: clip; }
  .shell img { max-width: 100%; }
  /* Stavový řádek telefonu v barvě hlavičky (9. 10. 2026, 2. pokus). iOS 26 už meta theme-color nečte: barvu horního okraje si WebKit bere
     z pevného/lepivého prvku pod horním okrajem (LocalFrameView::fixedContainerEdges — bod 4 px pod okrajem, prvek ≥ 90 % šířky a > 10 px
     vysoký, jednobarevné background-color čtené ze stylu). Prvek s backdrop-filter = „více barev“ → výchozí černá/bílá podle systému, a to je
     případ skleněné hlavičky .mhead. Proto tenhle prakticky neviditelný pás nad vším: krytí 11 % je těsně nad prahem 10 %, pod kterým ho
     WebKit přeskočí; barva se bere z background-color, ne z pixelů, takže lišta dostane plnou barvu. WebKit barvu přepočítá jen při
     přidání/odebrání pevného prvku → themeApply (zaklad.js) pás po změně vzhledu vyjme a hned vrátí. Chrome na Androidu dál čte theme-color. */
  #px_bar { display: block; position: fixed; top: 0; left: 0; right: 0; height: 12px; z-index: 2147483647; pointer-events: none; opacity: .11; background-color: var(--bar); }
  /* iOS přibližuje stránku při klepnutí do pole s písmem pod 16 px (základ je .95rem = 15,2 px): po přihlášení zůstal Přehled přiblížený
     a seříznutý vpravo, dokud ho Marco prsty neoddálil (video 9. 10. 2026). Na telefonu mají proto všechna pole rovných 16 px. */
  input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]), select:not([multiple]):not([size]), textarea:not([hidden]) { font-size: 16px; }
  /* přetažení shora dolů = obnovit — návrh 7 „Vrtulka a hvězdičky“ (Marco 8. 10. 2026, plátno 2tkSBqrLSajRr1tk6UhFk2): pás v toku stránky hned pod
     lepivou hlavičkou (.mhead) odsouvá obsah dolů; v něm dlaždice loga, která se s prstem zvětšuje a narovnává, po prahu se rozsvítí (.ready),
     po puštění se točí naplocho a po každé otočce malinko zatřepe (.spin, smyčka až do načtení dat), pak se nafoukne a roztříští do osmi
     hvězdiček (.burst) a pás se složí. Tažení (.drag) bez přechodů — výšku a natočení řídí prst (start.js pullRefresh). */
  /* přetažení od levé hrany = zpět (Marco 9. 10. 2026, start.js swipeBack): obsah sekce jede s prstem doprava, u jeho levé hrany lehký stín
     (hloubka jako u vrstvy nad předchozí sekcí); po puštění za prahem dojede a předchozí sekce vyjede. Jen za mobilní bránou. */
  #view.px-swipe { will-change: transform; box-shadow: -12px 0 30px rgba(0, 0, 0, .16); border-radius: 14px 0 0 14px; }
  @media (prefers-reduced-motion: reduce) { #view.px-swipe { box-shadow: none; } }
  .px-ptr { display: flex; align-items: center; justify-content: center; height: 0; overflow: visible; position: relative; z-index: 2;
    transition: height .28s cubic-bezier(.3,.7,.3,1.1); pointer-events: none; }
  .px-ptr.drag, .px-ptr.drag .px-ptr-lg { transition: none; }
  .px-ptr-st { position: relative; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; }
  .px-ptr-lg { width: 44px; height: 44px; border-radius: 12px; opacity: 0; transform: scale(.3) rotate(-20deg); will-change: transform, opacity;
    transition: transform .25s cubic-bezier(.3,.7,.3,1.3), box-shadow .25s ease, opacity .2s ease; }
  .px-ptr-lg svg.sb-logo { width: 44px; height: 44px; border-radius: 12px; box-shadow: none; }
  .px-ptr.ready .px-ptr-lg { box-shadow: 0 0 0 6px var(--acc-soft), 0 0 26px color-mix(in srgb, var(--acc) 60%, transparent); }
  .px-ptr.spin .px-ptr-lg { animation: px-ptr-turn 1.04s cubic-bezier(.45,0,.3,1) infinite; }
  @keyframes px-ptr-turn { 0% { transform: rotate(0deg) scale(1); } 70% { transform: rotate(360deg) scale(1); }
    77% { transform: rotate(352deg); } 84% { transform: rotate(368deg); } 92% { transform: rotate(354deg); } 100% { transform: rotate(360deg) scale(1); } }
  .px-ptr.burst .px-ptr-lg { animation: px-ptr-burst .5s cubic-bezier(.45,0,.3,1) forwards; }
  @keyframes px-ptr-burst { 0% { transform: scale(1); opacity: 1; } 35% { transform: scale(1.25); opacity: 1; } 100% { transform: scale(0); opacity: 0; } }
  .px-ptr-star { position: absolute; left: 50%; top: 50%; opacity: 0; transform: translate(-50%, -50%) scale(0); fill: #ffd36a; }
  .px-ptr-star.a { fill: var(--acc); }
  .px-ptr.burst .px-ptr-star { animation: px-ptr-star .75s cubic-bezier(.2,.7,.3,1) .12s forwards; }
  @keyframes px-ptr-star {
    0% { transform: translate(-50%, -50%) translate(0, 0) scale(0) rotate(0deg); opacity: 1; }
    45% { transform: translate(-50%, -50%) translate(var(--dx), var(--dy)) scale(1) rotate(90deg); opacity: 1; }
    100% { transform: translate(-50%, -50%) translate(calc(var(--dx) * 1.35), calc(var(--dy) * 1.35)) scale(.2) rotate(180deg); opacity: 0; } }
  @media (prefers-reduced-motion: reduce) {
    .px-ptr.spin .px-ptr-lg { animation: none; opacity: .75; }
    .px-ptr.burst .px-ptr-lg { animation: none; opacity: 0; }
    .px-ptr.burst .px-ptr-star { animation: none; }
  }
}

.sidebar {
  position: sticky; top: 0;
  width: 236px; flex: 0 0 236px;
  height: 100vh;
  display: flex; flex-direction: column;
  padding: 32px 14px 18px;
  background: var(--sb-bg);
  backdrop-filter: blur(26px) saturate(1.55);
  -webkit-backdrop-filter: blur(26px) saturate(1.55);
  border-right: 1px solid var(--sb-edge);
  overflow-y: auto;
  scrollbar-width: thin;
}
/* ============================================================
   Výchozí velikost zobrazení na PC = 90 % (Marco 20. 10. 2026: „chci mít jako výchozí“ to, co v Safari udělá ⌘− ze Skutečné velikosti).
   Celá aplikace (i přihlášení a okna) se zmenší CSS zoomem. Jen počítač s myší nad mobilní bránou — telefon a tablet beze změny; atribut
   data-pz dává zaklad.js jen prohlížečům s jednotným zoomem (pxZ() tam přepočítává polohy myši a prvků). Jednotky vh se zoomem zmenšují
   taky → co má sahat na celou výšku okna, dělí se --pz. Superadmin, check-in hosta a portál úklidu tento atribut nemají.
   ============================================================ */
@media screen and (min-width: 921px) and (hover: hover) and (pointer: fine) {
  html[data-pz] { --pz: .9; zoom: var(--pz); }
  html[data-pz] .shell { min-height: calc(100vh / var(--pz)); }
  html[data-pz] .sidebar { height: calc(100vh / var(--pz)); }
  html[data-pz] .lg { min-height: calc(100vh / var(--pz)); min-height: calc(100dvh / var(--pz)); }
  html[data-pz] .px-modal { max-height: calc(100dvh / var(--pz) - 48px); }
  html[data-pz] .apt-detail section[data-asec].on { min-height: calc(100vh / var(--pz) - 9rem); }
  html[data-pz] .mail-list { max-height: calc(74vh / var(--pz)); }
  html[data-pz] .np-panel { max-height: calc(100vh / var(--pz) - 92px); }   /* článek Nápovědy (napoveda.css) */
  /* Okénko Cloudflare v registraci jen ve WebKitu (22. 10. 2026 večer; Marco 3×: „nelícuje“ → 90 % šířky, po změně zvětšení Safari přeteklo):
     WebKit dá vnořenému rámečku (iframe) zoom podle toho, jaký má jeho místo ve chvíli VYTVOŘENÍ rámečku, a k zoomu stránky ho přičte ještě jednou
     (obsah 0,9 × 0,9 = 81 %); pozdější změna CSS zoomu předka se do rámečku nepropíše — přepočítá se až při změně zvětšení v prohlížeči (⌘±),
     a pak už platí skutečný zoom místa. Proto: zoom zpět na 1 má .reg-cf VŽDY (i ve stavu „ověřuje se“, kdy se rámeček vytváří), ne jen ve stavu
     „ask“ — rámeček se rodí s efektivním zoomem 1, obsah = celá šířka řádku, a totéž platí i po ⌘±. Žádná kompenzace šířky (ta po ⌘± přetekla).
     Výška řádku = 65 bodů obrazovky (= okénko bez zoomu) ve všech stavech, aby tlačítka neposkakovala. Ověřeno vlastním oknem WebKitu
     (scratchpad cf-test/wk/snap.swift: snímky před a po změně pageZoom), Chromium (bez data-wk) nic nepotřebuje. Platí pro každý cizí rámeček. */
  html[data-pz][data-wk] .reg-cf { zoom: calc(1 / var(--pz)); }
  html[data-pz][data-wk] .reg-cfrow { height: calc(65px / var(--pz)); }
}
/* Marco 10. 9. 2026 v noci: logo o kousek níž a menší mezera pod ním; sekce „Provoz“ zůstává na stejném místě (32 + 42 + 16 = dřívějších 22 + 42 + 26) */
.sb-brand { display: flex; align-items: center; gap: 12px; padding: 0 6px; margin-bottom: 16px; font-size: 15px; font-weight: 600; letter-spacing: -0.02em; }
.sb-logo {
  /* značka Ubyo (10. 9. 2026): ikona aplikace z Marcova návrhu loga jako vektor (assets/ubyo-icon.svg) — viz poznámka u UBYO_LOGO v app/index.html.
     Marco 10. 9. 2026 večer: logo i název větší, v sidebaru je na to místo (30 → 42 px, název 17 → 26 px). */
  width: 42px; height: 42px; border-radius: 9px; flex: 0 0 auto; display: block;
  box-shadow: 0 5px 12px var(--logo-sh);
}
h1.brand-h1 { display: flex; align-items: center; gap: .75rem; letter-spacing: -0.02em; }
h1.brand-h1 .sb-logo { width: 52px; height: 52px; border-radius: 11px; }
/* psaný název z návrhu loga: inline SVG, barva = text (var(--ink)), takže na tmavých vzhledech (Obsidian, Amethyst, Black Gold) je světlý sám od sebe */
.sb-word { display: inline-flex; align-items: center; line-height: 0; color: var(--ink); }
.sb-word svg { height: 26px; width: auto; aspect-ratio: 666 / 269; display: block; fill: currentColor; }
.mhead .sb-logo { width: 34px; height: 34px; border-radius: 8px; }
.mhead .sb-word svg { height: 20px; }
h1.brand-h1 .sb-word svg { height: 34px; }
.sb-grp {
  font-size: 10px; text-transform: uppercase; letter-spacing: 1.2px;
  font-weight: 600; color: var(--faint);
  padding: 0 10px; margin: 16px 0 6px;
}
.sb-grp:first-of-type { margin-top: 0; }
button.sn {
  position: relative;
  width: 100%; margin: 1px 0;
  display: flex; align-items: center; gap: 10px;
  padding: 8px 10px;
  border: 0; border-radius: 9px;
  background: transparent; box-shadow: none;
  font-size: 13.5px; font-weight: 400; color: var(--mut);
  text-align: left; cursor: pointer;
}
@media (hover: hover) { button.sn:hover { background: var(--acc-soft); filter: none; color: var(--ink); } }
button.sn:active { background: var(--acc-soft); filter: none; }
button.sn svg { flex: 0 0 auto; color: var(--faint); }
button.sn.on {
  font-weight: 600; color: var(--ink);
  background: var(--sn-on-bg);
  box-shadow: var(--sn-on-shadow);
}
button.sn.on::before {
  content: ''; position: absolute; left: 0; top: 7px; bottom: 7px;
  width: 2px; border-radius: 1px; background: var(--acc);
}
button.sn.on svg { color: var(--acc); }
.sn-badge {
  margin-left: auto; min-width: 16px; height: 16px;
  border-radius: 8px; background: #d94a3f; color: #fff;
  font-size: 10px; font-weight: 600;
  display: flex; align-items: center; justify-content: center;
  padding: 0 4px;
}
.sb-foot { margin-top: auto; padding-top: 14px; }
.sb-line { height: 1px; background: linear-gradient(90deg, transparent, var(--hair), transparent); margin: 10px 4px; }
.sb-acct {
  width: 100%; margin: 0; padding: 6px 8px;
  display: flex; align-items: center; gap: 10px;
  border: 0; border-radius: 10px;
  background: transparent; box-shadow: none;
  text-align: left; cursor: pointer; color: var(--ink); font: inherit;
}
.sb-acct:hover { background: var(--acc-soft); filter: none; }
.sb-ava img, .ava-big img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; display: block; }
.sb-ava { overflow: hidden; }
.sb-ava {
  width: 32px; height: 32px; flex: 0 0 32px; border-radius: 50%;
  background: linear-gradient(135deg, #4a80f0, #7d5bd6);
  border: 1px solid rgba(255,255,255,0.35);
  display: flex; align-items: center; justify-content: center;
  font-size: 11.5px; font-weight: 600; color: #fff; letter-spacing: 0.02em;
}
.sb-acct .nm { font-size: 13px; font-weight: 600; letter-spacing: -0.01em; line-height: 1.25; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sb-acct .st { font-size: 11.5px; color: var(--mut); line-height: 1.25; }

.content { flex: 1; min-width: 0; padding: 30px 34px 48px; }
#view { max-width: 1400px; margin: 0 auto; } /* obsah vycentrovaný a roztažený na šířku monitoru */

.imp-strip {
  background: #b3382c; color: #fff;
  border-radius: 12px; padding: .6rem 1rem; margin-bottom: 1rem;
  display: flex; align-items: center; gap: .8rem; flex-wrap: wrap;
  font-size: .9rem; font-weight: 500;
}
.imp-strip button { width: auto; margin: 0; padding: .35rem .8rem; background: rgba(255,255,255,0.15); box-shadow: none; border: 1px solid rgba(255,255,255,0.4); font-size: .84rem; }
/* ukázkové prostředí DEMO (4. 10. 2026): záložka v levém sloupci (první 3 dny / natrvalo přepínačem) a proužek nad obsahem, když je ukázka zapnutá */
button.sn.sn-demo { margin-bottom: 8px; color: var(--ink); font-weight: 600; letter-spacing: .05em; background: var(--acc-soft); }
button.sn.sn-demo svg { color: var(--acc); }
.sn-demo-tag { margin-left: auto; font-size: 9.5px; font-weight: 700; letter-spacing: .03em; line-height: 1; padding: 3px 7px; border-radius: 999px; background: var(--acc); color: #fff; white-space: nowrap; }
button.sn.sn-demo.on { background: var(--acc); color: #fff; box-shadow: none; }
button.sn.sn-demo.on::before { display: none; }
button.sn.sn-demo.on svg { color: #fff; }
button.sn.sn-demo.on .sn-demo-tag { background: rgba(255,255,255,0.24); }
button.sn.sn-demo:disabled { opacity: .6; cursor: progress; }
.demo-strip {
  background: var(--acc); color: #fff;
  border-radius: 12px; padding: .6rem 1rem; margin-bottom: 1rem;
  display: flex; align-items: center; gap: .8rem; flex-wrap: wrap;
  font-size: .9rem; line-height: 1.4;
}
.demo-strip .sp { flex: 1; }
.demo-strip .demo-acts { display: flex; gap: .5rem; flex: 0 0 auto; }   /* Začít znovu + Zpět do mého účtu (22. 10. 2026) */
.demo-strip button { width: auto; margin: 0; padding: .35rem .8rem; background: rgba(255,255,255,0.16); box-shadow: none; border: 1px solid rgba(255,255,255,0.45); color: #fff; font-size: .84rem; white-space: nowrap; }
.demo-strip button:hover { background: rgba(255,255,255,0.28); filter: none; }
@media (max-width: 760px) {   /* telefon: text vedle tlačítka, proužek nezabere půl obrazovky */
  .demo-strip { flex-wrap: nowrap; gap: .6rem; padding: .55rem .75rem; font-size: .8rem; line-height: 1.35; }
  .demo-strip .sp { display: none; }
  .demo-strip button { flex: 0 0 auto; padding: .4rem .6rem; font-size: .78rem; }
  .demo-strip .demo-acts { flex-direction: column; gap: .35rem; }
}

/* mobilní hlavička (skrytá na desktopu) */
.mhead { display: none; }

/* nižší okna: kompaktnější sidebar, ať je vidět i účet dole */
@media (min-width: 921px) and (max-height: 800px) {
  .sidebar { padding-top: 20px; }
  .sb-brand { margin-bottom: 6px; }
  button.sn { padding: 6px 10px; }
  .sb-grp { margin: 9px 0 4px; }
  .sb-foot { padding-top: 6px; }
  .sb-line { margin: 7px 4px; }
}

/* ---------- přepínač vzhledu (Nastavení) ---------- */
.theme-seg { display: flex; gap: 8px; margin-top: .3rem; flex-wrap: wrap; }
.theme-seg button {
  width: auto; margin: 0; flex: 1 1 130px;
  padding: .55rem .9rem;
  background: var(--btn-bg); border: 1px solid var(--btn-line); box-shadow: var(--btn-shadow);
  color: var(--ink); font-weight: 500; font-size: .9rem;
}
.theme-seg button.on {
  background: var(--prim-bg); box-shadow: var(--prim-shadow);
  border-color: transparent; color: var(--prim-ink); font-weight: 600;
}

/* ---------- pomocné ---------- */
.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1rem; }
/* cena pobytu v detailu rezervace (21. 10. 2026) */
.rd-price { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 6.5rem; gap: 0 1rem; }
.rd-price.ro { display: block; margin: .7rem 0 0; font-size: .88rem; }
.rd-pnote { margin: .25rem 0 0; }
@media (max-width: 920px) { .rd-price { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .rd-price > div:last-child { grid-column: 1 / -1; } }
@media (max-width: 560px) { .grid2 { grid-template-columns: 1fr; } }

/* ============================================================
   Mobil (≤ 920 px): sidebar jako rozbalovací menu shora
   ============================================================ */
@media (max-width: 920px) {
  .shell { display: block; }
  .mhead {
    position: sticky; top: 0; z-index: 40;
    display: flex; align-items: center; gap: 10px;
    padding: 12px 14px;
    background: var(--sb-bg);
    backdrop-filter: blur(26px) saturate(1.55);
    -webkit-backdrop-filter: blur(26px) saturate(1.55);
    border-bottom: 1px solid var(--sb-edge);
  }
  /* vpravo dvě stejné ikony: lupa a menu (tři čárky); název sekce se v liště nezobrazuje (Marco 29. 9. 2026, obr. 3) */
  .mhead .burger {
    width: 36px; height: 36px; flex: none; margin: 0; padding: 0; border-radius: 10px;
    display: flex; align-items: center; justify-content: center;
    background: var(--btn-bg); border: 1px solid var(--btn-line); box-shadow: var(--btn-shadow);
    color: var(--ink); line-height: 1;
  }
  .mhead .burger svg { width: 18px; height: 18px; }
  /* menu na telefonu zajíždí a vyjíždí plynule (8. 10. 2026): místo display none skryté přes visibility, zavření = lehký odsun doleva + ztlumení */
  .sidebar {
    position: fixed; inset: 0; z-index: 50;
    width: 100%; height: 100%;
    display: flex; visibility: hidden; opacity: 0; transform: translateX(-28px);
    backdrop-filter: none; -webkit-backdrop-filter: none;
    padding: 18px 16px 24px;
    background: var(--body-bg);
    transition: transform .24s cubic-bezier(.4, 0, .2, 1), opacity .2s ease, visibility 0s linear .24s;
  }
  .shell.navopen .sidebar { visibility: visible; opacity: 1; transform: none; transition: transform .3s cubic-bezier(.2, .7, .2, 1), opacity .22s ease, visibility 0s; }
  @media (prefers-reduced-motion: reduce) { .sidebar, .shell.navopen .sidebar { transition: none; } }
  .shell.navopen { overflow: hidden; }
  .sb-close {
    width: auto; margin: 0; padding: .4rem .75rem;
    background: var(--btn-bg); border: 1px solid var(--btn-line); box-shadow: var(--btn-shadow);
    color: var(--ink); font-size: 1rem; line-height: 1;
  }
  .content { padding: 16px 14px 40px; }
  .card { padding: 1.05rem 1.05rem; }
}


/* ============================================================
   Cizinecká policie — UbyPort dispečink + Domovní kniha
   (sdílené komponenty: výběr období, adresář měsíců, filtr)
   ============================================================ */
.pol-tools { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; margin: 0 0 .8rem; }
.split-btn { display: inline-flex; }
.split-btn > button { margin: 0; }
.split-btn > button:first-child { border-radius: 9px 0 0 9px; }
.split-btn > button.split-more { border-radius: 0 9px 9px 0; padding: .4rem .55rem; border-left: 1px solid rgba(255,255,255,0.35); }

/* výběr období (popover s měsíci) */
.per-wrap { position: relative; display: inline-block; }
.per-pop { position: absolute; top: calc(100% + 6px); left: 0; z-index: 40; width: min(21rem, calc(100vw - 2rem));
  background: var(--panel); border: 1px solid var(--card-line); border-radius: 14px; box-shadow: var(--card-shadow);
  padding: .8rem .9rem; }
html[data-theme="dark"] .per-pop { background: #23232e; }
html[data-theme="violet"] .per-pop { background: #2a2040; }
html[data-theme="gold"] .per-pop { background: #2a2110; }
.per-head { display: flex; align-items: center; gap: .4rem; margin-bottom: .55rem; }
.per-head strong { flex: 1; text-align: center; font-size: .95rem; }
.per-x { margin-left: auto; }
.per-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: .35rem; margin-bottom: .55rem; }
.per-grid button, .per-chips button { width: auto; margin: 0; padding: .38rem .3rem; font-size: .8rem; font-weight: 500;
  background: var(--btn-bg); border: 1px solid var(--btn-line); box-shadow: none; color: var(--ink); border-radius: 8px; }
.per-grid button.on { background: var(--prim-bg); border-color: transparent; color: var(--prim-ink); font-weight: 600; }
.per-grid button.dot { position: relative; }
.per-chips { display: flex; gap: .35rem; flex-wrap: wrap; }
.per-chips button { font-size: .76rem; padding: .32rem .55rem; }
.per-rng { border-top: 1px solid var(--hair); margin-top: .65rem; padding-top: .6rem; }
.per-rng .fl { font-size: .64rem; text-transform: uppercase; letter-spacing: 1px; color: var(--faint); margin-bottom: .35rem; }
.per-rng-row { display: flex; gap: .4rem; align-items: center; flex-wrap: wrap; }
.per-rng-row input { width: 9.2rem; }

/* filtrační lišta */
.fbar { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; background: var(--well);
  border: 1px solid var(--hair); border-radius: 12px; padding: .5rem .7rem; margin: 0 0 .9rem; }
.fbar .fl { font-size: .62rem; text-transform: uppercase; letter-spacing: 1.2px; color: var(--faint); font-weight: 600; }
.fbar input[type="search"], .fbar input[type="text"] { width: 14rem; max-width: 100%; }
.fbar select { width: auto; }
.fbar .chip { width: auto; margin: 0; padding: .34rem .7rem; font-size: .78rem; font-weight: 500; border-radius: 999px;
  background: var(--btn-bg); border: 1px solid var(--btn-line); box-shadow: none; color: var(--ink); }
.fbar .chip.on { background: var(--prim-bg); border-color: transparent; color: var(--prim-ink); font-weight: 600; }
.fbar .fclear { width: auto; margin: 0; padding: .3rem .5rem; background: none; border: 0; box-shadow: none;
  color: var(--acc); font-size: .8rem; text-decoration: underline; }

/* rozvržení: adresář vlevo + obsah vpravo */
.pol-grid { display: grid; grid-template-columns: 15rem minmax(0, 1fr); gap: 1.1rem; align-items: start; }
.dir-panel { border: 1px solid var(--hair); border-radius: 12px; padding: .6rem .3rem .4rem; }
.dir-cap { font-size: .62rem; text-transform: uppercase; letter-spacing: 1.4px; color: var(--faint); font-weight: 600;
  padding: 0 .7rem .45rem; }
.dir-yr { width: 100%; margin: 0; display: flex; justify-content: space-between; align-items: center; padding: .45rem .7rem;
  background: none; border: 0; box-shadow: none; color: var(--ink); font-weight: 600; font-size: .88rem; border-radius: 8px; }
.dir-yr:hover { background: var(--acc-soft); filter: none; }
.dir-mon { width: 100%; margin: 0; display: flex; justify-content: space-between; align-items: center; gap: .4rem;
  padding: .42rem .7rem .42rem 1.1rem; background: none; border: 0; box-shadow: none; color: var(--ink);
  font-weight: 400; font-size: .86rem; border-radius: 8px; border-top: 1px solid var(--hair); text-align: left; }
.dir-mon:hover { background: var(--acc-soft); filter: none; }
.dir-mon.on { background: var(--acc-soft); font-weight: 600; }
.dir-mon .cnt { font-size: .72rem; font-weight: 600; white-space: nowrap; }
.dir-mon .cnt.okc { color: var(--ok); }
.dir-mon .cnt.wc { color: var(--warn); }
.dir-mon .cnt.mut { color: var(--faint); font-weight: 400; }

/* obsah knihy / dispečinku */
.book-h { display: flex; align-items: baseline; gap: .8rem; flex-wrap: wrap; border-bottom: 1px solid var(--hair);
  padding-bottom: .5rem; margin-bottom: .7rem; }
.book-h h2 { margin: 0; font-size: 1.15rem; }
.book-h .who { margin-left: auto; }
tr.msec > td { background: var(--well); font-size: .72rem; font-weight: 600; text-transform: uppercase;
  letter-spacing: 1.2px; color: var(--mut); padding: .4rem .35rem; }
.sig-img { max-height: 30px; max-width: 110px; vertical-align: middle;
  background: #fff; border-radius: 6px; padding: 1px 4px; border: 1px solid var(--hair); }
.sig-img.big { max-height: 70px; max-width: 240px; }
tr.gdet > td { background: var(--well); border-radius: 0; padding: .8rem .7rem; }
.gdet-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); gap: .55rem .9rem; }
.gdet-grid > div { min-width: 0; overflow-wrap: anywhere; }   /* obsah (select, dlouhá adresa) nikdy nepřeteče přes okraj tabulky */
.gdet-grid .fl { display: block; font-size: .62rem; text-transform: uppercase; letter-spacing: 1px; color: var(--faint); }
.rcp-link { font-size: .78rem; white-space: nowrap; }
tr.rowx { cursor: pointer; }
tr.rowx:hover td { background: var(--acc-soft); }
.chev2 { display: inline-block; transition: transform .15s; color: var(--faint); font-size: .72rem; }
.chev2.open { transform: rotate(90deg); }

/* Domovní kniha na PC — seskupené sloupce, dvě patra v buňce (návrh B z plátna 3ardB5sQqmHJVeRiMbBiot, Marco 6. 10. 2026):
   hlavní údaj + šedý doplněk pod ním, hlavička s podtitulkem; řádek hosta = vždy dva řádky textu. Sloupce mají pevné šířky v procentech
   (<colgroup> v domBodyHtml), takže se tabulka vždy vejde do karty — dlouhá hodnota končí výpustkou, celé znění je v title a v rozbaleném
   detailu. Mobilní rejstřík .dkm-* beze změny. */
.dk2-wrap { overflow-x: auto; }
table.t.dk2 { table-layout: fixed; }
table.t.dk2 th { vertical-align: bottom; }
table.t.dk2 .dk2-th { display: block; font-size: .66rem; letter-spacing: 0; text-transform: none; font-weight: 500; color: var(--dim); margin-top: .1rem; }
table.t.dk2 td { vertical-align: middle; padding: .42rem .5rem; }
table.t.dk2 td.dk2-n { color: var(--mut); padding-left: .2rem; padding-right: .2rem; }
table.t.dk2 .dk2-m, table.t.dk2 .dk2-s { display: block; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
table.t.dk2 .dk2-s { font-size: .78rem; color: var(--mut); margin-top: .12rem; }
table.t.dk2 .dk2-x { color: var(--faint); font-size: .8rem; }
table.t.dk2 .sig-img { max-width: 76px; max-height: 26px; }
table.t.dk2 td.dk2-apt { line-height: 1.3; overflow-wrap: break-word; }   /* název apartmánu (Všechny apartmány) se smí zalomit v mezeře — dvě patra řádku na to mají místo */
table.t.dk2 tr.msec > td, table.t.dk2 tr.gdet > td { vertical-align: top; }

@media (max-width: 1100px) { .pol-grid { grid-template-columns: 1fr; } }

/* tisk domovní knihy: jen obsah knihy, bez navigace a nástrojů */
@media print {
  .sidebar, .mhead, .pol-tools, .fbar, .dir-panel, .res-seg, .imp-strip, .demo-strip, .split-btn, .per-wrap { display: none !important; }
  .shell { display: block; }
  .content { padding: 0; }
  .card { box-shadow: none; border: 0; background: #fff; }
  body { background: #fff; }
  tr.rowx { cursor: default; }
}

/* evidenční kniha: žlutý řádek = poplatek odpuštěn (dítě / osvobozen) */
tr.ev-waiv td { background: var(--warn-bg); }
tr.anon td { color: var(--mut); font-style: italic; }   /* host anonymizovaný po zákonné lhůtě (15. 9. 2026) */

/* dlouhá adresa / občanství se na desktopu ořezávají s „…" (plná hodnota v bublině a v detailu) */
@media (min-width: 921px) {
  td.ev-adr { max-width: 11rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  td.ev-nat { max-width: 7.5rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
}

/* velký titulek sekce (samostatné stránky) — výrazně oddělený od obsahu */
h1.pg { font-size: 1.5rem; font-weight: 600; letter-spacing: -0.02em; margin: 0 0 .45rem; }

/* evidenční kniha (18. 9. 2026, Marco: v tabulkách NIKDY posuvník, hlavičky se nesmí lámat):
   tabulka se vždy vejde na šířku (table-layout fixed, 100 %), hlavičky krátké na jednom řádku, data bez roku
   (rok je v období), dlouhé texty s výpustkou a plným zněním v tooltipu. Pevné šířky jsou násobkem --evs,
   v užším sloupci (container query) se písmo i sloupce zmenší a Adresa se schová (je v rozbaleném detailu i v PDF). */
.ev-wrap { container-type: inline-size; }
table.rest-ev, table.rest-ev-all { --evs: 1; table-layout: fixed; width: 100%; min-width: 0; font-size: .78rem; }
table.rest-ev td, table.rest-ev-all td { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-left: .3rem; padding-right: .3rem; }
table.rest-ev tr.gdet > td, table.rest-ev-all tr.gdet > td { white-space: normal; overflow: visible; }
table.rest-ev th, table.rest-ev-all th { white-space: nowrap; overflow: visible; font-size: .54rem; letter-spacing: .2px; padding-left: .3rem; padding-right: .3rem; }
table.rest-ev .who, table.rest-ev-all .who { font-size: inherit; }
table.rest-ev th:nth-child(1), table.rest-ev-all th:nth-child(1) { width: calc(1rem * var(--evs)); }      /* rozklik */
table.rest-ev th:nth-child(2), table.rest-ev-all th:nth-child(2) { width: calc(1.9rem * var(--evs)); }    /* # */
table.rest-ev th:nth-child(3), table.rest-ev-all th:nth-child(4) { width: calc(4rem * var(--evs)); }      /* Počátek */
table.rest-ev th:nth-child(4), table.rest-ev-all th:nth-child(5) { width: calc(4rem * var(--evs)); }      /* Konec */
table.rest-ev th:nth-child(9), table.rest-ev-all th:nth-child(10) { width: calc(7.2rem * var(--evs)); }   /* Narození (s rokem) */
table.rest-ev th:nth-child(10), table.rest-ev-all th:nth-child(11) { width: calc(5.8rem * var(--evs)); }  /* Doklad */
table.rest-ev th:nth-child(11), table.rest-ev-all th:nth-child(12) { width: calc(5.4rem * var(--evs)); }  /* Č. dokladu */
table.rest-ev th:nth-child(12), table.rest-ev-all th:nth-child(13) { width: calc(4.6rem * var(--evs)); }  /* Kategorie */
table.rest-ev th:nth-child(13), table.rest-ev-all th:nth-child(14) { width: calc(5.4rem * var(--evs)); }  /* Osvobození */
table.rest-ev th:nth-child(14), table.rest-ev-all th:nth-child(15) { width: calc(7rem * var(--evs)); }    /* V tomto měsíci */
table.rest-ev th:nth-child(15), table.rest-ev-all th:nth-child(16) { width: calc(2.6rem * var(--evs)); }  /* Nocí */
table.rest-ev th:nth-child(16), table.rest-ev-all th:nth-child(17) { width: calc(4.4rem * var(--evs)); }  /* Poplatek */
table.rest-ev th:nth-child(17), table.rest-ev-all th:nth-child(18) { width: calc(4.6rem * var(--evs)); }  /* Odpuštěn */
@container (max-width: 1260px) {   /* běžný monitor (obsah do 1400 px minus adresář) — plná sada sloupců se vejde až na širokém displeji */
  table.rest-ev, table.rest-ev-all { --evs: .84; font-size: .7rem; }
  table.rest-ev th, table.rest-ev-all th { font-size: .5rem; letter-spacing: 0; }
  table.rest-ev th:nth-child(7), table.rest-ev td:nth-child(7):not([colspan]),
  table.rest-ev-all th:nth-child(8), table.rest-ev-all td:nth-child(8):not([colspan]) { display: none; }   /* Adresa → detail řádku, PDF */
}
@container (max-width: 940px) {   /* úzký sloupec (adresář vedle, menší okno): ještě menší písmo, bez Č. dokladu a Osvobození (obojí v detailu řádku a v PDF) */
  table.rest-ev, table.rest-ev-all { --evs: .72; font-size: .64rem; }
  table.rest-ev th, table.rest-ev-all th { font-size: .46rem; }
  table.rest-ev th:nth-child(11), table.rest-ev td:nth-child(11):not([colspan]), table.rest-ev th:nth-child(13), table.rest-ev td:nth-child(13):not([colspan]),
  table.rest-ev-all th:nth-child(12), table.rest-ev-all td:nth-child(12):not([colspan]), table.rest-ev-all th:nth-child(14), table.rest-ev-all td:nth-child(14):not([colspan]) { display: none; }
}
@media (max-width: 920px) {
  table.t.rest-ev, table.t.rest-ev td { white-space: normal; overflow: visible; table-layout: auto; }
}

/* Poplatky MČ: mini tlačítka hlášení per apartmán vedle sebe */
td.fee-h { white-space: nowrap; }
td.fee-h .mini { padding: .22rem .42rem; font-size: .72rem; margin-right: .25rem; }
td.fee-h .mini:last-child { margin-right: 0; }
@media (max-width: 920px) { td.fee-h { white-space: normal; } }

/* ---------- 3. 9. 2026: zarovnání, souhrn nákladů úklidů, počasí ---------- */
/* Poplatky MČ: všechny hodnoty řádku svisle na střed (tlačítka dělají řádek vyšší) */
table.fee-t td { vertical-align: middle; }
/* Poplatky MČ (PC, 6. 10. 2026, návrh A): stav Zaplaceno = štítek za měsícem + okénko; Stáhnout · Datovka · QR jako jedna skupina */
table.fee-t td { padding-top: .45rem; padding-bottom: .45rem; }
table.fee-t tr.fee-on td { background: var(--acc-soft); }
table.fee-t .fee-nil { color: var(--faint); }
td.fee-st { position: relative; white-space: nowrap; }
.fee-chip { display: inline-flex; align-items: center; gap: .3rem; width: auto; margin: 0; padding: .2rem .6rem .2rem .45rem; border: 0; border-radius: 999px;
  background: var(--neu-bg); color: var(--mut); font: inherit; font-size: .78rem; font-weight: 600; white-space: nowrap; cursor: pointer; box-shadow: none; }
.fee-chip svg { width: .8rem; height: .8rem; stroke-width: 2.8; }
.fee-chip i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.fee-chip.ok { background: var(--ok-bg); color: var(--ok); }
.fee-chip.warn { background: var(--warn-bg); color: var(--warn); }
.fee-chip:hover, .fee-chip[aria-expanded="true"] { box-shadow: inset 0 0 0 1px currentColor; }
.fee-pop { position: absolute; left: .3rem; top: calc(100% - .2rem); z-index: 30; width: 16rem; padding: .7rem .75rem; border-radius: 14px;
  background: var(--panel); border: 1px solid var(--line); box-shadow: 0 18px 40px rgba(0,0,0,.22); white-space: normal; text-align: left; }
.fee-pop-h { display: flex; align-items: center; justify-content: space-between; gap: .5rem; margin-bottom: .5rem; font-size: .8rem; }
.fee-pop-x { width: auto; margin: 0; padding: .1rem .35rem; border: 0; background: none; box-shadow: none; color: var(--faint); font-size: .8rem; cursor: pointer; }
.fee-pop-r { display: flex; gap: .4rem; align-items: center; }
.fee-pop-r input { flex: 1; min-width: 0; margin: 0; }
.fee-pop-del { display: flex; align-items: center; gap: .4rem; width: 100%; margin: .6rem 0 0; padding: .55rem 0 0; border: 0; border-top: 1px solid var(--line); border-radius: 0;
  background: none; box-shadow: none; color: var(--err); font: inherit; font-size: .8rem; font-weight: 500; cursor: pointer; text-align: left; }
.fee-pop-del svg { width: .85rem; height: .85rem; }
.fee-grp { display: inline-flex; border: 1px solid var(--btn-line); border-radius: 9px; overflow: hidden; background: var(--btn-bg); }
.fee-grp button { display: inline-flex; align-items: center; gap: .3rem; width: auto; margin: 0; padding: .32rem .65rem; border: 0; border-radius: 0; background: none; box-shadow: none;
  color: var(--ink); font: inherit; font-size: .8rem; font-weight: 500; white-space: nowrap; cursor: pointer; }
.fee-grp button + button { border-left: 1px solid var(--btn-line); }
.fee-grp button:hover { background: var(--neu-bg); }
.fee-grp button:disabled { opacity: .6; cursor: default; }
.fee-grp svg { width: .8rem; height: .8rem; color: var(--acc); }
/* Úklidy: souhrn nákladů za období v horní kartě (bylo dole pod tabulkou) */
.cl-sum { display: flex; flex-wrap: wrap; gap: .5rem .6rem; align-items: stretch; margin: .2rem 0 .1rem; }
.cl-sum-i { display: flex; flex-direction: column; gap: .12rem; padding: .5rem .8rem; border: 1px solid var(--hair);
  border-radius: 10px; background: var(--neu-bg); min-width: 8.5rem; }
.cl-sum-i .l { font-size: .62rem; text-transform: uppercase; letter-spacing: 1.1px; color: var(--faint); font-weight: 600; }
.cl-sum-i .v { font-size: 1.05rem; font-weight: 600; font-variant-numeric: tabular-nums; letter-spacing: -0.01em; }
.cl-sum-i .s { font-size: .74rem; color: var(--mut); }
.cl-sum-i.tot { background: var(--acc-soft); border-color: transparent; }
.cl-sum-i.tot .v { color: var(--acc); }
/* Úklidy: odvolaný úklid — potlačený řádek, štítek */
/* odvolaný úklid: bez přeškrtnutí — stav nese jen štítek „Odvolán" (Marco 3. 9. 2026) */
.tag.cancel { text-decoration: none; }
/* detail úklidu: kompaktní řádek polí (časy, počet osob, typ) */
.cl-ed-row { display: flex; gap: .5rem 1.1rem; flex-wrap: wrap; align-items: flex-end; margin-top: .2rem; }
.cl-ed-row label { margin-top: .5rem; }
.cl-ed-row input, .cl-ed-row select { width: auto; }
table.cl-t td { vertical-align: middle; }
.tag.cancel { background: var(--neu-bg); color: var(--mut); }
table.t tr.rowlink { cursor: pointer; }
table.t tr.rowlink:hover > td { background: var(--acc-soft); }
/* Přehled: řádek počasí pod datem */
.dash-weather strong { color: var(--ink); }
@media (max-width: 920px) {
  table.t.rest-ev-all, table.t.rest-ev-all td { white-space: normal; overflow: visible; table-layout: auto; }
}

/* Úklidy: souhrn nákladů jako tabulka pod sebou (když by se dlaždice nevešly na šířku) */
table.cl-sumt { width: auto; min-width: 34rem; max-width: 100%; margin: .2rem 0 .1rem; font-size: .88rem; }
table.cl-sumt td { vertical-align: middle; padding: .4rem .7rem .4rem 0; }
table.cl-sumt th { padding: .35rem .7rem .35rem 0; }
table.cl-sumt td:nth-child(n+2), table.cl-sumt th:nth-child(n+2) { font-variant-numeric: tabular-nums; }
table.cl-sumt tr.tot > td { font-weight: 600; border-top: 1px solid var(--line); }
table.cl-sumt tr.tot > td:last-child { color: var(--acc); }
@media (max-width: 920px) { table.cl-sumt { min-width: 0; width: 100%; } }

/* ---------- 3. 9. 2026 (noc): Nastavení jako záložky + Evidenční kniha zarovnání ---------- */
/* Nastavení: hlavička se záložkami — každé téma má vlastní stránku; pod aktivní záložkou
   je „sklo" (stejné jako aktivní položka v sidebaru), které při přepnutí přejede na novou záložku */
.sett-head { padding-bottom: 1rem; }
.sett-head .sub { margin-bottom: .8rem; }
.sett-tabs { position: relative; display: flex; flex-wrap: wrap; gap: 2px; background: var(--neu-bg);
  border-radius: 999px; padding: 3px; margin: 0; }
.sett-tabs button { position: relative; z-index: 1; flex: 1 1 auto; width: auto; margin: 0; padding: .5rem 1rem;
  border: 0; border-radius: 999px; background: transparent; box-shadow: none; color: var(--mut);
  font-weight: 500; font-size: .88rem; white-space: nowrap; cursor: pointer; transition: color .18s; }
@media (hover: hover) { .sett-tabs button:hover { color: var(--ink); filter: none; background: transparent; } }
/* stisk na dotyku: jen barva textu (žádné pozadí ani záblesk; sklo přejede po puštění) */
.sett-tabs button:active, .res-seg button:active, .res-view button:active { color: var(--ink); filter: none; background: transparent; }
.sett-tabs button.on { color: var(--ink); font-weight: 600; }
.sett-tabs .seg-glide, .res-seg .seg-glide, .res-view .seg-glide { position: absolute; left: 0; top: 0; z-index: 0; width: 0; height: 0; border-radius: 999px;
  background: var(--sn-on-bg); box-shadow: var(--sn-on-shadow); pointer-events: none;
  transition: transform .32s cubic-bezier(.4, 0, .2, 1), width .32s cubic-bezier(.4, 0, .2, 1); }
@media (prefers-reduced-motion: reduce) { .sett-tabs .seg-glide, .res-seg .seg-glide, .res-view .seg-glide { transition: none; } }
/* Seznam / Kalendář (Rezervace): sklo je modré jako dřív aktivní tlačítko — musí být až za sdíleným pravidlem výše (Marco 22. 9. 2026) */
.res-view .seg-glide { background: var(--prim-bg); box-shadow: var(--prim-shadow); }
/* Úklidy na telefonu: filtr stavů má modré sklo jako Seznam / Kalendář (Marco 27. 9. 2026) */
.clm-filter .seg-glide { background: var(--prim-bg); box-shadow: var(--prim-shadow); }
.clm-filter button.on { color: var(--prim-ink); }
/* ---------- Nastavení, 2. várka 4. 9. 2026 ---------- */
/* hlavička karty s tlačítkem vpravo (Vytvořit subjekt / Přidat apartmán) */
.card-hrow { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; margin-bottom: .4rem; }
.card-hrow h1 { margin: 0; }
.card-hrow .mini { margin-left: auto; }
/* detail apartmánu: název + podzáložky (posuvné sklo), sekce se přepínají */
.apt-title { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; margin: 0 2.4rem .3rem 0; }
/* texty hlavičky na jedné účaří: název z platformy + interní název stejně velké, „nastavení apartmánu" o stupeň menší (Marco 12. 9. 2026) */
.apt-title .apt-title-txt { display: flex; align-items: baseline; gap: .45rem; flex-wrap: wrap; min-width: 0; }
.apt-title .apt-name { font-size: 1.35rem; font-weight: 600; letter-spacing: -0.02em; }
.apt-title .apt-code { font-size: 1.35rem; font-weight: 400; letter-spacing: -0.02em; color: var(--mut); }
.apt-title .apt-ctx { font-size: 1.05rem; font-weight: 400; color: var(--mut); }
.apt-tabs { margin: .5rem 0 1.1rem; }
.apt-detail section[data-asec] { display: none; }
.apt-detail section[data-asec].on { display: block; min-height: calc(100vh - 9rem); }   /* při přepnutí na kratší sekci se stránka nezkrátí → hlavička neskáče */
/* hlavička detailu (název + podzáložky) drží u horního okraje, obsah sekcí roluje pod ní (Marco 5. 9. 2026) */
.apt-detail .apt-head { position: sticky; top: 0; z-index: 4; margin: -1.3rem -1.5rem .9rem; padding: 1.3rem 1.5rem 0;
  background: var(--card-bg); backdrop-filter: blur(24px) saturate(1.55); -webkit-backdrop-filter: blur(24px) saturate(1.55);
  border-radius: 16px 16px 0 0; }
.apt-detail .apt-head .apt-tabs { margin-bottom: 0; padding-bottom: .1rem; }
.apt-detail .apt-head::after { content: ''; display: block; height: .9rem; }
/* oko u hesla: v řádku pole, svisle na střed, u pravého okraje s mezerou */
.pw-wrap { position: relative; display: flex; align-items: center; width: 100%; }
.pw-wrap > input { flex: 1 1 auto; width: 100%; margin-bottom: 0 !important; padding-right: 2.8rem; }
.pw-eye { position: absolute; right: .8rem; top: 50%; transform: translateY(-50%); width: auto; margin: 0; padding: .2rem;
  border: 0; background: none; box-shadow: none; color: var(--mut); line-height: 0; cursor: pointer; }
.pw-eye:hover { color: var(--ink); background: none; filter: none; box-shadow: none; }
.pw-eye.on { color: var(--acc); }
/* Vzhled aplikace: každá dlaždice v barvách svého vzhledu */
.theme-seg button { position: relative; text-align: left; padding: .8rem 1rem; border-radius: 12px; }
.theme-seg button span { position: relative; z-index: 1; }
.theme-seg button[data-th="light"] { background: linear-gradient(135deg, #ffffff 0%, #eef2fb 100%); color: #1d1d1f; border-color: #cfd3dc; }
.theme-seg button[data-th="dark"] { background: radial-gradient(120% 90% at 85% 0%, rgba(72,138,255,0.35), transparent 60%), linear-gradient(180deg, #1a1a26 0%, #08080c 100%); color: #f5f5f7; border-color: rgba(255,255,255,0.22); }
.theme-seg button[data-th="lavender"] { background: linear-gradient(135deg, #f4effc 0%, #dfd3f4 100%); color: #2e2fb4; border-color: #c6b9e2; }
.theme-seg button[data-th="violet"] { background: radial-gradient(120% 90% at 85% 0%, rgba(168,143,255,0.40), transparent 60%), linear-gradient(180deg, #2a2040 0%, #120c1f 100%); color: #d7ccff; border-color: rgba(194,176,255,0.35); }
.theme-seg button[data-th="cream"] { background: linear-gradient(135deg, #fcf8ee 0%, #eddfc2 100%); color: #8f6210; border-color: #d9c9a3; }
.theme-seg button[data-th="gold"] { background: radial-gradient(120% 90% at 85% 0%, rgba(240,190,80,0.42), transparent 60%), linear-gradient(180deg, #2a2110 0%, #100b05 100%); color: #f5d78a; border-color: rgba(242,200,106,0.35); }
.theme-seg button:hover { filter: brightness(1.04); }
.theme-seg button.on { outline: 2px solid var(--acc); outline-offset: 2px; box-shadow: none; }
.theme-seg button.on span::after { content: ' ✓'; }
/* kulatá fotka apartmánu (hlavička detailu + sekce Fotka) */
.apt-ava { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; border-radius: 50%; overflow: hidden;
  background: var(--neu-bg); border: 2px solid var(--card-line); box-shadow: var(--card-shadow); color: var(--mut); font-weight: 600; font-size: .85rem; letter-spacing: .04em; }
.apt-ava img { width: 100%; height: 100%; object-fit: cover; display: block; }
.apt-ava .apt-ava-ph { display: block; width: 52%; height: 52%; color: var(--mut); opacity: .75; }
.apt-ava .apt-ava-ph svg { width: 100%; height: 100%; display: block; }
/* Zprávy hostům u apartmánu + Informace k jednotce */
.am-box { border: 1px solid var(--line); border-radius: 12px; padding: .7rem .9rem .8rem; margin-top: .7rem; background: var(--neu-bg); }
.am-h { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
/* Informace k jednotce — jeden panel = hlavička (úchyt ⠿ + nadpis + ✕) a tělo s textem; panel má vlastní
   velikost (resize za pravý dolní roh, rozměry se ukládají) a pořadí se mění tažením za úchyt.
   Zmenšené panely se ve flex-wrap skládají vedle sebe (Marco 17. 9. 2026). */
#ai_list { display: flex; flex-wrap: wrap; gap: .7rem; align-items: flex-start; margin-top: .6rem; }
#ai_list > .empty { width: 100%; }
.ai-sec { display: flex; flex-direction: column; box-sizing: border-box; width: 100%; max-width: 100%; min-width: 15rem; min-height: 8.5rem;
  resize: both; overflow: hidden; border: 1px solid var(--line); border-radius: 12px; background: var(--neu-bg); }
.ai-sec.drag { opacity: .4; }
.ai-head { display: flex; align-items: center; gap: .35rem; padding: .3rem .45rem .3rem .4rem; border-bottom: 1px solid var(--hair); background: var(--well); flex: none; }
.ai-grip { cursor: grab; color: var(--faint); font-size: 1.15rem; line-height: 1; padding: .2rem .35rem; border-radius: 7px; user-select: none; -webkit-user-select: none; }
.ai-grip:hover { color: var(--ink); background: var(--acc-soft); }
.ai-grip:active { cursor: grabbing; }
.ai-grip-inline { color: var(--faint); font-weight: 700; }
.ai-sec input.ai-title { flex: 1; width: auto; min-width: 0; margin: 0; padding: .35rem .45rem; border: 1px solid transparent; border-radius: 8px; background: transparent; box-shadow: none; font-weight: 700; font-size: .95rem; }
.ai-sec input.ai-title:focus { border-color: var(--acc); background: var(--input-bg); }
.ai-sec .ai-x { flex: none; padding: .2rem .5rem; }
.ai-sec textarea.ai-body { flex: 1; width: 100%; min-height: 3.5rem; margin: 0; padding: .6rem .8rem; border: 0; border-radius: 0; background: transparent; box-shadow: none; resize: none; font-size: .92rem; line-height: 1.45; }
.ai-sec textarea.ai-body:focus { box-shadow: inset 0 0 0 1px var(--acc); }
@media (max-width: 700px) { .ai-sec { resize: vertical; width: 100% !important; } }

/* Evidenční kniha: užší adresář vlevo (víc místa pro tabulku), hodnoty řádku svisle na střed,
   datumy Od/Do se nikdy nelámou (pevná šířka místo procent) */
.pol-grid.ev-grid { grid-template-columns: 12rem minmax(0, 1fr); }
@media (max-width: 1100px) { .pol-grid.ev-grid { grid-template-columns: 1fr; } }
table.rest-ev td, table.rest-ev-all td { vertical-align: middle; }
/* .nw mělo overflow:visible, takže dlouhé datum přeteklo PŘES sousední buňku a data splynula
   („31. 8. 20263. 9. 2026"). Nově se ořízne a plné znění zůstává v bublině a v rozkliku. */
table.rest-ev td.nw, table.rest-ev-all td.nw { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-right: .6rem; }
/* hodnota, která se nevejde ani při 12px: jednořádkově s trojtečkou (plné znění v bublině / v rozkliku) */
table.rest-ev td.ev-cut, table.rest-ev-all td.ev-cut { text-overflow: ellipsis; }

/* ---------- pulzování „živých" stavů (Marco 3. 9. 2026) ---------- */
/* Rezervace: štítek Probíhá dýchá — kolem něj se rozpíná kroužek v barvě štítku */
.tag.live { position: relative; }
.tag.live::after { content: ''; position: absolute; inset: -2px; border-radius: inherit; border: 2px solid currentColor;
  opacity: 0; pointer-events: none; animation: px-ring 1.7s ease-out infinite; }
@keyframes px-ring { 0% { opacity: .75; transform: scale(1); } 70%, 100% { opacity: 0; transform: scale(1.28); } }
/* Detail rezervace: nesplněné (červené) body osy odbavení pulzují, dokud nejsou hotové */
.ob-step.err::before { animation: px-dot 1.5s ease-in-out infinite; }
@keyframes px-dot { 0%, 100% { transform: scale(1); opacity: 1; } 50% { transform: scale(1.45); opacity: .55; } }
@media (prefers-reduced-motion: reduce) { .tag.live::after, .ob-step.err::before { animation: none; } }

/* ---------- Analytika — varianta C (Marco 4. 9. 2026) ---------- */
.an-top { display: flex; align-items: flex-start; gap: .8rem; }
/* hlavička Analytiky na PC — návrh 1 (Marco 21. 10. 2026): nadpis + podtitulek, „Odkud data“ vpravo; glass baner Rok / Měsíc + krokovač; čtyři čísla */
.an-th { flex: 1; min-width: 0; }
.an-th .sub { margin: .2rem 0 0; }
.an-srcb { display: inline-flex; align-items: center; gap: .4rem; flex: none; }
.an-srcb svg { width: 14px; height: 14px; }
.an-srcb[aria-expanded="true"] { border-color: var(--acc); color: var(--acc); }
.an-ctl { display: flex; align-items: center; gap: .7rem; flex-wrap: wrap; margin: .9rem 0 0; }
.an-year { display: inline-flex; align-items: center; gap: .4rem; flex-wrap: wrap; }   /* krokovač roku v Energiích */
.an-mode { margin: 0; flex: 0 0 auto; }
.an-mode button { flex: 0 0 auto; padding: .4rem 1.1rem; }
.an-stepper { display: inline-flex; align-items: center; gap: 2px; padding: 3px; border-radius: 999px; background: var(--btn-bg); border: 1px solid var(--btn-line); box-shadow: var(--btn-shadow); }
.an-stepper button { width: 30px; height: 30px; margin: 0; padding: 0; border: 0; border-radius: 999px; background: transparent; box-shadow: none; color: var(--ink); display: flex; align-items: center; justify-content: center; }
.an-stepper button:disabled { opacity: .35; }
.an-stepper button svg { width: 15px; height: 15px; }
.an-stepper strong { min-width: 4.2rem; padding: 0 .4rem; text-align: center; font-size: .92rem; white-space: nowrap; }
.an-stepper strong.m { min-width: 8.6rem; }
.an-now { width: auto; margin: 0; padding: .3rem .4rem; border: 0; background: transparent; box-shadow: none; color: var(--acc); font-size: .84rem; font-weight: 500; }
.an-now:disabled { color: var(--faint); cursor: default; }
.an-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 1rem 0 0; }
.an-kpis .an-kpi { background: var(--glass-bg); border: 1px solid var(--glass-edge); box-shadow: var(--glass-shadow); -webkit-backdrop-filter: var(--glass-filter); backdrop-filter: var(--glass-filter); padding: .75rem .95rem .8rem; }   /* mléčné sklo, ne --well (21. 10. 2026) */
.an-kpis .an-kpi .tile-v { font-size: 1.45rem; margin: .25rem 0 .1rem; }
.an-kpis .an-kpi .tile-s { padding-top: .15rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* mřížka 2 × 2: řádek 1 křivka | KPI + platformy, řádek 2 apartmány | národnosti — karty v řádku mají stejnou výšku */
.an-grid { display: grid; grid-template-columns: 1.55fr 1fr; gap: 14px; align-items: stretch; }
.an-grid > .card { margin: 0; min-width: 0; }
.an-col { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.an-col > .card, .an-col > .tile { margin: 0; }
.an-col > .card { flex: 1; }
@media (max-width: 980px) { .an-grid { grid-template-columns: 1fr; } }
.an-chart { width: 100%; height: auto; display: block; }
.an-chart .an-gl { stroke: var(--hair); stroke-width: 1; }
.an-chart .an-ax { fill: var(--faint); font-size: 10.5px; font-weight: 600; }
.an-chart .an-ax.cur { fill: var(--acc); }
.an-chart .an-line, .tile-spark .an-line { fill: none; stroke: #3d7bff; stroke-width: 2.5; stroke-linejoin: round; stroke-linecap: round; }
.an-chart .an-line.fut, .tile-spark .an-line.fut { stroke-dasharray: 5 5; }
.an-chart .an-dot, .tile-spark .an-dot { fill: #3d7bff; stroke: #3d7bff; stroke-width: 2; cursor: default; }
.an-chart .an-dot.fut { fill: var(--panel); }
/* baner Obsazenost — graf roku (zmenšená křivka) */
.tile-spark { width: 100%; height: auto; display: block; margin: .15rem 0 .1rem; }
.tile-spark .an-line { stroke-width: 2; }
.tile-spark .an-ax { fill: var(--faint); font-size: 8px; font-weight: 600; }
.tile-spark .an-ax.cur { fill: var(--acc); }
.an-chart .an-lab { fill: var(--ink); font-size: 12px; font-weight: 600; }
/* zvolený měsíc pulzuje (režim Měsíc); šedá linka = minulý rok */
.an-chart .an-ax.sel { fill: var(--acc); font-size: 11.5px; }
.an-chart .an-dot.sel { fill: var(--acc); stroke: #fff; r: 5; transform-box: fill-box; transform-origin: center; animation: px-dot 1.5s ease-in-out infinite; }
.an-chart .an-ring { fill: none; stroke: var(--acc); stroke-width: 2; transform-box: fill-box; transform-origin: center; animation: an-ring 1.7s ease-out infinite; }
@keyframes an-ring { 0% { opacity: .8; transform: scale(1); } 70%, 100% { opacity: 0; transform: scale(2.8); } }
@media (prefers-reduced-motion: reduce) { .an-chart .an-dot.sel, .an-chart .an-ring { animation: none; } }
.an-chart .an-line.prev { stroke: var(--faint); stroke-width: 2; opacity: .85; }
.an-legend i.prev { width: 18px; height: 0; border-top: 2px solid var(--faint); border-radius: 0; }
.an-legend i.pulse { background: var(--acc); box-shadow: 0 0 0 3px var(--acc-soft); }
.an-grid > .an-wide { grid-column: 1 / -1; }
/* vracející se hosté */
.an-ret { display: flex; flex-direction: column; }
.an-ret-row { padding: .6rem 0; border-top: 1px solid var(--hair); }
.an-ret-row:first-child { border-top: 0; }
.an-ret-h { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; font-size: .92rem; }
.an-ret-stays { display: flex; gap: .35rem; flex-wrap: wrap; margin-top: .4rem; padding: 2px 0 2px 4px; }
.an-stay { cursor: pointer; }
.an-stay:hover { filter: brightness(1.08); }
.an-legend { display: flex; gap: 1rem; flex-wrap: wrap; margin-top: .4rem; font-size: .8rem; color: var(--mut); }
.an-legend span { display: inline-flex; align-items: center; gap: .4rem; }
.an-legend i { width: 9px; height: 9px; border-radius: 50%; display: inline-block; }
.an-legend i.dash { width: 18px; height: 0; border-top: 2px dashed #3d7bff; border-radius: 0; }
.an-bar { display: block; height: 8px; border-radius: 4px; background: var(--track); overflow: hidden; min-width: 5rem; }
.an-bar i { display: block; height: 100%; border-radius: 4px; }
table.an-t td { vertical-align: middle; }
.an-seg { display: flex; height: 14px; border-radius: 7px; overflow: hidden; gap: 2px; background: var(--track); }
.an-seg i { display: block; height: 100%; }
.an-rows { display: flex; flex-direction: column; gap: .45rem; margin-top: .7rem; }
.an-row { display: flex; align-items: center; gap: .5rem; font-size: .88rem; flex-wrap: wrap; }
.an-row > i { width: 9px; height: 9px; border-radius: 50%; flex: 0 0 9px; }
.an-row strong { min-width: 5.5rem; }
.an-row b { font-variant-numeric: tabular-nums; }
.an-donutwrap { display: flex; align-items: center; gap: 1.2rem; flex-wrap: wrap; }
.an-donut { flex: 0 0 150px; }
.an-donut .trk { stroke: var(--track); }
.an-donut .cv { fill: var(--ink); font-size: 24px; font-weight: 600; }
.an-donut .cl { fill: var(--mut); font-size: 11.5px; }
.an-donutwrap .an-rows { margin-top: 0; flex: 1; min-width: 12rem; }

/* baner Počasí: teď + předpověď na 3 dny s ikonami (Marco 5. 9. 2026) */
.tile-wnow { display: flex; align-items: center; gap: .7rem; margin: .35rem 0 .2rem; }
.tile-wnow .tile-v { margin: 0; }
.tile-wdays { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .4rem; margin-top: .5rem; padding-top: .5rem; border-top: 1px solid var(--hair); text-align: center; }
.tile-wday { min-width: 0; display: flex; flex-direction: column; align-items: center; gap: .15rem; }
.tile-wday .who { font-size: .72rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.tile-wt { font-size: .92rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
.w-ic { flex: 0 0 auto; }
.tile-wtop { display: flex; align-items: center; justify-content: space-between; gap: .6rem 1.2rem; flex-wrap: wrap; }
.tile-wx { display: none; }   /* východ / západ slunce, vlhkost, UV — jen v baneru přes celou šířku na PC */
.tile-wxi { display: inline-flex; align-items: center; gap: .3rem; font-size: .8rem; color: var(--mut); white-space: nowrap; }
.tile-wxi svg { width: 17px; height: 17px; flex: none; color: var(--faint); }
/* Počasí přes celou šířku na PC (Marco 2. 10. 2026): využije celý prostor baneru — větší ikona i teplota, doplňkové údaje vpravo,
   předpověď na 3 dny se roztáhne do zbylé výšky s většími ikonami */
@media (min-width: 921px) {
  .tile.tile-f.tile-weather .tile-wnow > .w-ic { width: 84px; height: 84px; stroke-width: 1.4; }
  .tile.tile-f.tile-weather .tile-v, .tile.tile-f.tall.tile-weather .tile-v, .tile.tile-f.xl.tile-weather .tile-v { font-size: 2.6rem; line-height: 1.05; }
  .tile.tile-f.tile-weather .tile-wnow .who { font-size: .92rem; }
  .tile.tile-f.tile-weather .tile-wx { display: grid; grid-template-columns: auto auto; gap: .35rem 1.1rem; }
  .tile.tile-f.tile-weather .tile-wxi { font-size: .88rem; }
  .tile.tile-f.tile-weather .tile-wxi svg { width: 20px; height: 20px; }
  .tile.tile-f.tile-weather .tile-wdays { flex: 1; align-content: center; gap: .6rem; margin-top: .7rem; padding-top: .7rem; }
  .tile.tile-f.tile-weather .tile-wday { gap: .3rem; }
  .tile.tile-f.tile-weather .tile-wday > .w-ic { width: 52px; height: 52px; stroke-width: 1.5; }
  .tile.tile-f.tile-weather .tile-wday .who { font-size: .86rem; }
  .tile.tile-f.tile-weather .tile-wt { font-size: 1.25rem; }
}
.w-sun, .w-sunp { color: var(--warn); }
.w-part { color: var(--mut); }
.w-part .w-sunp { stroke: var(--warn); }
.w-cloud { color: var(--mut); }
.w-rain, .w-snow { color: var(--acc); }
.w-storm { color: var(--warn); }
.dash-intl { color: var(--mut); }

/* dlaždice podle výšky řádku (Marco 5. 9. 2026): .tall (≥ 185 px) větší hodnota + doplněk .tile-x, .xl (≥ 260 px) ještě větší */
.tile .tile-x { display: none; }
/* doplněk jen VYPLNÍ místo, které řádek dá (flex-basis 0 → nezvětšuje řádek), přebytek se skryje */
.tile.tall .tile-x { display: block; flex: 1 1 0px; min-height: 0; overflow: hidden; margin-top: .4rem; padding-top: .45rem; border-top: 1px solid var(--hair); }
.tile.tall .tile-x .tile-xcut, .tile.tall .tile-x.tile-x-none { display: none; }   /* jen celé řádky (tileXFit v prehled.js, 20. 10. 2026) */
.tile.tall .tile-rows { gap: .4rem; }
.tile.xl .tile-rows { gap: .55rem; }
.tile.xl .tile-row { font-size: .88rem; }
.tile.xl .tile-code { font-size: .84rem; padding: .2rem .6rem; }
.tile.xl .tile-bar { height: 8px; }
.tile.tall .tile-v { font-size: 2.3rem; margin: .4rem 0 .25rem; }
.tile.tall .tile-v small { font-size: 1.05rem; }
.tile.xl .tile-v { font-size: 2.9rem; }
.tile.tall.tile-weather .tile-v, .tile.xl.tile-weather .tile-v { font-size: 1.65rem; margin: 0; } /* počasí má vlastní rozvržení */
/* hodnota, která se nevejde ani po zmenšení písma (tileValueFit v prehled.js), se zalomí po celých částkách — 23. 9. 2026 */
.tile-v .tile-vp, .tile-v .tile-vp small { white-space: nowrap; }
.tile-v.wrap { white-space: normal; text-overflow: clip; line-height: 1.12; }
.tile-v .tile-vplus { color: var(--mut); font-weight: 500; }
.tile-val.tile-val-multi { flex: 1 1 auto; min-width: 0; white-space: normal; text-align: right; }
.tile-x .tile-rows { margin-top: 0; }
.tile-x .tile-row.on { color: var(--ink); }
.tile-x .tile-row.on .tile-rn { color: var(--ink); font-weight: 600; }
.tile-x .tile-row:not(.on) b { font-weight: 500; color: var(--mut); }
.tile-x .tile-spark { margin-top: .1rem; }
/* roční křivka v doplňující části baneru s popisky os (Marco 2. 10. 2026): roztáhne se do zbylé výšky, osa Y vlevo, měsíce dole */
.osp-cap { margin-bottom: .2rem; }
.osp { display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-rows: minmax(36px, 1fr) auto; column-gap: .4rem; height: calc(100% - 1.4rem); min-height: 70px; }
.osp-y { display: flex; flex-direction: column; justify-content: space-between; font-size: .62rem; font-weight: 600; color: var(--faint); text-align: right; line-height: 1; transform: translateY(0); }
.osp-y span:first-child { transform: translateY(-40%); } .osp-y span:last-child { transform: translateY(40%); }
.osp-plot { position: relative; min-height: 0; }
.osp-plot svg { display: block; width: 100%; height: 100%; overflow: visible; }
.osp-grid { fill: none; stroke: var(--hair); stroke-width: 1; }
.osp-plot .an-line { fill: none; stroke: #3d7bff; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.osp-plot .an-line.fut { stroke-dasharray: 5 5; }
.osp-dot { position: absolute; width: 9px; height: 9px; margin: -4.5px 0 0 -4.5px; border-radius: 50%; background: #3d7bff; box-shadow: 0 0 0 2px var(--card-bg); }
.osp-x { grid-column: 2; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); font-size: .62rem; font-weight: 600; color: var(--faint); text-align: center; padding-top: .25rem; }
.osp-x span:first-child { text-align: left; } .osp-x span:last-child { text-align: right; }
.osp-x .cur { color: var(--acc); }
.tile-rowlink { cursor: pointer; border-radius: 6px; }
.tile-rowlink:hover { background: var(--acc-soft); }
.tile-x .tag { font-size: .68rem; padding: .08rem .4rem; }

/* ---------- Nastavení → Účet, návrh C (5. 9. 2026): seznam řádků + galerie vzhledů ---------- */
.acct-list { display: flex; flex-direction: column; }
.acct-row { display: grid; grid-template-columns: 1fr minmax(260px, 46%); gap: 1.2rem; align-items: center; padding: .85rem 0; border-top: 1px solid var(--hair); }
.acct-row:first-child { border-top: 0; }
.acct-t { font-size: .95rem; font-weight: 600; }
.acct-l .who { margin-top: .15rem; line-height: 1.4; }
.acct-r { display: flex; align-items: center; justify-content: flex-end; gap: .5rem; min-width: 0; flex-wrap: wrap; }
.acct-r .mini { margin: 0; }
.acct-val { text-align: right; min-width: 0; font-size: .92rem; }
.acct-seg { margin: 0; flex: 1 1 auto; }
.acct-seg button { flex: 1 1 auto; padding: .35rem .6rem; font-size: .82rem; }
.acct-form { padding: .2rem 0 1rem; border-top: 1px dashed var(--hair); }
@media (max-width: 720px) { .acct-row { grid-template-columns: 1fr; gap: .5rem; } .acct-r { justify-content: flex-start; } .acct-val { text-align: left; } }
/* Oznámení na zařízení = seznam zařízení (návrh A2, 2. 10. 2026): řádky s ikonou, popisem, stavem a přepínačem; návod pro iPhone ve 3 krocích */
.acct-row.push-block { grid-template-columns: 1fr; gap: .6rem; }
.push-devs { display: flex; flex-direction: column; }
.push-dev { display: flex; align-items: center; gap: .75rem; padding: .7rem 0; border-top: 1px solid var(--hair); }
.push-dev:first-child { border-top: 0; }
.push-dev-i { width: 40px; height: 40px; border-radius: 12px; background: var(--acc-soft); color: var(--acc); display: flex; align-items: center; justify-content: center; flex: none; }
.push-dev-i svg { width: 19px; height: 19px; }
.push-dev.off .push-dev-i { background: var(--neu-bg); color: var(--mut); }
.push-dev-i.warn { background: var(--warn-bg); color: var(--warn); }
.push-dev-l { flex: 1 1 auto; min-width: 0; }
.push-dev-n { font-size: .95rem; font-weight: 600; display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; }
.push-dev-n .tag { font-size: .68rem; }
.push-dev-l .who { margin-top: .1rem; line-height: 1.4; }
.push-dev-l .who.push-warn { color: var(--warn); }
.push-test { display: inline-flex; align-items: center; gap: .35rem; margin: 0; white-space: nowrap; }
.push-test svg { width: 14px; height: 14px; }
.push-guide { margin-top: .4rem; padding: .85rem 1rem; border-radius: 14px; background: var(--well); border: 1px solid var(--card-line); }
.push-guide-h { display: flex; align-items: center; gap: .75rem; }
.push-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; margin-top: .7rem; }
.push-step { display: flex; flex-direction: column; align-items: center; text-align: center; gap: .4rem; padding: .7rem .5rem; border-radius: 12px; background: var(--card-bg); border: 1px solid var(--card-line); }
.push-step-i { position: relative; width: 38px; height: 38px; border-radius: 50%; background: var(--acc-soft); color: var(--acc); display: flex; align-items: center; justify-content: center; flex: none; }
.push-step-i svg { width: 18px; height: 18px; }
.push-step-i b { position: absolute; top: -5px; left: -5px; width: 17px; height: 17px; border-radius: 50%; background: var(--prim-bg); color: var(--prim-ink); font-size: .62rem; line-height: 17px; text-align: center; }
.push-step-t { display: block; font-size: .82rem; font-weight: 600; }
/* „Ať oznámení chodí s logem Ubyo“ (návrh 1 z plátna, Marco 20. 10. 2026): Ubyo do Docku (Safari na Macu) / Instalovat (Chrome, Edge) */
.push-dock-h { display: flex; align-items: center; gap: .8rem; }
.push-dock-logo svg.sb-logo { width: 40px; height: 40px; display: block; border-radius: 11px; box-shadow: 0 0 0 4px var(--acc-soft); }
.push-dock-tx { flex: 1 1 auto; min-width: 0; }
.push-dock-tx .who { margin-top: .1rem; line-height: 1.4; }
.push-dock-pv { display: flex; align-items: center; gap: .45rem; flex: none; color: var(--faint); }
.push-dock-st { display: flex; flex-direction: column; align-items: center; gap: .2rem; font-size: .7rem; color: var(--mut); }
.push-dock-ic { width: 30px; height: 30px; border-radius: 8px; display: flex; align-items: center; justify-content: center; background: var(--neu-bg); color: var(--mut); }
.push-dock-ic svg { width: 18px; height: 18px; }
.push-dock-ic.logo { background: none; }
.push-dock-ic.logo svg.sb-logo { width: 30px; height: 30px; border-radius: 8px; }
.push-dock-ar svg { width: 16px; height: 16px; display: block; }
.push-dock-f { display: flex; align-items: center; gap: .5rem; margin-top: .75rem; flex-wrap: wrap; }
.push-dock-f .sp { flex: 1 1 auto; }
.push-dock-f .mini { margin: 0; display: inline-flex; align-items: center; gap: .35rem; }
.push-dock-f .mini svg { width: 15px; height: 15px; }
@media (max-width: 920px) { .push-dock-pv { display: none; } }
/* 23. 10. 2026: po přidání do Docku (nebo „Teď ne“) jen úsporný řádek — kde aplikace běží + tlačítko Postup, které návod rozbalí */
.push-dock.done { padding: .7rem .9rem; }
.push-dock.done .push-dock-logo svg.sb-logo { width: 34px; height: 34px; border-radius: 9px; box-shadow: 0 0 0 3px var(--acc-soft); }
.push-dock-act { flex: none; display: flex; align-items: center; gap: .4rem; }
.push-dock-act .mini { margin: 0; display: inline-flex; align-items: center; gap: .35rem; white-space: nowrap; }
.push-dock-act .mini svg { width: 15px; height: 15px; }
.push-dock-more .push-dock-f { margin-top: .55rem; }
@media (max-width: 920px) { .push-dock.done .push-dock-h { flex-wrap: wrap; } .push-dock-act { width: 100%; justify-content: flex-end; } }
.push-step .who { display: block; font-size: .76rem; }
@media (max-width: 720px) {
  .push-steps { grid-template-columns: 1fr; }
  .push-step { flex-direction: row; text-align: left; padding: .55rem .7rem; }
  .push-test span { display: none; }   /* na telefonu jen ikona letadélka, popisek je v title */
  .push-test { padding: .4rem .55rem; }
}
/* Hlášky — kapsle B1 (Marco 2. 10. 2026): sklo, barevná ikona podle druhu, text se zalamuje, akce jako kapsle, ✕; PC nahoře uprostřed,
   telefon dole na celou šířku nad palcem; víc hlášek pod sebou (#px_toasts). Používá pxToast() v zaklad.js (výpadek spojení, nová verze). */
#px_toasts { position: fixed; top: .7rem; left: 50%; transform: translateX(-50%); z-index: 9999; display: flex; flex-direction: column; align-items: center; gap: .5rem;
  width: max-content; max-width: min(680px, calc(100vw - 2rem)); pointer-events: none; }
.px-toast { pointer-events: auto; display: flex; align-items: center; gap: .6rem; max-width: 100%; box-sizing: border-box; padding: .4rem .5rem .4rem .6rem; border-radius: 999px;
  background: color-mix(in srgb, var(--panel) 88%, transparent); border: 1px solid var(--card-line); color: var(--ink); font-size: .88rem; line-height: 1.3;
  box-shadow: 0 14px 36px rgba(29,29,31,.16), inset 0 1px 0 rgba(255,255,255,.5); backdrop-filter: blur(20px) saturate(1.5); -webkit-backdrop-filter: blur(20px) saturate(1.5); }
.px-toast-i { width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex: none; }
.px-toast-i svg { width: 15px; height: 15px; }
.px-toast-err .px-toast-i { background: var(--err-bg); color: var(--err); }
.px-toast-warn .px-toast-i { background: var(--warn-bg); color: var(--warn); }
.px-toast-ok .px-toast-i { background: var(--ok-bg); color: var(--ok); }
.px-toast-info .px-toast-i { background: var(--acc-soft); color: var(--acc); }
.px-toast-t { flex: 1 1 auto; min-width: 0; font-weight: 500; overflow-wrap: anywhere; }
.px-toast-a { display: flex; align-items: center; gap: .5rem; flex: none; }
.px-toast-a button { width: auto; margin: 0; height: 30px; padding: 0 .75rem; border-radius: 999px; font-size: .82rem; font-weight: 600; white-space: nowrap;
  background: var(--btn-bg); border: 1px solid var(--btn-line); color: var(--ink); box-shadow: none; }
.px-toast-a button:hover { filter: none; border-color: var(--faint); }
.px-toast-a a { display: inline-flex; align-items: center; gap: .25rem; font-size: .82rem; font-weight: 600; white-space: nowrap; text-decoration: none; color: var(--acc); }
.px-toast-a a svg { width: 13px; height: 13px; }
.px-toast-err .px-toast-a a { color: var(--err); } .px-toast-warn .px-toast-a a { color: var(--warn); } .px-toast-ok .px-toast-a a { color: var(--ok); }
.px-toast-x { width: 26px; height: 26px; margin: 0; padding: 0; border-radius: 50%; border: 0; background: transparent; box-shadow: none; color: var(--mut); display: flex; align-items: center; justify-content: center; flex: none; }
.px-toast-x svg { width: 14px; height: 14px; }
.px-toast-x:hover { background: var(--neu-bg); color: var(--ink); filter: none; }
@media (max-width: 920px) {
  /* 8. 10. 2026 (Marco, snímek ze Safari na iPhonu: kapsle „nová verze“ byla úplně dole, tlačítka pod okrajem obrazovky, text přes obsah nečitelný):
     na telefonu hlášky NAHOŘE pod lepivou hlavičkou, ne dole — spodní pevné prvky v Safari na iPhonu padají pod viditelnou plochu (lišta Safari,
     klávesnice, rozšířené rozvržení při širší stránce); pozadí skoro neprůhledné, aby text nesplýval s obsahem pod ním. */
  #px_toasts { top: calc(64px + env(safe-area-inset-top, 0px)); bottom: auto; left: .75rem; right: .75rem; transform: none; width: auto; max-width: none; align-items: stretch; }
  .px-toast { flex-wrap: wrap; border-radius: 22px; padding: .55rem .6rem .55rem .7rem; background: color-mix(in srgb, var(--panel) 97%, transparent); box-shadow: 0 10px 30px rgba(29,29,31,.22), inset 0 1px 0 rgba(255,255,255,.5); }
  .px-toast-t { flex: 1 1 0; }
  .px-toast-x { order: 2; }
  .px-toast-a { order: 3; flex: 1 1 100%; padding-left: calc(28px + .6rem); }
  .px-toast-a button { flex: 0 1 auto; }
  /* hláška s volbami na telefonu = skleněné okno uprostřed obrazovky — návrh 2 z plátna UGytXV4UG3nJcEKpWSfAL5 (Marco 8. 10. 2026 v noci:
     „minimalismus, glass efekty, v duchu naší aplikace“): obrazovka pod oknem zjemní a rozmaže se, okno = sklo jako karty (.card), nahoře logo Ubyo,
     titulek (+ případný řádek detailu), tlačítka pod sebou — první modré (.prim), další skleněné, Zavřít jen jako tichý text; bez ✕, klepnutí
     mimo okno zavře. pxToast() v zaklad.js vybírá okno, má-li hláška actions. Barvy z proměnných vzhledu, takže sedí i tmavým vzhledům. */
  #px_dlg { position: fixed; inset: 0; z-index: 9999; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .6rem;
    padding: 24px; box-sizing: border-box; background: rgba(28,32,44,.22); -webkit-backdrop-filter: blur(10px) saturate(1.2); backdrop-filter: blur(10px) saturate(1.2);
    animation: px-veil-in .25s ease-out; }
  @keyframes px-veil-in { from { opacity: 0; } to { opacity: 1; } }
  .px-dlg { position: relative; width: 100%; max-width: 330px; box-sizing: border-box; border-radius: 24px; padding: 24px 20px 14px;
    display: flex; flex-direction: column; align-items: center; gap: 14px; color: var(--ink);
    background: color-mix(in srgb, var(--panel) 74%, transparent); -webkit-backdrop-filter: blur(30px) saturate(1.6); backdrop-filter: blur(30px) saturate(1.6);
    border: 1px solid var(--card-line); box-shadow: 0 24px 60px rgba(29,29,31,.20), inset 0 1px 0 rgba(255,255,255,.6); animation: px-dlg-in .3s cubic-bezier(.3,.7,.3,1.1); }
  @keyframes px-dlg-in { from { opacity: 0; transform: translateY(12px) scale(.97); } to { opacity: 1; transform: none; } }
  .px-dlg-h { display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; }
  .px-dlg-logo svg.sb-logo { width: 48px; height: 48px; border-radius: 13px; box-shadow: 0 0 0 6px var(--acc-soft), 0 10px 24px var(--logo-sh); }
  .px-dlg .px-toast-i { width: 44px; height: 44px; }
  .px-dlg .px-toast-i svg { width: 22px; height: 22px; }
  .px-dlg-t { font-size: 1.06rem; font-weight: 600; letter-spacing: -0.01em; line-height: 1.25; overflow-wrap: anywhere; }
  .px-dlg-d { font-size: .9rem; color: var(--mut); line-height: 1.4; margin-top: -6px; }
  .px-dlg-a { width: 100%; display: flex; flex-direction: column; gap: 8px; margin-top: 4px; }
  .px-dlg-a button, .px-dlg-a a { width: 100%; margin: 0; height: 46px; padding: 0 1rem; border-radius: 999px; font-size: .95rem; font-weight: 600; box-sizing: border-box;
    display: flex; align-items: center; justify-content: center; gap: .3rem; text-decoration: none; color: var(--ink);
    background: color-mix(in srgb, var(--panel) 55%, transparent); border: 1px solid var(--card-line); box-shadow: 0 4px 12px rgba(29,29,31,.06), inset 0 1px 0 rgba(255,255,255,.6); }
  .px-dlg-a button.prim { background: var(--prim-bg); color: var(--prim-ink); box-shadow: var(--prim-shadow); border: 0; }
  .px-dlg-a a svg { width: 13px; height: 13px; }
  .px-dlg-later { width: auto; margin: 0; height: 36px; padding: 0 .75rem; border: 0; border-radius: 999px; background: transparent; box-shadow: none;
    color: var(--mut); font-size: .85rem; font-weight: 500; }
  .px-dlg-later:hover { color: var(--ink); background: var(--neu-bg); filter: none; }
  @media (prefers-reduced-motion: reduce) { .px-dlg, #px_dlg { animation: none; } }
}
/* okno s obsahem pxDialog() (11. 10. 2026: volba období tarifu se souhlasem s VOP, potvrzení výpovědi, uzavření účtu) — stejné sklo jako hláška
   s volbami na telefonu (#px_dlg, návrh 2 z plátna UGytXV4UG3nJcEKpWSfAL5), ale na PC i telefonu, se zarovnáním textu vlevo a vlastním obsahem;
   tlačítka vedle sebe na PC, pod sebou na telefonu. Rekapitulace vyúčtování ročního tarifu (.px-set) se používá i v Účtu a v superadminu. */
#px_modal { position: fixed; inset: 0; z-index: 9998; display: flex; align-items: center; justify-content: center; padding: 24px; box-sizing: border-box;
  background: rgba(28,32,44,.22); -webkit-backdrop-filter: blur(10px) saturate(1.2); backdrop-filter: blur(10px) saturate(1.2); animation: px-veil-in .25s ease-out; }
@keyframes px-veil-in { from { opacity: 0; } to { opacity: 1; } }
.px-modal { position: relative; width: 100%; max-width: 460px; max-height: calc(100dvh - 48px); overflow: auto; box-sizing: border-box; border-radius: 24px; padding: 22px 22px 16px;
  display: flex; flex-direction: column; gap: 12px; color: var(--ink); background: color-mix(in srgb, var(--panel) 80%, transparent);
  -webkit-backdrop-filter: blur(30px) saturate(1.6); backdrop-filter: blur(30px) saturate(1.6); border: 1px solid var(--card-line);
  box-shadow: 0 24px 60px rgba(29,29,31,.20), inset 0 1px 0 rgba(255,255,255,.6); animation: px-modal-in .3s cubic-bezier(.3,.7,.3,1.1); }
@keyframes px-modal-in { from { opacity: 0; transform: translateY(12px) scale(.97); } to { opacity: 1; transform: none; } }
.px-modal-h { display: flex; align-items: center; gap: 12px; }
.px-modal-h .px-dlg-logo svg.sb-logo { width: 36px; height: 36px; border-radius: 10px; box-shadow: 0 0 0 5px var(--acc-soft); }
.px-modal-h .px-dlg-t { font-size: 1.08rem; font-weight: 600; letter-spacing: -0.01em; line-height: 1.25; }
.px-modal-b .sub { margin: 0 0 .7rem; }
.px-modal .msg { margin: 0; }
.px-modal-a { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.px-modal-a:empty { display: none; }
/* křížek vpravo nahoře (pxDialog o.x, 24. 10. 2026): roluje jen obsah okna, hlavička s křížkem zůstává nahoře (bez pruhu přes obsah) */
.px-modal.has-x { display: flex; flex-direction: column; overflow: hidden; }
.px-modal.has-x > .px-modal-h { flex: none; }
.px-modal.has-x > .px-modal-b { flex: 1 1 auto; min-height: 0; overflow: auto; margin: 0 -22px; padding: 0 22px 4px; }
.px-modal.has-x .px-dlg-t { flex: 1; min-width: 0; }
.px-x { flex: none; width: 36px; height: 36px; padding: 0; margin-left: auto; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--glass-edge);
  border-radius: 50%; background: var(--glass-bg); color: var(--mut); cursor: pointer; transition: background .15s, color .15s; }
.px-x svg { flex: none; width: 16px; height: 16px; }
@media (hover: hover) { .px-x:hover { color: var(--ink); background: var(--glass-row); } }
.px-x:focus-visible { outline: 2px solid var(--acc); outline-offset: 2px; }
.px-modal-a button { margin: 0; width: auto; }
.px-per { display: grid; gap: 8px; }
.px-per-o { display: flex; gap: .6rem; align-items: flex-start; margin: 0; padding: .65rem .8rem; border: 1px solid var(--card-line); border-radius: 14px; cursor: pointer;
  background: color-mix(in srgb, var(--panel) 55%, transparent); font-weight: 400; }
.px-per-o:has(input:checked) { border-color: var(--acc, #2f6fed); box-shadow: 0 0 0 3px var(--acc-soft); }
.px-per-o input { width: auto; margin: .2rem 0 0; flex: none; }
.px-per-o > span { display: flex; flex-direction: column; gap: .1rem; }
.px-terms { display: flex; gap: .55rem; align-items: flex-start; margin: .7rem 0 .2rem; font-weight: 400; line-height: 1.4; }
.px-terms[hidden] { display: none; }
.px-terms input { width: auto; margin: .2rem 0 0; flex: none; }
.px-set { margin: .2rem 0 .7rem; padding: .7rem .85rem; border: 1px solid var(--card-line); border-radius: 14px; background: color-mix(in srgb, var(--panel) 55%, transparent); }
.px-set-t { font-weight: 600; margin-bottom: .15rem; }
.px-set-r { display: flex; justify-content: space-between; gap: 1rem; padding: .22rem 0; border-top: 1px solid var(--hair); font-size: .92rem; }
.px-set-r:first-of-type { border-top: 0; }
.px-set-r strong { white-space: nowrap; font-variant-numeric: tabular-nums; }
.px-set-r.tot { border-top: 1px solid var(--ink); margin-top: .15rem; padding-top: .35rem; font-weight: 600; }
@media (max-width: 920px) {
  #px_modal { align-items: flex-end; padding: 12px 12px calc(12px + env(safe-area-inset-bottom)); }
  .px-modal { max-width: none; border-radius: 24px; padding: 20px 16px 14px; }
  .px-modal.has-x > .px-modal-b { margin: 0 -16px; padding: 0 16px 4px; }
  .px-modal-a { flex-direction: column-reverse; }
  .px-modal-a button { width: 100%; height: 46px; border-radius: 999px; font-size: .95rem; font-weight: 600; }
}
@media (prefers-reduced-motion: reduce) { .px-modal, #px_modal { animation: none; } }
@media print { #px_toasts, #px_dlg, #px_modal { display: none !important; } }
/* ikona před popiskem tlačítka v okně (a.ico v pxDialog) */
.px-modal-a button svg { vertical-align: -3px; margin-right: 7px; }
/* odhlášení se zapnutými oznámeními (pxLogout v push.js; návrh 1 z plátna 4KoeCbmARLUEt8RPVHBRfD, Marco 20. 10. 2026): dvě karty volby jako
   u volby období tarifu (.px-per-o), vybraná má rámeček v akcentu a barevnou ikonu; Zrušit · Odhlásit se v jednom řádku i na telefonu */
.px-modal.px-lo-dlg { max-width: 480px; gap: 14px; }
.px-lo { display: grid; gap: 8px; }
.px-lo-o { display: flex; gap: 12px; align-items: flex-start; margin: 0; padding: 12px 14px; border-radius: 14px; cursor: pointer; font-weight: 400; font-size: .95rem; color: var(--ink);
  border: 1px solid var(--glass-in-line, var(--card-line)); background: var(--glass-in-bg, color-mix(in srgb, var(--panel) 55%, transparent));
  transition: border-color .15s, box-shadow .15s; }
.px-lo-o:has(input:checked) { border-color: var(--acc); box-shadow: 0 0 0 3px color-mix(in srgb, var(--acc) 18%, transparent); }
/* fokus nese celá karta silnější září (ne druhý rámeček): okno zaostří vybranou volbu hned po otevření a Safari to bere jako fokus z klávesnice */
.px-lo-o:has(input:focus-visible) { box-shadow: 0 0 0 3px color-mix(in srgb, var(--acc) 34%, transparent); }
.px-lo-o input:focus-visible { outline: none; }
.px-lo-i { flex: none; width: 38px; height: 38px; border-radius: 11px; display: flex; align-items: center; justify-content: center; background: var(--neu-bg); color: var(--mut);
  transition: background .15s, color .15s; }
.px-lo-o:has(input:checked) .px-lo-i { background: var(--acc-soft); color: var(--acc); }
.px-lo-t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.px-lo-t b { font-weight: 600; line-height: 1.3; }
.px-lo-t span { font-size: .84rem; color: var(--mut); line-height: 1.45; }
.px-lo-o input { flex: none; width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--acc); cursor: pointer; }
@media (max-width: 920px) {
  .px-modal.px-lo-dlg { max-width: none; }
  .px-lo-o { border-radius: 16px; }
  .px-lo-o input { width: 20px; height: 20px; margin-top: 1px; }
  .px-lo-dlg .px-modal-a { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.theme-gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
.theme-gallery button { display: flex; flex-direction: column; align-items: stretch; gap: .55rem; text-align: left; padding: .75rem .8rem .7rem; }
.th-prev { display: block; height: 56px; border-radius: 8px; background: rgba(127,127,127,0.14); position: relative; overflow: hidden; }
.th-prev::before { content: ''; position: absolute; left: 6px; top: 6px; bottom: 6px; width: 22%; border-radius: 4px; background: rgba(127,127,127,0.26); }
.th-prev::after { content: ''; position: absolute; left: calc(22% + 12px); right: 6px; top: 6px; bottom: 6px; border-radius: 4px;
  background: linear-gradient(180deg, rgba(127,127,127,0.30) 0 10px, transparent 10px 15px, rgba(127,127,127,0.18) 15px 100%); }

/* dvoufázové ověření (Účet → Přihlášení) */
.tfa-setup { display: flex; gap: 1.2rem; flex-wrap: wrap; align-items: flex-start; }
.tfa-qr { width: 196px; height: 196px; flex: 0 0 196px; border-radius: 12px; background: #fff; padding: 8px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; }
.tfa-qr svg { width: 100%; height: 100%; display: block; }
.tfa-secret { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .95rem; letter-spacing: .06em; padding: .5rem .7rem; border: 1px dashed var(--line); border-radius: 10px; background: var(--neu-bg); word-break: break-all; }
.tfa-codes { display: grid; grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr)); gap: .35rem .8rem; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 1rem; letter-spacing: .06em; padding: .6rem .8rem; border: 1px solid var(--line); border-radius: 10px; background: var(--neu-bg); }

/* Účet: profilová fotka + přihlášená zařízení */
.ava-big { width: 56px; height: 56px; flex: 0 0 56px; border-radius: 50%; overflow: hidden; background: linear-gradient(135deg, #4a80f0, #7d5bd6); color: #fff; font-weight: 600; font-size: 1rem; display: flex; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,0.35); }
.sess-list { display: flex; flex-direction: column; gap: .4rem; }
.sess-row { display: flex; align-items: center; justify-content: space-between; gap: .8rem; padding: .55rem .8rem; border: 1px solid var(--line); border-radius: 10px; background: var(--neu-bg); }
.sess-row.cur { border-color: var(--ok); }
.sess-row .sess-l { min-width: 0; }
.sess-row .sess-l .who { margin-top: .1rem; }
.sess-row button { flex: 0 0 auto; }
@media (max-width: 720px) { .sess-row { flex-wrap: wrap; } }
/* Účet → Správci (tým): karta manažera + oprávnění jako pilulky (13. 9. 2026) */
.team-row { border: 1px solid var(--line); border-radius: 10px; background: var(--neu-bg); padding: .5rem .8rem .6rem; margin: .5rem 0 0; }
.team-head { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.team-head .team-name { width: auto; min-width: 9rem; max-width: 15rem; margin: 0; padding: .28rem .5rem; font-size: .9rem; font-weight: 600; border-radius: 8px; }
.team-head .who { flex: 1 1 auto; min-width: 0; }
.team-head .team-act { display: flex; gap: .4rem; margin-left: auto; }
.team-caps { display: flex; flex-wrap: wrap; gap: .35rem; margin: .45rem 0 0; }
.team-caps .chip { width: auto; margin: 0; padding: .28rem .65rem; font-size: .78rem; font-weight: 500; border-radius: 999px; line-height: 1.3;
  background: var(--btn-bg); border: 1px solid var(--btn-line); box-shadow: none; color: var(--ink); }
.team-caps .chip.on { background: var(--prim-bg); border-color: transparent; color: var(--prim-ink); font-weight: 600; }
.team-caps .chip.on::before { content: '✓ '; }
.team-row .msg, #team_msg { margin-top: .5rem; }
.team-pw { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin-top: .5rem; }
.team-pw input { width: auto; flex: 0 1 16rem; margin: 0; padding: .3rem .55rem; font-size: .9rem; border-radius: 8px; }
.team-add { border-top: 1px solid var(--hair); margin-top: .7rem; }
.team-grid3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 .8rem; align-items: start; }   /* minmax(0, …): dlouhý obsah buňky nesmí roztáhnout sloupec (Marco 30. 9. 2026) */
.team-grid3 > div { min-width: 0; }
.team-grid3 label { margin-top: .6rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.st-hint { font-size: .74rem; line-height: 1.35; margin: .25rem 0 .1rem; white-space: normal; overflow-wrap: anywhere; }   /* popisek pole pod vstupem, zalamuje se (Nastavení superadmina) */
.team-lbl { font-size: .8rem; font-weight: 500; color: var(--mut); margin: .7rem 0 .3rem; }
.team-foot { margin-top: .6rem; }
@media (max-width: 860px) { .team-grid3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { .team-grid3 { grid-template-columns: minmax(0, 1fr); } .team-head .team-act { margin-left: 0; } }


/* ---------- Energie — samostatná sekce (10. 9. 2026): kategorie v horní liště, rozvržení na celou šířku ---------- */
.en-banner { border: 1px solid var(--warn-line); background: var(--warn-bg); color: var(--warn); border-radius: 12px; padding: .7rem 1rem; font-size: .92rem; margin: 0 0 12px; line-height: 1.5; }
.en-banner.crit { border-color: var(--err-line); background: var(--err-bg); color: var(--err); }
.en-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 0 0 12px; }
.en-kpis .tile { margin: 0; }
.en-kpis .tile-v { font-size: 1.75rem; }
.en-two { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; align-items: start; }
.en-two > .card { margin: 0; min-width: 0; }
.en-two.ov { grid-template-columns: 2fr 1fr; }
.en-top { display: grid; grid-template-columns: minmax(340px, 1fr) 1.7fr; gap: 14px; align-items: start; margin-bottom: 14px; }
.en-top > .card { margin: 0; min-width: 0; }
.en-right { min-width: 0; display: flex; flex-direction: column; gap: 12px; }
.en-right > .card { margin: 0; }
.en-right .en-kpis { margin: 0; }
.en-pick { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 12px; }
.en-pick button { width: auto; margin: 0; padding: .5rem .95rem; font-size: .9rem; border-radius: 999px; background: var(--btn-bg); border: 1px solid var(--btn-line); box-shadow: var(--btn-shadow); color: var(--mut); font-weight: 500; }
.en-pick button:hover { filter: none; color: var(--ink); border-color: var(--faint); }
.en-pick button.on { background: var(--prim-bg); color: var(--prim-ink); border-color: transparent; box-shadow: var(--prim-shadow); font-weight: 600; }
.en-pick button.en-pick-add { border-style: dashed; color: var(--acc); }
.en-contract .en-h { display: flex; justify-content: space-between; gap: .6rem; align-items: center; flex-wrap: wrap; }
.en-fix { font-size: .8rem; font-weight: 600; border-radius: 8px; padding: .2rem .6rem; background: var(--ok-bg); color: var(--ok); white-space: nowrap; }
.en-fix.big { font-size: .88rem; padding: .3rem .7rem; }
.en-fix.warn { background: var(--warn-bg); color: var(--warn); }
.en-fix.crit { background: var(--err-bg); color: var(--err); }
.en-tbl { width: 100%; border-collapse: collapse; font-size: .93rem; margin-top: .2rem; table-layout: fixed; }
.en-tbl td { padding: .42rem 0; vertical-align: top; overflow-wrap: break-word; word-break: break-word; border-bottom: 1px solid var(--hair); line-height: 1.4; }
.en-tbl tr:last-child td { border-bottom: 0; }
.en-tbl td:first-child { color: var(--mut); width: 38%; padding-right: .7rem; }
.en-act { display: flex; gap: .45rem; margin-top: .9rem; flex-wrap: wrap; }
a.en-lnk { display: inline-flex; align-items: center; text-decoration: none; }
.en-subh { display: flex; justify-content: space-between; align-items: center; gap: .6rem; flex-wrap: wrap; margin-bottom: .5rem; }
.en-pdfzone { border: 2px dashed var(--acc); border-radius: 12px; background: var(--acc-soft); padding: .8rem 1rem; font-size: .9rem; cursor: pointer; margin: .6rem 0 .8rem; line-height: 1.5; }
.en-pdfzone:hover { filter: brightness(1.03); }
.en-pdfzone .who { display: block; margin-top: .25rem; white-space: pre-wrap; }
.en-filled { background: var(--ok-bg) !important; }
.en-inline { border: 1px solid var(--line); border-radius: 12px; padding: .3rem 1rem .9rem; margin: .2rem 0 .9rem; background: var(--panel); }
.en-grid3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 1rem; }
.en-term { display: grid; grid-template-columns: 6.5rem 1fr; gap: .1rem .8rem; padding: .55rem 0; border-top: 1px solid var(--hair); cursor: pointer; font-size: .92rem; }
.en-term:first-of-type { border-top: 0; }
.en-term:hover { background: var(--acc-soft); }
.en-term-d { font-weight: 600; grid-row: span 2; align-self: center; }
.en-term-d.warn { color: var(--warn); } .en-term-d.err { color: var(--err); }
.en-term-t { font-weight: 600; }
.en-term-p, .en-term .who { grid-column: 2; }
table.t.en-all td { vertical-align: middle; }
/* Energie → Všechna měřidla bez vodorovného posuvníku (Marco 21. 10. 2026): pevné šířky sloupců, texty se lámou, druhý řádek buňky drobně */
table.t.en-all .en-alls { display: block; font-size: .8rem; color: var(--mut); font-weight: 400; margin-top: .1rem; }
.en-fixd { display: block; font-size: .76rem; font-weight: 600; margin-top: .25rem; white-space: nowrap; }
.en-fixd.warn { color: var(--warn); } .en-fixd.crit { color: var(--err); }
@media (min-width: 921px) {
  table.t.en-all { table-layout: fixed; }
  table.t.en-all col.c1 { width: 30%; } table.t.en-all col.c2 { width: 21%; } table.t.en-all col.c3 { width: 16%; }
  table.t.en-all col.c4 { width: 12%; } table.t.en-all col.c5 { width: 21%; }
  table.t.en-all td, table.t.en-all th { overflow-wrap: anywhere; }
  table.t.en-all th { white-space: normal; }
}
.an-chart.en-chart .en-ax { font-size: 13px; }
.an-chart.en-chart .en-lab { font-size: 13px; }
.an-legend.en-legend { font-size: .88rem; margin-top: .6rem; }
.an-chart .en-bar { fill: #3d7bff; rx: 4; }
.an-chart .en-bar.prev { fill: none; stroke: var(--faint); stroke-width: 1.5; stroke-dasharray: 4 3; }
.an-chart .en-bar.nt { fill: #3d7bff; opacity: .45; }
.an-legend i.en-prevleg { width: 12px; height: 9px; border-radius: 2px; border: 1.5px dashed var(--faint); background: transparent; }
.an-legend i.en-ntleg { background: #3d7bff; opacity: .45; border-radius: 2px; }
@media (max-width: 1100px) { .en-top { grid-template-columns: 1fr; } .en-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } .en-grid3 { grid-template-columns: 1fr 1fr; } }
@media (max-width: 1100px) { .en-two.ov { grid-template-columns: 1fr; } }
@media (max-width: 860px) { .en-two { grid-template-columns: 1fr; } .en-grid3 { grid-template-columns: 1fr; } .en-tbl td:first-child { width: 42%; } }

/* ---------- tarify Basic / Profi, zkušební období (11. 9. 2026) ---------- */
.sn-pro { margin-left: auto; font-size: 9.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; line-height: 1;
  padding: 3px 6px; border-radius: 999px; background: var(--acc); color: #fff; opacity: .9; }
.sett-tabs .sn-pro { margin-left: .3rem; vertical-align: 1px; }
.tag.pro { background: var(--acc); color: #fff; }
/* Tarify a ceník (2. 10. 2026): šipka Zpět nad nadpisem, ✕ v rohu (res-x) */
.plans-back { display: inline-flex; align-items: center; gap: .35rem; margin: 0 0 .7rem; }
.plans-card > h1.pg { padding-right: 2.6rem; }
.plan-strip { border-radius: 12px; padding: .6rem 1rem; margin-bottom: 1rem; display: flex; align-items: center; gap: .6rem; flex-wrap: wrap;
  font-size: .9rem; background: var(--warn-bg); color: var(--ink); border: 1px solid var(--warn-line); }
.plan-strip.urgent { background: var(--err-bg); border-color: transparent; }
.plan-strip .sp { flex: 1; }
.plan-strip button { width: auto; margin: 0; padding: .35rem .8rem; font-size: .84rem; }
.wrap.wide { max-width: 920px; }
.plan-block h2 { margin: .8rem 0 .3rem; }
.plan-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin: 1rem 0 .6rem; }
@media (max-width: 720px) { .plan-cards { grid-template-columns: 1fr; } }
.plan-card { border: 1px solid var(--line); border-radius: 16px; padding: 1.1rem 1.2rem; background: var(--well); display: flex; flex-direction: column; }
.plan-card.profi { border-color: var(--acc); box-shadow: 0 0 0 1px var(--acc) inset; }
.plan-card.cur { background: var(--ok-bg); }
.plan-name { font-size: 1.15rem; font-weight: 700; display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.plan-price { margin: .35rem 0 .1rem; font-size: 1rem; }
.plan-price strong { font-size: 1.6rem; font-weight: 700; }
.plan-lead { margin: .8rem 0 .3rem; font-weight: 600; }
.plan-feats { margin: 0 0 .8rem; padding-left: 1.1rem; font-size: .9rem; line-height: 1.5; }
.plan-btn { margin-top: auto; display: flex; gap: .5rem; align-items: center; }
.plan-btn .mini { width: auto; }
.plan-foot { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: .8rem; }
.upsell h1 .tag, .upsell-in h2 .tag { vertical-align: middle; margin-left: .3rem; }
.upsell-a { display: flex; gap: .5rem; flex-wrap: wrap; margin: .6rem 0 .3rem; }
.upsell-in { border: 1px dashed var(--line); border-radius: 12px; padding: .8rem 1rem; margin: .6rem 0; background: var(--well); }

/* ---------- Superadmin 2.0 (Marco 14. 9. 2026): oznámení klientům, platební box, obrazovky superadmina ---------- */
.plan-strip.ann { background: var(--acc-soft); border-color: transparent; }
.plan-strip.ann.maintenance { background: var(--warn-bg); border-color: var(--warn-line); }
.plan-strip.ann.price { background: var(--ok-bg); border-color: transparent; }
.pay-box { border: 1px solid var(--line); border-radius: 12px; padding: .5rem .9rem .8rem; background: var(--well); margin: .6rem 0 .2rem; }
.pay-box label { margin: .45rem 0 .1rem; }
.pay-box .acct-val { text-align: left; }
/* superadmin: dlaždice metrik, seznam „co vyžaduje akci", filtry, časová osa, trychtýř, záložky, mřížky */
/* 30. 9. 2026 (Marco: „superadmin graficky stejný jako admin“): boxy metrik uvnitř karet mají vzhled vnořených souhrnných boxů klientské
   aplikace (.cl-sum-i v Úklidech) — popisek nahoře, pod ním hodnota a podtext, chladné pozadí; stav = tónované pozadí a barva hodnoty */
.sa-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 10px; margin-bottom: 1rem; }
.sa-kpi { display: flex; flex-direction: column; gap: .12rem; border: 1px solid var(--hair); border-radius: 10px; padding: .55rem .8rem; background: var(--neu-bg); min-width: 0; }
.sa-kpi .l { order: -1; font-size: .62rem; font-weight: 600; color: var(--faint); text-transform: uppercase; letter-spacing: 1.1px; line-height: 1.3; overflow-wrap: break-word; }
.sa-kpi .v { font-size: 1.3rem; font-weight: 600; letter-spacing: -0.02em; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-variant-numeric: tabular-nums; }
.sa-kpi .v.v2 { font-size: 1.1rem; } .sa-kpi .v.v3 { font-size: .95rem; }
.sa-kpi .s { font-size: .74rem; color: var(--mut); line-height: 1.3; overflow-wrap: break-word; }
.sa-kpi.warn { background: var(--warn-bg); border-color: transparent; } .sa-kpi.warn .v { color: var(--warn); }
.sa-kpi.err { background: var(--err-bg); border-color: transparent; } .sa-kpi.err .v { color: var(--err); }
.sa-kpi.acc { background: var(--acc-soft); border-color: transparent; } .sa-kpi.acc .v { color: var(--acc); }
.sa-todo { display: flex; flex-direction: column; gap: .4rem; }
.sa-todo .sess-row.warn { border-color: var(--warn-line); } .sa-todo .sess-row.err { border-color: var(--err-line); }
.sa-todo .sess-row .row-actions { display: flex; gap: .3rem; flex-wrap: wrap; justify-content: flex-end; }
.sa-filter { display: flex; gap: .5rem; flex-wrap: wrap; align-items: center; margin: 0 0 .8rem; }
.sa-filter input, .sa-filter select { width: auto; margin: 0; min-width: 9rem; }
.sa-tl { display: flex; flex-direction: column; gap: .2rem; }
.sa-tl .row { display: grid; grid-template-columns: 7.4rem 5.4rem 1fr; gap: .6rem; padding: .35rem .5rem; border-bottom: 1px solid var(--hair); font-size: .86rem; align-items: start; }
.sa-tl .row.err { background: var(--err-bg); border-radius: 8px; }
.sa-tl .k { font-size: .7rem; text-transform: uppercase; letter-spacing: .05em; color: var(--mut); padding-top: .15rem; }
.sa-tl .d { min-width: 0; overflow-wrap: anywhere; }
@media (max-width: 720px) { .sa-tl .row { grid-template-columns: 1fr; gap: .15rem; } }
.sa-funnel { display: inline-flex; gap: 3px; vertical-align: middle; }
.sa-funnel i { width: 12px; height: 6px; border-radius: 3px; background: var(--track); display: inline-block; }
.sa-funnel i.on { background: var(--ok-dot); }
.sa-tabs { display: flex; gap: .3rem; flex-wrap: wrap; margin: 0 0 .9rem; }
.sa-tabs button { width: auto; margin: 0; padding: .35rem .8rem; font-size: .84rem; border-radius: 9px; }
.sa-tabs button.on { background: var(--prim-bg); color: var(--prim-ink); border-color: transparent; }
.sa-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; align-items: start; }

/* Nastavení → Oznámení pro manažera (23. 10. 2026): kanál a pravidla účtu jen pro čtení — mění je vlastník */
.nr-ro [data-notif], .nr-ro [data-pushev], .nr-ro [data-pushtime] { pointer-events: none; opacity: .55; }
/* pulz klienta v kartě klienta (návrh 2, Marco 23. 10. 2026): Zavedení · Online · Aktivita 30 dní · E-maily + co klient dělal + šablony e-mailů */
.sa-pulse { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin-bottom: 1rem; align-items: stretch; }
.sa-pulse > .card { margin: 0; min-width: 0; }
@media (max-width: 1180px) { .sa-pulse { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .sa-pulse { grid-template-columns: 1fr; } }
.sa-ph { margin: 0 0 .6rem; font-size: .62rem; font-weight: 600; color: var(--faint); text-transform: uppercase; letter-spacing: 1.1px; }
.sa-prg { display: flex; align-items: center; gap: .8rem; margin-bottom: .55rem; min-width: 0; }
.sa-pbig { font-size: 1.75rem; font-weight: 700; letter-spacing: -0.02em; line-height: 1.1; font-variant-numeric: tabular-nums; }
.sa-pbig.sm { font-size: 1.25rem; }
.sa-live { display: inline-block; flex: none; width: 9px; height: 9px; border-radius: 50%; background: var(--track); }
.sa-live.on { background: var(--ok-dot); box-shadow: 0 0 0 4px var(--ok-bg), 0 0 10px var(--ok-dot); }
.sa-live.mid { background: var(--warn-dot); box-shadow: 0 0 0 4px var(--warn-bg); }
.sa-live.big { width: 13px; height: 13px; margin: 0 .2rem 0 .3rem; }
.sa-online { display: inline-flex; align-items: center; gap: .35rem; font-size: .8rem; color: var(--ok); margin-right: .45rem; vertical-align: middle; }
.sa-online.mid { color: var(--warn); }
.sa-ten-title .sa-online { margin: 0 .2rem 0 .1rem; }
.sa-steps .st { display: flex; align-items: center; gap: .45rem; font-size: .8rem; padding: .12rem 0; color: var(--mut); }
.sa-steps .st i { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 14px; height: 14px; border-radius: 50%; border: 1.5px solid var(--line); box-sizing: border-box; }
.sa-steps .st.on { color: var(--ink); }
.sa-steps .st.on i { background: var(--ok-dot); border-color: var(--ok-dot); }
.sa-steps .st.nx { color: var(--warn); font-weight: 600; }
.sa-steps .st.nx i { border: 2px solid var(--warn-dot); }
.sa-bars { display: grid; grid-template-columns: repeat(30, minmax(0, 1fr)); gap: 2px; align-items: end; height: 44px; margin-top: .4rem; }
.sa-bars i { display: block; border-radius: 2px; background: var(--track); }
.sa-bars i.on { background: var(--ok-dot); }
.sa-bars-ax { display: flex; justify-content: space-between; font-size: .68rem; margin-top: .3rem; }
.sa-prow { display: flex; justify-content: space-between; align-items: center; gap: .6rem; font-size: .82rem; padding: .38rem 0; border-bottom: 1px solid var(--hair); min-width: 0; }
.sa-prow:last-child { border-bottom: 0; }
.sa-prow .okc, .sa-pulse .okc { color: var(--ok); white-space: nowrap; }
.sa-pulse .errc { color: var(--err); }
.sa-prow > .who { white-space: nowrap; }
.sa-ell { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sa-feed .sa-prow .t { display: inline-block; width: 4.4rem; color: var(--faint); font-variant-numeric: tabular-nums; }
.sa-mcode { display: inline-block; min-width: 1.9rem; text-align: center; padding: .08rem .3rem; border-radius: 6px; font-size: .68rem; font-weight: 700; background: var(--acc-soft); color: var(--acc); font-variant-numeric: tabular-nums; }
.sa-tpl-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.6rem; }
@media (max-width: 920px) { .sa-tpl-cols { grid-template-columns: 1fr; } }
.sa-tpl-g { margin: .9rem 0 .15rem; font-size: .64rem; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: var(--faint); }
.sa-tpl-r { display: grid; grid-template-columns: 2.3rem minmax(0, 1fr) auto; gap: .6rem; align-items: center; font-size: .84rem; padding: .42rem 0; border-bottom: 1px solid var(--hair); }
.sa-tpl-r .st { font-size: .76rem; text-align: right; white-space: nowrap; }
.sa-tpl-r .st.ok { color: var(--ok); } .sa-tpl-r .st.no { color: var(--faint); } .sa-tpl-r .st.warn { color: var(--warn); } .sa-tpl-r .st.err { color: var(--err); }
@media (max-width: 980px) { .sa-grid2 { grid-template-columns: 1fr; } }
.sa-note textarea { width: 100%; min-height: 5rem; font: inherit; }
table.t.sa-clients td { vertical-align: middle; }
table.t.sa-clients .who { display: block; }
.sa-status { display: inline-flex; flex-direction: column; gap: .15rem; align-items: flex-start; }
.sa-status .who { white-space: nowrap; }
.sa-head { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; margin-bottom: .6rem; }
.sa-head h1 { margin: 0; } .sa-head .sp { flex: 1; }
.sa-form-inline { display: flex; gap: .5rem; flex-wrap: wrap; align-items: flex-end; }
.sa-form-inline > div { min-width: 8rem; } .sa-form-inline label { margin-top: .2rem; }
.sa-mono { font-variant-numeric: tabular-nums; }
.sa-acts { display: inline-flex; gap: .35rem; white-space: nowrap; }   /* Obsah → článek: Skrýt/Zobrazit · Upravit · Smazat vedle sebe (21. 9. 2026) */
.sa-acts .mini { margin: 0; }
.tag.neu { background: var(--neu-bg); color: var(--mut); }
.tag.acc { background: var(--acc-soft); color: var(--acc); }

/* ---------- Superadmin 2.0, 2. kolo (Marco 14. 9. 2026 odpoledne): značka se štítkem pod názvem, seznam a karta klienta, editor dlaždic, Pošta ---------- */
.sb-brand .sb-col { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.sb-brand .sb-col .tag { align-self: flex-start; font-size: .6rem; padding: .04rem .42rem; letter-spacing: .04em; }
.sa-back { display: inline-flex; align-items: center; gap: .45rem; padding: .48rem .95rem; font-size: .9rem; font-weight: 600; border-radius: 10px; }
.sa-back kbd { font-family: inherit; font-size: .66rem; font-weight: 600; color: var(--mut); border: 1px solid var(--line); border-radius: 5px; padding: .1rem .35rem; margin-left: .15rem; }
.sa-grid-ov { display: grid; grid-template-columns: minmax(270px, 1fr) minmax(0, 1.8fr); gap: 1rem; align-items: stretch; margin-bottom: 1.1rem; }
.sa-grid-ov > .card { margin-bottom: 0; }
@media (max-width: 980px) { .sa-grid-ov { grid-template-columns: 1fr; } }
.sa-life .acct-row { padding: .36rem 0; grid-template-columns: auto 1fr; gap: .6rem; }
.sa-life .acct-t { font-size: .82rem; font-weight: 500; color: var(--mut); }
.sa-life .acct-val { font-size: .85rem; }
.sa-contact { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: .3rem .9rem; }
.sa-contact > div { border-top: 1px solid var(--hair); padding: .42rem 0 .3rem; min-width: 0; }
.sa-contact .l { font-size: .66rem; text-transform: uppercase; letter-spacing: .06em; color: var(--mut); }
.sa-contact .v { font-size: .92rem; overflow-wrap: anywhere; }
.sa-contact .v a { color: var(--acc); text-decoration: none; }
table.t.sa-clients .sa-c1 { display: block; font-size: .79rem; color: var(--mut); line-height: 1.35; }
table.t.sa-clients td.sa-no { white-space: nowrap; }
table.t.sa-clients td:first-child { min-width: 14rem; }
.sa-kpi-edit { border: 1px dashed var(--line); border-radius: 12px; padding: .7rem .9rem; margin: .3rem 0 .9rem; background: var(--well); }
.card > .sa-kpi-edit:only-child { border: 0; border-radius: 0; padding: 0; margin: 0; background: none; }   /* editor nástěnky je samostatná karta (jako úpravy Přehledu v aplikaci) */
.sa-kpi-edit .dash-ordlist { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 0 .6rem; }
/* editor dlaždic (22. 9. 2026): název vždy na jednom řádku, popisek jen v bublině po najetí na „i“ */
.sa-kpi-edit .dash-tchk { font-size: .86rem; min-width: 0; }
.sa-kpi-edit .dash-tname { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sa-kpi-edit .dash-ord { position: relative; }
.dash-tinfo { flex: 0 0 auto; width: 1.05rem; height: 1.05rem; border-radius: 50%; border: 1px solid var(--line); color: var(--faint); font-size: .68rem; font-weight: 600; line-height: 1; display: inline-flex; align-items: center; justify-content: center; cursor: help; font-style: italic; }
.dash-tinfo:hover { color: var(--acc); border-color: var(--acc); }
.dash-tinfo::after { content: attr(data-tip); position: absolute; left: 1.6rem; right: .3rem; top: calc(100% + .15rem); z-index: 20; background: #2a2a2e; color: #fff; font-size: .8rem; font-weight: 400; line-height: 1.35; font-style: normal; padding: .45rem .6rem; border-radius: 8px; box-shadow: 0 6px 20px rgba(0,0,0,.18); opacity: 0; pointer-events: none; transition: opacity .12s; white-space: normal; }
.dash-tinfo:hover::after, .dash-tinfo:focus::after { opacity: 1; }
.sa-kpi-edit .foot { display: flex; gap: .5rem; flex-wrap: wrap; align-items: center; margin-top: .6rem; }
.sa-actions2 { display: flex; gap: .35rem; flex-wrap: wrap; margin-top: .55rem; }
.sa-tabs .mini.imp { border-color: var(--acc); color: var(--acc); }
/* Pošta: seznam vlevo, čtení / psaní vpravo */
.mail-wrap { display: grid; grid-template-columns: minmax(260px, 320px) minmax(0, 1fr); gap: 1rem; align-items: start; }   /* 26. 9. 2026: užší seznam, chat s panelem klienta potřebuje šířku */
@media (max-width: 980px) { .mail-wrap { grid-template-columns: 1fr; } }
.mail-list { display: flex; flex-direction: column; max-height: 74vh; overflow-y: auto; scrollbar-width: thin; }
.mail-row { display: grid; grid-template-columns: 10px minmax(0, 1fr) auto; gap: .5rem; padding: .5rem .55rem; border-bottom: 1px solid var(--hair); cursor: pointer; border-radius: 8px; align-items: start; }
.mail-row:hover { background: var(--acc-soft); }
.mail-row.on { background: var(--sn-on-bg); box-shadow: var(--sn-on-shadow); }
.mail-row .dot { width: 8px; height: 8px; border-radius: 50%; margin-top: .42rem; background: transparent; }
.mail-row.unread .dot { background: var(--acc); }
.mail-row .from, .mail-row .subj, .mail-row .snip { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.mail-row .from { font-size: .88rem; font-weight: 500; }
.mail-row.unread .from, .mail-row.unread .subj { font-weight: 700; }
.mail-row .subj { font-size: .86rem; }
.mail-row .snip { font-size: .77rem; color: var(--mut); }
.mail-row .when { font-size: .73rem; color: var(--mut); white-space: nowrap; text-align: right; }
.mail-row .tag { font-size: .6rem; padding: .04rem .38rem; margin-top: .25rem; display: inline-block; }
.mail-row .clip { font-size: .8rem; color: var(--mut); }
.mail-read { min-width: 0; }
.mail-head { display: flex; flex-wrap: wrap; gap: .3rem .8rem; align-items: baseline; }
.mail-head h2 { margin: 0; font-size: 1.05rem; }
.mail-meta { font-size: .82rem; color: var(--mut); margin: .25rem 0 .6rem; line-height: 1.5; }
.mail-body { border-top: 1px solid var(--hair); padding-top: .7rem; }
.mail-body pre { white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; font-size: .92rem; line-height: 1.5; margin: 0; }
.mail-frame { width: 100%; border: 0; min-height: 220px; background: #fff; border-radius: 8px; }
.mail-att { display: flex; gap: .4rem; flex-wrap: wrap; margin: .6rem 0; }
.mail-att button { width: auto; margin: 0; }
.mail-compose textarea { width: 100%; min-height: 9rem; font: inherit; }
.mail-compose input { margin-bottom: .3rem; }
.mail-thread { border-left: 2px solid var(--hair); padding-left: .7rem; margin: .6rem 0; }
.mail-thread .row { font-size: .82rem; padding: .18rem 0; }
.mail-thread .row a { color: var(--acc); text-decoration: none; }
.mail-tools { display: flex; gap: .35rem; flex-wrap: wrap; align-items: center; margin: .4rem 0 .6rem; }
.mail-tools select { width: auto; margin: 0; }
.mail-sys { opacity: .75; }
.mail-empty { color: var(--mut); font-size: .92rem; padding: 2rem 1rem; text-align: center; }

/* ---------- Superadmin 2.0, 3. kolo (Marco 14. 9. 2026 večer): větší názvy sekcí, tabulka klientů bez zalamování + sloupec Rezervace,
   karta klienta (hlavička a Kontakt a subjekt vedle sebe, stejně vysoké karty Přehledu), Pošta — celé vlákno pod sebou ---------- */
/* 30. 9. 2026: velký je jen název sekce (jako h1.pg v klientské aplikaci); názvy karet a panelů mají velikost názvů karet aplikace */
.sa-shell .content .card > h1, .sa-shell .content .sa-head > h1, .sa-shell .content .sa-ten-title > h1 { font-size: 1.5rem; letter-spacing: -0.02em; }
.sa-shell .content .card > h1 { margin-bottom: .45rem; }
.sa-shell .content h2 { font-size: 1.05rem; }
.sa-shell .mhead .burger { margin-left: auto; }
table.t.sa-clients th, table.t.sa-clients td.sa-no, table.t.sa-clients td.sa-num, table.t.sa-clients td.sa-nw, table.t.sa-clients .sa-status .who { white-space: nowrap; }   /* 4. kolo: ostatní buňky se zalamují, tabulka bez posuvníku */
table.t.sa-clients td.sa-num { font-variant-numeric: tabular-nums; }
.sa-ten-top { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(280px, 1fr); gap: 1rem; align-items: stretch; margin-bottom: 1.1rem; }   /* 5. kolo: vlevo hlavička s kontaktem, vpravo Životní cyklus */
.sa-ten-top > .card { margin-bottom: 0; min-width: 0; }
.sa-ten-head .msg:empty { display: none; }
@media (max-width: 1150px) { .sa-ten-top { grid-template-columns: 1fr; } }
.mail-msgs { display: flex; flex-direction: column; gap: .7rem; margin-top: .2rem; }
.mail-msg { border: 1px solid var(--line); border-radius: 12px; padding: .65rem .9rem .75rem; background: var(--well); min-width: 0; }
.mail-msg.out { background: var(--acc-soft); border-color: transparent; }
.mail-msg.on { border-color: var(--acc); }
.mail-msg-h { display: flex; flex-wrap: wrap; gap: .2rem .6rem; align-items: baseline; font-size: .84rem; margin-bottom: .45rem; }
.mail-msg-h strong { font-size: .9rem; }
.mail-msg-h .when { margin-left: auto; color: var(--mut); white-space: nowrap; font-size: .78rem; }
.mail-msg-h .tag { font-size: .6rem; padding: .04rem .38rem; }
.mail-msg .mail-body { padding-top: .5rem; }
.mail-msg .mail-att { margin: .5rem 0 0; }
.mail-tools .mini.on { background: var(--prim-bg); color: var(--prim-ink); border-color: transparent; }

/* ---------- Superadmin 2.0, 4. kolo (Marco 14. 9. 2026 večer): klikací řádky klientů bez posuvníku, karta klienta se šipkou zpět v rohu obrazovky,
   dlaždice s krátkými popisky a menším písmem u dlouhých hodnot, editor faktury, paměť podle klienta ---------- */
/* tabulky superadmina se neposouvají do strany: dlouhé buňky se zalamují, jen čísla, data a stavy zůstávají na řádku */
.sa-shell table.t td { overflow-wrap: break-word; }
.sa-shell .row-actions { white-space: normal; }
.sa-shell .row-actions .mini { margin: .12rem 0 .12rem .3rem; }
td.sa-nw { white-space: nowrap; }
table.t.sa-clients tr.rowlink:hover > td { background: var(--acc-soft); }
.sa-health { display: inline-flex; flex-wrap: wrap; gap: .25rem; max-width: 21rem; }
.sa-health .tag { font-size: .7rem; padding: .12rem .5rem; }
/* karta klienta: šipka zpět v pravém horním rohu obrazovky (Esc), název + stav, pruh záložek s podtržením, tlumené nebezpečné akce vpravo */
.sa-back-fab { position: fixed; top: 16px; right: 18px; z-index: 60; width: 38px; height: 38px; margin: 0; padding: 0; border-radius: 50%; font-size: 1.15rem; line-height: 1; display: flex; align-items: center; justify-content: center; }
@media (max-width: 920px) { .sa-back-fab { top: 62px; right: 12px; } }
.sa-ten-title { display: flex; align-items: center; gap: .4rem .7rem; flex-wrap: wrap; padding-right: 2.4rem; }
.sa-ten-title h1 { margin: 0; }
/* 5. kolo (14. 9. v noci): kontakt a subjekt v hlavičce, záložky jako klouzavé sklo (.sett-tabs sdílené s klientskou aplikací) */
.sa-ten-head .sa-ten-contact { margin: .5rem 0 .9rem; }
.sa-ten-head .sa-ten-contact .sa-contact > div { padding: .36rem 0 .28rem; }
/* 6. kolo: glass baner hned pod názvem klienta; v Poště a Fakturaci vedle vyhledávání */
.glass-bar { margin: .1rem 0 .2rem; }
.glass-bar button { padding: .45rem .9rem; font-size: .86rem; }
.glass-bar button .who { font-size: .74rem; margin-left: .15rem; }
.sa-ten-head .glass-bar { margin: .6rem 0 .2rem; }
.mail-boxes { display: flex; gap: .6rem; align-items: center; flex-wrap: wrap; margin: 0 0 .8rem; }
.mail-boxes .glass-bar { flex: 1 1 auto; margin: 0; }
/* 22. 9. 2026 (Marco): blok Automatická fakturace — karta klienta → Fakturace a stránka Fakturace; zelený proužek = zapnuto, oranžový = vypnuto */
.sa-auto-box { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; padding: .7rem .9rem; border-radius: 14px; margin: .2rem 0 .8rem; background: var(--neu-bg); border-left: 4px solid var(--ok-dot); }
.sa-auto-box.off { border-left-color: var(--warn-dot); }
.sa-auto-box .sa-auto-l { flex: 1 1 18rem; min-width: 0; }
.sa-auto-box .sa-auto-l strong { display: inline-flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
.sa-auto-box .sa-auto-l .who { margin-top: .25rem; display: block; }
/* 22. 9. 2026 (Marco): Audit jako časová osa po dnech — čas · kdo · akce · detail; sbalené opakování ×N; JSON detail rozbalovací */
.tag.sys { background: var(--neu-bg); color: var(--mut); border: 1px dashed var(--hair); }
.sa-aud { display: flex; flex-direction: column; }
.sa-aud-day { font-size: .7rem; text-transform: uppercase; letter-spacing: .06em; color: var(--mut); padding: .9rem 0 .3rem; border-bottom: 1px solid var(--hair); position: sticky; top: 0; background: var(--card-bg); z-index: 1; }
.sa-aud-day:first-child { padding-top: .2rem; }
.sa-aud-row { display: grid; grid-template-columns: 3.4rem minmax(11rem, 15rem) minmax(9rem, 12rem) minmax(0, 1fr); gap: .3rem .8rem; padding: .5rem .4rem; border-bottom: 1px solid var(--hair); font-size: .86rem; align-items: start; border-left: 3px solid transparent; }
.sa-aud-row.warn { border-left-color: var(--warn-dot); }
.sa-aud-row.acc { border-left-color: var(--acc); }
.sa-aud-row.ok { border-left-color: var(--ok-dot); }
.sa-aud-row .t { color: var(--mut); font-size: .82rem; padding-top: .15rem; }
.sa-aud-row .w { min-width: 0; overflow-wrap: anywhere; }
.sa-aud-row .w .c { display: block; margin-top: .15rem; }
.sa-aud-row .w .tag { margin-right: .2rem; }
.sa-aud-row .d { min-width: 0; overflow-wrap: anywhere; color: var(--ink); }
.sa-aud-json summary { cursor: pointer; color: var(--mut); list-style: none; }
.sa-aud-json summary::after { content: ' ▸'; font-size: .7rem; }
.sa-aud-json[open] summary::after { content: ' ▾'; }
.sa-aud-json pre { font-size: .74rem; white-space: pre-wrap; margin: .3rem 0 0; padding: .4rem .6rem; background: var(--well); border-radius: 8px; max-height: 18rem; overflow: auto; }
@media (max-width: 860px) { .sa-aud-row { grid-template-columns: 3.4rem 1fr; } .sa-aud-row .a, .sa-aud-row .d { grid-column: 2; } }
.mail-boxes input { width: auto; flex: 1 1 16rem; min-width: 14rem; margin: 0; }
/* 25. 9. 2026 (Marco): barevné příznaky jako v Apple Mail + VIP klienti — praporek v seznamu i v hlavičce zprávy, tečky pro výběr barvy,
   filtr barev pod glass banerem ve složce Označené, žlutá hvězdička VIP (štítek .tag.vip, tlačítko .vip-btn) */
.mail-flag { vertical-align: -1px; flex-shrink: 0; }
.mail-row .from .vip-star, .mail-row .from .mail-flag { vertical-align: -1px; }
.mail-flags { display: inline-flex; align-items: center; gap: .3rem; margin-left: .35rem; padding: .2rem .45rem; border-radius: 999px; background: var(--well); border: 1px solid var(--hair); }
.mail-flag-dot { width: 18px; height: 18px; border-radius: 50%; border: 2px solid transparent; padding: 0; margin: 0; box-shadow: none; cursor: pointer; font-size: .7rem; line-height: 1; color: var(--mut); background: transparent; }
.mail-flag-dot.none { border: 1px dashed var(--line); background: var(--card-bg); }
.mail-flag-dot.on { border-color: var(--ink); box-shadow: 0 0 0 2px var(--card-bg) inset; }
.mail-flag-dot:hover { filter: brightness(.92); }
.mail-flag-dot.none:hover { background: var(--well); }
.mail-flagbar { display: flex; gap: .35rem; flex-wrap: wrap; align-items: center; margin: -.3rem 0 .8rem; }
.mail-flagbar .mini { display: inline-flex; align-items: center; gap: .3rem; }
.tag.vip { background: #fff6d6; color: #8a6400; border: 1px solid #f0d27a; display: inline-flex; align-items: center; gap: .25rem; }
[data-theme="dark"] .tag.vip, [data-theme="violet"] .tag.vip, [data-theme="gold"] .tag.vip { background: rgba(245,179,1,0.16); color: #f5d066; border-color: rgba(245,179,1,0.4); }
/* zrušení VIP (20. 10. 2026): volba S doběhem 30 dní / Okamžitě v okně superadmina */
.vip-end { display: flex; flex-direction: column; gap: .5rem; margin: .2rem 0 .2rem; }
.vip-end label { display: flex; gap: .6rem; align-items: flex-start; padding: .6rem .75rem; border: 1px solid var(--hair); border-radius: 12px; cursor: pointer; font-weight: 500; margin: 0; }
.vip-end label:has(input:checked) { border-color: var(--acc); background: var(--acc-soft); }
.vip-end input { width: auto; margin: .2rem 0 0; flex: none; }
.vip-end .who { font-weight: 400; line-height: 1.4; }
.vip-btn { display: inline-flex; align-items: center; gap: .3rem; }
.vip-btn.on { background: #fff6d6; color: #8a6400; border-color: #f0d27a; }
[data-theme="dark"] .vip-btn.on { background: rgba(245,179,1,0.16); color: #f5d066; border-color: rgba(245,179,1,0.4); }
.mail-head .vip-btn { padding: .12rem .5rem; font-size: .72rem; }
.mail-msg-h .mail-flag { margin-left: -.2rem; }
/* ===== Pošta jako chat — návrh B (Marco 26. 9. 2026): ikonová lišta ve skupinách (Apple Mail), předmět na celý řádek, bubliny
   (klient vlevo světlé, Ubyo vpravo akcentové), rozbalovací hlavičky, přílohy jako karty, rychlá odpověď dole, panel klienta vpravo ===== */
.mail-row.flagged { box-shadow: inset 3px 0 0 var(--flag); }
.mail-row.flagged.on { box-shadow: inset 3px 0 0 var(--flag), var(--sn-on-shadow); }
.mail-b { display: grid; grid-template-columns: minmax(0, 1fr) 250px; gap: .9rem; align-items: start; min-width: 0; }
.mail-b.norail { grid-template-columns: minmax(0, 1fr); }
@media (max-width: 1400px) { .mail-b { grid-template-columns: minmax(0, 1fr); } .mail-rail { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: .7rem; } }
.mail-chat { min-width: 0; display: flex; flex-direction: column; gap: .6rem; }
.mtb-row { display: flex; align-items: center; gap: .45rem; flex-wrap: wrap; }
.mtb-row .sp { flex: 1; }
.mtb-info { font-size: .78rem; white-space: nowrap; }
.mtb-grp { display: inline-flex; align-items: center; gap: 2px; padding: 2px; border-radius: 11px; background: var(--card-bg); border: 1px solid var(--hair); box-shadow: 0 1px 2px rgba(29,29,31,0.05); }
.mtb-wrap { position: relative; display: inline-flex; }
.mtb { width: 34px; height: 32px; margin: 0; padding: 0; border: 0; border-radius: 9px; background: transparent; box-shadow: none; color: var(--ink); display: inline-flex; align-items: center; justify-content: center; gap: 2px; font-size: 0; }
.mtb.mtb-dd { width: auto; padding: 0 .35rem 0 .5rem; }
.mtb:hover { background: var(--acc-soft); filter: none; color: var(--acc); }
.mtb.danger { color: var(--err); }
.mtb.danger:hover { background: var(--err-bg); color: var(--err); }
.mail-menu { position: absolute; top: calc(100% + 6px); left: 0; z-index: 30; min-width: 13rem; padding: .35rem; border-radius: 12px; background: var(--card-bg); backdrop-filter: blur(14px); border: 1px solid var(--hair); box-shadow: 0 12px 30px rgba(29,29,31,0.16); display: flex; flex-direction: column; gap: 1px; }
.mail-menu[hidden] { display: none; }
.mail-menu-t { font-size: .68rem; text-transform: uppercase; letter-spacing: .05em; color: var(--mut); padding: .3rem .6rem .15rem; }
.mail-menu-it { width: 100%; margin: 0; padding: .45rem .6rem; border: 0; border-radius: 8px; background: transparent; box-shadow: none; color: var(--ink); font-size: .86rem; font-weight: 500; text-align: left; display: flex; align-items: center; gap: .55rem; }
.mail-menu-it:hover { background: var(--acc-soft); filter: none; }
.mail-menu-it.on { background: var(--sn-on-bg); font-weight: 600; }
.mail-menu-it svg { flex-shrink: 0; }
.mail-subj { margin: .1rem 0 0; font-size: 1.12rem; line-height: 1.3; overflow-wrap: anywhere; }
.mail-subj-meta { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; font-size: .82rem; margin-bottom: .2rem; }
.mail-subj-meta .sp { flex: 1; }
.mail-chat-body { display: flex; flex-direction: column; gap: .7rem; padding: .3rem 0; }
.bbl-day { display: flex; align-items: center; gap: .8rem; font-size: .7rem; color: var(--mut); text-transform: uppercase; letter-spacing: .06em; margin: .2rem 0; }
.bbl-day::before, .bbl-day::after { content: ''; flex: 1; height: 1px; background: var(--hair); }
.bbl { max-width: 82%; min-width: 0; padding: .6rem .85rem .7rem; border-radius: 16px 16px 16px 4px; background: var(--card-bg); border: 1px solid var(--hair); display: flex; flex-direction: column; gap: .4rem; align-self: flex-start; }
.bbl.out { align-self: flex-end; border-radius: 16px 16px 4px 16px; background: var(--acc); border-color: transparent; color: #fff; }
.bbl.on { border-color: var(--acc); box-shadow: 0 0 0 3px var(--acc-soft); }
.bbl.out.on { box-shadow: 0 0 0 3px var(--acc-soft), 0 0 0 1px #fff inset; }
.bbl-h { display: flex; align-items: center; gap: .5rem; font-size: .8rem; color: var(--mut); flex-wrap: wrap; }
.bbl-h strong { color: var(--ink); font-size: .88rem; }
.bbl.out .bbl-h { color: rgba(255,255,255,0.78); }
.bbl.out .bbl-h strong { color: #fff; }
.bbl-h .sp { flex: 1; }
.bbl-h .tag { font-size: .6rem; padding: .04rem .38rem; }
.bbl.out .bbl-h .tag { background: rgba(255,255,255,0.18); color: #fff; }
.bbl-hbtn { width: auto; margin: 0; padding: .05rem .5rem; border-radius: 999px; border: 1px solid var(--hair); background: var(--card-bg); box-shadow: none; color: var(--mut); font-size: .7rem; font-weight: 500; }
.bbl-hbtn.on { border-color: var(--acc); background: var(--acc-soft); color: var(--acc); }
.bbl.out .bbl-hbtn { border-color: rgba(255,255,255,0.45); background: transparent; color: #fff; }
.bbl.out .bbl-hbtn.on { background: rgba(255,255,255,0.2); }
.bbl-hbtn:hover { filter: none; background: var(--acc-soft); color: var(--acc); }
.bbl.out .bbl-hbtn:hover { background: rgba(255,255,255,0.25); color: #fff; }
.bbl-hdrs { display: grid; grid-template-columns: 6.2rem minmax(0, 1fr); gap: .15rem .6rem; padding: .5rem .65rem; border-radius: 10px; background: var(--well); font-size: .78rem; line-height: 1.45; color: var(--ink); overflow-wrap: anywhere; }
.bbl-hdrs[hidden] { display: none; }
.bbl-hdrs .l { color: var(--mut); }
.bbl-hdrs .bbl-mid { font-size: .72rem; }
.bbl.out .bbl-hdrs { background: rgba(255,255,255,0.14); color: #fff; }
.bbl.out .bbl-hdrs .l, .bbl.out .bbl-hdrs .who, .bbl.out .who { color: rgba(255,255,255,0.78); }
.bbl .mail-body { border-top: 0; padding-top: 0; }
.bbl .mail-body pre { font-size: .92rem; }
.bbl.out .mail-body pre { color: #fff; }
.bbl.out a { color: #fff; text-decoration: underline; }
.bbl .mail-frame { border-radius: 10px; min-height: 0; height: auto; display: block; }   /* výška jen podle obsahu — obecné .mail-frame má min-height 220 px (Marco 26. 9. 2026: „obrovská bílá mezera“) */
.bbl .mail-tools { margin: 0 0 .3rem; gap: .3rem; }
.bbl .mail-tools .mini { margin: 0; padding: .12rem .55rem; font-size: .72rem; border-radius: 999px; box-shadow: none; }   /* bez vnitřní linky (tlačítko se jinak „rozdvojí“, Marco 26. 9. 2026) */
.bbl.out .mail-tools .mini { background: rgba(255,255,255,0.16); color: #fff; border-color: rgba(255,255,255,0.4); }
.bbl .bbl-qt { margin: .35rem 0 0; }   /* tlačítko Zobrazit citaci pod textem (26. 9. 2026) */
.att-cards { display: flex; flex-wrap: wrap; gap: .4rem; }
.att-card { width: auto; margin: 0; padding: .4rem .6rem .4rem .45rem; border-radius: 10px; border: 1px solid var(--hair); background: var(--well); box-shadow: none; color: var(--ink); display: inline-flex; align-items: center; gap: .5rem; text-align: left; font-size: .8rem; max-width: 100%; }
.att-card:hover { filter: none; border-color: var(--acc); }
.bbl.out .att-card { background: rgba(255,255,255,0.14); border-color: rgba(255,255,255,0.35); color: #fff; }
.att-ico { width: 30px; height: 36px; border-radius: 5px; background: var(--acc); color: #fff; font-size: .58rem; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; letter-spacing: .02em; }
.bbl.out .att-ico { background: #fff; color: var(--acc); }
.att-txt { display: flex; flex-direction: column; gap: .05rem; min-width: 0; }
.att-n { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 22rem; }
.mail-reply { border-top: 1px solid var(--hair); padding-top: .7rem; display: flex; flex-direction: column; gap: .45rem; }
.mail-reply-to { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; font-size: .8rem; }
.mail-reply-to a { color: var(--acc); text-decoration: none; font-size: .78rem; }
.mail-reply textarea { width: 100%; min-height: 4.2rem; font: inherit; margin: 0; }
.mail-reply-foot { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; font-size: .76rem; }
.mail-reply-foot .mini { margin: 0; }
.mail-reply .mail-compose { margin: 0; }
.mail-rail { display: flex; flex-direction: column; gap: .7rem; min-width: 0; }
.rail-card { padding: .8rem .9rem; border-radius: 14px; background: var(--well); border: 1px solid var(--hair); display: flex; flex-direction: column; gap: .5rem; font-size: .82rem; }
.rail-t { font-size: .68rem; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; color: var(--mut); }
.rail-who { display: flex; align-items: center; gap: .6rem; min-width: 0; }
.rail-who-t { display: flex; flex-direction: column; gap: .1rem; min-width: 0; }
.rail-who-t strong { font-size: .92rem; }
.rail-who-t .who { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rail-av { width: 42px; height: 42px; border-radius: 50%; background: var(--neu-bg); color: var(--acc); font-weight: 600; font-size: .9rem; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.rail-av.ten { background: var(--acc); color: #fff; }
.rail-ten { display: flex; flex-direction: column; gap: .1rem; padding: .55rem .7rem; border-radius: 10px; background: var(--acc-soft); text-decoration: none; color: var(--ink); }
.rail-ten strong { color: var(--acc); }
.rail-vip { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .45rem .7rem; border-radius: 10px; background: var(--card-bg); border: 1px solid var(--hair); font-weight: 600; color: var(--mut); }
.rail-vip.on { background: #fff6d6; border-color: #f0d27a; color: #8a6400; }
[data-theme="dark"] .rail-vip.on { background: rgba(245,179,1,0.16); border-color: rgba(245,179,1,0.4); color: #f5d066; }
.rail-vip > span { display: inline-flex; align-items: center; gap: .35rem; }
.switch { width: 40px; height: 24px; margin: 0; padding: 2px; border: 0; border-radius: 12px; background: var(--line); box-shadow: none; display: inline-flex; justify-content: flex-start; flex-shrink: 0; transition: background .2s; }
.switch span { width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,0.25); transition: transform .2s; }
.switch.on { background: var(--ok-dot); }
.switch.on span { transform: translateX(16px); }
.switch:hover { filter: none; }
.rail-flags { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .35rem; }
.rail-flag { width: 100%; margin: 0; padding: .4rem .5rem; border-radius: 9px; border: 1px solid var(--hair); background: var(--card-bg); box-shadow: none; color: var(--ink); font-size: .78rem; font-weight: 500; display: inline-flex; align-items: center; gap: .35rem; }
.rail-flag.on { border: 2px solid var(--ink); padding: calc(.4rem - 1px) calc(.5rem - 1px); font-weight: 600; }
.rail-flag:hover { filter: none; border-color: var(--acc); }
.rail-card p.who { margin: 0; font-size: .74rem; line-height: 1.4; }
.rail-card select { margin: 0; width: 100%; }
.rail-card .dash-tchk { font-size: .78rem; }
.rail-card .mini { align-self: flex-start; margin: 0; }
.rail-rel { display: flex; justify-content: space-between; gap: .5rem; text-decoration: none; color: var(--ink); font-size: .8rem; padding: .2rem 0; border-bottom: 1px solid var(--hair); }
.rail-rel:last-child { border-bottom: 0; }
.rail-rel > span:first-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rail-rel > span:last-child { white-space: nowrap; flex-shrink: 0; }
.rail-rel:hover > span:first-child { color: var(--acc); }
.sa-inv-sum { display: flex; gap: .4rem 1.4rem; flex-wrap: wrap; align-items: center; font-size: .88rem; color: var(--mut); padding: .5rem .8rem; border: 1px solid var(--hair); border-radius: 10px; background: var(--well); margin: 0 0 .8rem; }
.sa-inv-sum strong { color: var(--ink); }
.sa-actions2 .imp { border-color: var(--acc); color: var(--acc); }
.sa-actions2 { align-items: center; margin-top: .35rem; }
.sa-actions2 .sp { flex: 1; }
/* 22. 9. 2026 (Marco): tlumená tlačítka splývala s textem — nebezpečné akce jsou červené už v klidu, po najetí s podkladem */
.sa-actions2 .danger { background: transparent; border-color: transparent; box-shadow: none; padding: .25rem .5rem; font-size: .8rem; color: var(--err); font-weight: 500; }
.sa-actions2 .danger:hover { color: var(--err); background: var(--err-bg); filter: none; }
/* editor faktury */
.sa-inv-ed .sa-items { margin-top: .8rem; }
.sa-inv-ed .sa-items input { margin: 0; padding: .35rem .5rem; font-size: .88rem; }
.sa-inv-ed .sa-items td { vertical-align: middle; }
.sa-items-tools { display: flex; gap: .4rem; flex-wrap: wrap; align-items: center; margin-top: .6rem; }
.sa-items-tools .sp { flex: 1; }
.sa-inv-total { font-size: .95rem; } .sa-inv-total strong { font-size: 1.15rem; margin-left: .3rem; }
/* paměť podle klienta */
.sa-bar { display: inline-block; width: 5.5rem; height: 6px; border-radius: 3px; background: var(--track); vertical-align: middle; margin-right: .4rem; overflow: hidden; }
.sa-bar i { display: block; height: 100%; background: var(--acc); border-radius: 3px; }

/* ---- Nastavení → Oznámení (15. 9. 2026): seznam událostí s přepínači a volbou času ---- */
.ev-grp { font-size: .76rem; text-transform: uppercase; letter-spacing: .08em; color: var(--faint); font-weight: 600; margin: 1.1rem 0 .25rem; display: flex; align-items: center; gap: .5rem; }
.ev-list { display: flex; flex-direction: column; }
.ev-row { display: flex; align-items: center; gap: 1rem; padding: .7rem 0; border-top: 1px solid var(--hair); }
.ev-row:first-child { border-top: 0; }
.ev-l { flex: 1; min-width: 0; }
.ev-t { font-size: .95rem; font-weight: 600; }
.ev-l .who { margin-top: .1rem; line-height: 1.4; }
.ev-when { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; margin-top: .45rem; font-size: .86rem; color: var(--mut); }
.ev-when select { width: auto; margin: 0; padding: .3rem .6rem; font-size: .86rem; }
.ev-row.off .ev-when { display: none; }
.ev-row.off .ev-t, .ev-row.off .who { opacity: .6; }
.sw { flex: none; position: relative; width: 46px; height: 27px; border-radius: 999px; border: 0; padding: 0; margin: 0; background: var(--track); cursor: pointer; transition: background .2s; box-shadow: inset 0 1px 2px rgba(0,0,0,.12); }
.sw::after { content: ''; position: absolute; top: 3px; left: 3px; width: 21px; height: 21px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.35); transition: left .2s; }
.sw.on { background: var(--acc); }   /* akcent vzhledu (Marco 15. 9. 2026: ne zelená, barva podle zvoleného vzhledu) */
.sw.on::after { left: 22px; }
.sw:focus-visible { outline: 2px solid var(--acc); outline-offset: 2px; }
/* návrh A (15. 9. 2026): pravidla po apartmánech — název, štítek a čas v jednom řádku; zděděná hodnota zašedlá */
.ev-l { display: flex; align-items: center; gap: .9rem; flex-wrap: wrap; }
.ev-when { margin-top: 0; }
.ev-tag { margin: 0; cursor: default; border: 0; font: inherit; font-size: .76rem; font-weight: 600; }
button.ev-tag { cursor: pointer; width: auto; padding: .18rem .6rem; box-shadow: none; }
button.ev-tag:hover { filter: brightness(1.1); }
.ev-row.inh .sw { opacity: .5; }
.ev-row.off .ev-t { opacity: .6; }
.notif-tabs { margin-bottom: .2rem; }
.notif-tabs .sn-pro { margin-left: .3rem; vertical-align: 1px; }
/* Pravidla oznámení — návrh 2 z plátna (Marco 20. 10. 2026): úzký seznam 720 px + ukázka oznámení vpravo */
.nr-wrap { display: flex; gap: 2rem; align-items: flex-start; }
.nr-main { flex: 0 1 720px; min-width: 0; }
.nr-pv { flex: 1 1 260px; min-width: 0; max-width: 420px; position: sticky; top: 1rem; padding-top: 2.6rem; display: flex; flex-direction: column; gap: .9rem; }
.nr-grp { display: flex; align-items: baseline; justify-content: space-between; gap: .75rem; margin: 1.1rem .15rem .5rem; }
.nr-grp:first-child { margin-top: 0; }
.nr-grp .ev-grp { margin: 0; }
.nr-grp > .who { font-size: .8rem; font-variant-numeric: tabular-nums; }
.nr-list { border-radius: 14px; background: var(--glass-bg); border: 1px solid var(--glass-edge); padding: 4px 0; }
.nr-row { position: relative; display: flex; align-items: center; gap: .75rem; padding: .45rem .9rem; }
.nr-row + .nr-row::before { content: ''; position: absolute; top: 0; left: 58px; right: .9rem; height: 1px; background: var(--hair); }
.nr-row.sel::after { content: ''; position: absolute; inset: 2px 6px; border-radius: 10px; background: var(--hl); box-shadow: inset 0 0 0 1px var(--acc-soft); z-index: 0; pointer-events: none; }
.nr-row > * { position: relative; z-index: 1; }
.nr-ic { width: 32px; height: 32px; border-radius: 9px; flex: none; display: flex; align-items: center; justify-content: center; background: var(--acc-soft); color: var(--acc); }
.nr-ic svg { width: 17px; height: 17px; }
.nr-row.off .nr-ic { background: var(--neu-bg); color: var(--mut); }
.nr-l { flex: 1 1 auto; min-width: 0; }
.nr-row.off .nr-l { opacity: .55; }
.nr-l > .who { line-height: 1.4; }
.nr-t { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.nr-name { margin: 0; padding: 0; border: 0; background: transparent; box-shadow: none; width: auto; color: var(--ink); font-size: .95rem; font-weight: 600; line-height: 1.55; text-align: left; cursor: pointer; }
@media (hover: hover) { .nr-name:hover { color: var(--acc); filter: none; background: transparent; } }
.nr-row.inh .sw { opacity: .5; }
.nr-chip { position: relative; display: inline-flex; align-items: center; gap: .3rem; height: 24px; box-sizing: border-box; padding: 0 .5rem 0 .62rem; margin: 0; border-radius: 999px;
  border: 1px solid var(--btn-line); background: var(--input-bg); color: var(--ink); font-size: .78rem; font-weight: 500; line-height: 1; white-space: nowrap; cursor: pointer; font-variant-numeric: tabular-nums; }
.nr-chip select { appearance: none; -webkit-appearance: none; border: 0; background: transparent; box-shadow: none; padding: 0; margin: 0; width: auto; height: auto; color: inherit; font: inherit; cursor: pointer; outline: none; }
.nr-chip:focus-within { outline: 2px solid var(--acc); outline-offset: 1px; }
.nr-chev { width: 10px; height: 10px; flex: none; color: var(--mut); pointer-events: none; }
.nr-pv-h .who { margin-top: .1rem; }
.nr-pv-card { border-radius: 18px; padding: .75rem .9rem .8rem; background: var(--glass-bg); border: 1px solid var(--glass-edge); box-shadow: var(--glass-shadow);
  -webkit-backdrop-filter: var(--glass-filter); backdrop-filter: var(--glass-filter); }
.nr-pv-top { display: flex; align-items: center; gap: .5rem; }
.nr-pv-logo svg.sb-logo { width: 20px; height: 20px; border-radius: 5px; display: block; }
.nr-pv-app { font-size: .72rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--mut); }
.nr-pv-now { margin-left: auto; font-size: .72rem; color: var(--mut); }
.nr-pv-t { margin-top: .5rem; font-size: .875rem; font-weight: 600; line-height: 1.35; color: var(--ink); }
.nr-pv-b { margin-top: .12rem; font-size: .83rem; line-height: 1.4; color: var(--ink); opacity: .82; }
.nr-pv-off { border-radius: 18px; padding: 1rem .9rem; border: 1px dashed var(--line); color: var(--mut); font-size: .83rem; line-height: 1.45; }
.nr-pv-off strong { color: var(--ink); }
.nr-pv-grid { display: grid; grid-template-columns: 72px minmax(0, 1fr); column-gap: .6rem; row-gap: .5rem; font-size: .81rem; line-height: 1.4; padding: .1rem .1rem 0; }
.nr-pv-grid > span:nth-child(odd) { color: var(--faint); }
.nr-pv-note { margin: 0; padding-top: .7rem; border-top: 1px solid var(--hair); line-height: 1.45; }
@media (max-width: 1180px) { .nr-wrap { display: block; } .nr-pv { position: static; max-width: none; padding-top: 1.4rem; } }
/* ===== Rámec pro mnoho bytů (Marco 20. 10. 2026): „Apartmán ▾“ v glass baneru + skleněná nabídka s hledáním (aptSegFill / aptPopOpen v zaklad.js) ===== */
.apt-pick-b { display: inline-flex !important; align-items: center; justify-content: center; gap: .4rem; min-width: 0; }
.apt-pick-l { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 22rem; }
.apt-pick-chev { width: 11px; height: 11px; flex: none; opacity: .75; }
.res-seg .apt-pick-b.on span.apt-pick-l { color: var(--ink); }   /* v .res-seg by span v aktivní položce zmodral (počty) — název apartmánu zůstává černý */
.apt-pickbar > button { flex: 1 1 0; min-width: 0; }
.apt-pop { position: fixed; z-index: 9000; box-sizing: border-box; display: flex; flex-direction: column; padding: .55rem; overflow: hidden;
  background: var(--glass-bg), color-mix(in srgb, var(--panel) 80%, transparent); border-radius: 16px;
  box-shadow: var(--glass-shadow), 0 24px 60px rgba(0,0,0,.22); animation: apt-pop-in .16s ease-out; }
@keyframes apt-pop-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .apt-pop { animation: none; } }
.apt-pop-h { display: flex; align-items: center; gap: .5rem; padding: .15rem .55rem .5rem; border-bottom: 1px solid var(--hair); margin-bottom: .35rem; color: var(--mut); }
.apt-pop-h svg { width: 17px; height: 17px; flex: none; }
#aptPop .apt-pop-h input { flex: 1 1 auto; min-width: 0; width: auto; margin: 0; padding: .4rem 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; color: var(--ink); font-size: .95rem; outline: none; }
.apt-pop-cnt { flex: none; font-variant-numeric: tabular-nums; }
.apt-pop-l { overflow-y: auto; overscroll-behavior: contain; display: flex; flex-direction: column; gap: 2px; padding-right: 2px; }
.apt-pop-g { font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; color: var(--faint); font-weight: 600; padding: .55rem .6rem .25rem; }
.apt-pop-g:first-child { padding-top: .2rem; }
.apt-pop-i { display: flex; align-items: center; gap: .6rem; width: 100%; margin: 0; padding: .5rem .65rem; border: 0; border-radius: 10px; background: transparent; box-shadow: none;
  color: var(--ink); text-align: left; font: inherit; cursor: pointer; }
.apt-pop-i:hover, .apt-pop-i:focus-visible { background: var(--acc-soft); outline: none; filter: none; }
.apt-pop-i.on { background: var(--glass-row); }
.apt-pop-tx { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.apt-pop-n { font-size: .92rem; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.apt-pop-tx .who { font-size: .78rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.apt-pop-i .tag { margin: 0; flex: none; }
.apt-pop-ok { width: 16px; height: 16px; flex: none; color: var(--acc); }
.apt-pop-none { padding: .8rem .65rem; }
.apt-pop-i[hidden], .apt-pop-g[hidden], .apt-pop-none[hidden] { display: none; }   /* třída .apt-pop-i má display:flex — bez toho by hledání řádky neskrylo */
.apt-pop.sheet { left: 0 !important; right: 0; bottom: 0; top: auto !important; width: auto !important; max-height: 75vh !important; border-radius: 20px 20px 0 0;
  padding-bottom: calc(.55rem + env(safe-area-inset-bottom)); animation-name: apt-sheet-in; box-shadow: 0 0 0 100vmax rgba(0,0,0,.32), var(--glass-shadow); }   /* telefon: list zdola, zbytek obrazovky ztlumený */
@keyframes apt-sheet-in { from { transform: translateY(24px); opacity: 0; } to { transform: none; opacity: 1; } }
@media (max-width: 920px) { .nr-pv { display: none; } .nr-row { padding: .5rem .7rem; } .nr-row + .nr-row::before { left: 54px; } }
/* křížek pro skrytí rozbaleného detailu (Aktivní přihlášení; Marco 15. 9. 2026) */
.acct-x { width: 30px; height: 30px; flex: none; margin: 0; padding: 0; border-radius: 8px; border: 1px solid var(--btn-line);
  background: var(--btn-bg); box-shadow: var(--btn-shadow); color: var(--mut); font-size: .95rem; line-height: 1; cursor: pointer; }
.acct-x:hover { color: var(--ink); border-color: var(--faint); filter: none; }

/* ---- Superadmin → Web (21. 9. 2026): stav webu, sloupcový graf po dnech, tabulky s pruhem ---- */
.sa-web-state { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; padding: .85rem 1rem; border: 1px solid var(--hair); border-radius: 12px; margin: .8rem 0 1rem; }
.sa-web-state .dot { width: 10px; height: 10px; border-radius: 50%; background: var(--ok); box-shadow: 0 0 0 4px var(--ok-bg); flex: 0 0 auto; }
.sa-web-state.hidden .dot { background: var(--err); box-shadow: 0 0 0 4px var(--err-bg); }
.sa-web-chart { display: flex; align-items: flex-end; gap: 3px; height: 150px; padding-top: .4rem; border-bottom: 1px solid var(--hair); }
.sa-web-chart .c { flex: 1; display: flex; align-items: flex-end; gap: 1px; height: 100%; min-width: 0; }
.sa-web-chart .c i { display: block; flex: 1; border-radius: 2px 2px 0 0; min-height: 1px; }
.sa-web-chart .c i.v { background: var(--acc); }
.sa-web-chart .c i.b { background: var(--track); }
.sa-web-axis { display: flex; justify-content: space-between; font-size: .72rem; color: var(--faint); margin-top: .35rem; }
.sa-web-axis .lg { display: inline-block; width: 9px; height: 9px; border-radius: 2px; margin: 0 .3rem 0 .6rem; vertical-align: -1px; }
.sa-web-axis .lg.v { background: var(--acc); } .sa-web-axis .lg.b { background: var(--track); }
.sa-web-t td.sa-num { white-space: nowrap; }
.sa-web-t .sa-bar { width: 4.5rem; }
@media (max-width: 700px) { .sa-web-t .sa-bar { display: none; } .sa-web-chart { height: 110px; } }

/* Bezpečnostní dohled (22. 9. 2026): zvýrazněná nová přihlášení, rozbalovací návody „Co dělat když…“ */
.t tr.sec-new-c td { background: var(--err-bg); }
.t tr.sec-new-ip td { background: var(--warn-bg); }
.sec-q { border-top: 1px solid var(--line); padding: .45rem 0; }
.sec-q summary { cursor: pointer; font-weight: 600; font-size: .92rem; }
.sec-a { padding: .3rem 0 .2rem .2rem; font-size: .9rem; color: var(--ink); }
.sec-a ol { margin: .2rem 0 0 1.2rem; padding: 0; }
.sec-a li { margin: .2rem 0; }
.sec-lrow { cursor: pointer; }
.sec-lrow:hover td { background: var(--well); }
.sec-ldet td { background: var(--well); border-top: 0; }
.sec-lact { display: flex; gap: .4rem; flex-wrap: wrap; align-items: center; padding: .2rem 0; }

/* ---------- Superadmin → Nástěnka (23. 9. 2026; 30. 9. 2026 Marco: „superadmin graficky stejný jako admin“) ----------
   Nástěnka používá STEJNÉ prvky jako Přehled klientské aplikace: hlavička .dash-head, dlaždice = baner .tile (popisek .tile-l, hodnota .tile-v,
   podtext .tile-s) přímo na pozadí stránky, „Co vyžaduje mou akci“ = panel s řádky .dp-row. Dřívější vlastní dlaždice (.sa-dt s barevným
   rámečkem, tónem a ikonou) jsou pryč; zůstává jen jemná křivka za 12 měsíců a volná mřížka 12 sloupců (tah ⠿, roh = velikost). */
.sa-dgrid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-rows: 130px; gap: 14px; margin-bottom: 1.1rem; }
.sa-dcell { min-width: 0; min-height: 0; position: relative; display: flex; }
.sa-dcell > .tile { flex: 1 1 auto; min-width: 0; min-height: 0; overflow: hidden; }
.sa-dcell > .dp-ph { flex: 1; }
.sa-dcell .sa-dgrip { position: absolute; left: 10px; top: 8px; z-index: 3; background: var(--panel); border-radius: 6px; padding: .05rem .25rem; box-shadow: 0 1px 4px rgba(0,0,0,.15); }
.sa-dgrid.edit .tile { border: 1px dashed var(--acc); }
.sa-dgrid.edit .tile.tile-click { cursor: default; }
.sa-dgrid.edit .tile-l { padding-left: 1.6rem; }
.sa-t > *:not(.sa-t-spark) { position: relative; z-index: 1; }
.sa-t .tile-v { font-variant-numeric: tabular-nums; }
.sa-t .tile-v.v2 { font-size: 1.3rem; } .sa-t .tile-v.v3 { font-size: 1.05rem; }
.sa-t.tall .tile-v.v2 { font-size: 1.75rem; } .sa-t.tall .tile-v.v3 { font-size: 1.35rem; }
.sa-t.warn .tile-v { color: var(--warn); } .sa-t.err .tile-v { color: var(--err); }
.sa-t .tile-s { max-width: 72%; }
.sa-t.tall .tile-s { max-width: 100%; font-size: .84rem; }
.sa-t-ic { display: none; color: var(--faint); line-height: 0; }
.sa-t-spark { position: absolute; right: 0; bottom: 0; width: 56%; height: 36px; pointer-events: none; z-index: 0; }
.sa-t-spark .ln { fill: none; stroke: #3d7bff; stroke-width: 1.8; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; opacity: .7; }
.sa-t-spark .ar { fill: #3d7bff; opacity: .08; }
.sa-t.tall .sa-t-spark { height: 64px; width: 62%; }
/* nejmenší dlaždice 1 × 1: jen ikona a číslo, název po najetí */
.sa-t.mini { padding: .6rem .6rem .55rem; }
.sa-t.mini .tile-l > span:not(.sa-t-ic), .sa-t.mini .tile-s, .sa-t.mini .sa-t-spark { display: none; }
.sa-t.mini .sa-t-ic { display: block; }
.sa-t.mini .tile-v { font-size: 1.35rem; margin: .45rem 0 0; }
.sa-t.mini .tile-v.v2 { font-size: 1rem; } .sa-t.mini .tile-v.v3 { font-size: .82rem; }
/* Vývoj za 12 měsíců: glass baner Klienti / Tržby v řádku popisku (jako M / K / R u banerů), graf ve stylu Analytiky přes celou dlaždici */
.sa-growth .tile-l { flex-wrap: nowrap; }
.sa-growth .tile-l > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sa-growth .tile-l .glass-bar { margin: -.2rem 0 -.2rem auto; flex: none; flex-wrap: nowrap; text-transform: none; letter-spacing: 0; }
.sa-growth .tile-l .glass-bar button { padding: .26rem .7rem; font-size: .78rem; }
.sa-growth .g-c1 { color: var(--acc); }
.sa-g-delta { font-size: .76rem; font-weight: 600; letter-spacing: 0; margin-left: .35rem; padding: .08rem .45rem; border-radius: 99px; vertical-align: middle; }
.sa-g-delta.up { color: var(--ok); background: var(--ok-bg); } .sa-g-delta.down { color: var(--err); background: var(--err-bg); }
.sa-g-plot { position: relative; flex: 1 1 0; min-height: 0; }
.sa-g-plot > .empty { padding: .4rem 0; }
.sa-growth-svg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: block; }
.sa-growth-svg .g-grid { stroke: var(--hair); stroke-width: 1; }
.sa-growth-svg .g-ax { fill: var(--faint); font-size: 10.5px; font-weight: 600; }
.sa-growth-svg .g-ax.cur { fill: var(--acc); }
.sa-growth-svg .g-l1 { fill: none; stroke: #3d7bff; stroke-width: 2.5; stroke-linejoin: round; stroke-linecap: round; }
.sa-growth-svg .g-l2 { fill: none; stroke: var(--faint); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; opacity: .85; }
.sa-growth-svg .g-d1 { fill: #3d7bff; }
.sa-growth-svg .g-d2 { fill: var(--faint); }
.sa-growth-svg .g-bar { fill: #3d7bff; opacity: .45; }
.sa-growth-svg .g-bar.cur { opacity: 1; }
.sa-growth-svg .g-hit { fill: transparent; cursor: crosshair; }
.sa-growth-svg .g-cross { stroke: var(--line); stroke-width: 1; stroke-dasharray: 3 3; pointer-events: none; }
.sa-g-tip { position: absolute; top: 0; z-index: 5; pointer-events: none; background: var(--panel); border: 1px solid var(--card-line); border-radius: 10px;
  padding: .45rem .65rem; font-size: .78rem; line-height: 1.45; white-space: nowrap; box-shadow: var(--card-shadow); }
.sa-g-tip b { font-variant-numeric: tabular-nums; }
.sa-g-tip > b:first-child { display: block; margin-bottom: .1rem; }
.sa-g-tip .who { display: block; }
.sa-g-leg { display: flex; gap: .2rem 1.1rem; flex-wrap: wrap; }
.g-k1, .g-k2 { display: inline-block; width: 14px; height: 3px; border-radius: 2px; background: #3d7bff; vertical-align: middle; margin-right: .4rem; }
.g-k2 { background: var(--faint); }
.g-k1.bar { width: 10px; height: 10px; border-radius: 3px; }
/* „Co vyžaduje mou akci“: panel jako na Přehledu — název ve velikosti názvů karet, řádky oddělené vlasovou linkou, stav jako barevná tečka */
.sa-tlist { display: flex; flex-direction: column; }
.sa-tlist .dp-row { gap: .7rem; padding: .55rem 4px; }
.sa-tlist .dp-row .dp-t strong, .sa-tlist .dp-row .dp-t .who { white-space: normal; overflow: visible; }
.sa-tlist .dp-row .dp-t .who strong { display: inline; font-size: inherit; }
.sa-tr-dot { flex: 0 0 auto; width: 8px; height: 8px; border-radius: 50%; background: var(--track); }
.dp-row.warn > .sa-tr-dot { background: var(--warn-dot); } .dp-row.err > .sa-tr-dot { background: var(--err-dot); }
.sa-tlist .row-actions { display: flex; gap: .3rem; flex-wrap: wrap; justify-content: flex-end; align-items: center; flex: 0 0 auto; }
.sa-tlist .row-actions .mini { margin: 0; }
.sa-shell .card-hrow h1 + .tag { margin-left: -.3rem; }
/* skrývání položek „Co vyžaduje mou akci" */
.sa-hide-wrap { position: relative; display: inline-flex; }
.sa-hide-b { padding: .34rem .45rem !important; color: var(--faint); display: inline-flex; align-items: center; }
.sa-hide-b:hover { color: var(--ink); }
.sa-hide-menu { position: absolute; right: 0; top: calc(100% + 5px); z-index: 30; min-width: 11.5rem; display: flex; flex-direction: column; gap: .1rem;
  background: var(--panel); border: 1px solid var(--line); border-radius: 11px; padding: .4rem; box-shadow: 0 12px 28px rgba(0,0,0,.16); }
.sa-hide-menu .who { font-size: .7rem; text-transform: uppercase; letter-spacing: .06em; padding: .15rem .5rem .25rem; }
.sa-hide-menu button { width: 100%; margin: 0; text-align: left; background: transparent; border: 0; box-shadow: none; color: var(--ink); padding: .42rem .55rem; border-radius: 7px; font-size: .85rem; }
.sa-hide-menu button:hover { background: var(--acc-soft); }
.sa-tlist .dp-row.sa-hid { opacity: .62; }
.sa-edit-hero { display: flex; gap: .5rem 1.1rem; flex-wrap: wrap; align-items: center; margin: .1rem 0 .7rem; padding-bottom: .6rem; border-bottom: 1px solid var(--hair); font-size: .86rem; }
.sa-edit-hero .dash-tchk { display: inline-flex; align-items: center; gap: .3rem; }
.sa-edit-hero input[type=checkbox] { width: auto; margin: 0; }
/* Klienti: hlavní je podnikatelský subjekt, další subjekty účtu pod ním (23. 9. 2026) */
table.t.sa-clients .sa-ent1 strong { font-size: .95rem; }
table.t.sa-clients .sa-ent2 { display: block; color: var(--ink); font-weight: 600; font-size: .95rem; margin-top: .3rem; line-height: 1.3; }
table.t.sa-clients .sa-entb { margin-top: 0; }
table.t.sa-clients .sa-entn { font-size: .62rem; padding: .03rem .4rem; vertical-align: 1px; }
@media (max-width: 760px) {
  .sa-dgrid { display: flex; flex-direction: column; }
  .sa-dcell { grid-column: auto !important; grid-row: auto !important; min-height: 110px; }
  .sa-dcell > .sa-growth { min-height: 250px; }
  .sa-tlist .dp-row { flex-wrap: wrap; }
  .sa-tlist .dp-row .dp-t { flex: 1 1 calc(100% - 1.4rem); }
  .sa-tlist .row-actions { margin-left: 1.2rem; justify-content: flex-start; }
}

/* ============================================================
   Mobilní optimalizace (26. 9. 2026, Marco: „na telefonu není tolik místa")
   Zásada: co nejvíc informací na jedné obrazovce — menší banery ve dvou sloupcích, panely bez plných tabulek,
   glass banery jako mřížka, lišty nástrojů ve dvou sloupcích, adresáře měsíců sbalené.
   ============================================================ */
.mob-only { display: none; }           /* text jen pro mobil (např. „2 noci" místo holého čísla ve sloupci Nocí) */
@media (max-width: 920px) {
  .mob-hide { display: none !important; }   /* vysvětlivky, které na telefonu jen zabírají místo */
  .dt-only { display: none; }
  .mob-only { display: inline; }
  h1.pg { font-size: 1.3rem; margin-bottom: .3rem; }
  .sub { font-size: .86rem; margin-bottom: .8rem; }
  .card { padding: .9rem .9rem; margin-bottom: .8rem; border-radius: 14px; }
  .content { padding: 12px 12px calc(40px + env(safe-area-inset-bottom, 0px)); }   /* spodek nikdy pod lištou telefonu */
  .mhead { padding: 9px 12px; }
  /* glass baner: místo nahodilého zalamování mřížka 2 sloupce; lichá poslední položka přes celou šířku */
  /* víc řádků = lišta už není pilulka: rohy 14 px, sklo i tlačítka 11 px, ať sklo lícuje s tvarem lišty (Marco 26. 9. 2026, obr. 3–5) */
  .res-seg, .sett-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 3px; border-radius: 14px; padding: 4px; }
  .res-seg button, .sett-tabs button { width: 100%; flex: none; padding: .48rem .45rem; font-size: .84rem; border-radius: 11px; overflow: hidden; text-overflow: ellipsis; }
  .res-seg .seg-glide, .sett-tabs .seg-glide { border-radius: 11px; }
  .res-seg button:last-of-type:nth-of-type(odd), .sett-tabs button:last-of-type:nth-of-type(odd) { grid-column: 1 / -1; }
  /* záložky v kartě rezervace (Odbavení / Hosté / Údaje): tři krátké položky = JEDEN řádek, pilulka jako na desktopu (Marco 26. 9. 2026 večer, obr. 1) */
  .sett-tabs.dq-tabs { display: flex; gap: 2px; border-radius: 999px; padding: 3px; }
  .sett-tabs.dq-tabs button { width: auto; flex: 1 1 0; padding: .42rem .3rem; font-size: .82rem; border-radius: 999px; }
  .sett-tabs.dq-tabs .seg-glide { border-radius: 999px; }
  .res-seg { margin-bottom: .6rem; }
  /* Rezervace: přepínač Seznam/Kalendář + tlačítka ve dvou řádcích na plnou šířku */
  .res-tools { margin-bottom: .55rem !important; }
  .res-tools > span { display: none; }
  .res-tools .res-view { flex: 1 1 100%; justify-content: stretch; }
  .res-tools .res-view button { flex: 1; }
  .res-tools > .mini { flex: 1 1 45%; padding: .45rem .5rem; white-space: nowrap; }
  /* ---- Přehled ---- */
  .dash-head { margin-bottom: .7rem; gap: .5rem; flex-wrap: nowrap; }
  .dash-head > div:first-child { flex: 1; min-width: 0; }
  .dash-hi { font-size: 1.3rem; }
  .dash-head .sub { font-size: .82rem; line-height: 1.4; }
  .dash-actions { margin-left: auto; align-self: flex-start !important; }
  .dash-actions .mini { padding: .3rem .6rem; font-size: .78rem; }
  /* hlavička po řádcích (Marco 27. 9. 2026): 1. den, datum a svátek · 2. světový den s ikonou (hlášení jsou od 18. 10. 2026 jen v kartě Vyžaduje pozornost) */
  .dash-sub .dash-date { color: var(--ink); font-weight: 500; }
  .dash-sep-intl { display: none; }
  .dash-intl { display: flex; align-items: center; gap: .35rem; margin-top: .15rem; }
  .dash-intl-i { display: block; width: 13px; height: 13px; color: var(--faint); flex: none; }
  .dash-intl-t::first-letter { text-transform: uppercase; }   /* na vlastním řádku „Dnes je …“, na PC uprostřed věty „· dnes je …“ (20. 10. 2026) */
  .dash-edit-t { display: none; }
  .dash-edit-i { display: flex; }
  #dhTiles { width: 34px; height: 34px; padding: 0 !important; display: flex; align-items: center; justify-content: center; border-radius: 10px; }
  /* editace úvodní stránky na telefonu (Marco 27. 9. 2026 pozdě večer): v kartě ŽÁDNÝ seznam pod sebou — jen čipy skrytých banerů a panelů
     vedle sebe ve dvou skupinách; pořadí, ½ / 1 a ✕ jsou u každého baneru v mřížce, ✕ i u panelu. Blok čipů nad mřížkou (desktop) se nekreslí. */
  .dash-edit-txt-d, .msg.dash-edit-txt-d, .dp-rs, .dp-grip { display: none !important; }   /* 2. 10. 2026: na telefonu se panely netahají (jeden sloupec) — nápověda k tahu panelů jen na PC */
  .dash-chipgrp .tile-l { font-size: .62rem; letter-spacing: .9px; }
  .dash-chipgrp .tile-chips { margin-top: .35rem; }
  .dp-hide { margin-left: auto; }
  /* banery: dva sloupce, kompaktní; počasí, graf a víceřádkové banery (obsazenost apartmánů, keylocker, hlášení) přes celou šířku */
  .dash-tiles { margin-bottom: .8rem; }
  .tile { padding: .6rem .7rem .6rem; border-radius: 12px; }
  .tile-l { font-size: .58rem; letter-spacing: .9px; gap: .2rem .4rem; }
  .tile-v, .tile.tall .tile-v, .tile.xl .tile-v { font-size: 1.35rem; margin: .2rem 0 .2rem; }
  .tile-v small, .tile.tall .tile-v small { font-size: .8rem; }
  .tile-s { font-size: .7rem; padding-top: .2rem; line-height: 1.3; }
  /* velikost baneru (Marco 27. 9. 2026): ½ = číslo + podtitulek (bez doplňkových řádků), 1/1 = celá šířka + řádky s detailem */
  .tile.tile-f .tile-x { display: block; flex: none; margin-top: .35rem; padding-top: .35rem; border-top: 1px solid var(--hair); }
  .tile.tile-f { grid-column: 1 / -1; }
  .tile.tile-f[data-tilek="occ_chart"] .tile-x { display: none; }   /* u grafu roku je detailem sama křivka — tři nejsilnější měsíce už ne */
  /* 27. 10. 2026: ½ už na telefonu neskrývá předpověď ani křivku — co baner ukáže, určuje jeho velikost v políčkách (Malý = jen číslo) */   /* JEN telefon: poloviční baner = jen teplota / procento (27. 9. 2026 večer); na PC se předpověď ukazuje vždy (Marco 2. 10. 2026) */
  .tile-per button { padding: 0 .35rem; font-size: .58rem; }
  .tile-weather .tile-v, .tile.tall.tile-weather .tile-v { font-size: 1.35rem; }
  .tile-wnow { gap: .5rem; margin: .2rem 0 .1rem; }
  .tile-wnow > .w-ic { width: 34px; height: 34px; }
  .tile-wnow .who { font-size: .74rem; }
  .tile-wdays { margin-top: .35rem; padding-top: .35rem; gap: .3rem; }
  .tile-wday { gap: .05rem; }
  .tile-wday > .w-ic { width: 22px; height: 22px; }
  .tile-wday .who { font-size: .66rem; }
  .tile-wt { font-size: .84rem; }
  .tile-spark { margin: .1rem 0 0; max-height: 58px; }
  .osp { height: 120px; }
  .tile-rows { margin-top: .3rem; gap: .22rem; }
  .tile-row { font-size: .76rem; }
  /* panely: jeden sloupec, výška podle obsahu (bez vnitřního rolování a bez zeslabení „další"), žádné vnořené flexy —
     Safari na iPhonu jinak spočítal stránku kratší a poslední panel se nedal dorolovat (Marco 26. 9. 2026, obr. 3) */
  .dash-panels { display: block; margin-bottom: .8rem; }
  .dpc { display: block; margin-bottom: .8rem; }
  .dpc > .card { display: block; height: auto; overflow: visible; margin: 0; }
  .dp-body { flex: none; min-height: auto; max-height: none; overflow: visible; }
  .dp-more { display: none; }
  .dpc > .card h1 { font-size: 1rem; }
  .dp-row2 { padding: .4rem 0; gap: .2rem; }
  .dp-row .dp-t strong { font-size: .88rem; }
  .dp-row .dp-t .who { font-size: .78rem; white-space: normal; }   /* apartmán · termín · noci · osoby — smí se zalomit, nic se neztrácí */
  .dp-tags { gap: .25rem .5rem; }
  .dp-tags .tag { font-size: .66rem; padding: .08rem .4rem; }
  .dp-tg i { font-size: .56rem; }
  /* adresář měsíců (UbyPort, knihy): na telefonu sbalený — rozbalí se klepnutím na nadpis; období se stejně volí nahoře */
  .pol-grid { gap: .6rem; }
  .dir-panel { padding: .35rem .3rem; }
  .dir-panel > .dir-cap { cursor: pointer; padding: .3rem .7rem; display: flex; align-items: center; gap: .5rem; }
  .dir-panel > .dir-cap::after { content: '▾'; margin-left: auto; font-size: .8rem; color: var(--acc); transition: transform .18s; }
  .dir-panel.open > .dir-cap::after { transform: rotate(180deg); }
  .dir-panel:not(.open) > :not(.dir-cap) { display: none; }
  .dir-panel.open > .dir-cap { padding-bottom: .5rem; }
  .pol-tools { gap: .4rem; margin-bottom: .6rem; }
  .fbar { padding: .45rem .55rem; gap: .4rem; }
  .fbar input[type="search"], .fbar input[type="text"] { width: 100%; }
  .book-h h2 { font-size: 1rem; }
  /* ---- Úklidy (27. 9. 2026: kombinace návrhů z plátna — pás týdne, filtr stavů, tabulka nákladů, karty po dnech, detail v mřížce) ---- */
  /* 21. 10. 2026 (návrh 2 / 2. kolo): horní karta s obdobím, tabule Náklady a Vzkazy týmu na rozkrytí nad pásem týdne */
  .clm-top { padding: .9rem .9rem .85rem; margin-bottom: .6rem; }
  .clm-top h1.pg { margin: 0 0 .6rem; }
  .clm-top .an-stepper { display: flex; width: 100%; justify-content: space-between; margin-bottom: .55rem; box-sizing: border-box; }
  .clm-top .an-stepper strong { font-size: .95rem; }
  .clm-top .cl-pmode { display: flex; width: 100%; grid-template-columns: none; border-radius: 999px; padding: 3px; }
  .clm-top .cl-pmode button { flex: 1 1 0; width: auto; min-width: 0; border-radius: 999px; padding: .4rem .3rem; }
  .clm-top .cl-pmode .seg-glide { border-radius: 999px; }
  .cl-gp.clm { margin-bottom: .6rem; padding: .75rem .85rem; border-radius: 14px; }
  .cl-gp.clm .cl-big { font-size: 1.45rem; }
  .cl-gp.clm .cl-ch { flex-wrap: wrap; gap: .5rem; }
  .cl-gp.clm .cl-prog { margin-left: 0; width: 100%; flex-direction: row; align-items: center; justify-content: space-between; }
  .cl-gp.clm .cl-prog .bar { flex: 1; width: auto; margin-right: .6rem; }
  .cl-gp.clm .cl-cfoot { justify-content: center; }
  .cl-gp.clm .cl-cr .n { width: 4.2rem; }
  .cl-gp.clm .cl-mtab { display: flex; width: 100%; grid-template-columns: none; border-radius: 999px; padding: 3px; margin-top: .4rem; }
  .cl-gp.clm .cl-mtab button { flex: 1 1 0; width: auto; border-radius: 999px; }
  .cl-gp.clm .cl-mtab .seg-glide { border-radius: 999px; }
  .cl-gp.clm .cl-ma .sp { display: none; }
  .cl-gp.clm .cl-ma .mini, .cl-gp.clm .cl-ma > .tag { flex: 1 1 0; min-width: 0; justify-content: center; padding: .45rem .3rem; font-size: .8rem; }   /* tři tlačítka v jednom řádku */
  .cl-gp.clm .cl-mh .cl-tg { margin-left: auto; }
  .clm-head { display: flex; align-items: center; gap: .5rem; margin-bottom: .6rem; }
  .clm-head h1.pg { margin: 0; flex: 1; min-width: 0; }
  .clm-per { display: inline-flex; align-items: center; gap: .35rem; padding: .42rem .65rem .42rem .6rem; font-weight: 600; white-space: nowrap; }
  .clm-per svg { width: 14px; height: 14px; color: var(--acc); }
  .clm-per svg:last-child { width: 12px; height: 12px; color: var(--faint); }
  .clm-week { display: flex; gap: 4px; margin-bottom: .6rem; }
  .clm-day { flex: 1; width: auto; min-width: 0; margin: 0; display: flex; flex-direction: column; align-items: center; gap: 3px; padding: .4rem 0 .3rem; border: 0; border-radius: 11px;
    background: var(--well); box-shadow: inset 0 1px 0 rgba(255,255,255,0.08); color: var(--ink); }
  .clm-day:hover { filter: none; background: var(--neu-bg); }
  .clm-day.on, .clm-day.on:hover { background: var(--prim-bg); box-shadow: var(--prim-shadow); color: var(--prim-ink); }
  .clm-wd { font-size: .6rem; text-transform: uppercase; letter-spacing: .8px; font-weight: 600; color: var(--faint); }
  .clm-day.on .clm-wd { color: var(--prim-ink); opacity: .85; }
  .clm-dn { font-size: .95rem; font-weight: 700; line-height: 1; }
  .clm-dots { display: flex; gap: 2px; height: 5px; }
  .clm-dots i { width: 5px; height: 5px; border-radius: 50%; }
  .clm-dots i.ok { background: var(--ok-dot); } .clm-dots i.err { background: var(--err-dot); } .clm-dots i.neu { background: var(--faint); } .clm-dots i.none { background: transparent; }
  .clm-day.on .clm-dots i.err { background: #fff; }
  .clm-filter { margin-bottom: .6rem; }
  .clm-filter button span { color: var(--faint); font-weight: 600; margin-left: .2rem; }
  .clm-filter button.on span { color: var(--prim-ink); }
  .clm-cost { padding: .6rem .8rem .55rem; margin-bottom: .6rem; }
  .clm-cost > .tile-l { margin-bottom: .3rem; }
  .clm-cr { display: flex; align-items: center; gap: .5rem; font-size: .8rem; min-height: 26px; }
  .clm-cr .n { flex: 0 1 auto; max-width: 42%; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }   /* dlouhý název ubere pruhu, ne sobě */
  .clm-cr .bar { flex: 1 1 2rem; min-width: 1.5rem; height: 6px; border-radius: 3px; background: var(--track); overflow: hidden; }
  .clm-cr .bar i { display: block; height: 100%; background: var(--ok-dot); border-radius: 3px; }
  .clm-cr .s { flex: none; font-size: .72rem; color: var(--mut); white-space: nowrap; }
  .clm-cr b { width: 3.6rem; flex: none; text-align: right; font-variant-numeric: tabular-nums; }
  .clm-cr.tot { border-top: 1px solid var(--line); margin-top: .15rem; padding-top: .2rem; font-size: .84rem; }
  .clm-cr.tot .s { flex: 1; text-align: right; }
  .clm-cr.tot b { color: var(--acc); }
  .clm-g { display: flex; align-items: center; gap: .4rem; margin: .55rem 0 .35rem; scroll-margin-top: 64px; font-size: .8rem; font-weight: 700; }
  .clm-g.today { color: var(--acc); }
  .clm-g .n { font-size: .72rem; color: var(--faint); font-weight: 600; }
  .clm-g::after { content: ''; flex: 1; height: 1px; background: var(--hair); }
  .clm { background: var(--card-bg); backdrop-filter: blur(24px) saturate(1.55); -webkit-backdrop-filter: blur(24px) saturate(1.55); border: 1px solid var(--card-line); border-radius: 12px; box-shadow: var(--card-shadow); padding: .55rem .6rem .5rem; margin-bottom: .4rem; }
  .clm.open { border-color: var(--acc); }
  .clm.dim { opacity: .62; }
  .clm-h { display: flex; align-items: center; gap: .5rem; cursor: pointer; border-radius: 10px; }
  .clm-h:focus-visible { outline: 2px solid var(--acc); outline-offset: 2px; }
  .clm-sq { width: 28px; height: 28px; border-radius: 8px; display: flex; align-items: center; justify-content: center; flex: none; box-shadow: inset 0 1px 0 rgba(255,255,255,0.15); }
  .clm-sq svg { width: 14px; height: 14px; }
  .clm-sq.ok { background: var(--ok-bg); color: var(--ok); } .clm-sq.err { background: var(--err-bg); color: var(--err); } .clm-sq.neu { background: var(--neu-bg); color: var(--faint); }
  .clm-t { flex: 1; min-width: 0; }
  .clm-l1 { display: flex; align-items: center; gap: .35rem; min-width: 0; flex-wrap: wrap; }
  .clm-l1 .tag { font-size: .66rem; padding: .08rem .4rem; }
  .clm-apt { padding: .1rem .45rem; border-radius: 7px; background: var(--neu-bg); font-size: .74rem; font-weight: 600; letter-spacing: .04em; white-space: nowrap; }
  .clm-sub { font-size: .7rem; color: var(--mut); margin-top: .1rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .clm-r { text-align: right; flex: none; }
  .clm-time { font-size: .82rem; font-weight: 600; white-space: nowrap; }
  .clm-ok { width: 30px; height: 30px; padding: 0; margin: 0; border-radius: 50%; border: 1px solid var(--btn-line); background: var(--btn-bg); box-shadow: var(--btn-shadow); color: var(--ink); display: flex; align-items: center; justify-content: center; flex: none; }
  .clm-ok svg { width: 14px; height: 14px; }
  .clm-chev { width: 30px; display: flex; justify-content: center; color: var(--faint); flex: none; }
  .clm-chev svg { width: 15px; height: 15px; transition: transform .18s; }
  .clm.open .clm-chev svg { transform: rotate(180deg); }
  .clm-tags { margin-top: .35rem; }
  .clm-tags .tag { font-size: .68rem; padding: .1rem .45rem; }
  .clm-body { margin-top: .55rem; padding-top: .55rem; border-top: 1px solid var(--hair); }
  .clm-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .45rem .5rem; }
  .clm-grid3 { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: .45rem; }
  .clm-body label { margin: .2rem 0 .25rem; font-size: .74rem; font-weight: 600; color: var(--ink); }
  .clm-body label .who { font-weight: 400; }
  .clm-body input, .clm-body select, .clm-body textarea { padding: .5rem .6rem; font-size: .88rem; }
  .clm-body textarea { line-height: 1.35; }
  .clm-lbl { font-size: .74rem; font-weight: 600; margin: .55rem 0 .3rem; }
  .clm-chips { display: flex; flex-wrap: wrap; gap: .3rem; }
  .clm-chip { display: inline-flex; align-items: center; gap: .25rem; margin: 0; padding: .28rem .6rem .28rem .45rem; border: 1px solid var(--btn-line); border-radius: 999px; background: var(--btn-bg); color: var(--mut); font-size: .74rem; font-weight: 600; cursor: pointer; }
  .clm-chip input { display: none; }
  .clm-chip::before { content: '+'; font-weight: 700; color: var(--faint); }
  .clm-chip:has(input:checked) { background: var(--acc-soft); border-color: transparent; color: var(--acc); }
  .clm-chip:has(input:checked)::before { content: '✓'; color: var(--acc); }
  .clm-reps { font-size: .84rem; }
  .clm-reps .mini { padding: .25rem .5rem; font-size: .74rem; }
  .clm-acts { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .6rem; }
  .clm-acts .mini { padding: .42rem .65rem; font-size: .8rem; }
  .clm-spacer { height: 66px; }
  .clm-bar { position: fixed; left: 12px; right: 12px; bottom: calc(10px + env(safe-area-inset-bottom, 0px)); z-index: 30; display: flex; gap: .35rem; padding: .4rem; border-radius: 16px;
    background: var(--card-bg); backdrop-filter: blur(24px) saturate(1.55); -webkit-backdrop-filter: blur(24px) saturate(1.55); border: 1px solid var(--card-line); box-shadow: var(--card-shadow); }
  .clm-bar .mini { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: .3rem; padding: .55rem .4rem; white-space: nowrap; }
  .clm-bar .mini:first-child { flex: 1.5; }
  .clm-bar svg { width: 14px; height: 14px; }
  /* spodní listy: Období, Nastavení, Přidat úklid — přes celou šířku, pozadí ztmavené, klepnutí mimo zavře */
  .cl-pop { position: fixed; left: 0; right: 0; bottom: 0; z-index: 41; margin: 0; max-height: 88vh; overflow: auto; border-radius: 20px 20px 0 0; background: var(--panel); border: 1px solid var(--card-line); border-bottom: 0;
    box-shadow: 0 -18px 44px rgba(0,0,0,.5); padding: 1.35rem .9rem calc(1rem + env(safe-area-inset-bottom, 0px)); }
  .cl-pop::before { content: ''; display: block; width: 36px; height: 4px; border-radius: 2px; background: var(--line); margin: -.65rem auto .6rem; }
  .cl-pop > .res-x { top: .85rem; right: .8rem; }
  .cl-backdrop { display: none; position: fixed; inset: 0; z-index: 40; background: rgba(0,0,0,.45); }
  .cl-backdrop.on { display: block; }
  .clm-sh { margin: 0 0 .5rem; font-size: 1.05rem; padding-right: 2.4rem; }
  .clm-settabs { margin-bottom: .7rem; }
  /* Nastavení úklidů (Marco 27. 9. 2026 večer): list má pořád stejnou výšku a lišta záložek stojí na místě — mění se jen obsah pod ní, který roluje sám */
  #cl_setwrap.cl-pop { height: 88vh; height: 88dvh; display: flex; flex-direction: column; overflow: hidden; }
  #cl_setwrap.cl-pop::before, #cl_setwrap > .clm-sh, #cl_setwrap > .clm-settabs { flex: none; }
  #cl_setwrap > .cl-setbody { flex: 1 1 auto; min-height: 0; overflow: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; padding-bottom: .4rem; }
  .clm-stepper { display: flex; align-items: center; gap: .5rem; margin: .2rem 0 .5rem; }
  .clm-stepper strong { flex: 1; text-align: center; font-size: 1rem; }
  .clm-stepper .mini { padding: .45rem .9rem; }
  .cl-bar { gap: .35rem; }
  .cl-bar > strong { flex: 1 0 55%; font-size: 1rem; min-width: 0 !important; }
  .cl-bar > #cl_prev, .cl-bar > #cl_next { flex: 0 0 auto; }
  .cl-bar > .sp { display: none; }
  .cl-bar > .mini { flex: 1 1 42%; padding: .4rem .4rem; white-space: nowrap; }
  .cl-bar > #cl_prev, .cl-bar > #cl_next { flex: 0 0 auto; padding: .4rem .8rem; }
  /* souhrn nákladů za období: dlaždice ve dvou sloupcích (celkem přes oba) */
  .cl-sum { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .4rem; }
  .cl-sum-i { min-width: 0; padding: .4rem .6rem; }
  .cl-sum-i .l { font-size: .56rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .cl-sum-i .v { font-size: .95rem; }
  .cl-sum-i .s { font-size: .68rem; line-height: 1.3; }
  .cl-sum-i.tot { grid-column: 1 / -1; }
  /* tabulka úklidů: karta = apartmán + stav vpravo · datum · čas · osoby · typ · hlášení · tlačítka */
  table.cl-t, table.cl-t tbody { display: block; width: 100%; }
  table.cl-t tr:first-child { display: none; }
  table.cl-t tr { position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: .15rem .4rem; border: 1px solid var(--hair); border-radius: 12px; margin: .5rem 0; padding: .5rem .8rem .55rem; }
  table.cl-t td { display: block; border: 0; padding: 0; white-space: normal; font-size: .86rem; }
  table.cl-t td:nth-child(2) { order: 1; flex: 1 1 100%; font-size: .95rem; padding-right: 6.5rem; }   /* apartmán na celý řádek, stav absolutně vpravo → datum vždy na 2. řádku */
  table.cl-t td:nth-child(3) { position: absolute; right: .8rem; top: .55rem; }
  table.cl-t td:nth-child(1) { order: 3; }
  table.cl-t td:nth-child(1)::after, table.cl-t td:nth-child(4)::after { content: ' · '; color: var(--faint); }
  table.cl-t td:nth-child(4) { order: 4; }
  table.cl-t td:nth-child(5) { order: 5; }
  table.cl-t td:nth-child(6) { order: 6; flex: 1 1 100%; }
  table.cl-t td:nth-child(6) > .who:only-child { display: none; }   /* žádné hlášení = bez prázdné pomlčky */
  table.cl-t td:nth-child(6):has(> .who:only-child) { display: none; }
  table.cl-t td.row-actions { order: 7; flex: 1 1 100%; text-align: left; padding-top: .3rem; }
  table.cl-t td.row-actions .mini { margin: 0 .35rem .2rem 0; padding: .3rem .55rem; font-size: .78rem; }
  table.cl-t tr.cln-edit { display: block; padding: 0; border-color: var(--acc); overflow: hidden; }
  table.cl-t tr.cln-edit > td { padding: .8rem .8rem !important; }
  table.cl-t .tag { font-size: .7rem; padding: .12rem .45rem; }
  .cl-ed-row input, .cl-ed-row select { width: auto !important; max-width: 100%; }
  /* Poplatky MČ: měsíc jako nadpis karty, hodnoty tečou za sebou; prázdné měsíce (jen pomlčky) zkrácené na jeden řádek */
  table.fee-t td:first-child { display: block; font-size: .95rem; margin-bottom: .1rem; }
  table.fee-t td.fee-h .mini { margin-top: .15rem; }
  /* nastavení: řádky s tlačítkem vpravo se lámou pod sebe */
  .card-hrow .mini { margin-left: 0; }
}

/* ============================================================
   Karta rezervace na Přehledu — návrh 3B „Skleněná pole" (26. 9. 2026)
   Rozbaluje se na místě; kroky odbavení a hosté jako skleněná pole (well + vnitřní linka světla), ikona v barevném čtverci.
   ============================================================ */
.dq-list { display: flex; flex-direction: column; gap: .5rem; }
.dq { background: var(--card-bg); border: 1px solid var(--card-line); border-radius: 14px; box-shadow: var(--card-shadow); padding: .7rem .75rem .55rem; }
.dq.open { border-color: var(--acc); }
.dq-h { cursor: pointer; border-radius: 10px; }
.dq-h:focus-visible { outline: 2px solid var(--acc); outline-offset: 2px; }
.dq-top { display: flex; align-items: center; gap: .4rem; min-width: 0; }
.dq-name { flex: 1; min-width: 0; font-size: 1rem; font-weight: 700; letter-spacing: -0.015em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dq-name.miss { color: var(--err); }
.dq-top .tag { flex: none; }
.dq-plat { flex: none; padding: .12rem .55rem; border-radius: 999px; border: 1px solid var(--btn-line); background: var(--btn-bg); color: var(--mut); font-size: .72rem; font-weight: 500; white-space: nowrap; }
.dq-meta { display: flex; align-items: center; flex-wrap: wrap; gap: .2rem .45rem; margin-top: .35rem; font-size: .8rem; color: var(--mut); white-space: nowrap; }
.dq-apt { padding: .1rem .5rem; border-radius: 7px; background: var(--neu-bg); color: var(--ink); font-size: .72rem; font-weight: 600; letter-spacing: .04em; flex: none; }
.dq-term { color: var(--ink); flex: none; }
.dq-meta .who { min-width: 0; }
.dq-segs { display: flex; gap: 4px; margin-top: .55rem; }
.dq-seg { flex: 1; height: 22px; border-radius: 7px; display: flex; align-items: center; justify-content: center; background: var(--well); border: 1px solid var(--line); color: var(--faint); }
.dq-seg .dq-svg { width: 12px; height: 12px; }
.dq-seg.ok { background: var(--ok-bg); border-color: transparent; color: var(--ok); box-shadow: 0 0 10px var(--ok-bg); }
.dq-seg.warn { background: var(--warn-bg); border-color: transparent; color: var(--warn); }
.dq-seg.err { background: var(--err-bg); border-color: transparent; color: var(--err); }
.dq-sum { display: flex; align-items: center; margin-top: .3rem; font-size: .76rem; font-weight: 600; }
.dq-cnt.ok { color: var(--ok); } .dq-cnt.warn { color: var(--warn); }
.dq-chev { width: 15px; height: 15px; margin-left: auto; color: var(--faint); transition: transform .18s; }
.dq.open .dq-chev { transform: rotate(180deg); }
.dq-body { margin-top: .6rem; }
.dq-tabs button { padding: .42rem .3rem; font-size: .82rem; }
.dq-tabs button span { color: var(--faint); font-weight: 600; margin-left: .25rem; }
.dq-tabs button.on span { color: var(--acc); }
.dq-body .msg { margin-top: .5rem; }
.dq-flds { display: flex; flex-direction: column; gap: 5px; margin-top: .45rem; }
.dq-fld { display: flex; align-items: center; gap: .55rem; padding: .38rem .5rem .38rem .45rem; border-radius: 11px; background: var(--well); border: 1px solid var(--line); box-shadow: inset 0 1px 0 rgba(255,255,255,0.10); min-width: 0; }
.dq-ic { width: 26px; height: 26px; border-radius: 8px; display: flex; align-items: center; justify-content: center; flex: none; box-shadow: inset 0 1px 0 rgba(255,255,255,0.15); background: var(--neu-bg); color: var(--faint); }
.dq-ic .dq-svg { width: 13px; height: 13px; }
.dq-ic.ok { background: var(--ok-bg); color: var(--ok); } .dq-ic.warn { background: var(--warn-bg); color: var(--warn); } .dq-ic.err { background: var(--err-bg); color: var(--err); }
.dq-ft { flex: 1; min-width: 0; line-height: 1.25; }
.dq-fn { font-size: .8rem; font-weight: 600; }
.dq-fs { font-size: .7rem; color: var(--mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dq-fs.err { color: var(--err); } .dq-fs.warn { color: var(--warn); }
.dq-fld .mini { flex: none; padding: .3rem .6rem; font-size: .76rem; }
.dq-num { width: 24px; height: 24px; border-radius: 50%; background: var(--neu-bg); display: flex; align-items: center; justify-content: center; font-size: .7rem; font-weight: 700; flex: none; }
.dq-gname { flex: 1; min-width: 0; font-size: .84rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dq-fld .tag { flex: none; font-size: .68rem; padding: .1rem .45rem; }
.dq-gi { flex: none; display: flex; color: var(--faint); }
.dq-gi .dq-svg { width: 14px; height: 14px; }
.dq-gi.ok { color: var(--ok); } .dq-gi.warn { color: var(--warn); } .dq-gi.err { color: var(--err); }
.dq-legend { font-size: .68rem; margin-top: .35rem; }
/* hosté v kartě (26. 9. 2026 večer, obr. 2–3): řádek = číslo, jméno + (narození · stát · doklad), kategorie, pero = podpis, štít = UbyPort, šipka;
   klepnutí rozbalí PLNÝ detail hosta — stejná mřížka .gdet-grid jako v detailu rezervace, v úzké kartě 2 sloupce, široká pole (.w) přes oba */
.dq-g { flex-wrap: wrap; cursor: pointer; }
.dq-g:focus-visible { outline: 2px solid var(--acc); outline-offset: 1px; }
.dq-g.open { border-color: var(--acc); }
.dq-gt { flex: 1; min-width: 0; line-height: 1.25; }
.dq-gt .dq-gname { display: block; }
.dq-gsub { display: block; font-size: .7rem; color: var(--mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dq-gchev { width: 14px; height: 14px; flex: none; color: var(--faint); transition: transform .18s; }
.dq-g.open .dq-gchev { transform: rotate(180deg); }
.dq-gdet { flex: 1 1 100%; min-width: 0; margin-top: .4rem; padding-top: .5rem; border-top: 1px solid var(--line); cursor: auto; }
.dq-gdet .gdet-grid { grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr)); grid-auto-flow: dense; gap: .45rem .7rem; font-size: .82rem; }   /* dense: úzká pole se sesadí vedle sebe, po širokém poli nezůstává díra */
.dq-gdet .gdet-grid > .w { grid-column: 1 / -1; }
.dq-gdet img { max-width: 100%; }
.dq-ghint { font-size: .7rem; margin-top: .35rem; }
.dq.dq-off { opacity: .6; }   /* zrušená rezervace (sekce Rezervace, filtr Vše) */
/* plný detail rezervace pod kartou — mobil / karty místo tabulky (resForm najde kartu .dq místo řádku tabulky) */
.res-detail-card { background: var(--well); border: 1px solid var(--acc); border-radius: 14px; padding: .9rem .8rem; margin: -.1rem 0 .55rem; }
.res-detail-card.glass-panel { background: var(--glass-bg); border-color: var(--glass-edge); border-radius: 16px; }   /* mléčné sklo (20. 10. 2026): hrana skla místo modrého rámečku */
.dq-acts { display: flex; gap: .4rem; margin-top: .5rem; }
.dq-kv { min-height: 38px; padding: .3rem .6rem; }
.dq-k { width: 4.6rem; flex: none; font-size: .6rem; letter-spacing: 1.1px; text-transform: uppercase; color: var(--faint); font-weight: 600; }
.dq-v { flex: 1; min-width: 0; font-size: .82rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dq-foot { display: flex; justify-content: flex-end; margin-top: .55rem; }
.dq-foot a { font-size: .8rem; font-weight: 600; text-decoration: none; }
@media (max-width: 920px) { .dq-list { gap: .45rem; } .dq { padding: .65rem .7rem .5rem; } }

/* ============================================================
   Domovní kniha na telefonu — návrh „Rejstřík" (27. 9. 2026, plátno AXi45RWWX2KUEfZj2x1XcX). Prvky .dkm-* vznikají jen
   v mobilní větvi renderDomM() (≤ 920 px), desktop se nemění. Ikonová tlačítka 34 px, mřížka měsíců 6 sloupců (rohy 14 / 9 px),
   řádek rejstříku ~62 px (číslo · jméno + občanství · dva tiché řádky · termín + podpis), spodní list filtru = .cl-pop z Úklidů.
   ============================================================ */
.dkm .clm-head { margin-bottom: .1rem; }
.dkm-ib { width: 34px; height: 34px; padding: 0; margin: 0; border-radius: 10px; border: 1px solid var(--btn-line); background: var(--btn-bg); box-shadow: var(--btn-shadow); color: var(--ink); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.dkm-ib svg { width: 15px; height: 15px; }
.dkm-ib.prim { border: 0; background: var(--prim-bg); box-shadow: var(--prim-shadow); color: var(--prim-ink); }
.dkm-ib.prim svg { width: 16px; height: 16px; }
.dkm-ib:disabled { opacity: .45; }
.dkm-ib[aria-pressed="true"] { background: var(--acc-soft); color: var(--acc); border-color: transparent; }
.dkm-ibw { position: relative; display: inline-flex; flex: none; }
.dkm-badge { position: absolute; top: -5px; right: -5px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px; background: var(--warn-dot); color: #fff; font-size: .62rem; font-weight: 700; display: flex; align-items: center; justify-content: center; box-sizing: border-box; pointer-events: none; }
.dkm-dot { position: absolute; top: -3px; right: -3px; width: 9px; height: 9px; border-radius: 50%; background: var(--acc); border: 2px solid var(--panel); box-sizing: content-box; pointer-events: none; }
.dkm-sub { font-size: .74rem; color: var(--mut); margin: 0 0 .6rem; }
.dkm-info { margin: -.2rem 0 .6rem; padding: .55rem .7rem .15rem; border-radius: 11px; background: var(--well); border: 1px solid var(--hair); }
.dkm-info .sub { margin: 0 0 .4rem; font-size: .8rem; line-height: 1.4; }
.dkm-dircap { display: flex; align-items: center; gap: .25rem; margin: 0 0 .3rem; }
.dkm-dircap .dir-cap { padding: 0; margin: 0; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dkm-dircap b { font-size: .8rem; }
.dkm-yb { width: 26px; height: 26px; padding: 0; margin: 0; border: 0; background: none; box-shadow: none; color: var(--mut); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.dkm-yb:hover { filter: none; color: var(--ink); }
.dkm-yb svg { width: 14px; height: 14px; }
.dkm-lnk { width: auto; margin: 0 0 0 .3rem; padding: .2rem .1rem; background: none; border: 0; box-shadow: none; color: var(--acc); font-size: .76rem; font-weight: 600; white-space: nowrap; }
.dkm-lnk:hover { filter: none; text-decoration: underline; }
.dkm-mgrid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 3px; padding: 4px; border-radius: 14px; background: var(--neu-bg); margin: 0 0 .7rem; }
.dkm-mon { display: flex; flex-direction: column; align-items: center; gap: 2px; width: auto; min-width: 0; margin: 0; padding: .32rem 0 .28rem; border: 0; border-radius: 9px; background: transparent; box-shadow: none; color: var(--ink); font-size: .76rem; font-weight: 500; line-height: 1.2; }
.dkm-mon:hover { filter: none; background: var(--neu-bg); }
.dkm-mon.on, .dkm-mon.on:hover { background: var(--card-bg); box-shadow: var(--card-shadow); font-weight: 600; }
.dkm-mon.none, .dkm-mon:disabled { color: var(--faint); opacity: 1; cursor: default; }
.dkm-mon span { display: inline-flex; align-items: center; gap: 3px; font-size: .66rem; font-weight: 600; color: var(--mut); }
.dkm-mon.on span { color: var(--ink); }
.dkm-mon.none span { color: var(--faint); font-weight: 400; }
.dkm-mon span i { width: 5px; height: 5px; border-radius: 50%; }
.dkm-mon span i.ok { background: var(--ok-dot); } .dkm-mon span i.warn { background: var(--warn-dot); }
.dkm-book { display: flex; align-items: flex-start; gap: .5rem; margin: 0 0 .6rem; }
.dkm-bt { flex: 1; min-width: 0; }
.dkm-bt1 { font-size: .95rem; letter-spacing: -.01em; }
.dkm-bt1 .who { font-weight: 500; }
.dkm-bt2 { font-size: .74rem; color: var(--mut); line-height: 1.35; }
.dkm-btags { display: flex; flex-direction: column; gap: 3px; align-items: flex-end; flex: none; }
.dkm-btags .tag { font-size: .68rem; padding: .1rem .5rem; }
.dkm-srch { position: relative; display: flex; gap: .4rem; align-items: center; margin: 0 0 .5rem; }
.dkm-srch .dkm-si { position: absolute; left: .65rem; top: 50%; transform: translateY(-50%); width: 14px; height: 14px; color: var(--faint); pointer-events: none; }
.dkm-srch .dkm-si svg { width: 14px; height: 14px; display: block; }
.dkm-srch input[type="search"] { flex: 1; min-width: 0; width: auto; height: 34px; padding: 0 .6rem 0 2rem; font-size: .86rem; }
.dkm-chips { display: flex; flex-wrap: wrap; gap: .3rem; align-items: center; margin: -.1rem 0 .5rem; }
.dkm-chips:empty { display: none; }
.dkm-chips .who { font-size: .74rem; }
.dkm-chip { display: inline-flex; align-items: center; gap: .3rem; width: auto; margin: 0; padding: .28rem .6rem; border-radius: 999px; border: 1px solid var(--btn-line); background: var(--btn-bg); box-shadow: none; color: var(--mut); font-size: .76rem; font-weight: 600; white-space: nowrap; }
.dkm-chip:hover { filter: none; color: var(--ink); }
.dkm-chip.on, .dkm-chip.on:hover { background: var(--acc-soft); border-color: transparent; color: var(--acc); }
.dkm-chip svg { width: 11px; height: 11px; }
.dkm-natchips { display: flex; flex-wrap: wrap; gap: .3rem; }
.dkm-fl { font-size: .76rem; font-weight: 600; margin: .5rem 0 .3rem; }
.dkm-sig.sett-tabs { display: flex; border-radius: 999px; padding: 3px; margin: 0; }
.dkm-sig.sett-tabs button { flex: 1 1 0; width: auto; padding: .42rem .3rem; border-radius: 999px; font-size: .8rem; }
.dkm-sig.sett-tabs .seg-glide { border-radius: 999px; }
.dkm-facts { display: flex; gap: .4rem; align-items: center; margin-top: .8rem; }
.dkm-ledger { border: 1px solid var(--hair); border-radius: 14px; padding: 0 .6rem 0 .45rem; margin: 0 0 .6rem; }
.dkm-msec { font-size: .66rem; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; color: var(--faint); padding: .55rem 0 .15rem; }
.dkm-row { display: flex; gap: .45rem; align-items: flex-start; padding: .45rem 0; border-bottom: 1px solid var(--hair); cursor: pointer; }
.dkm-ledger > .dkm-row:last-child, .dkm-open > .dkm-row { border-bottom: 0; }
.dkm-row:focus-visible { outline: 2px solid var(--acc); outline-offset: -2px; border-radius: 8px; }
.dkm-n { width: 1.15rem; flex: none; text-align: right; font-size: .68rem; font-weight: 600; color: var(--faint); padding-top: .2rem; font-variant-numeric: tabular-nums; }
.dkm-t { flex: 1; min-width: 0; }
.dkm-l1 { display: flex; align-items: baseline; gap: .35rem; min-width: 0; }
.dkm-nm { font-size: .9rem; white-space: nowrap; }
.dkm-cit { font-size: .74rem; color: var(--mut); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dkm-l2 .clm-apt { font-size: .64rem; padding: .02rem .4rem; color: var(--ink); vertical-align: 1px; }   /* Evidenční kniha, Všechny apartmány: štítek bytu na začátku 2. řádku (za jménem přejížděl přes datum pobytu, 26. 10. 2026) */
.dkm-l2 { font-size: .74rem; color: var(--mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.35; }
.dkm-r { text-align: right; flex: none; }
.dkm-dt { font-size: .8rem; font-weight: 600; white-space: nowrap; }
.dkm-sig { margin-top: 3px; display: flex; justify-content: flex-end; }
.dkm-sig .sig-img { max-height: 20px; max-width: 64px; }
.dkm-sig .tag { font-size: .64rem; padding: .08rem .4rem; }
.dkm-row.anon .dkm-nm, .dkm-row.anon .dkm-l2 { color: var(--mut); font-style: italic; }
.dkm-open { margin: .2rem -.35rem; padding: 0 .35rem .6rem; border: 1px solid var(--acc); border-radius: 11px; background: var(--hl); }
.dkm-det { padding: .15rem 0 0; }
.dkm-det .gdet-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .45rem .7rem; font-size: .82rem; }
.dkm-det .gdet-grid > .w { grid-column: 1 / -1; }
.dkm-sigbig { margin-top: .5rem; }
.dkm-sigbig .fl { display: block; font-size: .62rem; text-transform: uppercase; letter-spacing: 1px; color: var(--faint); }
.dkm-sigbig .sig-img.big { display: block; margin-top: .25rem; padding: .3rem .5rem; }
.dkm-sigbig .tag { display: inline-block; margin-top: .25rem; }
.dkm-dacts { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .6rem; }
.dkm-dacts .mini { width: auto; margin: 0; padding: .4rem .6rem; font-size: .78rem; }
.dkm-foot { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; font-size: .8rem; }
.dkm-foot .who { margin-left: auto; font-size: .72rem; }
@media print { .dkm-srch, .dkm-chips, .dkm-mgrid, .dkm-dircap, .dkm-ib, .dkm-ibw, .dkm-sub, .dkm-info, .dkm-dacts, .cl-pop, .cl-backdrop { display: none !important; } .dkm-open { border-color: var(--hair); background: none; } }

/* Evidenční kniha na telefonu — doplňky k .dkm-* (27. 9. 2026): žlutý řádek = poplatek odpuštěn, poplatek vpravo, souhrn pod rejstříkem,
   řádky spodního listu „Další akce" jako skleněná pole, výběry kategorie / důvodu v rozbaleném řádku */
.ekm-row.ekm-waiv { background: var(--warn-bg); margin: 0 -.6rem 0 -.45rem; padding-left: .45rem; padding-right: .6rem; }
.dkm-open > .ekm-row.ekm-waiv { margin: 0 -.35rem; padding-left: .35rem; padding-right: .35rem; border-radius: 10px 10px 0 0; }
.ekm-fee { margin-top: 3px; font-size: .82rem; font-weight: 700; white-space: nowrap; }
.ekm-fee .tag { font-size: .64rem; padding: .08rem .4rem; font-weight: 600; }
.ekm-warn { color: var(--warn); font-weight: 600; }
.dkm-l2 .tag { font-size: .62rem; padding: .04rem .35rem; vertical-align: 1px; }
.ekm-sum { padding: .55rem .8rem; border: 1px solid var(--hair); border-radius: 12px; background: var(--well); font-size: .8rem; line-height: 1.55; }
.ekm-sum:empty { display: none; }
.ekm-sum .who { margin-left: .4rem; font-size: .72rem; }
.ekm-act { display: flex; align-items: center; gap: .55rem; width: 100%; margin: 0 0 .35rem; padding: .5rem .6rem; border: 1px solid var(--line); border-radius: 10px; background: var(--well); box-shadow: inset 0 1px 0 rgba(255,255,255,0.10); color: var(--ink); text-align: left; }
.ekm-act:hover { filter: none; background: var(--acc-soft); }
.ekm-act .dq-ic { width: 28px; height: 28px; }
.ekm-act .dq-ic svg { width: 14px; height: 14px; }
.ekm-act .dq-ic.acc { background: var(--acc-soft); color: var(--acc); }
.ekm-act .dq-ic.neu { background: var(--neu-bg); color: var(--faint); }
.ekm-act-t { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.ekm-act-t b { font-size: .84rem; }
.ekm-act-t .who { font-size: .7rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ekm-act > svg:last-child { width: 14px; height: 14px; color: var(--faint); flex: none; }
.ekm-act .tag { font-size: .62rem; padding: .06rem .4rem; flex: none; }
.dkm-det select { width: 100%; max-width: 100%; margin-top: .15rem; padding: .4rem .5rem; font-size: .84rem; }
.dkm-sig.ekm-cat.sett-tabs button { font-size: .76rem; padding: .42rem .15rem; }
@media print { .ekm-act, #evMore, #evPerSheet, .pmc-persh { display: none !important; } }
/* Evidenční kniha na telefonu — Vlastní období ve spodním listu (26. 10. 2026; dřív popover u odkazu v adresáři přetékal přes pravý okraj obrazovky) */
/* totéž pro Poplatky MČ (.pmc-persh, 26. 10. 2026) */
#evPerSheet .per-pop, .pmc-persh .per-pop { position: static; width: auto; padding: 0; border: 0; border-radius: 0; box-shadow: none; background: transparent; }
#evPerSheet .per-x, .pmc-persh .per-x { display: none; }
#evPerSheet .per-grid button, .pmc-persh .per-grid button { padding: .55rem .3rem; font-size: .86rem; }
#evPerSheet .per-chips button, .pmc-persh .per-chips button { padding: .45rem .7rem; font-size: .8rem; }
#evPerSheet .per-rng-row input, .pmc-persh .per-rng-row input { flex: 1 1 8rem; width: auto; min-width: 0; }
#evPerSheet .per-rng-row .mini, .pmc-persh .per-rng-row .mini { flex: 1 1 100%; }
.ekm-n { font-size: .68rem; font-weight: 500; color: var(--mut); white-space: nowrap; }

/* Poplatky MČ na telefonu — „Výpis plateb" (28. 9. 2026, návrh 2 z plátna P5Hgmz68riddE5nkGgGbCu; prvky .fem-* vznikají jen v renderFeesM,
   sdílí .dkm-* / .ekm-* / .cl-pop). Karta K úhradě s akcemi 2×2, modrý filtr Vše / Nezaplaceno / Zaplaceno, měsíce jako výpis s rozbalením na místě. */
.fem-year { width: auto; height: 34px; margin: 0; padding: 0 1.8rem 0 .8rem; border-radius: 999px; font-weight: 600; font-size: .84rem; flex: none; }
.fem-due { padding: .7rem .8rem .75rem; border: 1px solid var(--card-line); border-radius: 14px; background: var(--card-bg); box-shadow: var(--card-shadow); margin: 0 0 .6rem; }
.fem-due-h { display: flex; align-items: flex-start; gap: .5rem; }
.fem-due-t { flex: 1; min-width: 0; }
.fem-due .fl { display: block; font-size: .62rem; text-transform: uppercase; letter-spacing: 1px; color: var(--faint); font-weight: 600; }
.fem-due-amt { display: flex; align-items: baseline; gap: .4rem; flex-wrap: wrap; margin-top: .1rem; font-size: 1.5rem; font-weight: 600; letter-spacing: -.02em; line-height: 1.1; }
.fem-due-amt .who { font-size: .74rem; font-weight: 400; }
.fem-due-s { font-size: .72rem; line-height: 1.35; margin-top: .25rem; }
.fem-due .tag { flex: none; }
.fem-acts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .35rem; margin-top: .6rem; }
.fem-acts .ekm-act { margin: 0; padding: .4rem .4rem; gap: .35rem; }
.fem-acts .ekm-act .dq-ic { width: 24px; height: 24px; }
.fem-acts .ekm-act .dq-ic svg { width: 12px; height: 12px; }
.fem-acts .ekm-act-t b { font-size: .76rem; line-height: 1.15; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.fem-acts .ekm-act-t .who { font-size: .66rem; }
.ekm-act.prim { border: 0; background: var(--prim-bg); box-shadow: var(--prim-shadow); color: var(--prim-ink); }
.ekm-act.prim:hover { background: var(--prim-bg); filter: brightness(1.06); }
.ekm-act.prim .dq-ic { background: rgba(255,255,255,0.18); color: var(--prim-ink); box-shadow: none; }
.ekm-act.prim .who { color: var(--prim-ink); opacity: .85; }
.ekm-act:disabled { opacity: .6; }
.fem-seg.sett-tabs { margin: 0 0 .6rem; }
.fem-row { align-items: center; padding: .5rem 0; }
.fem-row .dkm-t { padding: 0; }
.fem-mon { font-size: .9rem; font-weight: 600; }
.fem-fee { font-size: .9rem; font-weight: 700; white-space: nowrap; }
.fem-tag { margin-top: 2px; display: flex; justify-content: flex-end; }
.fem-tag .tag, .fem-due-h .tag { font-size: .64rem; padding: .08rem .4rem; }
.fem-chev { width: 14px; flex: none; color: var(--faint); }
.fem-chev svg { width: 14px; height: 14px; display: block; }
.fem-empty { padding: .5rem 0 .45rem; font-size: .8rem; color: var(--mut); }
.fem-apts { display: flex; flex-direction: column; gap: .3rem; margin: .1rem 0 .3rem; }
.fem-apt, .fem-pay { display: flex; align-items: center; gap: .5rem; padding: .4rem .5rem; border: 1px solid var(--line); border-radius: 10px; background: var(--well); box-shadow: inset 0 1px 0 rgba(255,255,255,0.10); }
.fem-apt .dq-ic, .fem-pay .dq-ic { width: 26px; height: 26px; }
.fem-apt .dq-ic svg, .fem-pay .dq-ic svg { width: 13px; height: 13px; }
.fem-apt .dq-ic.acc { background: var(--acc-soft); color: var(--acc); }
.fem-apt-t, .fem-pay-t { flex: 1; min-width: 0; }
.fem-apt .fl, .fem-pay .fl { display: block; font-size: .6rem; text-transform: uppercase; letter-spacing: 1px; color: var(--faint); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fem-apt-v { font-size: .82rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fem-apt-v .who { font-weight: 500; }
.fem-apt .dkm-ib, .fem-pay .dkm-ib { width: 30px; height: 30px; border-radius: 9px; }
.fem-apt .dkm-ib svg, .fem-pay .dkm-ib svg { width: 14px; height: 14px; }
.fem-pay b { font-size: .84rem; display: block; }
.fem-pay .who { font-size: .7rem; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fem-pay .mini { width: auto; margin: 0; padding: .4rem .6rem; font-size: .78rem; flex: none; white-space: nowrap; }
.fem-pay-row { display: flex; gap: .35rem; align-items: center; margin-top: .25rem; }
.fem-pay-row input[type="date"] { width: auto; flex: 1; min-width: 0; height: 34px; padding: 0 .5rem; margin: 0; font-size: .84rem; }
.fem .dkm-dacts .mini { white-space: nowrap; }
.fem-qr { display: flex; flex-direction: column; align-items: center; text-align: center; gap: .25rem; padding: .2rem 0 0; }
.fem-qrimg { background: #fff; padding: 10px; border-radius: 10px; line-height: 0; min-width: 196px; min-height: 196px; box-sizing: border-box; }
.fem-qrimg img, .fem-qrimg canvas { display: block; }
.fem-qr-area { font-size: .95rem; font-weight: 600; margin-top: .3rem; }
.fem-qr-area .who { font-weight: 500; }
.fem-qr-sum { font-size: 1.35rem; font-weight: 700; letter-spacing: -.02em; }
.fem-qr .sub { margin: 0; line-height: 1.45; overflow-wrap: anywhere; }
.fem-qrseg.sett-tabs { margin: 0 0 .6rem; }
.fem-qrseg.sett-tabs button { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media print { .fem-acts, #feeQr, #feeMore, .fem-year, .fem-seg { display: none !important; } }

/* UbyPort na telefonu — „Fronta podle termínu" (28. 9. 2026, návrh 1 z plátna HxqHF2ZWtAoZVqNaM5Mpwv; prvky .ubm-* vznikají jen v renderUbyM,
   sdílí .dkm-* / .ekm-act / .fem-due / .cl-pop). Glass baner 3 položky, karta Už přijeli s jedním Odeslat, rejstřík podle termínu. */
.ubm-unset { margin: 0 0 .6rem; padding: .5rem .7rem; border-radius: 11px; background: var(--warn-bg); border: 1px solid var(--warn-line); font-size: .8rem; line-height: 1.4; }
.ubm-apt.res-seg { margin: 0 0 .6rem; }   /* filtr apartmánů na telefonu (2. 10. 2026) */
.ubm-seg.sett-tabs { margin: 0 0 .6rem; }
.ubm-seg button span { color: var(--faint); font-weight: 600; margin-left: .3rem; }
.ubm-seg button.on span { color: var(--acc); }
.ubm-seg button span.warn { color: var(--warn); } .ubm-seg button span.err { color: var(--err); }
.ubm-srch select { width: auto; max-width: 9.5rem; height: 34px; margin: 0; padding: 0 1.6rem 0 .5rem; font-size: .8rem; flex: none; }
.ubm .msg { margin: 0 0 .6rem; }
.ubm .fem-due-amt { font-size: 1.35rem; }
.ubm-send { display: flex; align-items: center; justify-content: center; gap: .5rem; width: 100%; margin: .6rem 0 0; padding: .65rem .8rem; border: 0; border-radius: 11px;
  background: var(--prim-bg); box-shadow: var(--prim-shadow); color: var(--prim-ink); font-weight: 600; font-size: .92rem; }
.ubm-send svg { width: 15px; height: 15px; flex: none; }
.ubm-send:disabled { opacity: .55; }
.ubm-note { font-size: .7rem; color: var(--mut); line-height: 1.35; margin-top: .4rem; }
.ubm-cap { display: flex; align-items: center; gap: .4rem; font-size: .66rem; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; color: var(--faint); padding: .55rem 0 .15rem; }
.ubm-cap.warn { color: var(--warn); } .ubm-cap.err { color: var(--err); }
.ubm-cap .who { margin-left: auto; text-transform: none; letter-spacing: 0; font-weight: 500; font-size: .7rem; }
.ubm-row { align-items: center; }
.ubm-row .dkm-nm { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ubm-row .dkm-nm .tag { font-size: .62rem; padding: .02rem .35rem; vertical-align: 1px; }
.ubm-chk { width: 20px; height: 20px; margin: 0; padding: 0; flex: none; accent-color: var(--acc); }
.ubm-r { display: flex; align-items: center; gap: .3rem; flex: none; }
.ubm-r .tag { font-size: .64rem; padding: .08rem .4rem; white-space: nowrap; }
.ubm-r .dkm-ib, a.ubm-rcp { width: 28px; height: 28px; border-radius: 8px; text-decoration: none; }
.ubm-r .dkm-ib svg { width: 13px; height: 13px; }
.ubm-sentd { font-size: .72rem; font-weight: 600; white-space: nowrap; }
.ubm-tags { margin-top: 2px; display: flex; gap: .25rem; flex-wrap: wrap; }
.ubm-tags .tag { font-size: .62rem; padding: .04rem .35rem; }
.ubm-later .dkm-nm .who { font-weight: 500; font-size: .8rem; }
.ubm-legend { display: flex; gap: .7rem; font-size: .7rem; color: var(--mut); margin: -.4rem 0 .6rem .2rem; }
.ubm-legend i { display: inline-block; width: 6px; height: 6px; border-radius: 50%; margin-right: 3px; vertical-align: 1px; }
.ubm-legend i.ok { background: var(--ok-dot); } .ubm-legend i.warn { background: var(--warn-dot); }
.ubm .dkm-mon span i { margin-right: 1px; }
.ubm .dkm-det .gdet-grid code { font-size: .8rem; overflow-wrap: anywhere; }
.ubm .dkm-det > div[style] .mini { width: auto; margin: 0; padding: .4rem .6rem; font-size: .78rem; }
.ubm-log { margin-top: .6rem; }
.ubm-log .sub { margin: 0 0 .4rem; font-size: .78rem; }
.ubm-log table.t td { font-size: .8rem; }
@media print { .ubm-seg, .ubm-apt, .ubm-send, .ubm-srch, #ubyMore { display: none !important; } }



/* ============================================================
   Vyhledávání napříč aplikací (Marco 28. 9. 2026; app/js/hledani.js)
   Desktop: lupa = čtvercové tlačítko ve stylu .mini.sec; po klepnutí se místo ní rozbalí řádek (pole + ✕), panel výsledků
   .srch-pop leží v <body> jako fixed (uvnitř .mhead s backdrop-filter by fixed nefungoval), polohu počítá srchPlace().
   Telefon (Marco 28. 9. večer: žádná bílá plocha přes obrazovku): lišta zůstává, lupa jen zmodrá a pod lištou vyjede skleněné
   okénko .srch-win (stejné sklo jako .card) s polem nahoře a výsledky pod hairline linkou; roluje uvnitř, stránka zůstává vidět.
   ============================================================ */
.srch { position: relative; display: flex; align-items: center; gap: .4rem; }
.srch-btn { width: 34px; height: 34px; padding: 0; margin: 0; flex: none; display: flex; align-items: center; justify-content: center;
  border-radius: 9px; background: var(--btn-bg); border: 1px solid var(--btn-line); box-shadow: var(--btn-shadow); color: var(--ink); font-weight: 500; }
.srch-btn:hover { filter: none; border-color: var(--faint); }
.srch-btn svg { width: 17px; height: 17px; }
.srch.open > .srch-btn { display: none; }
.srch-field { display: flex; align-items: center; gap: .45rem; height: 34px; width: 320px; max-width: calc(100vw - 2rem); padding: 0 .3rem 0 .65rem; box-sizing: border-box;
  border-radius: 10px; background: var(--btn-bg); border: 1px solid var(--btn-line); box-shadow: var(--btn-shadow); animation: srchIn .16s ease-out; }
.srch-field:focus-within { border-color: var(--acc); box-shadow: 0 0 0 3px var(--acc-soft); }
@keyframes srchIn { from { opacity: 0; transform: translateX(8px); } to { opacity: 1; transform: none; } }
.srch-field > svg { width: 16px; height: 16px; flex: none; color: var(--faint); }
.srch-field input { flex: 1; min-width: 0; width: auto; height: 100%; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none;
  font: inherit; font-size: .9rem; color: var(--ink); outline: none; -webkit-appearance: none; appearance: none; }
.srch-field input::-webkit-search-cancel-button, .srch-field input::-webkit-search-decoration { -webkit-appearance: none; display: none; }
/* nápověda pole bez atributu placeholder (Safari podle slova „e-mail“ nabízel uložená hesla) — text z data-ph, schová se po prvním znaku */
.srch-in { position: relative; flex: 1; min-width: 0; height: 100%; display: flex; align-items: center; }
.srch-in::before { content: attr(data-ph); position: absolute; left: 0; right: 0; top: 50%; transform: translateY(-50%); pointer-events: none;
  font-size: .9rem; color: var(--faint); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.srch-in.v::before { display: none; }
.srch-x { width: 26px; height: 26px; flex: none; padding: 0; margin: 0; border: 0; border-radius: 7px; background: transparent; box-shadow: none;
  color: var(--mut); font-size: .8rem; line-height: 1; display: flex; align-items: center; justify-content: center; }
.srch-x:hover { background: var(--neu-bg); color: var(--ink); filter: none; }
.srch-float { position: fixed; top: 16px; left: 50%; transform: translateX(-50%); z-index: 61; }
.srch-float .srch-field { width: min(560px, calc(100vw - 2rem)); height: 40px; background: var(--panel); }
.srch-float > .srch-btn { display: none; }
/* panel výsledků */
.srch-pop { position: fixed; z-index: 60; overflow: auto; -webkit-overflow-scrolling: touch; box-sizing: border-box; padding: .35rem;
  background: var(--panel); border: 1px solid var(--card-line); border-radius: 14px; box-shadow: var(--card-shadow); color: var(--ink); }
html[data-theme="dark"] .srch-pop { background: #23232e; }
html[data-theme="violet"] .srch-pop { background: #2a2040; }
html[data-theme="gold"] .srch-pop { background: #2a2110; }
.srch-g + .srch-g { margin-top: .25rem; padding-top: .25rem; border-top: 1px solid var(--hair); }
.srch-gh { display: flex; align-items: baseline; gap: .5rem; padding: .4rem .65rem .2rem; font-size: .66rem; text-transform: uppercase; letter-spacing: 1.1px; font-weight: 600; color: var(--faint); }
.srch-gh b { font-weight: 500; text-transform: none; letter-spacing: 0; font-size: .7rem; color: var(--mut); }
.srch-it { display: flex; align-items: center; gap: .6rem; width: 100%; margin: 0; padding: .42rem .6rem; border: 0; border-radius: 10px;
  background: transparent; box-shadow: none; text-align: left; color: var(--ink); font: inherit; cursor: pointer; }
.srch-it:hover, .srch-it.sel { background: var(--acc-soft); filter: none; }
.srch-it:focus-visible { outline: 2px solid var(--acc); outline-offset: -2px; }
.srch-ic { width: 30px; height: 30px; flex: none; border-radius: 9px; background: var(--neu-bg); color: var(--acc); display: flex; align-items: center; justify-content: center; }
.srch-ic svg { width: 15px; height: 15px; }
.srch-tx { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.srch-t { font-size: .9rem; font-weight: 500; line-height: 1.25; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.srch-s { font-size: .78rem; color: var(--mut); line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.srch-it mark { background: var(--acc-soft); color: var(--acc); border-radius: 3px; padding: 0 1px; font-weight: 600; }
.srch-tags { flex: none; display: flex; gap: .3rem; align-items: center; }
.srch-tag { font-size: .68rem; font-weight: 600; white-space: nowrap; padding: .12rem .45rem; border-radius: 999px; background: var(--neu-bg); color: var(--mut); }
.srch-tag.ok { background: var(--ok-bg); color: var(--ok); }
.srch-tag.warn { background: var(--warn-bg); color: var(--warn); }
.srch-hint { padding: .75rem .7rem; font-size: .84rem; color: var(--mut); line-height: 1.4; }
.srch-hint.srch-err { color: var(--err); }
.srch-hint.srch-load { color: var(--faint); }
/* skleněné okénko na telefonu (v <body>, fixed; top a maxHeight nastavuje srchPlace) */
.srch-win { position: fixed; left: 10px; right: 10px; z-index: 60; display: flex; flex-direction: column; overflow: hidden; box-sizing: border-box;
  border-radius: 18px; background: var(--card-bg); backdrop-filter: blur(24px) saturate(1.55); -webkit-backdrop-filter: blur(24px) saturate(1.55);
  border: 1px solid var(--card-line); box-shadow: var(--card-shadow); animation: srchWin .2s ease-out; }
@keyframes srchWin { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: none; } }
.srch-win .srch-field { flex: none; width: auto; max-width: none; height: 46px; padding: 0 .35rem 0 .9rem; border: 0; border-radius: 0; background: transparent; box-shadow: none; animation: none; }
.srch-win .srch-field:focus-within { border: 0; box-shadow: none; }
.srch-win .srch-field input, .srch-win .srch-in::before { font-size: 16px; }   /* iOS jinak stránku při psaní přiblíží */
.srch-win .srch-pop, html[data-theme] .srch-win .srch-pop { position: static; flex: 1 1 auto; min-height: 0; overflow: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain;
  border: 0; border-top: 1px solid var(--hair); border-radius: 0; box-shadow: none; background: transparent; padding: .25rem .4rem .45rem; }
.srch-win .srch-pop[hidden] { display: none; }
.srch-win .srch-gh { padding: .4rem .55rem .15rem; }
.srch-win .srch-it { padding: .38rem .5rem; gap: .55rem; }
.srch-win .srch-ic { width: 26px; height: 26px; border-radius: 8px; }
.srch-win .srch-ic svg { width: 14px; height: 14px; }
.srch-win .srch-t { font-size: .88rem; }
.srch-win .srch-s { font-size: .76rem; }
.srch-pop-m .srch-t, .srch-pop-m .srch-s { white-space: normal; }   /* na telefonu nic neořezávat (stejné pravidlo jako u karet) */
.srch-win .srch-hint { padding: .55rem .6rem; font-size: .8rem; }
@media (max-width: 920px) {
  .dash-actions .srch { display: none; }          /* na telefonu je lupa v hlavičce, ne v hlavičce Přehledu */
  .mhead .srch { margin-left: auto; }             /* lupa a ☰ vpravo vedle sebe (29. 9. 2026) */
  .mhead .srch-btn { width: 36px; height: 36px; border-radius: 10px; }
  .mhead .srch.open > .srch-btn { display: flex; background: var(--acc-soft); border-color: transparent; box-shadow: none; color: var(--acc); }   /* lišta zůstává, lupa jen zmodrá */
  .srch-float { top: 8px; }
}
@media print { .srch, .srch-pop { display: none !important; } }

/* ============================================================
   Mobil 29. 9. 2026 — Marco vybral návrhy 1 z plátna: plný detail rezervace pod kartou se sekcemi (.rdm),
   ikony v hlavičce Rezervací + stavy v jedné řadě, záložky Energií v jedné řadě s ikonami. Desktop beze změny.
   ============================================================ */
.res-head-i { display: none; }   /* ikonová tlačítka Rezervací jen na telefonu */
/* ikony záložek Energií a Financí i na desktopu (Marco 2. 10. 2026: „líbí se mi to na mobilu, chci to i na PC“): ikona vlevo od popisku,
   odznak počtu v ikoně jen na telefonu (na desktopu je počet vedle popisku) */
.sett-tabs.tabs-ic button { display: inline-flex; align-items: center; justify-content: center; gap: .45rem; }
.sett-tabs.tabs-ic .en-ti { display: inline-flex; align-items: center; position: relative; }
.sett-tabs.tabs-ic .en-ti svg { width: 16px; height: 16px; }
.sett-tabs.tabs-ic .en-tb { display: none; }
.ibtn { width: 34px; height: 34px; padding: 0; margin: 0; flex: none; display: flex; align-items: center; justify-content: center;
  border-radius: 9px; background: var(--btn-bg); border: 1px solid var(--btn-line); box-shadow: var(--btn-shadow); color: var(--ink); }
.ibtn:hover { filter: none; border-color: var(--faint); }
.ibtn svg { width: 17px; height: 17px; }
.ibtn.on { background: var(--prim-bg); border-color: transparent; box-shadow: var(--prim-shadow); color: var(--prim-ink); }
@media (max-width: 920px) {
  /* Rezervace: ⟳ + ✚ + kalendář jako ikony vpravo od nadpisu (kalendář = přepínač pohledu, aktivní modrý); řádek nástrojů se nekreslí */
  .res-head { display: flex; align-items: center; gap: .4rem; margin-bottom: .3rem; }
  .res-head h1.pg { flex: 1; min-width: 0; margin: 0; }
  .res-head-i { display: flex; gap: .4rem; flex: none; }
  .res-tools { display: none !important; }
  /* stavy v JEDNÉ řadě: popisek nahoře, počet pod ním */
  .res-seg.res-seg-2l { display: flex; gap: 3px; }
  .res-seg.res-seg-2l button { flex: 1 1 0; width: auto; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 1px;
    padding: .34rem .1rem .3rem; font-size: .74rem; letter-spacing: -.01em; line-height: 1.2; white-space: nowrap; }
  .res-seg.res-seg-2l button span { margin: 0; font-size: .88rem; line-height: 1.2; }
  /* Energie: pět položek v jedné řadě — ikona komodity s odznakem počtu, popisek pod ní; dlouhý popis sekce jen na desktopu */
  .sett-tabs.tabs-ic { display: flex; gap: 3px; }   /* Energie i Finance (29. 9. 2026) */
  .sett-tabs.tabs-ic button { flex: 1 1 0; width: auto; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 3px;
    padding: .4rem .1rem .32rem; font-size: .68rem; line-height: 1.2; white-space: nowrap; }
  .sett-tabs.tabs-ic button > .who { display: none; }
  .sett-tabs.tabs-ic button > .sn-pro { margin: 0; }
  .sett-tabs.tabs-ic .en-ti { display: flex; position: relative; }
  .sett-tabs.tabs-ic .en-ti svg { width: 17px; height: 17px; }
  .sett-tabs.tabs-ic .en-tb { display: block; position: absolute; top: -5px; right: -9px; min-width: 14px; height: 14px; padding: 0 3px; border-radius: 7px; box-sizing: border-box;
    background: var(--prim-bg); color: var(--prim-ink); font-style: normal; font-weight: 700; font-size: .58rem; line-height: 14px; text-align: center; }
  /* Plný detail rezervace pod kartou (.rdm): modrý glass baner Údaje / Hosté / Odbavení přepíná tři části, každá se vejde na obrazovku */
  .rdm .sett-tabs.rdm-tabs { margin: .2rem 0 .7rem; }
  .sett-tabs.rdm-tabs .seg-glide { background: var(--prim-bg); box-shadow: var(--prim-shadow); }
  .sett-tabs.rdm-tabs button.on, .sett-tabs.rdm-tabs button.on .who { color: var(--prim-ink); }
  .rdm .rd-grid { display: block; }
  .rdm .rd-h2 { display: none; }
  .rdm[data-rdtab="udaje"] .rd-hoste, .rdm[data-rdtab="udaje"] .rd-right,
  .rdm[data-rdtab="hoste"] .rd-udaje, .rdm[data-rdtab="hoste"] .rd-right,
  .rdm[data-rdtab="odb"] .rd-udaje, .rdm[data-rdtab="odb"] .rd-hoste { display: none; }
  .rdm .grid2 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 .5rem; }   /* Příjezd | Odjezd, Jméno | Osob */
  .rdm .grid2.rd-contact { grid-template-columns: 1fr; }                            /* e-mail a telefon s nápovědou přes celou šířku */
  .rdm label .who { display: block; font-size: .66rem; margin: -.1rem 0 .15rem; }
  .rdm .ob-a.rd-acts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .4rem; }
  .rdm .ob-a.rd-acts .mini { width: 100%; padding: .5rem .4rem; }
  .rdm .ob-a.rd-acts #r_save { grid-column: 1 / -1; }
  /* hosté = skleněná pole jako v kartě; rozbalený host má údaje + akce */
  .rdm .rd-gl { display: flex; flex-direction: column; gap: .35rem; }
  .rdm .dq-g .dq-gi[data-gchev] { color: var(--faint); }
  .rdm .rd-gacts { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .55rem; }
  .rdm .rd-gacts .mini { flex: 1 1 auto; }
  .rdm .rd-gacts .mini:not(.sec):not(.danger) { flex: 1 1 100%; }
  /* odbavení = 5 kroků jako skládací pole: hlavička (ikona, název, stav, hlavní akce, šipka) je vidět vždy, zbytek po rozbalení */
  .rdm .ob { margin: 0; }
  .rdm .ob-step { padding: .45rem .55rem; margin-bottom: .4rem; border: 1px solid var(--line); border-radius: 11px;
    background: var(--input-bg); box-shadow: inset 0 1px 0 rgba(255,255,255,0.10); }
  .rdm .ob-step:last-child { padding-bottom: .45rem; }
  .rdm .ob-step::before { display: none; }
  .rdm .ob-step.open { border-color: var(--acc); }
  .rdm .ob-step:not(.open) > :not(.ob-h) { display: none !important; }
  .rdm .ob-h { display: flex; flex-wrap: nowrap; align-items: center; gap: .5rem; cursor: pointer; font-size: .9rem; }
  .rdm .ob-h:focus-visible { outline: 2px solid var(--acc); outline-offset: 2px; border-radius: 8px; }
  .rdm .ob-ic { width: 28px; height: 28px; border-radius: 8px; flex: none; display: flex; align-items: center; justify-content: center;
    background: var(--neu-bg); color: var(--faint); box-shadow: inset 0 1px 0 rgba(255,255,255,0.15); }
  .rdm .ob-ic svg { width: 14px; height: 14px; }
  .rdm .ob-step.ok .ob-ic { background: var(--ok-bg); color: var(--ok); }
  .rdm .ob-step.warn .ob-ic { background: var(--warn-bg); color: var(--warn); }
  .rdm .ob-step.err .ob-ic { background: var(--err-bg); color: var(--err); }
  .rdm .ob-tt { flex: 1; min-width: 0; line-height: 1.25; }
  .rdm .ob-t { display: block; font-weight: 700; font-size: .86rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .rdm .ob-sub { display: block; font-size: .72rem; font-weight: 500; color: var(--mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .rdm .ob-sub .tag { background: none; border: 0; padding: 0; font-size: .72rem; }
  .rdm .ob-sub .who { margin-left: .35rem; }   /* razítko času za stavem („Odesláno · 2026-07-19 09:00“) */
  .rdm .ob-h > .mini, .rdm .ob-h > .ob-link, .rdm .ob-h > #r_ubyact .mini { flex: none; padding: .3rem .55rem; font-size: .74rem; white-space: nowrap; }
  .rdm .ob-h > #r_ubyact { flex: none; }
  .rdm .ob-chev { width: 15px; height: 15px; flex: none; color: var(--faint); transition: transform .18s; }
  .rdm .ob-step.open .ob-chev { transform: rotate(180deg); }
  .rdm .ob-step .ob-a { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .35rem; margin-top: .55rem; }
  .rdm .ob-step .ob-a .mini { width: 100%; padding: .45rem .4rem; font-size: .78rem; white-space: normal; }
  .rdm .ob-step details { margin-top: .4rem; }
}

/* ============================================================
   Mobil 29. 9. 2026 (2) — Marco vybral návrhy A1 (Analytika: kompaktní hlavička) a F1 (Finance: záložky s ikonami, kompaktní hlavičky,
   skleněná pole akcí, manuály jako spodní list). Desktop beze změny — mobilní bloky jsou mimo telefon skryté.
   ============================================================ */
.an-top-m, .fin-hi, .mob-only-f, .mob-only-b { display: none; }
.fin-step { display: inline-flex; align-items: center; gap: .5rem; }   /* desktop: krokovač vypadá jako dřív (mezery .5rem) */
@media (max-width: 920px) {
  /* ---- Analytika (A1): desktopová hlavička a <details> se skryjí, místo nich nadpis + ⓘ + „dnes“, Rok / Měsíc + krokovač na řádku, statistiky ---- */
  .an-top, .an-src, .an-ctl, .an-kpis { display: none; }
  .an-top-m { display: flex; flex-direction: column; gap: .55rem; }
  .an-hm { display: flex; align-items: center; gap: .4rem; }
  .an-hm h1 { flex: 1; min-width: 0; }
  .an-hi { display: flex; gap: .4rem; flex: none; }
  .an-rowm { display: flex; align-items: center; gap: .5rem; }
  .an-mode-m { flex: 1; min-width: 0; display: flex; }
  .an-mode-m button { flex: 1; padding: .38rem .4rem; font-size: .84rem; }
  .an-step { display: inline-flex; align-items: center; padding: 3px; border-radius: 999px; background: var(--neu-bg); flex: none; }
  .an-stb { width: 28px; height: 28px; margin: 0; padding: 0; border: 0; border-radius: 999px; background: transparent; box-shadow: none; color: var(--ink); display: flex; align-items: center; justify-content: center; }
  .an-stb:disabled { opacity: .35; }
  .an-stb svg { width: 13px; height: 13px; }
  .an-step strong { font-size: .84rem; min-width: 2.6rem; text-align: center; padding: 0 .3rem; white-space: nowrap; }
  .an-stats { display: flex; flex-wrap: wrap; gap: .25rem .7rem; font-size: .74rem; color: var(--mut); }
  .an-stats b { font-size: .86rem; color: var(--ink); margin-right: .15rem; }
  /* tabulka Apartmány: řádek = název, pruh, %, noci; špička / volné noci na druhém řádku — nic nejede do strany */
  .tscroll:has(> table.an-t), .tscroll:has(> table.fin-exp), .tscroll:has(> table.rc-t), .tscroll:has(> table.rc-e) { overflow: visible; }
  table.an-t, table.an-t tbody { display: block; width: 100%; }
  table.an-t tr { display: flex; flex-wrap: wrap; align-items: center; gap: .15rem .5rem; padding: .4rem 0; border-bottom: 1px solid var(--hair); }
  table.an-t tr:first-child { display: none; }
  table.an-t td { display: block; padding: 0; border: 0; white-space: nowrap; font-size: .84rem; }
  table.an-t td:nth-child(1) { flex: 1 1 0; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
  table.an-t td:nth-child(2) { flex: 0 0 64px; }
  table.an-t td:nth-child(2) .an-bar { min-width: 0; width: 64px; }
  table.an-t td:nth-child(5) { flex: 1 1 100%; font-size: .72rem; color: var(--mut); white-space: normal; }
  /* ---- Finance (F1): hlavičky karet s ikonami, krokovač jako pilulka, souhrn na řádku, položky jako skleněná pole, akce DPH jako pole ---- */
  .fin-hm { display: flex; align-items: flex-start; gap: .4rem; }
  .fin-hm h1 { flex: 1; min-width: 0; margin: 0; }
  .fin-hsub { display: block; font-size: .74rem; font-weight: 400; color: var(--mut); margin-top: .1rem; }
  .fin-hi { display: flex; gap: .4rem; flex: none; }
  .fin-tools { margin: .55rem 0 .35rem !important; gap: .4rem !important; flex-wrap: nowrap !important; }
  .fin-tools > #fin_today, .fin-tools > #fin_tpl, .fin-tools > .sp, .fin-sump, .fin-man, .fin-pairbox, .fin-pdfp, h2.dt-only-b, .fin-file { display: none !important; }
  .fin-step { gap: 0; padding: 3px; border-radius: 999px; background: var(--neu-bg); flex: none; }
  .fin-step .mini { width: 28px; height: 28px; padding: 0; border: 0; border-radius: 999px; background: transparent; box-shadow: none; display: flex; align-items: center; justify-content: center; font-size: 1rem; color: var(--ink); }
  .fin-step .mini:disabled { opacity: .35; }
  .fin-step strong { min-width: auto !important; font-size: .84rem; padding: 0 .35rem; white-space: nowrap; }
  .fin-sum { flex: 1; min-width: 0; text-align: right; font-size: .72rem; color: var(--mut); line-height: 1.3; }
  .fin-hint { flex: 1; text-align: right; font-size: .7rem; color: var(--mut); }
  .mob-only-f { display: flex; } .mob-only-b { display: block; }
  .fin-empty { margin: .5rem 0 0; } .fin-empty .mini { width: 100%; padding: .55rem; }
  table.fin-exp, table.fin-exp tbody { display: block; width: 100%; }
  table.fin-exp tr:first-child { display: none; }
  table.fin-exp tr { display: flex; align-items: center; gap: .5rem; padding: .45rem .6rem; margin-bottom: .35rem; border: 1px solid var(--line); border-radius: 11px; background: var(--input-bg); box-shadow: inset 0 1px 0 rgba(255,255,255,0.10); }
  table.fin-exp td { display: block; padding: 0; border: 0; white-space: normal; }
  table.fin-exp td:nth-child(1) .mini { width: 24px !important; height: 24px; padding: 0; border-radius: 8px !important; font-size: .8rem; display: flex; align-items: center; justify-content: center; }
  table.fin-exp td:nth-child(2) { flex: 1; min-width: 0; font-size: .86rem; font-weight: 600; line-height: 1.25; }
  table.fin-exp td:nth-child(2) .who { display: block; font-size: .7rem; font-weight: 400; }
  table.fin-exp td:nth-child(2) .tag { font-size: .62rem; }
  table.fin-exp td:nth-child(3) { flex: none; font-size: .86rem; font-weight: 700; white-space: nowrap; }
  table.fin-exp td:nth-child(4) .tag { font-size: .64rem; padding: .1rem .4rem; white-space: nowrap; }
  .fin-act { display: flex; align-items: center; gap: .55rem; padding: .5rem .6rem; margin: .35rem 0; border: 1px solid var(--line); border-radius: 11px; background: var(--input-bg); box-shadow: inset 0 1px 0 rgba(255,255,255,0.10); cursor: pointer; color: var(--ink); font: inherit; text-align: left; width: auto; }
  .fin-act:focus-visible { outline: 2px solid var(--acc); outline-offset: 1px; }
  .fin-act-i { width: 30px; height: 30px; border-radius: 8px; flex: none; display: flex; align-items: center; justify-content: center; background: var(--acc-soft); color: var(--acc); box-shadow: inset 0 1px 0 rgba(255,255,255,0.15); }
  .fin-act-i.ok { background: var(--ok-bg); color: var(--ok); }
  .fin-act-i svg { width: 15px; height: 15px; }
  .fin-act-t { flex: 1; min-width: 0; line-height: 1.25; }
  .fin-act-t b { display: block; font-size: .86rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .fin-act-t > span { display: block; font-size: .7rem; color: var(--mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .fin-act > .tag { flex: none; font-size: .66rem; }
  .fin-act > svg { width: 14px; height: 14px; flex: none; color: var(--faint); }
  table.rc-t td:first-child, table.rc-e td:first-child { display: block; padding: .05rem 0; }
  table.rc-t td strong { font-size: .88rem; }
}

/* ---------- překreslení bez probliknutí (29. 9. 2026) → plynulé přechody (8. 10. 2026): prolnutí vyměněných celků, vyjetí nové sekce
   a ztlumení staré řídí aplikace.js (pxReveal / pxLeave přes el.animate, bez tříd); prefers-reduced-motion = bez pohybu ---------- */

/* ===== Podpora v aplikaci (30. 9. 2026; Nápověda → Napsat podpoře, návrh B uvnitř Nápovědy) ===== */
.np-sup { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1rem; align-items: start; }
/* Podpora jako samostatná stránka (návrh A z plátna, Marco 20. 10. 2026): velký nadpis s ikonou, čitelný popis, fakta; zpět odkazem nad nadpisem */
.sup-head { display: flex; flex-direction: column; gap: .75rem; margin-bottom: 1.4rem; }
.sup-back { display: inline-flex; align-items: center; gap: .35rem; align-self: flex-start; min-height: 32px; font-size: .86rem; color: var(--mut); }
.sup-back:hover { color: var(--ink); text-decoration: none; }
.sup-title-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.sup-title { display: flex; align-items: center; gap: 1rem; min-width: 0; }
.sup-title h1.pg, .sup-title h2.pg { margin: 0; font-size: 1.9rem; font-weight: 700; letter-spacing: -0.025em; line-height: 1.1; }
.sup-ico { width: 54px; height: 54px; border-radius: 15px; display: flex; align-items: center; justify-content: center; flex: none;
  background: var(--prim-bg); box-shadow: var(--prim-shadow); color: var(--prim-ink, #fff); }
.sup-lead { margin: 0; max-width: 48rem; font-size: 1.08rem; line-height: 1.55; color: var(--ink); }
.sup-facts { display: flex; flex-wrap: wrap; gap: .5rem; }
.sup-fact { display: inline-flex; align-items: center; gap: .45rem; max-width: 100%; padding: .38rem .78rem; border-radius: 999px;
  background: var(--neu-bg); border: 1px solid var(--hair); font-size: .86rem; color: var(--ink); overflow-wrap: anywhere; }
.sup-fact svg { flex: none; color: var(--acc); }
.np-sup .card > h2.pg:first-child, .sup-th-head h2.pg { margin-top: 0; font-size: 1.12rem; }
.sup-tabs { display: none; }
.sup-tabs .en-tb { display: inline-block; min-width: 18px; margin-left: .3rem; padding: 0 5px; border-radius: 999px; box-sizing: border-box;
  background: var(--acc); color: #fff; font-size: .72rem; font-weight: 700; font-style: normal; line-height: 18px; text-align: center; }
.sup-form label { display: block; margin: .7rem 0 .25rem; font-size: .82rem; font-weight: 600; color: var(--mut); }
.sup-form input[type="text"], .sup-form input:not([type]), .sup-form textarea, .sup-reply textarea { width: 100%; box-sizing: border-box; }
.sup-form textarea { resize: vertical; min-height: 7.5rem; }
.sup-kind { margin: .2rem 0 .3rem; }
.sup-row { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; margin-top: .7rem; }
.sup-att { display: inline-flex; align-items: center; gap: .35rem; cursor: pointer; margin: 0; }
.sup-att svg { flex-shrink: 0; }
/* místo souhlasu s přihlášením podpory jen informace s odkazem na Zásahy podpory (Marco 20. 10. 2026) */
.sup-note { display: flex; align-items: flex-start; gap: .55rem; margin: .8rem 0 0; font-size: .84rem; color: var(--mut); line-height: 1.45; }
.sup-note svg { flex: none; margin-top: .1rem; color: var(--ok-dot, var(--mut)); }
.sup-note a { color: var(--ink); text-decoration: underline; text-underline-offset: 2px; text-decoration-color: color-mix(in srgb, currentColor 35%, transparent); }
.sup-auto { margin-top: .8rem; padding: .55rem .7rem; border-radius: 10px; background: var(--neu-bg); font-size: .8rem; color: var(--mut); line-height: 1.45; }
.sup-auto strong { color: var(--ink); font-weight: 600; }
.sup-foot { display: flex; align-items: center; justify-content: space-between; gap: .8rem; flex-wrap: wrap; margin-top: .9rem; }
.sup-foot .who { font-size: .8rem; }
.sup-th-head { display: flex; align-items: baseline; justify-content: space-between; gap: .6rem; margin-bottom: .4rem; }
.sup-t { padding: .8rem .9rem; border-radius: 14px; background: var(--btn-bg); border: 1px solid var(--hair); margin-top: .6rem; }
.sup-t.unread { border-color: var(--acc); box-shadow: 0 0 0 3px var(--acc-soft); }
.sup-t-h { display: flex; align-items: flex-start; justify-content: space-between; gap: .6rem; cursor: pointer; }
.sup-t-t { min-width: 0; }
.sup-t-s { font-weight: 600; font-size: .95rem; line-height: 1.3; overflow-wrap: anywhere; }
.sup-t-h .tag { flex-shrink: 0; white-space: nowrap; }
.sup-t-snip { margin-top: .4rem; font-size: .84rem; color: var(--ink); overflow-wrap: anywhere; }
.sup-t-open { display: inline-block; margin-left: .4rem; font-weight: 600; white-space: nowrap; }
.sup-msgs { display: flex; flex-direction: column; gap: .6rem; margin-top: .7rem; }
.sup-msgs .bbl { max-width: 90%; }
.sup-msgs .bbl.in { align-self: flex-start; }
.sup-msgs .bbl-h .when { font-size: .74rem; }
.sup-body { font-size: .92rem; line-height: 1.45; overflow-wrap: anywhere; }
.sup-attach { margin-top: .3rem; }
.sup-attach .mini { margin: 0; padding: .15rem .6rem; font-size: .76rem; border-radius: 999px; display: inline-flex; align-items: center; gap: .35rem; }
.bbl.out .sup-attach .mini { background: rgba(255,255,255,0.16); color: #fff; border-color: rgba(255,255,255,0.4); }
.bbl.out .sup-attach .mini .who { color: rgba(255,255,255,0.8); }
.sup-img img { display: block; max-width: 100%; margin-top: .5rem; border-radius: 10px; border: 1px solid var(--hair); }
.sup-reply { margin-top: .7rem; padding-top: .7rem; border-top: 1px solid var(--hair); }
.sup-reply textarea { resize: vertical; min-height: 3.2rem; }
.sup-reply-foot { display: flex; align-items: center; gap: .5rem; margin-top: .4rem; }
.sup-reply-foot .sp { flex: 1; }
.sup-reply-foot .mini { margin: 0; }
.sup-bottom { display: none; }
.msg-sup { margin-left: .3rem; font-weight: 600; color: inherit; text-decoration: underline; white-space: nowrap; }
@media (max-width: 760px) {
  .np-sup { grid-template-columns: minmax(0, 1fr); gap: .8rem; }
  .sup-tabs { display: flex; margin-top: .15rem; }
  /* Napsat / Zprávy i Dotaz / Něco nefunguje / Nápad = jeden řádek jako pilulka (obecné .sett-tabs na telefonu dělá mřížku 2 sloupce;
     s display:flex z .sup-tabs se tlačítka se šířkou 100 % skládala pod sebe) — návrh A, 20. 10. 2026 */
  .sett-tabs.sup-tabs, .sett-tabs.sup-kind { display: flex; flex-wrap: nowrap; gap: 2px; border-radius: 999px; padding: 3px; }
  .sett-tabs.sup-tabs button, .sett-tabs.sup-kind button { width: auto; flex: 1 1 auto; min-width: 0; padding: .5rem .55rem; border-radius: 999px; font-size: .86rem; white-space: nowrap; }
  .sett-tabs.sup-tabs .seg-glide, .sett-tabs.sup-kind .seg-glide { border-radius: 999px; }
  .sup-head { gap: .6rem; margin-bottom: .9rem; }
  .sup-title { gap: .75rem; }
  .sup-ico { width: 46px; height: 46px; border-radius: 13px; }
  .sup-ico svg { width: 23px; height: 23px; }
  .sup-title h1.pg, .sup-title h2.pg { font-size: 1.6rem; }
  .sup-lead { font-size: 1rem; }
  .sup-fact { font-size: .8rem; padding: .3rem .65rem; }
  .np-sup[data-tab="write"] .sup-threads, .np-sup[data-tab="threads"] .sup-form { display: none; }
  .np-sup[data-tab="threads"] ~ .sup-bottom { display: block; position: sticky; bottom: .6rem; z-index: 5; padding: .3rem 0 0; }
  .sup-bottom button { width: 100%; height: 46px; border-radius: 13px; font-size: 15px; display: flex; align-items: center; justify-content: center; gap: .5rem; box-shadow: var(--prim-shadow); }
  .sup-foot { flex-direction: column; align-items: stretch; }
  .sup-foot button { width: 100%; }
}
/* ===== Nápověda: zvýrazněná sekce, ve které klient je (Marco 20. 10. 2026 — místo šipky Zpět a křížku na podstránkách) ===== */
.np-head-r button.mini[aria-pressed="true"] { background: color-mix(in srgb, var(--acc) 22%, transparent); border-color: color-mix(in srgb, var(--acc) 65%, transparent); color: var(--ink);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--acc) 16%, transparent), var(--btn-shadow); }
.np-head-r button.mini[aria-pressed="true"] svg { color: var(--acc); }
.np-sec-r { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.np-sec-r .mini { margin: 0; }
/* ===== Stav služby (Nápověda → Stav služby, návrh Stav 3, 20. 10. 2026) ===== */
.svc-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; flex: none; background: var(--ok-dot); box-shadow: 0 0 0 3px var(--ok-bg); }
.svc-dot.lv1 { background: var(--warn-dot); box-shadow: 0 0 0 3px var(--warn-bg); }
.svc-dot.lv2 { background: var(--err-dot); box-shadow: 0 0 0 3px var(--err-bg); }
.svc-hero { display: flex; align-items: center; gap: 1.3rem; padding: 1.4rem 1.6rem; margin-bottom: 1rem; }
.svc-hero-i { width: 58px; height: 58px; border-radius: 50%; flex: none; display: flex; align-items: center; justify-content: center; background: var(--ok-bg); color: var(--ok-dot); }
.svc-hero.lv1 .svc-hero-i { background: var(--warn-bg); color: var(--warn-dot); }
.svc-hero.lv2 .svc-hero-i { background: var(--err-bg); color: var(--err-dot); }
.svc-hero.lv1 { border-color: var(--warn-line); }
.svc-hero.lv2 { border-color: var(--err-line); }
.svc-hero-t { flex: 1; min-width: 0; }
.svc-hero-t h2 { margin: 0 0 .25rem; font-size: 1.55rem; font-weight: 700; letter-spacing: -0.02em; line-height: 1.2; }
.svc-hero-t p { margin: 0; color: var(--ink); line-height: 1.5; }
.svc-stats { display: flex; gap: 1.8rem; text-align: right; }
.svc-stat b { display: block; font-size: 1.6rem; font-weight: 700; line-height: 1.15; letter-spacing: -0.01em; white-space: nowrap; }
.svc-stat b.ok { color: var(--ok); }
.svc-grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 1rem; align-items: start; }
.svc-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.svc-cards > .card, .svc-aside > .card { margin: 0; }
.svc-aside { display: flex; flex-direction: column; gap: 1rem; }
.svc-card-h { display: flex; align-items: flex-start; gap: .75rem; }
.svc-ico { width: 36px; height: 36px; border-radius: 10px; flex: none; display: flex; align-items: center; justify-content: center; background: var(--well); border: 1px solid var(--hair); color: var(--ink); }
.svc-card-t { flex: 1; min-width: 0; }
.svc-name { font-weight: 600; font-size: 1rem; line-height: 1.3; }
.svc-card-h .tag { flex: none; }
.svc-card.lv1 { border-color: var(--warn-line); }
.svc-card.lv2 { border-color: var(--err-line); }
.svc-sent { margin: .65rem 0 0; font-size: .86rem; line-height: 1.45; }
.svc-bars { display: flex; gap: 2px; height: 24px; margin-top: 1rem; }
.svc-bar { flex: 1; min-width: 0; border-radius: 2px; background: var(--ok-dot); }
.svc-bar.lv1 { background: var(--warn-dot); }
.svc-bar.lv2 { background: var(--err-dot); }
.svc-bar.nd { background: var(--track); }
.svc-card-f { display: flex; justify-content: space-between; align-items: baseline; gap: .6rem; margin-top: .5rem; }
.svc-up { color: var(--ok); font-weight: 650; white-space: nowrap; }
.svc-side h2.pg { margin: 0 0 .55rem; font-size: 1.05rem; }
.svc-side .ev-row:first-child { border-top: 0; padding-top: .2rem; }
.svc-mt { margin: 0; font-size: .92rem; }
.svc-note { margin: .45rem 0 0; line-height: 1.45; }
.svc-ev { display: flex; gap: .7rem; align-items: flex-start; padding: .6rem 0; border-top: 1px solid var(--hair); }
.svc-side h2 + .svc-ev { border-top: 0; padding-top: 0; }
.svc-ev-d { flex: none; width: 4.6rem; }
.svc-ev-t { flex: 1; min-width: 0; font-size: .88rem; line-height: 1.35; }
.svc-ev .tag { flex: none; }
.svc-ext { text-align: center; margin: 1.3rem 0 0; }
@media (max-width: 1100px) { .svc-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 760px) {
  .svc-hero { flex-wrap: wrap; gap: .9rem; padding: 1.1rem; }
  .svc-hero-i { width: 46px; height: 46px; }
  .svc-hero-i svg { width: 22px; height: 22px; }
  .svc-hero-t h2 { font-size: 1.25rem; }
  .svc-stats { width: 100%; justify-content: flex-start; text-align: left; gap: 1.4rem; }
  .svc-stat b { font-size: 1.3rem; }
  .svc-cards { grid-template-columns: minmax(0, 1fr); gap: .8rem; }
  .svc-bars { height: 18px; margin-top: .8rem; }
}
/* Pošta superadmina: proužek u zprávy z aplikace */
.sup-strip { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; padding: .5rem .7rem; border-radius: 10px; background: var(--acc-soft); font-size: .82rem; margin: .1rem 0 .2rem; }
.sup-strip .sp { flex: 1; }
.sup-strip .mini { margin: 0; }
.sup-strip .who { overflow-wrap: anywhere; }

/* ---------- úvodní animace po přihlášení „Rozsvícení“ (návrh 3, Marco 2. 10. 2026; kód v app/js/prihlaseni.js introStart) ----------
   Překryv přes celé okno; barvy dlaždice z --logo-g0/--logo-g1 (vzhled uživatele), tma odvozená z téže barvy. Časy jsou posunuté o 0,35 s
   (nejdřív potemní stránka); konec (pxiOut) spouští třída .out z JS, až je Přehled načtený. INTRO.min v JS = konec lesku. */
.px-intro { position: fixed; inset: 0; z-index: 9998; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 32px;
  background: radial-gradient(circle at 50% 45%, #14332e 0%, #0a1b18 72%);
  background: radial-gradient(circle at 50% 45%, color-mix(in srgb, var(--logo-g0) 30%, #070a0c) 0%, color-mix(in srgb, var(--logo-g0) 16%, #070a0c) 72%);
  animation: pxiIn .45s ease both; }
.px-intro.out { animation: pxiOut .6s ease .1s forwards; pointer-events: none; }
@keyframes pxiIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes pxiOut { to { opacity: 0; } }
.px-intro svg.pxi-lg { width: 240px; height: 240px; overflow: visible; transform-origin: 50% 50%; }
@media (max-width: 600px) { .px-intro svg.pxi-lg { width: 190px; height: 190px; } }
.px-intro.out .pxi-lg { animation: pxiLgOut .5s ease-in forwards; }
@keyframes pxiLgOut { from { opacity: 1; transform: translateY(0); filter: blur(0); } to { opacity: 0; transform: translateY(-26px); filter: blur(6px); } }
.pxi-cap { font: 600 26px/1.25 'Albert Sans', -apple-system, system-ui, sans-serif; color: #f5ecd6; letter-spacing: -.01em; text-align: center; padding: 0 20px;
  opacity: 0; transform: translateY(8px); animation: pxiCapIn .6s ease 1.60s forwards; }   /* oslovení „Vítejte zpátky, Jano“ (16. 10. 2026): dřív 15 px „Vítejte zpět“ */
@media (max-width: 600px) { .pxi-cap { font-size: 21px; } }
.px-intro.out .pxi-cap { animation: pxiOut .3s ease forwards; }
@keyframes pxiCapIn { to { opacity: 1; transform: translateY(0); } }
@keyframes pxiFadeIn { to { opacity: 1; } }
.pxi-breath { transform-box: fill-box; transform-origin: 50% 50%; animation: pxiBreath .55s cubic-bezier(.3,.7,.3,1.3) 2.15s both; }
@keyframes pxiBreath { 0% { transform: scale(1,1); } 35% { transform: scale(1.045,.955); } 70% { transform: scale(.985,1.025); } 100% { transform: scale(1,1); } }
.pxi-ring { stroke-dasharray: 1; stroke-dashoffset: 1; animation: pxiDraw 1s cubic-bezier(.6,0,.3,1) 0.35s forwards; }
@keyframes pxiDraw { to { stroke-dashoffset: 0; } }
.pxi-dark { fill: #0f1e2e; fill: color-mix(in srgb, var(--logo-g0) 35%, #0a1014); opacity: 0; animation: pxiFadeIn .7s ease 0.55s forwards; }
.pxi-ghost { opacity: 0; animation: pxiGhost .7s ease 0.85s forwards; }
@keyframes pxiGhost { to { opacity: .07; } }
.pxi-lamp { opacity: 0; animation: pxiLamp .6s linear 1.20s forwards; }
@keyframes pxiLamp { 0% { opacity: 0; } 18% { opacity: .9; } 30% { opacity: .12; } 45% { opacity: 1; } 58% { opacity: .35; } 72% { opacity: 1; } 100% { opacity: 1; } }
.pxi-halo { opacity: 0; animation: pxiHalo .6s ease 1.30s forwards, pxiHaloFull .5s ease 1.75s forwards; }
@keyframes pxiHalo { to { opacity: .3; } }
@keyframes pxiHaloFull { to { opacity: .55; } }
.pxi-flood { transform-box: fill-box; transform-origin: 50% 50%; opacity: 0; animation: pxiFlood .6s cubic-bezier(.5,0,.6,1) 1.70s forwards; }
@keyframes pxiFlood { from { opacity: 0; transform: scale(.4); } 20% { opacity: 1; } to { opacity: 1; transform: scale(5); } }
.pxi-true { opacity: 0; animation: pxiFadeIn .4s ease 2.15s forwards; }
.pxi-sheen { opacity: 0; animation: pxiSheen 2.4s cubic-bezier(.4,0,.3,1) 2.40s infinite; }   /* opakuje se, dokud se Přehled načítá */
@keyframes pxiSheen { 0% { opacity: 0; transform: translateX(-120px) skewX(-20deg); } 5% { opacity: 1; } 27% { opacity: 1; } 32%, 100% { opacity: 0; transform: translateX(900px) skewX(-20deg); } }
.pxi-sp { transform-box: fill-box; transform-origin: 50% 50%; opacity: 0; animation: pxiSp .6s ease-in-out both; }
@keyframes pxiSp { 0% { opacity: 0; transform: scale(0) rotate(0); } 50% { opacity: 1; transform: scale(1) rotate(45deg); } 100% { opacity: 0; transform: scale(0) rotate(90deg); } }
.pxi-sp1 { animation-delay: 2.50s; } .pxi-sp2 { animation-delay: 2.67s; } .pxi-sp3 { animation-delay: 2.77s; }
/* PŘÍLET LOGA ze štítu (Marco 20. 10. 2026, plátno „Logo ve štítu + přílet loga“ Dm1MocrvZLdkZxeLuJoArC; introStart(cap, from) v prihlaseni.js).
   Překryv .fly nemá vlastní pozadí: pod ním je přestěhovaná scéna přihlášení (.pxi-scene), nad ní tma .pxi-bg (0,3–1,2 s). Logo letí 1,3 s
   z polohy štítu (Web Animations v JS), .pxf-src = logo v barvách přihlášení, za letu zhasne na tmavou dlaždici (.pxi-dark + .pxi-ghost jsou
   rovnou vidět), .pxf-aura = světlo, které si logo nese. Dál dnešní Rozsvícení, jen o 0,3 s později a zlatý rámeček až při přistání
   (1,0–1,9 s); INTRO.min v JS = 3350 ms. Bez .fly (superadmin, dům mimo obrazovku) beze změny. */
.px-intro.fly { background: none; animation: none; }
.px-intro.fly.out { animation: pxiOut .6s ease .1s forwards; }
.pxi-scene { position: absolute; left: 0; right: 0; top: 0; }
.pxi-bg { position: absolute; inset: 0; opacity: 0; background: radial-gradient(circle at 50% 45%, #14332e 0%, #0a1b18 72%);
  background: radial-gradient(circle at 50% 45%, color-mix(in srgb, var(--logo-g0) 30%, #070a0c) 0%, color-mix(in srgb, var(--logo-g0) 16%, #070a0c) 72%);
  animation: pxiFadeIn .9s ease .3s forwards; }
.px-intro.fly svg.pxi-lg, .px-intro.fly .pxi-cap { position: relative; }
.pxf-aura { opacity: 0; animation: pxfAura 1.2s ease forwards; }
@keyframes pxfAura { 25% { opacity: .6; } to { opacity: 0; } }
.pxf-src { animation: pxiOut .6s ease .5s forwards; }
.px-intro.fly .pxi-dark { opacity: 1; animation: none; }
.px-intro.fly .pxi-ghost { opacity: .07; animation: none; }
.px-intro.fly .pxi-ring { animation: pxiDraw .9s cubic-bezier(.6,0,.3,1) 1s forwards; }
.px-intro.fly .pxi-lamp { animation-delay: 1.5s; }
.px-intro.fly .pxi-halo { animation-delay: 1.6s, 2.05s; }
.px-intro.fly .pxi-cap { animation-delay: 1.9s; }
.px-intro.fly.out .pxi-cap { animation-delay: 0s; }
.px-intro.fly .pxi-flood { animation-delay: 2s; }
.px-intro.fly .pxi-true, .px-intro.fly .pxi-breath { animation-delay: 2.45s; }
.px-intro.fly .pxi-sheen { animation-delay: 2.7s; }
.px-intro.fly .pxi-sp1 { animation-delay: 2.8s; } .px-intro.fly .pxi-sp2 { animation-delay: 2.97s; } .px-intro.fly .pxi-sp3 { animation-delay: 3.07s; }

/* ============================================================
   REGISTRACE — „Rozsvícení + Tři otázky“ s banerem „Dlaždice tarifu“ (plátno Registrace Ubyo 12. 10. 2026, Marco: „nasaď“)
   Vlevo logo, v jehož okně sílí teplé světlo s každým správně vyplněným polem (navazuje na .px-intro), měřák 4 dílků a titulek;
   vpravo karta: baner vybraného tarifu (návrh B), glass baner kroků O vás → Přihlášení → Potvrzení (.sett-tabs), souhrn po skupinách.
   Barvy z proměnných vzhledu (Porcelain i Obsidian…); teplé světlo, halo a jantarové dílky měřáku jsou záměrně pevné.
   Telefon ≤ 920 px: sloupce pod sebou, levý sloupec jen logo + titulek + měřák (mobilní brána dole, do desktopu se nepropisuje). */
.wrap.reg-wrap { max-width: 1140px; margin: 6vh auto; }
.reg-grid { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 2.4rem 4rem; }
.reg-brand { flex: 1 1 400px; max-width: 520px; display: flex; flex-direction: column; gap: 1.1rem; }
.reg-card.card { flex: 0 1 500px; width: 100%; margin: 0; padding: 1.5rem 1.7rem 1.4rem; border-radius: 22px; display: flex; flex-direction: column; gap: 1rem; }
.reg-logo { position: relative; display: flex; align-items: center; gap: 1.1rem; }
.reg-logo .sb-word { position: relative; }
.reg-logo .sb-word svg { height: 40px; }
.reg-tile { position: relative; width: 128px; height: 128px; flex: 0 0 auto; border-radius: 28px; display: block; box-shadow: 0 12px 30px var(--logo-sh); animation: regBreathe 4s ease-in-out infinite; transition: box-shadow .6s; }
.reg-tile.lit { box-shadow: 0 16px 44px var(--logo-sh), 0 0 60px rgba(255,170,70,.55); animation: none; }
/* postupné rozsvícení napříč kroky (Marco 22. 10. 2026): --rl na .reg-logo = 0 … .85 podle vyplněných kroků (regLight), 1 po Založit účet;
   světlo v okně roste (velikost i jas), halo za dlaždicí sílí a zvětšuje se; jiskry a plné halo (.lit / .on) až po Založit účet */
.reg-lamp { transform-box: fill-box; transform-origin: 50% 50%; transform: scale(calc(.62 + .38 * var(--rl, 1))); transition: opacity .9s ease, transform 1s cubic-bezier(.2,.7,.2,1); }
.reg-halo { position: absolute; left: -38px; top: -38px; width: 204px; height: 204px; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, rgba(255,176,84,.8) 0%, rgba(255,184,100,.5) 38%, rgba(255,190,110,0) 70%);
  opacity: calc(var(--rl, 0) * 1.05); transform: scale(calc(.6 + .55 * var(--rl, 0))); transition: opacity 1s ease, transform 1s cubic-bezier(.2,.7,.2,1); }
.reg-halo.on { opacity: 1; transform: scale(1.22); }
.reg-sp { transform-box: fill-box; transform-origin: 50% 50%; opacity: 0; }
.reg-tile.lit .reg-sp { animation: regTwinkle 1.6s ease-in-out infinite; }
.reg-tile.lit .reg-sp.s2 { animation-delay: .5s; }
.reg-tile.lit .reg-sp.s3 { animation-delay: 1s; }
@keyframes regBreathe { 0%, 100% { box-shadow: 0 12px 30px var(--logo-sh); } 50% { box-shadow: 0 18px 44px var(--logo-sh); } }
@keyframes regTwinkle { 0%, 100% { opacity: 0; transform: scale(.3); } 50% { opacity: 1; transform: scale(1); } }
.reg-eye { margin: 0; font-size: .74rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--acc); }
.wrap h1.reg-h1 { margin: 0; font-size: 2.7rem; line-height: 1.08; font-weight: 700; letter-spacing: -.025em; }
.reg-sub { margin: 0; font-size: 1.05rem; line-height: 1.5; color: var(--mut); max-width: 460px; }
/* měřák = 3 dílky podle kroků; dílek se plní zleva podle toho, kolik je v kroku hotovo (--f 0 … 1), hotový krok dostane záři */
.reg-meter { display: flex; gap: 6px; }
.reg-pill { width: 46px; height: 8px; border-radius: 999px; background: linear-gradient(90deg, #ffd58a, #ffb15c) 0 0 / calc(var(--f, 0) * 100%) 100% no-repeat, var(--track);
  transition: background-size .6s cubic-bezier(.2,.7,.2,1), box-shadow .5s; }
.reg-pill.on { box-shadow: 0 0 0 1px rgba(255,177,92,.35), 0 4px 12px rgba(255,160,60,.45); }
.reg-meter-t { margin: -.5rem 0 0; }
.reg-trust { display: flex; flex-wrap: wrap; gap: .6rem 1.4rem; }
.reg-trust span { display: inline-flex; align-items: center; gap: .5rem; font-size: .86rem; }
.reg-ic { width: 18px; height: 18px; flex: 0 0 auto; color: var(--acc); }
/* baner B — dlaždice tarifu: název v dlaždici v barvách loga, výhody každá na svém řádku, cena ve třech řádcích za svislou linkou */
.reg-plan { display: flex; align-items: center; gap: .9rem; padding: .75rem .9rem .75rem .75rem; border: 1.5px solid color-mix(in srgb, var(--acc) 50%, transparent); border-radius: 14px;
  background: linear-gradient(180deg, color-mix(in srgb, var(--acc) 11%, transparent), color-mix(in srgb, var(--acc) 5%, transparent)); }
.reg-plan-tile { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; width: 60px; height: 60px; border-radius: 16px; background: linear-gradient(135deg, var(--logo-g0), var(--logo-g1));
  box-shadow: 0 8px 18px var(--logo-sh), inset 0 1px 0 rgba(255,255,255,.35); color: var(--logo-glyph); font-size: .9rem; font-weight: 800; letter-spacing: -.01em; }
.reg-plan-mid { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: .25rem; }
.reg-plan-eye { margin: 0; font-size: .66rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--acc); }
.reg-plan-line { display: flex; align-items: center; gap: .45rem; font-size: .82rem; line-height: 1.35; white-space: nowrap; }
.reg-plan-line .reg-ic { width: 15px; height: 15px; }
.reg-plan-sep { flex: 0 0 auto; width: 1px; align-self: stretch; background: color-mix(in srgb, var(--acc) 20%, transparent); }
.reg-plan-price { flex: 0 0 auto; display: flex; flex-direction: column; align-items: flex-end; gap: .35rem; }
.reg-plan-pp { text-align: right; display: flex; flex-direction: column; gap: 1px; }
.reg-plan-p { margin: 0; font-size: 1.06rem; line-height: 1.2; font-weight: 700; white-space: nowrap; }
.reg-plan-ps { margin: 0; font-size: .75rem; line-height: 1.35; color: var(--mut); white-space: nowrap; }
.reg-plan-ch { font-size: .78rem; font-weight: 600; white-space: nowrap; }
/* glass baner kroků: číslo kroku v kolečku, sklo klouže (segGlide) */
.reg-steps.sett-tabs { margin: 0; }
.reg-steps.sett-tabs button { flex: 1 1 0; padding: .5rem .4rem; font-size: .86rem; display: inline-flex; align-items: center; justify-content: center; gap: .4rem; }
.reg-steps b { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; border-radius: 50%; background: var(--acc-soft); color: var(--acc); font-size: .72rem; font-weight: 600; }
.reg-step { display: flex; flex-direction: column; animation: regStepIn .32s ease-out; }
.reg-step[hidden] { display: none; }
.reg-card h2.reg-q { margin: 0; font-size: 1.6rem; line-height: 1.15; font-weight: 700; letter-spacing: -.025em; }
.reg-step .sub { margin: .3rem 0 0; }
.reg-step label { margin-top: .8rem; }
@keyframes regStepIn { from { opacity: 0; transform: translateX(14px); } to { opacity: 1; transform: none; } }
.reg-nav { display: flex; gap: .6rem; margin-top: 1rem; }
.reg-nav button { margin: 0; flex: 1 1 auto; display: inline-flex; align-items: center; justify-content: center; gap: .5rem; }
.reg-nav button.sec { flex: 0 0 auto; width: auto; padding-left: 1.1rem; padding-right: 1.1rem; }
.reg-nav .reg-ic { color: currentColor; }
.reg-foot { margin: .6rem 0 0; text-align: center; }
.reg-pwbox { position: relative; }
.reg-pwbox input { padding-right: 2.8rem; }
/* oko bez transform a bez filtru (22. 10. 2026): Safari vykreslovalo ikonu dvakrát (posunutá kopie) — transformovaný prvek s hover filtrem
   uvnitř karty s backdrop-filter; svisle se tlačítko středí okraji + margin auto. Vlastní oko Safari pro hesla nemá, klíč Klíčenky zůstává vlevo. */
.reg-eyebtn { position: absolute; right: 4px; top: 0; bottom: 0; margin: auto 0; transform: none; filter: none; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 8px; background: transparent; box-shadow: none; color: var(--faint); display: flex; align-items: center; justify-content: center; }
.reg-eyebtn:hover { color: var(--ink); filter: none; }
.reg-pwbox input[type="text"] { font-family: inherit; letter-spacing: 0; }
.reg-eyebtn.on { color: var(--acc); }
.reg-eyebtn .reg-ic { width: 20px; height: 20px; color: currentColor; }
/* měřák síly hesla: 4 dílky, barva podle stupně (červená → oranžová → modrá → zelená) */
.reg-strength { display: flex; flex-direction: column; gap: .35rem; margin-top: .55rem; }
.reg-match { margin: .35rem 0 0; font-size: .8rem; min-height: 1.15em; color: var(--mut); }   /* shoda hesel pod polem Heslo znovu (12. 10. 2026) */
.reg-match.ok { color: var(--ok); }
.reg-match.err { color: var(--err); }
.reg-strength .who { margin: 0; }
.reg-segs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5px; }
.reg-seg { height: 6px; border-radius: 999px; background: var(--track); transition: background .3s; }
.reg-strength.st1 .reg-seg.on { background: var(--err-dot); }  .reg-strength.st1 .who { color: var(--err); }
.reg-strength.st2 .reg-seg.on { background: var(--warn-dot); } .reg-strength.st2 .who { color: var(--warn); }
.reg-strength.st3 .reg-seg.on { background: var(--acc); }      .reg-strength.st3 .who { color: var(--acc); }
.reg-strength.st4 .reg-seg.on { background: var(--ok-dot); }   .reg-strength.st4 .who { color: var(--ok); }
/* souhrn ve 3. kroku: skupiny podle kroků, popisek nad hodnotou, jedno Upravit na skupinu */
/* souhrn ve 3. kroku = mléčné sklo jako rozkliknutá rezervace (Marco 22. 10. 2026: „zase hnusné žlutošedé pozadí“ — dřív --well) */
.reg-sum { display: flex; flex-direction: column; border: 1px solid var(--glass-edge); border-radius: 16px; background: var(--glass-bg); box-shadow: var(--glass-shadow);
  -webkit-backdrop-filter: var(--glass-filter); backdrop-filter: var(--glass-filter); overflow: hidden; margin-top: .9rem; }
.reg-sum-h { display: flex; align-items: center; gap: .6rem; padding: .7rem .5rem 0 .85rem; }
.reg-sum-g + .reg-sum-h { border-top: 1px solid var(--glass-in-line); }
.reg-sum-h b { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; background: var(--acc-soft); color: var(--acc); font-size: .74rem; font-weight: 700; }
.reg-sum-h span { font-size: .86rem; font-weight: 600; }
button.reg-edit { margin: 0 0 0 auto; width: auto; flex: 0 0 auto; display: inline-flex; align-items: center; gap: .3rem; height: 30px; padding: 0 .55rem; border: 0; border-radius: 8px; background: transparent; box-shadow: none; color: var(--acc); font-size: .8rem; font-weight: 600; }
button.reg-edit:hover { filter: none; background: var(--acc-soft); }
button.reg-edit .reg-ic { width: 14px; height: 14px; }
.reg-sum-g { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem 1rem; padding: .5rem .85rem .85rem; }
.reg-sum-g > div { min-width: 0; }
.reg-sum-l { margin: 0; font-size: .68rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--mut); }
.reg-sum-v { margin: .2rem 0 0; font-size: .95rem; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.reg-dots { letter-spacing: .08em; }
.reg-sum-n { display: block; margin-top: .1rem; font-size: .76rem; font-weight: 500; color: var(--mut); letter-spacing: 0; }   /* délka a síla hesla pod tečkami, ať se nic neusekne */
/* souhlas: každý dokument na svém řádku (Marco 12. 10. 2026 večer) — zaškrtávátko + „Souhlasím s těmito dokumenty:“, pod ním odkazy s ikonou,
   Zásady ochrany osobních údajů zvlášť pod „Údaje zpracováváme podle:“ (informace, ne souhlas) */
.reg-consent { margin-top: 1rem; display: flex; flex-direction: column; gap: .35rem; }
.reg-consent .dash-tchk.reg-terms { margin: 0; align-items: center; }
.reg-docs { list-style: none; margin: 0 0 0 1.65rem; padding: 0; display: flex; flex-direction: column; gap: .3rem; }
.reg-docs a { display: inline-flex; align-items: center; gap: .45rem; font-size: .9rem; font-weight: 500; line-height: 1.35; }
.reg-docs a .reg-ic { width: 16px; height: 16px; }
.reg-docs small { font-size: .8em; font-weight: 400; color: var(--mut); }
.reg-docs-lead { margin: .35rem 0 0; }
/* záře z loga po klepnutí na Založit účet: teplé světlo se rozlije z domečku přes celou obrazovku (kruh ze středu dlaždice), pod ním se vykreslí
   obrazovka „Podívejte se do e-mailu“ a světlo se stáhne; při chybě se stáhne rychle (.fast); dlaždice se mezitím nadechne (.burst) */
.reg-glow { position: fixed; inset: 0; z-index: 2000; pointer-events: none; overflow: hidden; transition: opacity .9s ease; }
.reg-glow.out { opacity: 0; }
.reg-glow.out.fast { transition-duration: .4s; }
.reg-glow-c { position: absolute; border-radius: 50%; transform: scale(0); transition: transform 1.05s cubic-bezier(.2,.7,.2,1); will-change: transform;
  background: radial-gradient(circle, #fff9ec 0%, #ffe9c6 18%, #ffd6a4 38%, #ffc98f 60%, #ffc387 100%); }
.reg-glow.on .reg-glow-c { transform: scale(1); }
.reg-glow.on .reg-glow-c::after { content: ''; position: absolute; inset: 0; border-radius: 50%; background: radial-gradient(circle, rgba(255,255,255,.6), rgba(255,255,255,0) 55%); animation: regGlowPulse 1.8s ease-in-out .9s infinite; }
.reg-tile.burst { animation: regBurst 1s cubic-bezier(.2,.7,.2,1) both; z-index: 2001; }
@keyframes regBurst { 0% { transform: scale(1); } 45% { transform: scale(1.1); } 100% { transform: scale(1.06); box-shadow: 0 0 140px 60px rgba(255,200,130,.95); } }
@keyframes regGlowPulse { 0%, 100% { opacity: .6; } 50% { opacity: 1; } }
/* obrazovka po registraci — návrh B „Co bude dál“ (12. 10. 2026): rozsvícený domeček v hlavičce, osa tří kroků (hotovo / teď / přijde),
   tlačítko do schránky jen u známých poskytovatelů */
.reg-sent .reg-eye { margin: .2rem 0 0; }
.reg-sent h2.reg-sent-q { margin: .35rem 0 1rem; font-size: 1.5rem; line-height: 1.15; font-weight: 700; letter-spacing: -.025em; }
.reg-tls { display: flex; flex-direction: column; }
.reg-tl { display: flex; gap: .85rem; }
.reg-tl-l { flex: 0 0 28px; display: flex; flex-direction: column; align-items: center; }
.reg-tl-dot { display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; font-size: .8rem; font-weight: 700; flex: 0 0 auto; }
.reg-tl.done .reg-tl-dot { background: var(--acc); color: #fff; box-shadow: 0 4px 10px color-mix(in srgb, var(--acc) 35%, transparent); }
.reg-tl.done .reg-tl-dot .reg-ic { width: 14px; height: 14px; color: #fff; }
.reg-tl.now .reg-tl-dot { border: 2.5px solid var(--acc); background: var(--panel); color: var(--acc); box-shadow: 0 0 0 6px var(--acc-soft); }
.reg-tl.next .reg-tl-dot { border: 2px solid var(--hair); background: var(--btn-bg); color: var(--faint); }
.reg-tl-line { flex: 1 1 auto; width: 2px; min-height: 18px; margin: 6px 0; border-radius: 2px; background: var(--hair); }
.reg-tl.done .reg-tl-line { background: var(--acc); }
.reg-tl:last-child .reg-tl-line { display: none; }
.reg-tl-b { flex: 1 1 auto; min-width: 0; padding-bottom: 1rem; }
.reg-tl:last-child .reg-tl-b { padding-bottom: 0; }
.reg-tl-t { margin: .25rem 0 0; font-size: .98rem; font-weight: 700; }
.reg-tl.next .reg-tl-t { color: var(--mut); }
.reg-tl-s { margin: .2rem 0 0; font-size: .86rem; line-height: 1.45; color: var(--mut); overflow-wrap: anywhere; }
.reg-tl-btn { display: inline-flex; align-items: center; gap: .45rem; margin-top: .6rem; height: 38px; padding: 0 .9rem; border-radius: 10px; background: var(--prim-bg); color: var(--prim-ink); font-size: .88rem; font-weight: 600; box-shadow: var(--prim-shadow); }
.reg-tl-btn:hover { filter: brightness(1.06); text-decoration: none; color: var(--prim-ink); }
.reg-tl-btn .reg-ic { width: 16px; height: 16px; color: currentColor; }
.reg-sent .links { margin-top: .9rem; }
.reg-sent-note { margin: .8rem 0 0; line-height: 1.5; }
/* hlavička obrazovky po registraci: rozsvícený domeček místo plochého loga */
.reg-sent-h1 .reg-tile { width: 52px; height: 52px; border-radius: 11px; animation: none; }
.reg-sent-h1 .reg-tile.lit { box-shadow: 0 6px 16px var(--logo-sh), 0 0 28px rgba(255,170,70,.6); }
/* potvrzení e-mailu odkazem (Marco 22. 10. 2026, návrh 2 „Osa pokračuje“; vVerified v prihlaseni.js): karta jako „Registrace dokončena“.
   .vf-run = animace (obálka 0,5 s, dopis 1,0 s, fajfka 1,45 s, jiskry 1,8 s; JS v 1,6 s přepne krok 2 na hotovo a v 2,0 s krok 3 + tlačítko),
   .vf-lit = konečný stav bez animace (už potvrzeno, omezit pohyb, chybové stavy) */
.vf .reg-eye, .vf h2.reg-sent-q, .vf-sub { text-align: center; }
.vf h2.reg-sent-q { margin-bottom: .45rem; }
.vf-sub { margin: 0 0 1.15rem; font-size: .95rem; line-height: 1.5; color: var(--mut); overflow-wrap: anywhere; }
.vf-sub strong { color: var(--ink); }
.vf-env { display: block; width: 200px; height: 150px; margin: .5rem auto .1rem; overflow: visible; }
.vf-flap { fill: #c5d6fb; stroke: #a9bfea; stroke-width: 1.5; transform-box: view-box; transform-origin: 100px 48px; }
.vf-letter { opacity: 0; }
.vf-seal { fill: var(--acc); }
.vf-ck { fill: none; stroke: #fff; stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 1; }
.vf-sp { fill: #f0c36a; opacity: 0; transform-box: fill-box; transform-origin: 50% 50%; }
.vf-run .vf-flap { animation: vfFlap .55s ease-in-out .5s forwards; }
.vf-run .vf-letter { animation: vfLetter .7s cubic-bezier(.2,.7,.2,1) 1s forwards; }
.vf-run .vf-ck { animation: vfDraw .45s ease 1.45s forwards; }
.vf-run .vf-sp1 { animation: vfSpark .9s ease 1.8s both; } .vf-run .vf-sp2 { animation: vfSpark .9s ease 1.95s both; } .vf-run .vf-sp3 { animation: vfSpark .9s ease 2.1s both; }
.vf-lit .vf-flap { transform: scaleY(-1); fill: #b4c8f3; }
.vf-lit .vf-letter { opacity: 1; transform: translateY(-46px); }
.vf-lit .vf-ck { stroke-dashoffset: 0; }
@keyframes vfFlap { 49% { fill: #c5d6fb; } 51% { fill: #b4c8f3; } 100% { transform: scaleY(-1); fill: #b4c8f3; } }
@keyframes vfLetter { 0% { opacity: 0; transform: none; } 30% { opacity: 1; } 100% { opacity: 1; transform: translateY(-46px); } }
@keyframes vfDraw { to { stroke-dashoffset: 0; } }
@keyframes vfSpark { 0% { opacity: 0; transform: scale(0); } 40% { opacity: 1; transform: scale(1.1); } 100% { opacity: 0; transform: scale(.6); } }
.vf .reg-tl-dot { transition: background-color .35s, border-color .35s, color .35s, box-shadow .35s; }
.vf .reg-tl-t { transition: color .35s; }
.vf .reg-tl-line { background: linear-gradient(var(--acc), var(--acc)) no-repeat 0 0 / 100% 0, var(--hair); transition: background-size .5s ease; }
.vf .reg-tl.done .reg-tl-line { background: linear-gradient(var(--acc), var(--acc)) no-repeat 0 0 / 100% 100%, var(--hair); }
.vf .reg-tl.vf-pop .reg-tl-dot { animation: vfPop .45s cubic-bezier(.2,.8,.3,1.3); }
@keyframes vfPop { from { transform: scale(.55); } to { transform: none; } }
.vf-btn { display: flex; align-items: center; justify-content: center; gap: .45rem; }
.vf-btn .reg-ic { width: 18px; height: 18px; color: currentColor; }
.vf-run .vf-btn { opacity: 0; transform: translateY(8px); pointer-events: none; transition: opacity .4s ease, transform .4s ease; }
.vf-run.vf-go .vf-btn { opacity: 1; transform: none; pointer-events: auto; }
.vf-ico { display: flex; align-items: center; justify-content: center; width: 56px; height: 56px; margin: .9rem auto .5rem; border-radius: 50%; background: var(--warn-bg); color: var(--warn); }
.vf-ico .reg-ic { width: 28px; height: 28px; color: currentColor; }
@media (max-width: 560px) { .vf-env { width: 168px; height: 126px; } }
.reg-card .links { margin-top: .2rem; }
@media (prefers-reduced-motion: reduce) {
  .reg-tile, .reg-step, .reg-tile.lit .reg-sp, .reg-tile.burst, .reg-glow.on .reg-glow-c::after { animation: none; }
  .reg-lamp, .reg-halo, .reg-pill, .reg-seg { transition: none; }
  .reg-cfrow-spin { animation-duration: 2.4s; }
  .reg-tile.lit .reg-sp { opacity: 1; }
}
/* ---- mobilní brána registrace (≤ 920 px): sloupce pod sebou, levý sloupec na střed bez řádku důvěry ---- */
@media (max-width: 920px) {
  .wrap.reg-wrap { margin: 2.2rem auto 1.5rem; }
  .reg-grid { gap: 1.1rem; }
  .reg-brand { flex: 1 1 100%; max-width: none; align-items: center; text-align: center; gap: .8rem; }
  .reg-logo { gap: .8rem; }
  .reg-tile { width: 64px; height: 64px; border-radius: 14px; }
  .reg-halo { left: -20px; top: -20px; width: 104px; height: 104px; }
  .reg-logo .sb-word svg { height: 30px; }
  .wrap h1.reg-h1 { font-size: 1.75rem; }
  .reg-sub { font-size: .95rem; max-width: 340px; }
  .reg-meter { justify-content: center; }
  .reg-trust { display: none; }
  .reg-card.card { flex: 1 1 100%; padding: 1.25rem 1.1rem 1.2rem; border-radius: 20px; }
  /* kroky zůstávají jeden řádek jako pilulka (obecné pravidlo .sett-tabs na telefonu dělá mřížku 2 sloupce) */
  .reg-steps.sett-tabs { display: flex; border-radius: 999px; padding: 3px; }
  .reg-steps.sett-tabs button { width: auto; flex: 1 1 0; padding: .42rem .2rem; border-radius: 999px; font-size: .8rem; }
  .reg-steps.sett-tabs .seg-glide { border-radius: 999px; }
  /* baner tarifu: dlaždice + výhody nahoře, pod linkou cena vlevo a Změnit jako pilulka vpravo (návrh B, telefon) */
  .reg-plan { flex-wrap: wrap; gap: .7rem .75rem; padding: .75rem; }
  .reg-plan-line { white-space: normal; }   /* „7 dní zdarma s plným tarifem Profi“ se na úzkém telefonu zalomí, dlaždice zůstane vedle výhod */
  .reg-plan-sep { flex-basis: 100%; width: auto; height: 1px; align-self: auto; }
  .reg-plan-price { flex: 1 1 100%; flex-direction: row; align-items: center; justify-content: space-between; }
  .reg-plan-pp { text-align: left; }
  .reg-plan-ch { display: inline-flex; align-items: center; height: 30px; padding: 0 .7rem; border-radius: 999px; border: 1px solid color-mix(in srgb, var(--acc) 35%, transparent); background: var(--btn-bg); }
  .reg-sum-g { grid-template-columns: 1fr; }
}

/* ============================================================
   Karta „Vyžaduje pozornost“ (Marco 14. 10. 2026): Karta 1 (štítky oblastí) na PC, Karta 3 (podle naléhavosti) na telefonu; obě v DOM,
   přepíná je šířka. Křížek u řádku / celé karty = jen do příštího přihlášení (prehled.js warnCardHtml). */
.card.wc { border-color: var(--warn-line); padding: 1.1rem 1.25rem .9rem; }
.wc-m { display: none; }
.wc-head { display: flex; align-items: flex-start; gap: .75rem; }
.wc-ico { flex: 0 0 36px; height: 36px; border-radius: 50%; background: var(--warn-bg); color: var(--warn); display: flex; align-items: center; justify-content: center; }
.wc-ht { flex: 1 1 auto; min-width: 0; }
.wc-tl { display: flex; align-items: center; gap: .5rem; }
.wc-title { font-size: 1.05rem; font-weight: 600; }
.wc-cnt { font-size: .75rem; font-weight: 700; color: var(--warn); background: var(--warn-bg); border-radius: 999px; padding: .1rem .55rem; }
.wc-sub { font-size: .82rem; color: var(--mut); line-height: 1.4; margin-top: .1rem; }
.wc-x { flex: 0 0 26px; width: 26px; height: 26px; padding: 0; margin: 0; border-radius: 50%; border: 1px solid var(--btn-line); background: var(--btn-bg); color: var(--mut); font-size: .72rem; line-height: 1; display: flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: none; }
.wc-x:hover { color: var(--ink); filter: none; }
.wc-xall { width: 32px; height: 32px; flex-basis: 32px; font-size: .85rem; }
.wc-rows { display: flex; flex-direction: column; gap: .35rem; margin-top: .75rem; }
.wc-row { display: flex; align-items: center; gap: .7rem; padding: .55rem .75rem; border-radius: 12px; background: var(--sn-on-bg); border: 1px solid var(--card-line); }
.wc-chip { flex: 0 0 auto; font-size: .68rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; border-radius: 999px; padding: .18rem .55rem; min-width: 4.4rem; text-align: center; box-sizing: border-box; }
.wc-chip.err { color: var(--err); background: var(--err-bg); }
.wc-chip.warn { color: var(--warn); background: var(--warn-bg); }
.wc-chip.neu { color: var(--mut); background: var(--neu-bg); }
.wc-txt { flex: 1 1 auto; min-width: 0; font-size: .88rem; line-height: 1.35; }
.wc-go { flex: 0 0 auto; font-size: .84rem; font-weight: 600; white-space: nowrap; text-decoration: none; }
.wc-dot { flex: 0 0 10px; width: 10px; height: 10px; border-radius: 50%; margin-top: .35rem; }
.wc-dot.err { background: var(--err-dot); }
.wc-dot.warn { background: var(--warn-dot); }
.wc-dot.neu { background: var(--faint); }
.wc-grp { font-size: .7rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; padding: .6rem 0 .15rem; }
.wc-grp.err { color: var(--err); }
.wc-grp.warn { color: var(--warn); }
.wc-grp.neu { color: var(--mut); }
.wc-chips { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .35rem; }
.wc-note { font-size: .74rem; color: var(--mut); padding-top: .5rem; margin-top: .4rem; border-top: 1px solid var(--hair); }
/* PC (Marco 18. 10. 2026, návrh B): řádek „N hlášení čeká na odeslání“ jde rozbalit na hosty — jméno, apartmán, příjezd, termín */
.wc-row.wc-rowx { flex-direction: column; align-items: stretch; gap: 0; padding: 0; }
.wc-rowx .wc-rowh { display: flex; align-items: center; gap: .7rem; padding: .55rem .75rem; }
.wc-tg { flex: 0 0 auto; display: inline-flex; align-items: center; gap: .3rem; width: auto; height: 28px; margin: 0; padding: 0 .65rem; border-radius: 999px;
  border: 1px solid var(--warn-line); background: var(--warn-bg); color: var(--warn); box-shadow: none; font: inherit; font-size: .78rem; font-weight: 600; white-space: nowrap; cursor: pointer; }
.wc-tg:hover { filter: brightness(1.04); }
.wc-tg svg { transition: transform .18s; }
.wc-rowx.open .wc-tg svg { transform: rotate(180deg); }
.wc-gl { margin: 0 .75rem .6rem calc(4.4rem + 1.45rem); padding: .15rem .75rem; border-radius: 10px; background: var(--well); }
.wc-gl[hidden] { display: none; }
.wc-gr { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.2fr); gap: .6rem; align-items: center; padding: .42rem .15rem;
  border-bottom: 1px solid var(--hair); font-size: .84rem; }
.wc-gr:last-of-type { border-bottom: 0; }
.wc-gr strong, .wc-gr span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wc-gdl { color: var(--warn); font-weight: 600; }
.wc-gmore { font-size: .8rem; padding: .35rem .15rem .25rem; }
@media (max-width: 760px) {
  .card.wc { border-color: var(--card-line); }
  .wc-pc { display: none; }
  .wc-m { display: block; }
  .wc-m .wc-row { align-items: flex-start; background: transparent; border: 0; border-bottom: 1px solid var(--hair); border-radius: 0; padding: .5rem 0; gap: .5rem; }
  .wc-m .wc-txt { display: flex; flex-direction: column; gap: .2rem; }
}
/* okno po přihlášení se souhrnem upozornění (Okno 2 „Podle oblastí“, 14. 10. 2026) — sklo pxDialog, širší */
.wp-wrap .px-modal { max-width: 640px; }
.wp-grps { display: flex; flex-direction: column; gap: .6rem; }
.wp-grp { border-radius: 14px; padding: .7rem .85rem; background: var(--sn-on-bg); border: 1px solid var(--card-line); box-shadow: 0 4px 12px rgba(29,29,31,.05); display: flex; flex-direction: column; gap: .35rem; }
.wp-gh { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.wp-go { font-size: .84rem; font-weight: 600; text-decoration: none; white-space: nowrap; }
.wp-item { display: block; font-size: .88rem; line-height: 1.4; color: var(--ink); text-decoration: none; padding-left: .25rem; }
.wp-item:hover { color: var(--acc); }
/* Nápověda → Převod dat (návrh B, 14. 10. 2026) */
.np-prevod { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 1rem; align-items: start; }
.np-pv-main { border-color: var(--acc); box-shadow: 0 10px 30px rgba(47,111,237,.10); }
.np-pv-eye { font-size: .72rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--acc); }
.np-pv-no { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .8rem 1rem; border-radius: 14px; background: var(--acc-soft); border: 1px solid rgba(47,111,237,.25); margin: .8rem 0; }
.np-pv-no strong { display: block; font-size: 1.6rem; letter-spacing: .02em; line-height: 1.2; }
.np-pv-no button { margin: 0; width: auto; }
.np-pv-kv { display: flex; flex-direction: column; gap: .3rem; font-size: .9rem; line-height: 1.45; }
.np-pv-act { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin: .9rem 0 .6rem; }
.np-pv-act .btn-prim { display: inline-flex; align-items: center; gap: .45rem; height: 44px; padding: 0 1.1rem; border-radius: 999px; background: var(--prim-bg); color: var(--prim-ink); font-weight: 600; font-size: .9rem; text-decoration: none; box-shadow: var(--prim-shadow); }
.np-pv-act .btn-prim svg { stroke: currentColor; }
.np-pv-act button { margin: 0; width: auto; }
.np-pv-side { display: flex; flex-direction: column; gap: .75rem; }
.np-pv-side .card { margin: 0; }
.np-pv-step { display: flex; gap: .7rem; align-items: flex-start; font-size: .88rem; line-height: 1.45; margin-top: .55rem; }
.np-pv-step b { flex: 0 0 26px; height: 26px; border-radius: 8px; background: var(--prim-bg); color: var(--prim-ink); display: flex; align-items: center; justify-content: center; font-size: .8rem; }
.np-pv-imp { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
@media (max-width: 920px) { .np-prevod { grid-template-columns: 1fr; } }
/* registrace: odkud klient eviduje hosty (převod dat, 14. 10. 2026) */
.reg-src-l { margin: .9rem 0 .35rem; font-size: .84rem; font-weight: 600; color: var(--mut); }
.reg-src { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .4rem; }
.reg-src button { margin: 0; width: 100%; padding: .6rem .5rem; border-radius: 12px; border: 1px solid var(--btn-line); background: var(--btn-bg); color: var(--mut); font-size: .86rem; font-weight: 500; box-shadow: none; }
.reg-src button.on { border: 1.5px solid var(--acc); background: var(--acc-soft); color: var(--ink); font-weight: 600; }
.reg-pv-box { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; margin-top: .5rem; }
.reg-pv-box > div { padding: .5rem .7rem; border-radius: 10px; background: var(--glass-bg); border: 1px solid var(--glass-edge); box-shadow: var(--glass-shadow); font-size: .85rem; display: flex; flex-direction: column; }   /* mléčné sklo místo --well (22. 10. 2026) */
.reg-pv-box .who { font-size: .7rem; text-transform: uppercase; letter-spacing: .04em; }
@media (max-width: 600px) { .reg-src { grid-template-columns: 1fr; } .reg-pv-box { grid-template-columns: 1fr; } }
.np-pv-cols { width: 100%; border-collapse: collapse; margin-top: .8rem; font-size: .84rem; }
.np-pv-cols th { text-align: left; font-size: .7rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--mut); padding: .3rem .4rem; border-bottom: 1px solid var(--hair); }
.np-pv-cols td { padding: .4rem .4rem; border-bottom: 1px solid var(--hair); vertical-align: top; }
.np-pv-cols tr:last-child td { border-bottom: 0; }
.np-pv-cols .tag { font-size: .68rem; }
.np-pv-main .np-pv-act { margin: 1rem 0 .4rem; }

/* ---------- Úkolníček (Marco 20. 10. 2026; app/js/ukoly.js) ----------
   Řádek úkolu je jeden pro panel Přehledu, okno Úkolníček i záložku Úkoly u apartmánu: kroužek k odškrtnutí (obrys = důležitost:
   vysoká červený, střední oranžový, nízká šedý), název + apartmán · poznámka, vpravo termín a důležitost. Splněný = zelený kroužek,
   přeškrtnutý název. Baner má místo kroužku jen barevnou tečku. */
.tk-dot { display: inline-block; flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--faint); }
.tk-dot.p3 { background: var(--err-dot); }
.tk-dot.p2 { background: var(--warn-dot); }
.tk-chk { flex: none; width: 22px; height: 22px; margin: 0; padding: 0; border-radius: 50%; border: 2px solid var(--faint); background: transparent; box-shadow: none;
  color: transparent; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; transition: background .18s, border-color .18s, color .18s; }
.tk-chk svg { width: 13px; height: 13px; }
.tk-chk.p3 { border-color: var(--err-dot); background: color-mix(in srgb, var(--err-dot) 9%, transparent); }
.tk-chk.p2 { border-color: var(--warn-dot); background: color-mix(in srgb, var(--warn-dot) 9%, transparent); }
@media (hover: hover) { .tk-chk:hover { filter: none; color: var(--faint); } .tk-chk.p3:hover { color: var(--err-dot); } .tk-chk.p2:hover { color: var(--warn-dot); } }
.tk-chk.on, .tk-going .tk-chk { background: var(--ok-dot); border-color: var(--ok-dot); color: #fff; }
.tk-chk:disabled { opacity: 1; cursor: default; }
.tk-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: .1rem .7rem; padding: .5rem 4px; border-bottom: 1px solid var(--hair); cursor: pointer; border-radius: 8px; }
.dp-row.tk-row { display: grid; }   /* řádek v panelu Přehledu nese i .dp-row (dpFit počítá celé řádky) */
.tk-row:last-child { border-bottom: 0; }
@media (hover: hover) { .tk-row:hover { background: var(--acc-soft); } }
.tk-b { min-width: 0; display: flex; flex-direction: column; gap: .08rem; }
.tk-tt { font-size: .9rem; font-weight: 600; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tk-meta { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tk-apt { color: var(--ink); font-weight: 600; }
.tk-apt.gen { color: var(--mut); font-weight: 500; }
.tk-side { display: flex; align-items: center; gap: .35rem; flex-wrap: wrap; justify-content: flex-end; }
.tk-due { font-size: .72rem; padding: .12rem .5rem; }
.tk-pr { display: inline-flex; align-items: center; gap: .25rem; padding: .12rem .5rem .12rem .4rem; border-radius: 999px; font-size: .72rem; font-weight: 600; white-space: nowrap;
  background: var(--neu-bg); color: var(--mut); }
.tk-pr svg { width: 11px; height: 11px; }
.tk-pr.p3 { background: var(--err-bg); color: var(--err); }
.tk-pr.p2 { background: var(--warn-bg); color: var(--warn); }
.tk-row.done .tk-tt, .tk-going .tk-tt { text-decoration: line-through; color: var(--faint); }
.tk-going { opacity: .55; transition: opacity .3s; }
.tk-donel { white-space: nowrap; }
.tk-del { width: 28px; height: 28px; margin: 0; padding: 0; border-radius: 8px; border: 1px solid var(--btn-line); background: var(--btn-bg); box-shadow: none; color: var(--mut);
  display: inline-flex; align-items: center; justify-content: center; }
.tk-del svg { width: 15px; height: 15px; }
.tk-del:hover { color: var(--err); filter: none; border-color: var(--err-dot); }
/* panel Přehledu: hlavička s odkazem na všechny úkoly a tlačítkem Nový úkol, široký panel = tabulka */
.tk-ph { margin-left: auto; display: inline-flex; align-items: center; gap: .7rem; }
.tk-ph a { font-size: .85rem; font-weight: 600; white-space: nowrap; }
.tk-new { display: inline-flex; align-items: center; gap: .3rem; white-space: nowrap; }
.tk-new svg { width: 14px; height: 14px; }
.tk-tab td { vertical-align: middle; }
.tk-tab .tk-c0 { width: 34px; }
.tk-tr { cursor: pointer; }
@media (hover: hover) { .tk-tr:hover td { background: var(--acc-soft); } }
.tk-tab .tk-tt { display: block; }
.tk-note1 { display: block; max-width: 46ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tk-tile .tile-row .tk-dot { margin-right: -.15rem; }
/* okna: úprava úkolu a Úkolníček (pxDialog; px-modal-wide = širší okno se seznamem) */
.px-modal.tk-dlg { max-width: 520px; }
.px-modal.px-modal-wide { max-width: 720px; }
.tk-form label { margin: .7rem 0 .3rem; }
.tk-form label:first-child { margin-top: 0; }
.tk-form textarea { resize: vertical; min-height: 4.2rem; }
.tk-quick { display: flex; flex-wrap: wrap; gap: .35rem; margin: .5rem 0 .1rem; }
.tk-quick .tile-chip { padding: .22rem .7rem; }
.sett-tabs.tk-pseg { margin: 0; }
.sett-tabs.tk-pseg button { display: inline-flex; align-items: center; justify-content: center; gap: .45rem; padding: .45rem .8rem; }
.tk-pseg[data-p="3"] .seg-glide { box-shadow: var(--sn-on-shadow), inset 0 0 0 1.5px var(--err-dot); }
.tk-pseg[data-p="2"] .seg-glide { box-shadow: var(--sn-on-shadow), inset 0 0 0 1.5px var(--warn-dot); }
.tk-by { margin: .8rem 0 0; }
.tk-bar { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin: 0 0 .5rem; }
.tk-bar .res-seg { margin: 0; flex: 0 1 auto; }
.tk-bar select { width: auto; flex: 1 1 10rem; max-width: 15rem; margin: 0; }
.tk-bar .tk-new { margin-left: auto; }
.tk-items { display: flex; flex-direction: column; }
@media (max-width: 920px) {
  .tk-row { grid-template-columns: auto minmax(0, 1fr); padding: .6rem 2px; }
  .tk-side { grid-column: 2; justify-content: flex-start; }
  .tk-chk { width: 26px; height: 26px; }
  .tk-chk svg { width: 15px; height: 15px; }
  .tk-tt { white-space: normal; }
  .sett-tabs.tk-pseg { display: flex; gap: 2px; border-radius: 999px; padding: 3px; }
  .sett-tabs.tk-pseg button { width: auto; flex: 1 1 0; padding: .45rem .3rem; border-radius: 999px; }
  .sett-tabs.tk-pseg .seg-glide { border-radius: 999px; }
  .tk-bar .res-seg { flex: 1 1 100%; display: flex; }
  .tk-bar .res-seg button { flex: 1 1 0; }
  .tk-bar select { flex: 1 1 0; max-width: none; }
  .tk-bar .tk-new { margin-left: 0; }
  .tk-ph { gap: .5rem; }
  .px-modal.tk-dlg, .px-modal.px-modal-wide { max-width: none; }   /* telefon: okno odspodu přes celou šířku jako ostatní */
}

/* ===== Nastavení → Apartmány: dvojpanel (návrh 3, Marco 20. 10. 2026) ===== */
/* Karta Nastavení na jeden řádek (nadpis + glass baner, bez popisu). Pod ní vlevo stálý seznam apartmánů se svislým sklem, vpravo detail
   s kompaktní neprůhlednou hlavičkou a glass banerem sekcí. Výšku dvojpanelu na zbytek okna dopočítá aptxFit (apartmany.js) — seznam
   i hlavička stojí, roluje jen obsah sekce (.aptx-body) a dlouhý seznam (.aptx-items). Telefon (≤ 920 px): kroky jako Nastavení v iPhonu
   podle .aptx[data-lvl] — list (seznam) → apt (sekce jako seznam se stavy) → sec (sekce), nahoře lišta ‹ Zpět + název. */
.sett-head.sett-row { display: flex; align-items: center; gap: 1.2rem; padding: .7rem .8rem .7rem 1.5rem; margin-bottom: 16px; }
.sett-head.sett-row h1.pg { margin: 0; font-size: 1.25rem; white-space: nowrap; }
.sett-head.sett-row .sett-tabs { flex: 1 1 auto; min-width: 0; }
.aptx { display: flex; gap: 16px; align-items: stretch; min-height: 460px; }
.aptx > .card { margin: 0; }
.aptx-mbar, .aptx-mnav, .aptx-mdel, .aptx-march, .aptx-mempty { display: none; }
/* levý panel: seznam apartmánů se svislým sklem */
.aptx-nav { flex: 0 0 272px; min-width: 0; display: flex; flex-direction: column; padding: 1rem .8rem; }
.aptx-nh { display: flex; align-items: center; gap: .5rem; padding: 0 .4rem .7rem; }
.aptx-nh h2 { margin: 0; font-size: 1.05rem; letter-spacing: -0.01em; }
.aptx-nh .aptx-add { margin-left: auto; width: 32px; height: 32px; padding: 0; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.aptx-nh .aptx-add svg { width: 15px; height: 15px; stroke-width: 2; }
.aptx-q { padding: 0 0 .6rem; }
.aptx-q input { height: 2.3rem; font-size: .88rem; }
.aptx-items { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: var(--hair) transparent; border-radius: 16px; }
.aptx-seg { position: relative; display: flex; flex-direction: column; gap: 2px; background: var(--neu-bg); border-radius: 16px; padding: 4px; }
.aptx-seg .seg-glide { position: absolute; left: 0; top: 0; z-index: 0; width: 0; height: 0; border-radius: 12px; background: var(--sn-on-bg); box-shadow: var(--sn-on-shadow);
  pointer-events: none; transition: transform .32s cubic-bezier(.4, 0, .2, 1), width .32s cubic-bezier(.4, 0, .2, 1), height .32s cubic-bezier(.4, 0, .2, 1), opacity .2s ease; }
.aptx-seg .seg-glide.off { opacity: 0; }
@media (prefers-reduced-motion: reduce) { .aptx-seg .seg-glide { transition: none; } }
.aptx-seg > button { position: relative; z-index: 1; display: flex; align-items: center; gap: 10px; width: 100%; min-height: 58px; margin: 0; padding: 6px 10px;
  border: 0; border-radius: 12px; background: transparent; box-shadow: none; color: var(--ink); font-size: .9rem; font-weight: 500; text-align: left; cursor: pointer; transition: background .18s; }
.aptx-seg > button[hidden] { display: none; }
@media (hover: hover) { .aptx-seg > button:hover { filter: none; background: var(--acc-soft); } .aptx-seg > button.on:hover { background: transparent; } }
.aptx-seg > button:active { filter: none; }
.aptx-seg .apt-ava { box-shadow: none; }
.aptx-all-ic { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 34px; width: 34px; height: 34px; box-sizing: border-box; border-radius: 50%;
  background: var(--neu-bg); border: 2px solid var(--card-line); color: var(--mut); }
.aptx-all-ic svg { width: 15px; height: 15px; }
.aptx-seg > button.on .aptx-all-ic, .aptx-seg > button.on .apt-ava-ph { color: var(--acc); opacity: 1; }
.aptx-it { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.aptx-in { display: block; font-size: .9rem; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.aptx-seg > button.on .aptx-in { font-weight: 600; }
.aptx-is { display: block; font-size: .74rem; line-height: 1.3; font-weight: 400; color: var(--mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.aptx-dot { flex: 0 0 auto; width: 7px; height: 7px; border-radius: 50%; background: var(--warn-dot); }
.aptx-dot[hidden], .aptx-dirty[hidden] { display: none; }
.aptx-chev { display: none; }
.aptx-none { padding: .7rem .6rem; font-size: .84rem; color: var(--mut); }
.aptx-archl { margin: auto .4rem 0; padding-top: 1rem; font-size: .74rem; line-height: 1.4; color: var(--mut); }
.aptx-archb { width: auto; margin: 0; padding: 0; border: 0; background: none; box-shadow: none; color: var(--acc); font: inherit; font-weight: 500; cursor: pointer; }
@media (hover: hover) { .aptx-archb:hover { filter: none; text-decoration: underline; } }
/* pravý panel: detail apartmánu / Přehled všech */
.aptx-pane { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; overflow: hidden; padding: 0; }
.aptx-head { flex: none; padding: 1.1rem 1.5rem 1rem; border-bottom: 1px solid var(--hair); border-radius: 16px 16px 0 0;
  background: linear-gradient(180deg, color-mix(in srgb, var(--ink) 4%, transparent) 0%, color-mix(in srgb, var(--ink) 1.5%, transparent) 100%); }
.aptx-head-all { display: flex; align-items: center; gap: .8rem; padding: 1.1rem 1.5rem .9rem; }
.aptx-head-all h2 { margin: 0; font-size: 1.2rem; letter-spacing: -0.02em; }
.aptx-head-all .mini { margin-left: auto; }
.aptx-ht { display: flex; align-items: center; gap: .75rem; min-width: 0; }
.aptx-htt { flex: 1 1 auto; min-width: 0; }
.aptx-hn { display: flex; align-items: baseline; gap: .4rem; min-width: 0; line-height: 1.25; }
.aptx-hn .apt-name { font-size: 1.2rem; font-weight: 600; letter-spacing: -0.02em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.aptx-hn .apt-code { font-size: 1.2rem; font-weight: 400; letter-spacing: -0.02em; color: var(--mut); white-space: nowrap; }
.aptx-ha { margin-top: 2px; font-size: .8rem; color: var(--mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.aptx-x { flex: none; width: 36px; height: 36px; padding: 0; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; }
.aptx-x svg { width: 16px; height: 16px; stroke-width: 1.8; }
.aptx-tabs { margin-top: 14px; }
.aptx-tabs button { padding: .5rem .7rem; }
.aptx-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 1.2rem 1.5rem 1.6rem; scrollbar-width: thin; scrollbar-color: var(--hair) transparent; }
.aptx-body section[data-asec] { display: none; }
.aptx-body section[data-asec].on { display: block; }
/* nadpisy, které jen opakují název sekce v glass baneru (na telefonu v liště ‹ Zpět), se nekreslí — jako na plátně */
.aptx-body #ap_info, .aptx-body #ap_fee, .aptx-body #ap_uby, .aptx-body #ap_ical, .aptx-body section[data-asec="tasks"] > h2:first-child { display: none; }
.aptx-body section[data-asec] > .sub:first-child, .aptx-body section[data-asec] > h2:first-child + .sub { margin-top: 0; }
.aptx-arch { margin-top: 1.6rem; }
.aptx-arch h2 { margin-top: 0; }
@media screen and (min-width: 921px) {
  .content:has(#aptx) { padding-bottom: 30px; }   /* spodní okraj jako horní (zbytek okna vyplní dvojpanel) */
}
@media (min-width: 921px) and (max-width: 1180px) { .aptx-nav { flex-basis: 232px; } }
/* Telefon (≤ 920 px): dvojpanel se rozloží do kroků; desktop beze změny (vše jen za mobilní bránou) */
@media (max-width: 920px) {
  .sett-head.sett-row { display: block; padding: .9rem .9rem; margin-bottom: .8rem; }
  .sett-head.sett-row h1.pg { margin: 0 0 .6rem; font-size: 1.3rem; }
  #view:has(> #aptx:not([data-lvl="list"])) > .sett-head { display: none; }   /* řádek Nastavení s glass banerem jen na první úrovni */
  .aptx { display: block; height: auto !important; min-height: 0; }
  .aptx > .card { margin: 0 0 .8rem; }
  .aptx[data-lvl="list"] > .aptx-pane { display: none; }
  .aptx:not([data-lvl="list"]) > .aptx-nav { display: none; }
  /* 1. úroveň: seznam apartmánů jako v Nastavení iPhonu (řádky se šipkou, bez výběru) */
  .aptx-nav { display: block; padding: .8rem .9rem .5rem; }
  .aptx-nh { padding: 0 0 .5rem; }
  .aptx-items { overflow: visible; border-radius: 0; }
  .aptx-seg { background: none; padding: 0; gap: 0; border-radius: 0; }
  .aptx-seg .seg-glide, .aptx-seg > button.aptx-all { display: none; }
  .aptx-seg > button { min-height: 58px; padding: 8px 2px; border-radius: 0; border-top: 1px solid var(--hair); }
  .aptx-seg > button.aptx-all + button { border-top: 0; }
  .aptx-seg > button.on .aptx-in { font-weight: 500; }
  .aptx-seg > button.on .apt-ava-ph { color: var(--mut); opacity: .75; }
  .aptx-chev { display: block; flex: none; width: 15px; height: 15px; color: var(--faint); }
  .aptx-archl { display: none; }
  .aptx-mempty { display: block; }
  .aptx-march { display: block; margin-top: .9rem; padding-top: .3rem; border-top: 1px solid var(--hair); }
  .aptx-march h2 { margin: .6rem 0 .4rem; }
  /* lišta ‹ Zpět + název: drží pod hlavičkou telefonu, plná barva hlavičky (nic pod ní neprosvítá) */
  .aptx-mbar { position: sticky; top: var(--aptx-mtop, 55px); z-index: 30; align-items: center; gap: .55rem; margin: -12px -12px .8rem; padding: .5rem 12px;
    background: var(--bar); border-bottom: 1px solid var(--sb-edge); }
  .aptx:not([data-lvl="list"]) > .aptx-mbar { display: flex; }
  .aptx-mbar .aptx-back.res-x { position: static; flex: none; display: inline-flex; align-items: center; gap: .15rem; padding: .38rem .7rem .38rem .45rem; font-size: .88rem; line-height: 1.2; border-radius: 10px; }
  .aptx-mbar .aptx-back svg { width: 17px; height: 17px; }
  .aptx-mt { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; line-height: 1.2; }
  .aptx-mtt { font-size: 1rem; font-weight: 600; letter-spacing: -0.01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .aptx-mts { font-size: .74rem; color: var(--mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .aptx-mbar .aptx-dirty { flex: none; font-size: .7rem; padding: .14rem .5rem; }
  /* 2. úroveň: hlavička apartmánu + sekce jako seznam se stavy; 3. úroveň: jen obsah sekce */
  .aptx-pane { display: block; overflow: visible; padding: 0; }
  .aptx-head { padding: .9rem .9rem .7rem; border-bottom: 0; background: none; }
  .aptx-head-all { display: none; }
  .aptx-tabs, .aptx-x, .aptx-head .aptx-dirty { display: none !important; }
  .aptx-hn { flex-wrap: wrap; row-gap: 0; }
  .aptx-hn .apt-name, .aptx-hn .apt-code { font-size: 1.1rem; white-space: normal; }
  .aptx-ha { white-space: normal; }
  .aptx[data-lvl="sec"] .aptx-head, .aptx[data-lvl="apt"] .aptx-body { display: none; }
  .aptx[data-lvl="apt"] .aptx-mnav, .aptx[data-lvl="apt"] .aptx-mdel { display: block; }
  .aptx-mnav { padding: 0 .9rem .3rem; }
  .aptx-mnav > button { display: flex; align-items: center; gap: .7rem; width: 100%; min-height: 52px; margin: 0; padding: .55rem 2px; border: 0; border-top: 1px solid var(--hair);
    border-radius: 0; background: none; box-shadow: none; color: var(--ink); font-size: .95rem; font-weight: 500; text-align: left; }
  .aptx-mnav > button:active { filter: none; background: var(--acc-soft); }
  .aptx-mi { flex: none; width: 30px; height: 30px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; background: var(--acc-soft); color: var(--acc); }
  .aptx-mi svg { width: 17px; height: 17px; }
  .aptx-ml { flex: 1 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .aptx-mv { flex: 0 1 auto; min-width: 0; max-width: 48%; font-size: .82rem; font-weight: 400; color: var(--mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .aptx-mv.warn { color: var(--warn); }
  .aptx-mv.ok { color: var(--ok); }
  .aptx-mnav > button.dirty .aptx-ml::after { content: ''; display: inline-block; width: 7px; height: 7px; margin-left: .45rem; border-radius: 50%; background: var(--warn-dot); vertical-align: middle; }
  .aptx-mdel { padding: .5rem .9rem 1rem; }
  .aptx-mdel .mini { width: 100%; padding: .62rem .8rem; }
  .aptx-body { overflow: visible; padding: .9rem .9rem 1rem; }
}

/* ===== Nastavení → Účet: dvojpanel (návrh 2, Marco 22. 10. 2026; plátno RNK7pWX5…, klikací verze ChCg7sDf…) =====
   Kostra, seznam se svislým sklem, hlavička a rolování obsahu = třídy dvojpanelu Apartmánů (.aptx-*); tady jen prvky Účtu.
   Panely uvnitř (pruhy stavu, tři čísla, subjekty, vnořené formuláře) jsou z MLÉČNÉHO SKLA (--glass-*), ne z --well. */
.acx-who { display: flex; align-items: center; gap: .75rem; min-width: 0; padding: .1rem .4rem .9rem; }
.acx-whot { min-width: 0; display: flex; flex-direction: column; line-height: 1.3; }
.acx-whot strong { font-size: .98rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.acx-whot .who { font-size: .78rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.acx .aptx-all-ic svg { width: 16px; height: 16px; }
.acx-head .px-ct { margin: 0; }
.acx-head .px-st h1 { font-size: 1.2rem; letter-spacing: -0.02em; }
.acx-hsub { margin: .25rem 0 0; }
.acx-msub { display: none; }
.acx-foot { flex: none; display: flex; align-items: center; gap: .55rem; padding: .75rem 1.5rem; border-top: 1px solid var(--hair); }
.acx-foot .mini { margin: 0; }
.acx-fst { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: .45rem; font-size: .82rem; color: var(--mut); }
.acx-sec + .acx-sec { margin-top: 1.5rem; padding-top: 1.3rem; border-top: 1px solid var(--hair); }
.acx-sh { display: flex; align-items: flex-start; gap: 1rem; margin-bottom: .75rem; }
.acx-sht { flex: 1 1 auto; min-width: 0; }
.acx-sht h3 { margin: 0; font-size: 1rem; font-weight: 600; letter-spacing: -0.01em; }
.acx-sht .who { margin-top: .15rem; line-height: 1.45; }
.acx-sha { flex: none; display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; justify-content: flex-end; }
.acx-sha .mini, .acx-btns .mini, .acx-sa .mini, .acx-ent .mini, .acx-kvr .mini { margin: 0; }
.acx-btns { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: .6rem; }
.acx-g2 { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 0 1rem; }
.acx-g2 > div > label:first-child, .acx-sec .grid2 > div:nth-child(-n+2) > label:first-child, .acx-lang > label { margin-top: 0; }
@media (max-width: 560px) { .acx-sec .grid2 > div:nth-child(2) > label:first-child { margin-top: .85rem; } }   /* jeden sloupec: druhé pole má odstup jako ostatní */
.acx-hint { margin: .3rem 0 0; font-size: .78rem; line-height: 1.4; }
.acx-copy { position: relative; }
.acx-copy input { padding-right: 2.6rem; font-weight: 600; font-variant-numeric: tabular-nums; background: transparent; }
.acx-cbtn { position: absolute; right: .3rem; top: 50%; transform: translateY(-50%); width: 32px; height: 32px; margin: 0; padding: 0; border: 0; border-radius: 8px;
  background: transparent; box-shadow: none; color: var(--mut); display: inline-flex; align-items: center; justify-content: center; }
.acx-cbtn svg { width: 16px; height: 16px; }
@media (hover: hover) { .acx-cbtn:hover { filter: none; background: var(--neu-bg); color: var(--ink); } }
.acx-ro { margin: 1rem 0 0; }
/* pruh stavu (dvoufázové ověření, datová schránka) */
.acx-strip, .acx-ent, .acx-k, .acx .acct-form { background: var(--glass-bg); border: 1px solid var(--glass-edge); box-shadow: var(--glass-shadow);
  -webkit-backdrop-filter: var(--glass-filter); backdrop-filter: var(--glass-filter); border-radius: 14px; }
.acx-strip { display: flex; align-items: center; gap: .9rem; padding: .85rem 1rem; }
.acx-strip.warn { background: linear-gradient(var(--warn-bg), var(--warn-bg)), var(--glass-bg); border-color: var(--warn-line); }
.acx-strip.ok { background: linear-gradient(var(--ok-bg), var(--ok-bg)), var(--glass-bg); }
.acx-si { flex: none; width: 36px; height: 36px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; background: var(--neu-bg); color: var(--mut); }
.acx-si svg { width: 18px; height: 18px; }
.acx-strip.warn .acx-si, .acx-si.warn { background: var(--warn-bg); color: var(--warn); }
.acx-strip.ok .acx-si, .acx-si.ok { background: var(--ok-bg); color: var(--ok); }
.acx-stx { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: .12rem; }
.acx-stx strong { font-size: .92rem; }
.acx-stx span { font-size: .8rem; color: var(--mut); line-height: 1.45; }
.acx-sa { flex: none; display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; justify-content: flex-end; }
.acx-ents { display: flex; flex-direction: column; gap: .6rem; }
.acx-ent { display: flex; align-items: center; gap: .8rem; padding: .7rem .9rem; }
/* tři čísla tarifu */
.acx-k3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
.acx-k { padding: .75rem .95rem .8rem; min-width: 0; }
.acx-kl { display: block; font-size: .62rem; letter-spacing: .09em; text-transform: uppercase; color: var(--faint); font-weight: 600; }
.acx-kv { font-size: 1.2rem; font-weight: 600; letter-spacing: -0.02em; margin: .2rem 0 .1rem; display: flex; align-items: center; gap: .45rem; flex-wrap: wrap; }
.acx-kv .tag { font-size: .68rem; letter-spacing: 0; }
.acx-k .who { font-size: .76rem; }
/* řádky Přihlášení */
.acx-kvs { display: flex; flex-direction: column; }
.acx-kvr { display: flex; align-items: center; gap: .8rem; min-height: 46px; padding: .35rem 0; border-top: 1px solid var(--hair); }
.acx-kvr:first-child { border-top: 0; }
.acx-kvr > span { flex: 1 1 auto; min-width: 0; color: var(--mut); font-size: .88rem; }
.acx-kvr > strong { font-size: .92rem; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* vnořené formuláře (heslo, 2FA, zrušení účtu) jako skleněná tabule pod podsekcí */
.acx .acct-form { margin-top: .8rem; padding: .3rem 1rem 1rem; border-top: 1px solid var(--glass-edge); }
.acx .acct-form h4 { margin: .7rem 0 .3rem; font-size: .95rem; }
.acx .acct-form > h2:first-child { margin-top: .7rem !important; font-size: 1rem; }
.acx-strip + .acct-form { margin-top: .8rem; }
.acx-photo { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.acx-photo .acx-btns { margin: 0; }
.acx-lang select { width: auto; min-width: 14rem; max-width: 100%; }
.acx-lang label { margin-top: 0; }
.acx-bill .t { margin-top: .6rem; }
@media screen and (min-width: 921px) { .content:has(#acx) { padding-bottom: 30px; } }   /* spodní okraj jako horní (zbytek okna vyplní dvojpanel) */
@media (min-width: 921px) and (max-width: 1180px) { .acx-k3 { grid-template-columns: 1fr 1fr; } .acx-g2 { grid-template-columns: 1fr; } }
/* Telefon (≤ 920 px): seznam témat → téma s lištou ‹ Zpět (stejné kroky jako Apartmány) */
@media (max-width: 920px) {
  #view:has(> #acx:not([data-lvl="list"])) > .sett-head { display: none; }
  .acx .aptx-seg > button:first-of-type { border-top: 0; }
  .acx-who { padding: .1rem 0 .6rem; }
  .acx[data-lvl="sec"] .aptx-head { display: none; }
  .acx-msub { display: block; margin: 0 0 1rem; }
  .acx-foot { position: sticky; bottom: 0; z-index: 5; padding: .7rem .9rem calc(.7rem + env(safe-area-inset-bottom, 0px)); background: var(--bar); border-radius: 0 0 16px 16px; }
  .acx-foot .mini { flex: 1 1 auto; padding: .62rem .8rem; }
  .acx-fst { flex-basis: 100%; }
  .acx-foot { flex-wrap: wrap; }
  .acx-g2, .acx-k3 { grid-template-columns: 1fr; }
  .acx-g2 > div + div > label:first-child { margin-top: .85rem; }
  .acx-k3 { gap: .5rem; }
  .acx-sh { flex-wrap: wrap; row-gap: .5rem; }
  .acx-sha { justify-content: flex-start; }
  .acx-strip, .acx-ent { flex-wrap: wrap; }
  .acx-sa { flex-basis: 100%; justify-content: stretch; }
  .acx-sa .mini { flex: 1 1 auto; padding: .62rem .8rem; }
  .acx-ent .mini { margin-left: auto; }
  .acx-kvr { flex-wrap: wrap; row-gap: .3rem; }
  .acx-lang select { width: 100%; min-width: 0; }
}

/* ============ Poplatky MČ — finální návrh (Marco 21. 10. 2026; plátno XLygxZg6…, 4.–7. kolo) ============
   úřady jako skupiny bytů, Teď k vyřízení, panel C (Částka · Noci · Osoby, děti = odpuštěno fialově), tabulka roku z mléčného skla s řádky Platba a Hlášení,
   Evidence plateb, panel platby se záznamem; telefon: nejdřív k vyřízení, filtry ve spodním listu (mimo .card kvůli backdrop-filter) */
:root { --kid: #8a5cf0; }
html[data-theme="dark"], html[data-theme="gold"] { --kid: #b49cff; }
html[data-theme="violet"] { --kid: #e9a6ff; }
html[data-theme="lavender"] { --kid: #9b4fd6; }
.pmc { display: flex; flex-direction: column; gap: 14px; }
.pmc-i { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: none; vertical-align: -2px; }
.pmc .mini .pmc-i, .pmc-drawer .mini .pmc-i, .pmc-sheet .mini .pmc-i, .pmc-qrdlg .pmc-i { margin-right: 5px; }
.pmc-c, .pmc-cs, .pmc-chip, .pmc-tri, .pmc-onl, .pmc-lnk, .pmc-x, .pmc-step > button, .pmc-qrw, .pmc-qroff {
  width: auto; margin: 0; padding: 0; border: 0; background: none; box-shadow: none; color: inherit; font: inherit; border-radius: 0; filter: none; }
/* hlavička je od 21. 10. 2026 samostatná karta v řádku jako Nastavení (.sett-head.sett-row.px-sh.pmc-hd) — styly v bloku „Hlavička sekce“ na konci */
.pmc .mini { display: inline-flex; align-items: center; white-space: nowrap; }
.pmc-tabs button { display: inline-flex; align-items: center; justify-content: center; gap: .45rem; }
.pmc-tabs .pmc-i { width: 15px; height: 15px; }
.pmc-cnt { min-width: 18px; height: 18px; padding: 0 5px; border-radius: 99px; background: var(--err-dot); color: #fff; font-size: .66rem; font-weight: 700; display: inline-grid; place-items: center; }
.pmc-tools { display: flex; flex-direction: column; gap: 8px; }
.pmc-trow { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.pmc-tm { display: none; }
.pmc-sp { flex: 1; } .pmc-vr { width: 1px; height: 26px; background: var(--line); }
.pmc-seg { margin: 0; flex-wrap: nowrap; }
.pmc-seg button { padding: .38rem .9rem; font-size: .82rem; }
.pmc-fl { font-size: .62rem; letter-spacing: 1.2px; text-transform: uppercase; color: var(--faint); font-weight: 600; white-space: nowrap; }
.pmc-chips { display: inline-flex; flex-wrap: wrap; gap: 6px; }
.pmc-chip { display: inline-flex; align-items: center; gap: 6px; padding: .3rem .75rem; border-radius: 999px; border: 1px solid var(--btn-line); color: var(--mut); font-size: .8rem; font-weight: 500; white-space: nowrap; cursor: pointer; }
.pmc-chip b { font-size: .7rem; color: var(--faint); }
.pmc-chip.on { border-color: var(--acc); background: var(--acc-soft); color: var(--ink); font-weight: 600; } .pmc-chip.on b { color: var(--acc); }
.pmc-step { display: inline-flex; align-items: center; border-radius: 999px; border: 1px solid var(--btn-line); background: var(--btn-bg); box-shadow: var(--btn-shadow); padding: 3px; }
.pmc-step > button { width: 30px; height: 28px; border-radius: 99px; display: grid; place-items: center; cursor: pointer; color: var(--ink); }
.pmc-step > button:disabled { opacity: .3; cursor: default; }
/* výběr období jako v Evidenční knize (26. 10. 2026): ‹ [kalendář Celý rok 2026 ▾] › — panel .per-pop (ubyport.js) pod lištou; přímí potomci (>),
   ať se styly šipek nepropíšou do tlačítek panelu */
.pmc-step.pmc-per { position: relative; }
.pmc-step > .pmc-perb { width: auto; min-width: 0; padding: 0 10px; display: inline-flex; align-items: center; gap: 6px; font-size: .86rem; font-weight: 600; white-space: nowrap; }
.pmc-perb span { overflow: hidden; text-overflow: ellipsis; }
.pmc-perb .pmc-i:first-child { color: var(--acc); }
.pmc-perb .pmc-i:last-child { width: 12px; height: 12px; color: var(--faint); transition: transform .2s ease; }
.pmc-perb.on .pmc-i:last-child { transform: rotate(180deg); }
@media (hover: hover) { .pmc-step > button:not(:disabled):hover { background: var(--neu-bg); } }
.pmc-per .per-pop { font-weight: 400; }
.pmc-search { display: flex; align-items: center; gap: 8px; padding: 0 12px; height: 34px; border-radius: 999px; background: var(--glass-in-bg); border: 1px solid var(--glass-in-line); width: 220px; color: var(--faint); }
.pmc-search input { border: 0; background: transparent; outline: 0; font-size: .84rem; color: var(--ink); width: 100%; min-width: 0; margin: 0; padding: 0; box-shadow: none; }
.pmc-fnote { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; font-size: .78rem; color: var(--mut); }
.pmc-fnote.warn { color: var(--warn); }
.pmc-lnk { color: var(--acc); font-weight: 600; font-size: .8rem; cursor: pointer; display: inline-flex; align-items: center; gap: 4px; }
.pmc-mut { color: var(--mut); } .pmc-fa { color: var(--faint); font-size: .72rem; }
.pmc-pill { display: inline-flex; align-items: center; gap: 5px; padding: 3px 9px; border-radius: 999px; font-size: .74rem; font-weight: 600; white-space: nowrap; }
.pmc-pill .pmc-i { width: 11px; height: 11px; stroke-width: 2.6; }
.pmc-pill.ok { background: var(--ok-bg); color: var(--ok); } .pmc-pill.err { background: var(--err-bg); color: var(--err); }
.pmc-pill.warn { background: var(--warn-bg); color: var(--warn); } .pmc-pill.neu { background: var(--neu-bg); color: var(--mut); }
.pmc-dot { width: 7px; height: 7px; border-radius: 50%; display: inline-block; flex: none; }
.pmc-dot.d-paid { background: var(--ok-dot); } .pmc-dot.d-due, .pmc-dot.d-open { background: var(--warn-dot); } .pmc-dot.d-late { background: var(--err-dot); }
.pmc-dot.d-run { background: var(--faint); } .pmc-dot.d-plan { box-shadow: inset 0 0 0 1.5px var(--faint); }
.pmc-oic { width: 34px; height: 34px; border-radius: 10px; background: var(--acc-soft); color: var(--acc); display: grid; place-items: center; flex: none; }
.pmc-oic .pmc-i { width: 16px; height: 16px; } .pmc-oic.s { width: 26px; height: 26px; border-radius: 8px; } .pmc-oic.s .pmc-i { width: 13px; height: 13px; }
.pmc-glass { background: var(--glass-bg); border: 1px solid var(--glass-edge); box-shadow: var(--glass-shadow); border-radius: 16px; -webkit-backdrop-filter: var(--glass-filter); backdrop-filter: var(--glass-filter); }
.pmc-sech { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; }
.pmc-sech h2 { margin: 0; font-size: 1rem; } .pmc-sech .pmc-mut { font-size: .8rem; }
/* Teď k vyřízení */
.pmc-todo-g { display: grid; grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); gap: 12px; margin-top: 8px; }
.pmc-tcard { padding: 14px 16px; display: flex; flex-direction: column; gap: 11px; position: relative; overflow: hidden; }
.pmc-tcard::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--bar, transparent); }
.pmc-tch { display: flex; align-items: center; gap: 10px; }
.pmc-tch .t { flex: 1; min-width: 0; } .pmc-tch .t b { display: block; font-size: .92rem; } .pmc-tch .t span { font-size: .76rem; color: var(--mut); }
.pmc-multi { display: block; color: var(--err) !important; font-weight: 600; font-size: .72rem !important; }
.pmc-tcm { display: flex; align-items: center; gap: 14px; }
.pmc-big { font-size: 1.5rem; font-weight: 700; letter-spacing: -.02em; line-height: 1.2; white-space: nowrap; font-variant-numeric: tabular-nums; }
.pmc-ln { font-size: .76rem; color: var(--mut); }
.pmc-tca { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; } .pmc-tca .pmc-lnk { margin-left: auto; }
.pmc-done { display: flex; align-items: center; gap: 12px; padding: 12px 16px; }
.pmc-done > .pmc-i { width: 22px; height: 22px; color: var(--ok); stroke-width: 2.4; }
.pmc-done b { display: block; } .pmc-done span { font-size: .8rem; color: var(--mut); }
.pmc-qrw { position: relative; flex: none; line-height: 0; border-radius: 8px; cursor: zoom-in; }
div.pmc-qrw { cursor: default; }
.pmc-qr { background: #fff; border-radius: 8px; padding: 4px; box-sizing: content-box; box-shadow: 0 0 0 1px rgba(0,0,0,.06); }
.pmc-qr img, .pmc-qr canvas { display: block; width: 100% !important; height: 100% !important; }
.pmc-qrpaid { position: absolute; inset: 0; display: grid; place-items: center; background: rgba(255,255,255,.76); border-radius: 8px; color: #257a4a; font-size: .7rem; font-weight: 700; line-height: 1.2; text-align: center; }
.pmc-qroff { border-radius: 8px; border: 1.5px dashed var(--line); display: grid; place-items: center; text-align: center; font-size: .66rem; color: var(--faint); line-height: 1.25; padding: 6px; flex: none; box-sizing: border-box; cursor: pointer; }
div.pmc-qroff { cursor: default; }
/* panel C */
.pmc-trio { display: grid; grid-template-columns: 1fr 1.2fr 1.2fr; gap: 10px; }
.pmc-tri { text-align: left; cursor: pointer; padding: .8rem 1rem .85rem; border-radius: 14px; background: var(--card-bg); border: 1px solid var(--card-line); box-shadow: var(--card-shadow); -webkit-backdrop-filter: blur(24px) saturate(1.55); backdrop-filter: blur(24px) saturate(1.55); display: flex; flex-direction: column; gap: 6px; }
.pmc-tri.on { border-color: var(--acc); box-shadow: 0 0 0 1px var(--acc), var(--card-shadow); }
.pmc-tri .l { display: flex; align-items: center; gap: 6px; min-height: 15px; font-size: .62rem; letter-spacing: 1.1px; text-transform: uppercase; color: var(--faint); font-weight: 600; }   /* min-height: štítek „v tabulce“ nepřidá řádku výšku */
.pmc-intab { margin-left: auto; padding: 1px 7px; border-radius: 99px; background: var(--acc-soft); color: var(--acc); font-size: .58rem; letter-spacing: .5px; }
/* Dvě hodnoty VŽDY pod sebou, každá na jednom řádku (Marco 26. 10. 2026, video: při přepnutí filtru se čísla napočítávají a fialová hodnota
   přeskakovala podle šířky čísla na druhý řádek a zpět → dlaždice měnila výšku a vše pod ní poskakovalo). Výška dlaždice teď nezávisí na číslech. */
.pmc-tri .v2 { display: flex; flex-direction: column; gap: 2px; font-size: .82rem; color: var(--mut); }
.pmc-tri .v2 > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pmc-tri .v2 b { font-size: 1.22rem; color: var(--ink); letter-spacing: -.02em; margin-right: 3px; font-variant-numeric: tabular-nums; }
.pmc-tri .v2 .kid, .pmc-tri .v2 .kid b { color: var(--kid); }
.pmc-tri .s { font-size: .72rem; color: var(--mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }   /* jeden řádek (celé znění v title) */
.pmc-fnote.off, .pmc-pill.off { display: none; }
.pmc-yw { display: flex; flex-direction: column; gap: 14px; min-width: 0; }   /* obal tabulky roku / evidence plateb (stejná mezera jako v .pmc) */
/* okno Stáhnout přehled poplatků — volba formátu Excel / PDF (26. 10. 2026); karty z mléčného skla, vybraná s modrým okrajem */
.pmc-fmts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.pmc-fmt { width: auto; margin: 0; display: flex; align-items: flex-start; gap: 12px; padding: 14px 14px 15px; border-radius: 14px; text-align: left; cursor: pointer; font: inherit; color: var(--ink);
  background: var(--glass-bg); border: 1px solid var(--glass-edge); box-shadow: var(--glass-shadow); }
.pmc-fmt:hover { filter: none; border-color: var(--faint); }
.pmc-fmt.on { border-color: var(--acc); box-shadow: 0 0 0 1px var(--acc), var(--glass-shadow); }
.pmc-fmt .fi { position: relative; flex: none; width: 36px; height: 44px; border-radius: 6px; display: flex; align-items: flex-end; justify-content: center; padding-bottom: 6px; box-sizing: border-box;
  font-size: .56rem; font-weight: 800; letter-spacing: .4px; color: #fff; box-shadow: 0 4px 10px rgba(0,0,0,.14); }
.pmc-fmt .fi::before { content: ''; position: absolute; top: 0; right: 0; width: 11px; height: 11px; border-bottom-left-radius: 4px; background: rgba(255,255,255,.38); }   /* ohnutý roh listu */
.pmc-fmt .fi.xlsx { background: linear-gradient(160deg, #34a868, #1e7a48); } .pmc-fmt .fi.pdf { background: linear-gradient(160deg, #e2574e, #b3362f); }
.pmc-fmt .tx { display: flex; flex-direction: column; gap: 3px; min-width: 0; } .pmc-fmt .tx b { font-size: .92rem; } .pmc-fmt .tx span { font-size: .78rem; color: var(--mut); line-height: 1.4; }
.pmc-fmt .rd { flex: none; margin-left: auto; width: 18px; height: 18px; border-radius: 50%; border: 1.5px solid var(--line); box-sizing: border-box; }
.pmc-fmt.on .rd { border: 5px solid var(--acc); background: var(--panel); }
@media (max-width: 560px) { .pmc-fmts { grid-template-columns: 1fr; } }
.pmc-ratio { display: flex; height: 7px; border-radius: 99px; overflow: hidden; background: var(--neu-bg); }
.pmc-ratio i { display: block; height: 100%; background: var(--acc); } .pmc-ratio i.kid { background: var(--kid); }
.pmc-payl { display: flex; flex-wrap: wrap; gap: 6px; }
/* tabulka roku */
.pmc-mxw { overflow-x: auto; padding: 4px 0 2px; }
table.pmc-mx { border-collapse: separate; border-spacing: 0; width: 100%; min-width: calc(330px + var(--pmn, 12) * 56px); font-size: .8rem; table-layout: fixed; font-variant-numeric: tabular-nums; }
.pmc-mx th { font-size: .6rem; letter-spacing: 1px; text-transform: uppercase; color: var(--faint); font-weight: 600; padding: 10px 2px 8px; text-align: center; white-space: nowrap; border: 0; }
.pmc-mx th.l, .pmc-mx td.l { text-align: left; padding-left: 14px; width: 224px; overflow: hidden; }
.pmc-mx th.r, .pmc-mx td.r { text-align: right; padding-right: 14px; width: 104px; }
.pmc-mx th.cur span { color: var(--acc); }
.pmc-mx th .pmc-thy { display: block; font-size: .56rem; letter-spacing: .5px; color: var(--faint); margin-top: 1px; }   /* rok u období přes víc let */
.pmc-mx th.cur span::after { content: ''; display: block; width: 4px; height: 4px; border-radius: 50%; background: var(--acc); margin: 2px auto 0; }
.pmc-mx td { padding: 2px; text-align: center; white-space: nowrap; border: 0; vertical-align: middle; }
.pmc-mx tr.pmc-oa > td { border-top: 1px solid var(--hair); padding-top: 8px; }
.pmc-mx tbody tr.pmc-oa:first-child > td { border-top: 0; }
.pmc-mx tr.pmc-oc > td { padding-bottom: 8px; }
.pmc-mx tfoot td { border-top: 1px solid var(--hair); font-weight: 700; padding: 10px 2px; }
.pmc-c { display: flex; align-items: center; justify-content: center; width: 100%; padding: 6px 2px; border-radius: 9px; border: 1.5px solid transparent; font-weight: 600; cursor: pointer; }
.pmc-c:hover { background: var(--glass-row); }
.pmc-c.sel { border-color: var(--acc); background: var(--acc-soft); }
.pmc-c.fut { color: var(--faint); font-weight: 500; }
.pmc-c.two { padding: 3px 2px; }
.pmc-mx td > .pmc-c, .pmc-mx td > .pmc-cs { max-width: 112px; margin: 0 auto; }   /* kratší období = širší sloupce; buňky a štítky zůstanou úzké (26. 10. 2026) */
.pmc .dim { opacity: .28; }
.pmc-none { color: var(--faint); opacity: .6; }
.pmc-onl { display: flex; align-items: center; gap: 9px; padding: 2px 0; text-align: left; cursor: pointer; max-width: 100%; }
.pmc-onl .tx { display: flex; flex-direction: column; min-width: 0; line-height: 1.3; }
.pmc-onl b { font-size: .82rem; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pmc-onl small { font-size: .7rem; color: var(--faint); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pmc-tg { width: 14px; display: grid; place-items: center; color: var(--mut); }
.pmc-tg .pmc-i { width: 12px; height: 12px; transition: transform .2s; } .pmc-tg.open .pmc-i { transform: rotate(90deg); }
.pmc-rl { display: flex; align-items: center; gap: 6px; padding-left: 49px; font-size: .68rem; font-weight: 600; letter-spacing: .6px; text-transform: uppercase; color: var(--faint); }
.pmc-rl .pmc-i { width: 12px; height: 12px; }
.pmc-mx tr.pmc-ap td { font-size: .76rem; color: var(--mut); }
.pmc-mx tr.pmc-ap td.l { padding-left: 63px; color: var(--ink); white-space: nowrap; text-overflow: ellipsis; }
.pmc-cs { display: inline-flex; align-items: center; justify-content: center; gap: 4px; width: 100%; padding: 4px 3px; border-radius: 8px; border: 1px solid transparent; font-size: .69rem; font-weight: 600; white-space: nowrap; line-height: 1.25; cursor: pointer; }
span.pmc-cs { cursor: default; }
.pmc-cs .pmc-i { width: 11px; height: 11px; stroke-width: 2.4; }
.pmc-cs.ok { background: var(--ok-bg); color: var(--ok); }
.pmc-cs.warn { background: var(--warn-bg); color: var(--warn); border-color: color-mix(in srgb, var(--warn-dot) 35%, transparent); }
.pmc-cs.err { background: var(--err-bg); color: var(--err); border-color: color-mix(in srgb, var(--err-dot) 40%, transparent); }
.pmc-cs.okl { color: var(--ok); } .pmc-cs.neu { color: var(--faint); font-weight: 500; }
button.pmc-cs:hover { filter: brightness(1.06); box-shadow: 0 0 0 1px color-mix(in srgb, var(--acc) 30%, transparent); }
.pmc-pr { display: flex; flex-direction: column; align-items: center; line-height: 1.15; }
.pmc-pr b { font-weight: 600; } .pmc-pr i { font-style: normal; font-size: .7rem; font-weight: 600; color: var(--kid); }
.pmc-mx td.r .pmc-pr { align-items: flex-end; } .pmc-mx tr.pmc-ap .pmc-pr i { font-weight: 500; } .pmc-c.fut .pmc-pr i { opacity: .7; }
.pmc-kd { display: inline-block; width: 8px; height: 8px; border-radius: 3px; background: var(--kid); }
.pmc-leg { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; font-size: .72rem; color: var(--mut); }
.pmc-leg > span { display: inline-flex; align-items: center; gap: 5px; } .pmc-leg .pmc-cs { width: auto; padding: 2px 6px; cursor: default; }
/* Evidence plateb */
.pmc-lgw { padding: 4px 14px 8px; overflow-x: auto; }
table.pmc-lg { width: 100%; border-collapse: collapse; font-size: .82rem; font-variant-numeric: tabular-nums; }
.pmc-lg th { font-size: .6rem; letter-spacing: 1.1px; text-transform: uppercase; color: var(--faint); font-weight: 600; text-align: left; padding: 10px 8px 8px; white-space: nowrap; border: 0; }
.pmc-lg td { padding: 9px 8px; border-top: 1px solid var(--hair); border-bottom: 0; vertical-align: middle; }
.pmc-lg .r { text-align: right; }
.pmc-lg tr.pmc-gh td { padding: 14px 8px 6px; border-top: 0; font-size: .76rem; font-weight: 700; color: var(--ink); }
.pmc-lg tr.pmc-gh td span { color: var(--mut); font-weight: 500; }
.pmc-lg tr.pmc-rw.sel td { background: var(--glass-row); }
.pmc-lg td small { display: block; font-size: .7rem; color: var(--faint); }
.pmc-acts { display: flex; gap: 6px; justify-content: flex-end; flex-wrap: wrap; }
.pmc .mini.pmc-sm, .pmc-drawer .mini.pmc-sm { padding: .25rem .6rem; font-size: .74rem; }
/* panel platby */
.pmc-veil { position: fixed; inset: 0; z-index: 70; background: rgba(10,12,20,.32); }
.pmc-drawer { position: fixed; top: 0; right: 0; bottom: 0; z-index: 71; width: min(430px, 100%); overflow-y: auto; padding: calc(18px + env(safe-area-inset-top, 0px)) 22px 22px;
  background: color-mix(in srgb, var(--panel) 93%, transparent); border-left: 1px solid var(--glass-edge); box-shadow: -24px 0 60px rgba(0,0,0,.28);
  -webkit-backdrop-filter: var(--glass-filter); backdrop-filter: var(--glass-filter); display: flex; flex-direction: column; gap: 13px; animation: pmc-in .28s cubic-bezier(.3,.75,.2,1); }
@keyframes pmc-in { from { transform: translateX(40px); opacity: 0; } to { transform: none; opacity: 1; } }
.pmc-drh { display: flex; align-items: flex-start; gap: 8px; }
.pmc-drh .t { flex: 1; min-width: 0; } .pmc-drh .t b { font-size: 1.05rem; display: block; } .pmc-drh .t span { font-size: .76rem; color: var(--mut); }
.pmc-drnav { display: flex; gap: 6px; }
.pmc-x { width: 32px; height: 32px; border-radius: 50%; border: 1px solid var(--btn-line); background: var(--btn-bg); display: grid; place-items: center; cursor: pointer; color: var(--ink); }
.pmc-x:disabled { opacity: .35; cursor: default; }
.pmc-drpay { display: flex; gap: 14px; align-items: center; padding: 12px; }
.pmc-dra { display: flex; flex-wrap: wrap; gap: 6px; }
.pmc-drst { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.pmc-drst div { padding: 8px 4px; border-radius: 10px; background: var(--glass-in-bg); text-align: center; border: 1px solid var(--glass-in-line); }
.pmc-drst b { font-size: .95rem; display: block; } .pmc-drst span { font-size: .64rem; color: var(--mut); }
.pmc-drst .kid b { color: var(--kid); }
.pmc-alist > div { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 7px 0; border-top: 1px solid var(--hair); font-size: .8rem; }
.pmc-alist .nm { min-width: 0; } .pmc-alist .nm small { display: block; font-size: .7rem; color: var(--mut); }
.pmc-alist .rt { display: flex; align-items: center; gap: 6px; white-space: nowrap; }
.pmc-evl { display: flex; flex-direction: column; }
.pmc-ev { display: grid; grid-template-columns: 22px 1fr; gap: 2px 10px; padding: 7px 0; position: relative; }
.pmc-ev .ei { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; background: var(--glass-in-bg); border: 1px solid var(--glass-in-line); color: var(--mut); }
.pmc-ev .ei .pmc-i { width: 11px; height: 11px; }
.pmc-ev.paid .ei { color: var(--ok); background: var(--ok-bg); border-color: transparent; } .pmc-ev.send .ei { color: var(--acc); background: var(--acc-soft); border-color: transparent; }
.pmc-ev.unpaid .ei { color: var(--err); background: var(--err-bg); border-color: transparent; }
.pmc-ev:not(:last-child)::after { content: ''; position: absolute; left: 10.5px; top: 31px; bottom: -6px; width: 1px; background: var(--hair); }
.pmc-ev .et { font-size: .8rem; } .pmc-ev .ed { grid-column: 2; font-size: .7rem; color: var(--faint); }
.pmc-note { font-size: .74rem; color: var(--faint); margin: 0; } .pmc-note.warn { color: var(--warn); }
/* okno QR — částka největší (Marco 21. 10.) */
.pmc-qrbig { display: flex; gap: 20px; align-items: flex-start; flex-wrap: wrap; }
.pmc-qcol { flex: 1; min-width: 220px; display: flex; flex-direction: column; gap: 12px; }
.pmc-qamt { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: 12px 16px 14px; border-radius: 14px; background: var(--acc-soft); border: 1px solid color-mix(in srgb, var(--acc) 30%, transparent); }
.pmc-qamt.late { background: var(--err-bg); border-color: color-mix(in srgb, var(--err-dot) 40%, transparent); }
.pmc-qamt.due, .pmc-qamt.open { background: var(--warn-bg); border-color: color-mix(in srgb, var(--warn-dot) 40%, transparent); }
.pmc-qamt .ql { font-size: .62rem; letter-spacing: 1.1px; text-transform: uppercase; font-weight: 700; color: var(--mut); }
.pmc-qamt b { font-size: 2.3rem; font-weight: 800; letter-spacing: -.03em; line-height: 1.05; color: var(--ink); font-variant-numeric: tabular-nums; }
dl.pmc-kv { display: grid; grid-template-columns: auto 1fr; gap: 4px 14px; margin: 0; font-size: .84rem; }
dl.pmc-kv dt { color: var(--mut); } dl.pmc-kv dd { margin: 0; font-weight: 600; }
/* hlášení odeslané mimo aplikaci (Marco 21. 10. 2026): odkaz pod „Odeslat všechna hlášení“, zrušení značky u apartmánu, okno s datem */
.pmc-repman { align-self: center; font-size: .78rem; }
.pmc-xs { width: 24px; height: 24px; } .pmc-xs .pmc-i { width: 12px; height: 12px; }
.pmc-ev.rep .ei { color: var(--ok); background: var(--ok-bg); border-color: transparent; } .pmc-ev.unrep .ei { color: var(--err); background: var(--err-bg); border-color: transparent; }
.px-modal.pmc-rmdlg { max-width: 480px; }
.pmc-rmdlg .grid2 { margin-top: .9rem; }
.pmc-rmone { display: flex; align-items: center; gap: 8px; margin: 0; padding: 10px 12px; border-radius: 12px; background: var(--glass-in-bg); border: 1px solid var(--glass-in-line); font-size: .88rem; }
.pmc-rmone .pmc-i { color: var(--acc); } .pmc-rmone span { margin-left: auto; color: var(--mut); font-size: .8rem; }
.pmc-rml { display: flex; flex-direction: column; gap: 5px; margin-top: 6px; }
.pmc-rml label { display: flex; align-items: center; gap: 9px; margin: 0; padding: 8px 11px; border-radius: 10px; background: var(--glass-in-bg); border: 1px solid var(--glass-in-line); font-size: .86rem; cursor: pointer; }
.pmc-rml input { width: auto; margin: 0; }
@media (max-width: 520px) { .pmc-rmdlg .grid2 { grid-template-columns: 1fr; gap: .7rem; } }
.px-modal.pmc-qrdlg { max-width: 560px; } .pmc-qrdlg .pmc-note { margin-top: 14px; }
/* spodní list filtrů (telefon) */
.pmc-sheet, .pmc-sveil { display: none; }
@media (max-width: 1240px) { .pmc-trio { grid-template-columns: 1fr 1fr; } .pmc-trio .pmc-tri:first-child { grid-column: 1 / -1; } }
@media (max-width: 920px) {
  .pmc { gap: 12px; }
  .pmc-hsub { display: none; }
  .pmc-setb span { display: none; } .pmc-setb { padding: .45rem .55rem; } .pmc-setb .pmc-i { margin: 0; }
  .pmc-tabs button { padding: .5rem .4rem; font-size: .82rem; }
  .pmc-trow { display: none; } .pmc-tm { display: flex; gap: 8px; } .pmc-tm .pmc-step { flex: 1; min-width: 0; justify-content: space-between; } .pmc-tm .pmc-perb { flex: 0 1 auto; }
  .pmc-fbtn { position: relative; } .pmc-badge { position: absolute; top: -6px; right: -6px; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 99px; background: var(--err-dot); color: #fff; font-size: .64rem; font-weight: 700; display: grid; place-items: center; }
  .pmc-sheet.on { display: flex; flex-direction: column; align-items: stretch; gap: 10px; position: fixed; left: 0; right: 0; bottom: 0; z-index: 72; max-height: 86vh; overflow-y: auto;
    padding: 16px 16px calc(16px + env(safe-area-inset-bottom, 0px)); background: var(--panel); border-radius: 22px 22px 0 0; box-shadow: 0 -20px 60px rgba(0,0,0,.3); border-top: 1px solid var(--glass-edge); }
  .pmc-sveil.on { display: block; position: fixed; inset: 0; z-index: 71; background: rgba(10,12,20,.32); }
  .pmc-shh { display: flex; align-items: center; justify-content: space-between; } .pmc-shh b { font-size: 1rem; }
  .pmc-shf { display: flex; gap: 8px; } .pmc-shf .mini { flex: 1; justify-content: center; padding: .62rem; }
  .pmc-sheet .pmc-seg { display: flex; width: 100%; } .pmc-sheet .pmc-seg button { flex: 1 1 0; min-width: 0; padding: .5rem .3rem; }
  .pmc-sheet .pmc-search { width: 100%; height: 40px; }
  .pmc > * { order: 3; } .pmc > .pmc-hd, .pmc > .pmc-tabs, .pmc > .pmc-tools, .pmc > .pmc-fnote, .pmc > .msg { order: 0; } .pmc > .pmc-todo { order: 1; } .pmc > .pmc-trio, .pmc > .pmc-payl { order: 2; }
  .pmc-trio { grid-template-columns: 1fr; gap: 8px; }
  .pmc-todo-g { grid-template-columns: 1fr; }
  .pmc-tch { flex-wrap: wrap; row-gap: 6px; } .pmc-tch .t { flex: 1 1 calc(100% - 50px); } .pmc-tch .pmc-pill { margin-left: 44px; }
  .pmc-tca .mini { flex: 1 1 auto; justify-content: center; }
  .pmc-mx th.l, .pmc-mx td.l { position: sticky; left: 0; z-index: 2; background: var(--panel); width: 150px; min-width: 150px; padding-left: 10px; }
  .pmc-rl { padding-left: 10px; } .pmc-mx tr.pmc-ap td.l { padding-left: 14px; } .pmc-onl .pmc-oic { display: none; }
  table.pmc-mx { min-width: calc(254px + var(--pmn, 12) * 57px); }
  .pmc-lgw { padding: 2px 10px 8px; }
  table.pmc-lg thead { display: none; }
  table.pmc-lg, table.pmc-lg tbody, table.pmc-lg tr, table.pmc-lg td { display: block; width: 100%; }
  table.pmc-lg tr.pmc-gh td { padding: 12px 2px 6px; }
  table.pmc-lg tr.pmc-rw { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "of st" "per amt" "due paid" "rep rep" "act act"; gap: 4px 10px; padding: 11px 12px; margin-bottom: 8px; border-radius: 14px; background: var(--glass-in-bg); border: 1px solid var(--glass-in-line); }
  table.pmc-lg tr.pmc-rw td { border: 0; padding: 0; width: auto; }
  .pmc-lg .c-of { grid-area: of; } .pmc-lg .c-st { grid-area: st; justify-self: end; } .pmc-lg .c-per { grid-area: per; color: var(--mut); font-size: .76rem; }
  .pmc-lg .c-amt { grid-area: amt; text-align: right; } .pmc-lg .c-due { grid-area: due; font-size: .76rem; color: var(--mut); } .pmc-lg .c-paid { grid-area: paid; text-align: right; font-size: .76rem; }
  .pmc-lg .c-rep { grid-area: rep; } .pmc-lg .c-act { grid-area: act; } .pmc-lg .pmc-acts { justify-content: flex-start; padding-top: 4px; }
  .pmc-drawer { top: auto; left: 0; width: 100%; max-height: 90vh; border-radius: 22px 22px 0 0; border-left: 0; border-top: 1px solid var(--glass-edge); padding-bottom: calc(22px + env(safe-area-inset-bottom, 0px)); animation-name: pmc-up; }
  @keyframes pmc-up { from { transform: translateY(40px); opacity: 0; } to { transform: none; opacity: 1; } }
}
@media (prefers-reduced-motion: reduce) { .pmc-drawer { animation: none; } .pmc-tg .pmc-i { transition: none; } }

/* ============ Hlavička sekce: popis schovaný v nadpisu (Marco 21. 10. 2026, plátno BLbsRmf4…: nové uspořádání A + bublina u nadpisu + baner 2) ============
   secTitle() / pxTip() v app/js/zaklad.js. Nadpis = tlačítko s tichou ⓘ; bublina po najetí myší (prodleva ¼ s), fokusu z klávesnice nebo klepnutí (.open).
   Bublina je PLNÝ panel, ne průsvitné sklo: uvnitř karty s backdrop-filter by průsvitné pozadí propouštělo obsah pod ní (ověřeno na plátně).
   Karta hlavičky .px-sh leží nad dalšími kartami (z-index), aby je bublina mohla překrýt. */
:root { --stp-bg: var(--panel); --stp-top: var(--panel); --stp-line: rgba(29,29,31,.10); --stp-sh: 0 18px 44px rgba(29,29,31,.16), 0 2px 6px rgba(29,29,31,.06); }
html[data-theme="dark"], html[data-theme="violet"], html[data-theme="gold"] {
  --stp-bg: linear-gradient(180deg, color-mix(in srgb, var(--panel) 90%, #fff) 0%, var(--panel) 100%); --stp-top: color-mix(in srgb, var(--panel) 90%, #fff);
  --stp-line: rgba(255,255,255,.16); --stp-sh: 0 24px 60px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.12); }
.px-sh { position: relative; z-index: 3; }
.px-st { display: flex; align-items: center; gap: .6rem; min-width: 0; flex: none; }
.px-st h1.pg { margin: 0; }
.px-tw { position: relative; display: inline-flex; align-items: center; min-width: 0; }
.px-stb, .px-cap, .px-stl { width: auto; margin: 0; border: 0; box-shadow: none; font: inherit; letter-spacing: inherit; filter: none; }
.px-stb { display: inline-flex; align-items: center; gap: .45rem; padding: 0; background: none; color: inherit; border-radius: 6px; text-align: left; cursor: help; }
.px-st-i { width: .72em; height: .72em; flex: none; color: var(--faint); transition: color .15s ease; }
.px-tw.open .px-st-i { color: var(--acc); }
.px-stp { position: absolute; top: calc(100% + 11px); left: -12px; z-index: 60; width: max-content; max-width: min(440px, calc(100vw - 40px)); box-sizing: border-box;
  padding: .75rem .95rem .7rem; border-radius: 14px; background: var(--stp-bg); border: 1px solid var(--stp-line); box-shadow: var(--stp-sh);
  color: var(--ink); font-size: .84rem; font-weight: 400; line-height: 1.55; letter-spacing: 0; text-align: left; white-space: normal; text-transform: none;
  opacity: 0; visibility: hidden; transform: translateY(-5px);
  transition: opacity .14s ease .1s, transform .14s ease .1s, visibility 0s linear .24s; }
.px-stp::before { content: ''; position: absolute; top: -7px; left: 24px; width: 12px; height: 12px; background: var(--stp-top); border-left: 1px solid var(--stp-line); border-top: 1px solid var(--stp-line); transform: rotate(45deg); }
.px-stp::after { content: ''; position: absolute; left: 0; right: 0; top: -13px; height: 13px; }   /* most přes mezeru — myš přejede z nadpisu do bubliny (odkaz) */
.px-stp p { margin: 0; }
.px-stp-t b { display: block; font-weight: 600; } .px-stp-t span { display: block; color: var(--mut); font-size: .8rem; }
@media (hover: hover) {
  .px-tw:hover .px-st-i { color: var(--acc); }
  .px-stb:hover, .px-cap:hover, .px-stl:hover { filter: none; }
  .px-tw > :first-child:hover + .px-stp { opacity: 1; visibility: visible; transform: none; transition: opacity .18s ease .25s, transform .18s ease .25s, visibility 0s linear .25s; }
  .px-tw > .px-stp:hover { opacity: 1; visibility: visible; transform: none; transition: opacity .12s ease, transform .12s ease, visibility 0s; }
}
.px-tw:has(:focus-visible) > .px-stp, .px-tw.open > .px-stp { opacity: 1; visibility: visible; transform: none; transition: opacity .16s ease, transform .16s ease, visibility 0s; }
.px-stl { display: flex; align-items: center; gap: .4rem; width: 100%; margin: .6rem 0 0; padding: .55rem 0 0; border-top: 1px solid var(--line); border-radius: 0;
  background: none; color: var(--acc); font-size: .8rem; font-weight: 600; cursor: pointer; }
.px-stl svg { width: 14px; height: 14px; flex: none; } .px-stl svg:last-child { width: 13px; height: 13px; }
/* kapsle „Vše vyřízeno“ (Poplatky MČ, baner 2): zelená, celé znění v téže bublině */
.px-cap { display: inline-flex; align-items: center; gap: 5px; padding: 3px 10px 3px 8px; border-radius: 999px; border: 1px solid transparent; background: var(--ok-bg);
  color: var(--ok); font-size: .76rem; font-weight: 600; white-space: nowrap; cursor: help; transition: border-color .15s ease; }
.px-cap .pmc-i { width: 12px; height: 12px; stroke-width: 2.8; vertical-align: 0; }
@media (hover: hover) { .px-cap:hover { border-color: color-mix(in srgb, var(--ok) 55%, transparent); } }
.px-tw.open > .px-cap { border-color: color-mix(in srgb, var(--ok) 55%, transparent); }
.px-capw > .px-stp { left: -8px; }
.px-cap-new { animation: px-cap-in .55s cubic-bezier(.2,.9,.3,1.2); }
@keyframes px-cap-in { 0% { opacity: 0; transform: scale(.55); } 60% { opacity: 1; box-shadow: 0 0 0 6px color-mix(in srgb, var(--ok) 22%, transparent); } 100% { transform: none; box-shadow: 0 0 0 0 transparent; } }
@media (prefers-reduced-motion: reduce) { .px-stp, .px-tw > .px-stp { transition: none !important; } .px-cap-new { animation: none; } }

/* Poplatky MČ: hlavička v řádku, nástroje v jednom řádku, úřady jako rozbalovací výběr, lupa, křížek na baneru */
.pmc-hd .mini { display: inline-flex; align-items: center; white-space: nowrap; flex: none; }
.pmc-hd .mini .pmc-i { margin-right: 5px; }
.pmc-done > div { flex: 1; min-width: 0; }
.pmc-donex { width: 32px; height: 32px; flex: none; border-radius: 999px; display: grid; place-items: center; color: var(--faint); cursor: pointer; transition: background .15s ease, color .15s ease; }
.pmc-donex .pmc-i { width: 15px; height: 15px; }
@media (hover: hover) { .pmc-donex:hover { background: var(--neu-bg); color: var(--ink); } }
.pmc-done.pmc-bye { height: 0 !important; padding-top: 0; padding-bottom: 0; border-width: 0; margin-bottom: -14px; opacity: 0; transform: scale(.985); overflow: hidden;
  transition: height .26s ease, padding .26s ease, margin .26s ease, opacity .18s ease, transform .26s ease, border-width .26s ease; }
.pmc-ofw { position: relative; flex: none; }
.pmc .pmc-ofb { gap: 6px; } .pmc .pmc-ofb .pmc-i { margin: 0; } .pmc-ofb .pmc-i:last-child { width: 12px; height: 12px; color: var(--faint); }
.pmc-ofb.on { border-color: var(--acc); }
.pmc-ofp { position: absolute; top: calc(100% + 8px); left: 0; z-index: 30; min-width: 240px; padding: 6px; display: flex; flex-direction: column; gap: 3px;
  border-radius: 14px; background: var(--stp-bg); border: 1px solid var(--stp-line); box-shadow: var(--stp-sh); }
.pmc-ofp .pmc-chip { justify-content: space-between; gap: 14px; padding: .5rem .75rem; border-radius: 10px; border-color: transparent; }
@media (hover: hover) { .pmc-ofp .pmc-chip:hover { background: var(--neu-bg); color: var(--ink); } }
.pmc-trow .pmc-search { width: 34px; height: 34px; margin: 0; padding: 0 9px; box-sizing: border-box; overflow: hidden; cursor: pointer; flex: none; transition: width .22s ease; }
.pmc-trow .pmc-search .pmc-i { width: 15px; height: 15px; }
.pmc-trow .pmc-search:focus-within, .pmc-trow .pmc-search.on { width: 220px; cursor: text; }
@media (max-width: 920px) {
  .sett-head.sett-row.pmc-hd { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .75rem .5rem; }
  .sett-head.sett-row.pmc-hd h1.pg { margin: 0; white-space: normal; }
  .pmc-hd .px-st { flex-wrap: wrap; row-gap: .35rem; }
  .pmc-hd .pmc-setb { grid-column: 2; grid-row: 1; }
  .pmc-hd .pmc-tabs { grid-column: 1 / -1; }
  .pmc-done.pmc-bye { margin-bottom: -12px; }
}

/* ostatní sekce stejně (21. 10. 2026): Evidenční a Domovní kniha, UbyPort, Energie — nadpis s bublinou + přepínač v jednom řádku; Analytika, Nápověda, Rezervace
   v řádku uvnitř své karty. Telefon: knihy a UbyPort mají vlastní rejstříky (beze změny), Energie má přepínač pod nadpisem jako Nastavení. */
.sett-row > .res-seg { flex: 1 1 auto; min-width: 0; margin: 0; }
.px-st .tag { white-space: nowrap; }
.an-top { align-items: center; gap: 1rem 1.2rem; flex-wrap: wrap; }
.an-top .an-ctl { margin: 0; flex: 1 1 auto; }
.np-head.px-sh { align-items: center; }
.res-head { display: flex; align-items: center; flex-wrap: wrap; gap: .8rem 1.1rem; margin-bottom: .8rem; }
.res-head .res-tools { display: flex; align-items: center; gap: .5rem; flex: 1 1 auto; min-width: 0; flex-wrap: wrap; }
.res-cnt { display: inline-flex; align-items: center; gap: .4rem; }
@media (max-width: 920px) {
  .sett-head.sett-row .px-st { margin-bottom: .6rem; flex-wrap: wrap; row-gap: .35rem; }
  .sett-head.sett-row .px-st h1.pg { margin: 0; }
  .sett-head.sett-row.pmc-hd .px-st { margin-bottom: 0; }
  .res-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .5rem .4rem; margin-bottom: .5rem; }
  .res-head .px-st { display: contents; }   /* telefon: nadpis + ikony v 1. řádku, počty pod nimi přes celou šířku */
  .res-head .px-tw { grid-column: 1; grid-row: 1; }
  .res-head .px-st h1.pg { flex: none; }
  .res-head .res-cnt { grid-column: 1 / -1; grid-row: 2; }
  .res-head .res-head-i { grid-column: 2; grid-row: 1; }
}
/* nadpisy KARET s popisem v bublině (Analytika; Marco 21. 10. 2026 „ano, na obou“ — 2. kolo plátna BLbsRmf4…): místo šedé věty jen odstup;
   karty .px-sh mají stejné z-index (vyhrává pozdější), proto se karta s bublinou po najetí / otevření zvedne nad sousedy */
.px-ct { margin: 0 0 .9rem; }
.px-ct h1 { margin: 0; }
.px-sh:has(.px-tw:hover), .px-sh:has(.px-tw.open), .px-sh:has(.px-tw :focus-visible) { z-index: 8; }
/* superadmin: hlavičky Obsah, Web, Evidence GDPR a Nastavení služby jako samostatná karta s bublinou (saHead v sadmin.js); u Webu období vpravo nad obsahem */
.sa-web-days { display: flex; justify-content: flex-end; margin: 0 0 1rem; }
.sa-web-days .sett-tabs { flex: 0 0 auto; }
.card > .sa-web-state:first-child { margin-top: 0; }

/* ===== Skupiny polí na mléčném skle (23. 10. 2026): karty apartmánu = návrh 1 „Skupiny na mléčném skle“ (plátno 1GpUEqxW…, klikací L6mz9mtK…),
   Právní subjekty = návrh 2 „Subjekt po záložkách“ (plátno WDkZcJtu…, klikací Kzx4vhBY…). Panely VŽDY z mléčného skla (--glass-*), ne --well. ===== */
.agp { background: var(--glass-bg); border: 1px solid var(--glass-edge); box-shadow: var(--glass-shadow); -webkit-backdrop-filter: var(--glass-filter); backdrop-filter: var(--glass-filter);
  border-radius: 16px; padding: 1rem 1.15rem 1.15rem; }
.agp + .agp, .acx-strip + .agp, .agp + .acx-strip, .push-steps + .agp, .apt-basef + .agp, .ent-hero + .msg + .agp { margin-top: 14px; }
.agp-h { display: flex; align-items: center; gap: .7rem; }
.agp-i { flex: none; width: 30px; height: 30px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center; background: var(--acc-soft); color: var(--acc); }
.agp-i svg { width: 16px; height: 16px; stroke-width: 1.8; }
.agp-t { flex: 1 1 auto; min-width: 0; }
.agp-t h3 { margin: 0; font-size: .95rem; font-weight: 600; letter-spacing: -0.01em; }
.agp-t .who { margin: .1rem 0 0; font-size: .8rem; line-height: 1.45; }
.agp-h > .tag { flex: none; }
.agp > .agp-h + div > div > label:first-child, .agp > .agp-h + label { margin-top: .7rem; }
.apt-g3, .ent-g3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 1rem; }
.apt-g4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 1rem; }
.apt-g211 { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr); gap: 0 1rem; }
.apt-prev { display: flex; align-items: center; gap: .45rem; margin: .8rem 0 0; font-size: .82rem; color: var(--mut); }
.apt-prev svg { width: 15px; height: 15px; flex: none; color: var(--faint); }
.apt-prev strong { color: var(--ink); font-weight: 600; }
.apt-step { display: flex; align-items: center; gap: .35rem; }
.apt-step input { width: 4.5rem; text-align: center; font-weight: 600; font-variant-numeric: tabular-nums; -moz-appearance: textfield; }
.apt-step input::-webkit-outer-spin-button, .apt-step input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.apt-step .mini { flex: none; width: 38px; height: 38px; margin: 0; padding: 0; font-size: 1.1rem; line-height: 1; display: inline-flex; align-items: center; justify-content: center; }
.apt-perma { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin-top: .8rem; }
.apt-perma input { flex: 1 1 240px; min-width: 0; font-variant-numeric: tabular-nums; background: transparent; }
.apt-perma .mini { margin: 0; display: inline-flex; align-items: center; gap: .35rem; text-decoration: none; white-space: nowrap; }
.apt-perma .mini svg { width: 15px; height: 15px; }
.apt-inb, .ent-inb { display: flex; gap: .4rem; }
.apt-inb input, .ent-inb input { flex: 1 1 auto; min-width: 0; }
.apt-inb .mini, .ent-inb .mini { margin: 0; white-space: nowrap; flex: none; }
.ent-w50 { max-width: 30rem; margin-top: .8rem; }
.apt-note { margin: .1rem 0 0; font-size: .78rem; line-height: 1.45; }
.apt-foot[hidden], .ent-foot[hidden] { display: none; }
.acx-fst svg { width: 15px; height: 15px; flex: none; color: var(--ok); }
/* Právní subjekty: seznam (název · typ · IČO na třech řádcích), hlavička, záložky, patička */
.entx .aptx-seg > button { min-height: 72px; }
.ent-ava { flex: none; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: #fff; font-weight: 600; letter-spacing: .02em; border: 2px solid var(--card-line); box-sizing: border-box; }
.ent-nw { flex: none; width: 36px; height: 36px; box-sizing: border-box; border-radius: 50%; border: 1.5px dashed var(--acc); color: var(--acc); display: inline-flex; align-items: center; justify-content: center; }
.ent-nw svg { width: 15px; height: 15px; }
.ent-nw.lg { width: 44px; height: 44px; }
.ent-dstag { flex: none; }
.entx .aptx-tabs .ent-cnt { margin-left: .3rem; color: var(--faint); font-weight: 600; }
.entx .aptx-tabs .ent-tdot { display: inline-block; margin-left: .35rem; vertical-align: middle; }
.entx .aptx-body section[data-esec] { display: none; }
.entx .aptx-body section[data-esec].on { display: block; }
.entx .aptx-body > .msg:first-child { margin-top: 0; }
.ent-foot .ent-del { display: inline-flex; align-items: center; gap: .35rem; }
.ent-foot .ent-del svg { width: 15px; height: 15px; }
.ent-hero { margin-bottom: 14px; }
.ent-acc { background: var(--acc-soft) !important; color: var(--acc) !important; }
.ent-steps { margin-top: 14px; }
.ent-doc { margin-top: 14px; padding: .85rem 1rem; border-radius: 12px; border: 1px dashed var(--hair); font-size: .82rem; line-height: 1.6; color: var(--mut); }
.ent-doc strong { color: var(--ink); }
.ent-docl { display: block; margin-bottom: .35rem; font-size: .62rem; letter-spacing: .09em; text-transform: uppercase; color: var(--faint); font-weight: 600; }
.ent-det { margin: .7rem 0 0; }
.ent-det summary { cursor: pointer; color: var(--acc); font-size: .84rem; }
.ent-tbl { padding: .3rem .9rem .5rem; }
.ent-tbl .t { margin: 0; }
.ent-apt { display: flex; align-items: center; gap: .6rem; }
.ent-arow { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; margin-top: .9rem; }
.ent-arow .who { flex: 1 1 auto; min-width: 0; font-size: .82rem; }
.ent-arow .mini { margin: 0; display: inline-flex; align-items: center; gap: .35rem; }
.ent-arow .mini svg { width: 15px; height: 15px; }
@media screen and (min-width: 921px) { .content:has(#entx) { padding-bottom: 30px; } }
@media (min-width: 921px) and (max-width: 1180px) { .apt-g4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .apt-g3, .ent-g3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 920px) {
  #view:has(> #entx:not([data-lvl="list"])) > .sett-head { display: none; }
  .entx .aptx-seg > button:first-of-type { border-top: 0; }
  .entx[data-lvl="apt"] .ent-foot, .aptx[data-lvl="apt"] .apt-foot { display: none; }
  .ent-foot .ent-del { display: none; }
  .apt-g3, .apt-g4, .apt-g211, .ent-g3 { grid-template-columns: 1fr; }
  .agp { padding: .9rem; }
  .agp-h { align-items: flex-start; }
  .agp-i { margin-top: 2px; }
  .apt-perma input { flex-basis: 100%; }
  .ent-w50 { max-width: none; }
}

/* ============ Analytika v2 — 2. kolo, návrh 1 (Marco 23. 10. 2026; tarif Profi) ============
   Hlavička s filtrem apartmánů a šesti klikacími dlaždicemi (mléčné sklo), karty se sloupci srovnanými do mřížky (.an2-tr),
   detail v okně pxDialog (.an2-dlg, poloprůhledné sklo). Telefon ≤ 920 px: dlaždice 2 × 3, karty pod sebou, filtr jako okno. */
.an2-head { display: flex; flex-direction: column; gap: 14px; position: relative; z-index: 5; }
.an2-top { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.an2-top .px-st { margin: 0; }
.an2-top .an-mode { margin: 0; }
.an2-top .sp { flex: 1; }
.an2-who, .an2-head .who, .an2-card .who, .an2-dlg .who { color: var(--mut); font-weight: 400; }
.an2-lnk { width: auto; margin: 0; padding: 0; border: 0; background: transparent; box-shadow: none; color: var(--acc); font: inherit; font-size: .84rem; font-weight: 600; cursor: pointer; display: inline-flex; align-items: center; gap: 3px; }
.an2-lnk:hover { text-decoration: underline; }
.an2-lnk svg { width: 14px; height: 14px; }
/* filtr apartmánů */
.an2-fwrap { position: relative; }
.an2-afb { width: auto; margin: 0; min-height: 38px; padding: 7px 12px; border-radius: 999px; display: inline-flex; align-items: center; gap: 8px; font-size: .86rem; font-weight: 600;
  border: 1px solid var(--btn-line); background: var(--btn-bg); box-shadow: var(--btn-shadow); color: var(--ink); cursor: pointer; }
.an2-afb svg { width: 15px; height: 15px; flex: none; }
.an2-afb.act { border-color: color-mix(in srgb, var(--acc) 55%, transparent); color: var(--acc); background: var(--acc-soft); }
.an2-afb .cnt { min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--acc); color: #fff; font-size: .7rem; display: inline-flex; align-items: center; justify-content: center; }
.an2-fpop { position: absolute; top: calc(100% + 8px); left: 0; width: 400px; z-index: 40; padding: 12px; border-radius: 18px; box-sizing: border-box;
  background: var(--panel); border: 1px solid var(--glass-edge); box-shadow: var(--glass-shadow), 0 30px 70px rgba(0,0,0,.28);
  -webkit-backdrop-filter: var(--glass-filter); backdrop-filter: var(--glass-filter); }
.an2-fsrch { position: relative; display: flex; align-items: center; }
.an2-fsrch svg { position: absolute; left: 11px; width: 15px; height: 15px; color: var(--faint); pointer-events: none; }
.an2-fsrch input { padding-left: 34px; width: 100%; min-height: 38px; margin: 0; }
.an2-fl { margin-top: 8px; max-height: 360px; overflow-y: auto; display: flex; flex-direction: column; gap: 6px; }
.an2-fg { display: flex; flex-direction: column; }
.an2-fgh, .an2-fr { display: flex; align-items: center; gap: 9px; width: 100%; margin: 0; min-height: 40px; padding: 6px 8px; border: 0; border-radius: 10px; background: transparent;
  box-shadow: none; color: var(--ink); font: inherit; font-size: .86rem; font-weight: 400; text-align: left; cursor: pointer; box-sizing: border-box; }
.an2-fgh b, .an2-fr b { font-weight: 600; }
.an2-fr.in { padding-left: 22px; }
.an2-fr .sp { flex: 1; }
.an2-fgh:hover, .an2-fr:hover { background: var(--glass-row); }
.an2-fr .oc { font-size: .78rem; color: var(--mut); font-variant-numeric: tabular-nums; }
.an2-fr .only { width: auto; margin: 0; border: 0; background: transparent; box-shadow: none; color: var(--acc); font: inherit; font-size: .76rem; font-weight: 600; padding: 3px 6px; border-radius: 6px; opacity: 0; }
.an2-fr:hover .only, .an2-fr:focus-within .only { opacity: 1; }
.an2-fr .only:hover { background: var(--acc-soft); }
@media (hover: none) { .an2-fr .only { opacity: 1; } }
.an2-cb { width: 18px; height: 18px; flex: none; border-radius: 5px; border: 1.5px solid var(--hair); display: inline-flex; align-items: center; justify-content: center; color: transparent; background: var(--glass-in-bg); box-sizing: border-box; }
.an2-cb svg { width: 12px; height: 12px; }
.an2-cb.on { background: var(--acc); border-color: var(--acc); color: #fff; }
.an2-cb.part { border-color: var(--acc); color: var(--acc); }
.an2-ff { display: flex; align-items: center; gap: 8px; margin-top: 10px; padding: 8px 6px 0; border-top: 1px solid var(--hair); font-size: .78rem; }
.an2-ff .sp { flex: 1; }
.an2-adot { width: 9px; height: 9px; border-radius: 3px; flex: none; display: inline-block; }
.an2-fstrip { display: flex; align-items: center; gap: 9px; padding: 8px 12px; border-radius: 12px; background: var(--acc-soft); border: 1px solid color-mix(in srgb, var(--acc) 22%, transparent); font-size: .82rem; }
.an2-fstrip > svg { width: 15px; height: 15px; color: var(--acc); flex: none; }
.an2-fstrip > span { flex: 1; }
/* dlaždice */
.an2-kpis { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.an2-kp { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 3px; width: auto; margin: 0; padding: 12px 14px 11px; text-align: left; color: var(--ink); font: inherit;
  cursor: pointer; min-width: 0; border-radius: 18px; background: var(--glass-bg); border: 1px solid var(--glass-edge); box-shadow: var(--glass-shadow);
  -webkit-backdrop-filter: var(--glass-filter); backdrop-filter: var(--glass-filter); transition: transform .16s, box-shadow .16s; }
.an2-kp:hover { transform: translateY(-2px); box-shadow: var(--glass-shadow), 0 14px 30px rgba(36,58,110,.12); }
.an2-kp .kl { display: flex; align-items: center; width: 100%; font-size: .66rem; letter-spacing: .1em; text-transform: uppercase; color: var(--faint); font-weight: 600; white-space: nowrap; }
.an2-kp .go { margin-left: auto; opacity: .35; transition: opacity .16s; display: inline-flex; }
.an2-kp .go svg { width: 13px; height: 13px; }
.an2-kp:hover .go, .an2-kp:focus-visible .go { opacity: 1; color: var(--acc); }
.an2-kp .kv { font-size: 1.6rem; font-weight: 600; letter-spacing: -.02em; line-height: 1.15; white-space: nowrap; font-variant-numeric: tabular-nums; }
.an2-kp .ks { font-size: .75rem; color: var(--mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; min-height: 1.1em; }
.an2-dl { font-weight: 700; font-size: .72rem; }
.an2-dl.up { color: var(--ok); } .an2-dl.dn { color: var(--err); } .an2-dl.eq, .an2-dl.nd { color: var(--faint); font-weight: 500; }
/* karty v mřížce (Marco 23. 10. 2026 večer): 12 sloupců × pole 100 px jako panely Přehledu; klient je přesouvá za ⠿ a mění rohem (analytika.js anEditBind),
   obsah se velikosti přizpůsobí (anFitCard): graf na plochu .an2-chw, sloupce vyplní .an2-fill, řádky v .an2-rows jen celé + „a další…“ (.an2-morel) */
.an2-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-rows: 100px; gap: 14px; margin-bottom: 14px; }
.an2-pc { min-width: 0; min-height: 0; position: relative; display: flex; }
.an2-pc > .card { flex: 1; min-width: 0; min-height: 0; height: auto; overflow: hidden; position: relative; }
.an2-card { margin: 0; min-width: 0; display: flex; flex-direction: column; gap: 12px; container-type: inline-size; }
.an2-chw { flex: 1; min-height: 0; position: relative; }
.an2-chw svg { display: block; }
.an2-behw { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: 12px; }
.an2-side .an2-behw { flex-direction: row; gap: 18px; align-items: stretch; }
.an2-side .an2-k3 { grid-template-columns: 1fr; gap: 6px; width: 150px; flex: none; align-content: start; }
.an2-side .an2-k3 b { font-size: .95rem; }
.an2-side .an2-k3 small { display: none; }
.an2-fill { flex: 1; min-height: 0; }
.an2-fill .an2-vbc .bars { height: var(--an-bh, 92px); }
.an2-rows { flex: 1; min-height: 0; overflow: hidden; }
.an2-cut { display: none !important; }
.an2-morel { position: absolute; right: 12px; bottom: 9px; z-index: 1; font-size: .74rem; padding: .12rem .6rem .18rem; border-radius: 999px;
  background: var(--btn-bg); border: 1px solid var(--card-line); box-shadow: var(--btn-shadow); }
.an2-morel[hidden] { display: none; }
.an2-grid.edit .an2-morel { right: 34px; }   /* v úpravách nepřekrývá roh pro změnu velikosti */
/* přeplněná karta (nízká nebo úzká): hustší sazba, aby se obsah vešel */
.an2-tight .an2-tr { min-height: 32px; font-size: .8rem; }
.an2-tight .an2-tr.hd { min-height: 24px; }
.an2-tight .an2-tr.a { min-height: 36px; }
.an2-tight .an2-hb { gap: 4px 8px; font-size: .74rem; }
.an2-tight .an2-two { gap: 12px; }
.an2-tight .an2-two .lab { margin-bottom: 4px; }
.an2-tight .an2-k3 b { font-size: .95rem; }
.an2-tight .an2-ret { padding: 6px 0; }
.an2-tight .an2-natb { gap: 14px; }
.an2-tight .an2-nfoot { padding-top: 6px; }
.an2-tight.an2-card { gap: 8px; }
/* režim úprav rozložení: úchyty ⠿, tažená kopie, lišta s tlačítky */
.an2-grip, .an2-tgrip { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; flex: none; color: var(--acc); cursor: grab; touch-action: none; user-select: none; -webkit-user-select: none; }
.an2-grip svg, .an2-tgrip svg { width: 18px; height: 18px; }
.an2-grip svg circle, .an2-tgrip svg circle { fill: currentColor; stroke: none; }
.an2-tgrip { position: absolute; top: 8px; right: 8px; }
.an2-kp.edit { cursor: default; border-color: var(--acc); }
.an2-kp.edit:hover { transform: none; }
.an2-kp.dragging { opacity: .35; border-style: dashed; }
.an2-grid.edit .an2-pc > .card { border-color: var(--acc); }
.an2-grip { border-radius: 7px; background: var(--acc-soft); }
.an2-rs { position: absolute; right: 7px; bottom: 7px; z-index: 3; width: 26px; height: 26px; border-radius: 8px; background: var(--acc); color: #fff; display: inline-flex; align-items: center; justify-content: center;
  cursor: nwse-resize; touch-action: none; user-select: none; -webkit-user-select: none; box-shadow: 0 4px 12px rgba(36,58,110,.25); }
.an2-rs svg { width: 14px; height: 14px; }
.an2-rs:hover { filter: brightness(1.08); }
.an2-pc.an2-ghost > .card { opacity: .3; border-style: dashed; background: var(--acc-soft); }
.an2-pc.an2-ghost > .an2-rs { display: none; }
.an2-pc.an2-sizing > .card { border-color: var(--acc); box-shadow: 0 0 0 3px color-mix(in srgb, var(--acc) 25%, transparent); }
.an2-grid.edit .an2-clk { cursor: default; }
.an2-grid.edit .an2-clk:hover { transform: none; }
.an2-ebar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 14px; border-radius: 14px; background: var(--acc-soft); border: 1px dashed color-mix(in srgb, var(--acc) 50%, transparent); font-size: .84rem; }
.an2-ebar > svg { width: 16px; height: 16px; flex: none; color: var(--acc); }
.an2-ebar .sp { flex: 1; }
.an2-ebar .mini { margin: 0; width: auto; }
.an-editb svg { width: 15px; height: 15px; }
.an2-clk { cursor: pointer; transition: transform .16s, box-shadow .16s; }
.an2-clk:hover { transform: translateY(-1px); }
.an2-clk:hover .an2-more { color: var(--acc); }
.an2-ah { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; min-height: 34px; }
.an2-ah .px-st { margin: 0; }
.an2-ah .sp { flex: 1; }
.an2-more { display: inline-flex; align-items: center; gap: 2px; font-size: .8rem; font-weight: 600; color: var(--mut); }
.an2-more svg { width: 14px; height: 14px; }
.res-seg.an2-sm { margin: 0; flex: 0 0 auto; }
.res-seg.an2-sm button { flex: 0 0 auto; padding: .3rem .75rem; font-size: .78rem; }
.an2-card .lab, .an2-dlg .lab { font-size: .64rem; letter-spacing: .1em; text-transform: uppercase; color: var(--faint); font-weight: 600; }
/* roční graf */
.an2-ych { width: 100%; height: auto; display: block; overflow: visible; }
.an2-ych .gl { stroke: var(--hair); stroke-width: 1; opacity: .55; }
.an2-ych .ax { font-size: 11px; fill: var(--faint); }
.an2-ych .ax.on { fill: var(--acc); font-weight: 700; }
.an2-ych .area { fill: url(#anGa); }
.an2-ych .ln { fill: none; stroke: #3d7bff; stroke-width: 2.4; stroke-linejoin: round; stroke-linecap: round; }
.an2-ych .ln.fut { stroke-dasharray: 5 5; }
.an2-ych .ln.prev { stroke: var(--faint); stroke-width: 1.6; opacity: .75; }
.an2-ych .pt { fill: #3d7bff; stroke: #3d7bff; stroke-width: 2; }
.an2-ych .pt.fut { fill: var(--panel); }
.an2-ych .pt.sel { stroke-width: 3; filter: drop-shadow(0 0 6px #3d7bff); }
.an2-ych .hit { cursor: pointer; }
.an2-ych .hit:hover .pt { r: 6; }
.an2-ych .hit:hover rect { fill: var(--glass-row); }
.an2-ych .pk { font-size: 12px; font-weight: 700; fill: var(--ink); }
.an2-ych .pk { pointer-events: none; }
.an2-ych .pk.vl { font-size: 10.5px; font-weight: 600; fill: var(--mut); }   /* hodnota u každého bodu (24. 10. 2026) */
.an2-ych .pk.vl.fut { fill: var(--faint); }
.an2-lgd { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: .78rem; color: var(--mut); }
.an2-lgd span { display: inline-flex; align-items: center; gap: 7px; }
.an2-lgd .an2-lgi { width: 14px; height: 3px; border-radius: 2px; display: inline-block; }
.an2-lgd .an2-lgi.ln2 { background: var(--faint); }
.an2-lgd .an2-lgi.dsh { background: repeating-linear-gradient(90deg, #3d7bff 0 4px, transparent 4px 7px); }
.an2-mst { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 4px; }
.an2-mst button { display: flex; flex-direction: column; align-items: center; gap: 2px; width: auto; margin: 0; padding: 6px 0; border: 1px solid transparent; border-radius: 10px; background: transparent;
  box-shadow: none; color: var(--ink); font: inherit; cursor: pointer; font-variant-numeric: tabular-nums; min-width: 0; }
.an2-mst button span { font-size: .62rem; color: var(--faint); text-transform: uppercase; letter-spacing: .05em; }
.an2-mst button b { font-size: .78rem; font-weight: 600; white-space: nowrap; }
.an2-mst button.fut b { color: var(--mut); font-weight: 500; }
.an2-mst button:hover { background: var(--glass-row); }
.an2-mst button.on { background: var(--acc-soft); border-color: color-mix(in srgb, var(--acc) 40%, transparent); }
.an2-mst button.on span { color: var(--acc); }
/* řádky srovnané do sloupců */
.an2-tr { display: grid; align-items: center; column-gap: 12px; min-height: 40px; width: 100%; margin: 0; padding: 0 6px; box-sizing: border-box; border: 0; border-top: 1px solid var(--hair);
  border-radius: 0; background: transparent; box-shadow: none; color: var(--ink); font: inherit; font-size: .86rem; font-weight: 400; text-align: left; font-variant-numeric: tabular-nums; }
.an2-tr.hd { min-height: 28px; border-top: 0; font-size: .62rem; letter-spacing: .1em; text-transform: uppercase; color: var(--faint); font-weight: 600; }
.an2-tr.hd .on { color: var(--acc); }
.an2-tr .r { text-align: right; white-space: nowrap; }
.an2-tr .nm { display: flex; align-items: center; gap: 8px; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.an2-tr .nm b { overflow: hidden; text-overflow: ellipsis; }
.an2-dt { width: 10px; height: 10px; border-radius: 50%; display: inline-block; flex: none; }
button.an2-tr { cursor: pointer; }
button.an2-tr:hover { background: var(--glass-row); border-radius: 10px; }
.an2-tr.p { grid-template-columns: 10px minmax(0, 1fr) 52px 60px 46px 96px; }
.an2-tr.a { grid-template-columns: minmax(120px, 1.3fr) minmax(60px, 1fr) 50px 56px 90px 84px minmax(96px, .9fr); min-height: 46px; }
.an2-tr.a .pk2 { font-size: .78rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.an2-tr.sum { font-weight: 600; border-top: 1.5px solid var(--hair); }
.an2-th { width: auto; margin: 0; padding: 0; border: 0; background: transparent; box-shadow: none; color: inherit; font: inherit; letter-spacing: inherit; text-transform: inherit;
  display: inline-flex; align-items: center; gap: 4px; cursor: pointer; white-space: nowrap; }
.an2-th.r { justify-content: flex-end; width: 100%; }
.an2-th svg { width: 11px; height: 11px; }
.an2-th.on { color: var(--acc); }
span.an2-th { cursor: default; }
.an2-pbar { display: block; height: 7px; border-radius: 999px; background: var(--track); overflow: hidden; }
.an2-pbar i { display: block; height: 100%; border-radius: 999px; }
.an2-pseg { display: flex; gap: 3px; height: 14px; border-radius: 999px; overflow: hidden; }
.an2-pseg i { display: block; height: 100%; }
.an2-pseg.an2-pseg-lg { height: 18px; }   /* ne „.lg“ — to je globální třída přihlášení (výška celé obrazovky), 24. 10. 2026 */
/* národnosti */
.an2-natb { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 22px; align-items: center; }
.an2-dnt .cv { font-size: 26px; font-weight: 600; fill: var(--ink); }
.an2-dnt .cl { font-size: 11px; fill: var(--mut); }
.an2-dnt circle[data-tip]:hover { stroke-width: 19; }
.an2-tr.n { grid-template-columns: 10px minmax(0, 1fr) 48px 58px 54px; min-height: 36px; column-gap: 10px; }
.an2-tr.n.x { grid-template-columns: 10px minmax(0, 1fr) 46px 52px 48px 84px; }
.an2-tr.n .r.on { font-weight: 700; color: var(--ink); }
.an2-tr.n:not(.hd) .r:not(.on):not(.pct) { color: var(--mut); }
.an2-tr.n.oth { grid-template-columns: 10px minmax(0, 1fr) 48px 58px 54px 14px; margin-right: -24px; width: calc(100% + 24px); }
.an2-tr.n.x.oth { grid-template-columns: 10px minmax(0, 1fr) 46px 52px 48px 84px 14px; }
.an2-tr.n.oth > svg { width: 14px; height: 14px; color: var(--faint); }
.an2-tr.n.oth:hover > svg { color: var(--acc); }
.an2-nfoot { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; justify-content: space-between; font-size: .78rem; border-top: 1px solid var(--hair); padding-top: 10px; }
@container (max-width: 520px) { .an2-natb { grid-template-columns: 1fr; justify-items: center; } .an2-natb .an2-ntab { width: 100%; } .an2-tr.n.oth { margin-right: 0; width: 100%; } }
@container (max-width: 700px) { .an2-tr.a { grid-template-columns: minmax(110px, 1.2fr) minmax(50px, 1fr) 44px 50px 84px minmax(92px, .9fr); } .an2-tr.a > :nth-child(6) { display: none; } }
@container (max-width: 640px) { .an2-tr.a { grid-template-columns: minmax(100px, 1.2fr) minmax(50px, 1fr) 44px 50px 84px; } .an2-tr.a > :nth-child(6), .an2-tr.a > :nth-child(7) { display: none; } }
@container (max-width: 560px) { .an2-mst { grid-template-columns: repeat(6, minmax(0, 1fr)); } .an2-tr.p { grid-template-columns: 10px minmax(0, 1fr) 52px 60px 46px; } .an2-tr.p > :nth-child(6) { display: none; } }
@container (max-width: 440px) { .an2-k3:not(.an2-side .an2-k3) { grid-template-columns: 1fr 1fr; } .an2-k3 > div:nth-child(3) { grid-column: 1 / -1; } .an2-tr.a { grid-template-columns: minmax(90px, 1.2fr) 44px 50px 84px; } .an2-tr.a > :nth-child(2), .an2-tr.a > :nth-child(6), .an2-tr.a > :nth-child(7) { display: none; } }
/* sloupcové a vodorovné grafy */
.an2-two { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.an2-two .lab { margin-bottom: 8px; display: block; }
.an2-k3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.an2-k3 > div { display: flex; flex-direction: column; gap: 3px; }
.an2-k3 b { font-size: 1.05rem; font-weight: 600; }
.an2-k3 small { font-size: .72rem; }
.an2-hb { display: grid; grid-template-columns: max-content minmax(40px, 1fr) max-content max-content; gap: 7px 10px; align-items: center; font-size: .8rem; font-variant-numeric: tabular-nums; }
.an2-hb.nx { grid-template-columns: max-content minmax(40px, 1fr) max-content; }
.an2-hbr { display: contents; }
.an2-hbr .l { display: flex; align-items: center; gap: 7px; white-space: nowrap; max-width: 16rem; overflow: hidden; text-overflow: ellipsis; }
.an2-hbr .b { height: 9px; border-radius: 999px; background: var(--track); overflow: hidden; }
.an2-hbr .b i { display: block; height: 100%; border-radius: 999px; }
.an2-hbr .v { text-align: right; font-weight: 600; white-space: nowrap; }
.an2-hbr .x { text-align: right; color: var(--mut); font-size: .74rem; white-space: nowrap; }
.an2-vb { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 6px; align-items: end; }
.an2-vbc { display: flex; flex-direction: column; align-items: stretch; gap: 4px; }
.an2-vbc em { font-style: normal; font-size: .64rem; font-weight: 600; color: var(--mut); text-align: center; white-space: nowrap; font-variant-numeric: tabular-nums; min-height: 1em; }
.an2-vb.many .an2-vbc em { font-size: .58rem; }
.an2-vbc em small { display: block; font-size: .58rem; font-weight: 500; color: var(--faint); }   /* podíl v % pod počtem (Kdy hosté rezervují) */
.an2-mt tr.an2-futr td { color: var(--faint); }
.an2-lgrow { display: flex; align-items: center; gap: 12px; } .an2-lgrow .an2-lgd { flex: 1; min-width: 0; } .an2-lgrow .an2-more { cursor: pointer; flex: none; }
.an2-vbc .bars { height: 92px; display: flex; align-items: flex-end; justify-content: center; gap: 2px; }
.an2-vbc .bars > i { width: 100%; max-width: 22px; border-radius: 4px 4px 1px 1px; min-height: 2px; opacity: .85; }
.an2-vbc .bars > i.pv { background: var(--faint); opacity: .28; }
.an2-vbc.hi .bars > i:not(.pv) { opacity: 1; box-shadow: 0 0 0 2px color-mix(in srgb, var(--acc) 35%, transparent); }
.an2-vbc > span { font-size: .66rem; text-align: center; color: var(--faint); white-space: nowrap; }
.an2-vbc.hi > span { color: var(--acc); font-weight: 700; }
.an2-vbc:hover .bars > i:not(.pv) { opacity: 1; }
.an2-vb.stk .bars .st { width: 100%; max-width: 26px; height: 100%; display: flex; flex-direction: column-reverse; border-radius: 4px; overflow: hidden; }
.an2-vb.stk .bars { height: var(--an-bh, 92px); }
.an2-vb.stk .bars .st { max-width: 40px; height: auto; min-height: 2px; }   /* výška = noci v měsíci (24. 10. 2026) */
.an2-vb.stk .bars .st i { display: flex; align-items: center; justify-content: center; width: 100%; overflow: hidden; }
.an2-vb.stk .bars .st i b { font-size: .6rem; font-weight: 700; color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,.35); white-space: nowrap; }
.an2-vb.stk .an2-vbc.fut .st { opacity: .5; }
.an2-vb.stk .an2-vbc em { font-size: .66rem; color: var(--ink); }
.an2-vb.stk + .an2-lgd { margin-top: 12px; }
/* vracející se hosté */
.an2-rets { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 22px; }
.an2-ret { display: flex; align-items: center; gap: 10px; padding: 9px 0; border-top: 1px solid var(--hair); min-width: 0; }
.an2-ret .tx { display: flex; flex-direction: column; min-width: 110px; font-size: .86rem; }
.an2-ret .tx .who { font-size: .74rem; }
.an2-ret .sts { display: flex; flex-wrap: wrap; gap: 4px; justify-content: flex-end; flex: 1; }
/* užší karta: dva sloupce pod sebe (musí být AŽ ZA pravidly .an2-two a .an2-rets — stejná váha, platí pozdější) */
@container (max-width: 460px) { .an2-two { grid-template-columns: 1fr; gap: 16px; } }
@container (max-width: 640px) { .an2-rets { grid-template-columns: 1fr; } }
/* okno detailu — poloprůhledné mléčné sklo */
.px-modal.an2-dlg { max-width: 1000px; background: color-mix(in srgb, var(--panel) 66%, transparent); -webkit-backdrop-filter: blur(34px) saturate(1.8); backdrop-filter: blur(34px) saturate(1.8);
  border: 1px solid var(--glass-edge); }
.px-modal.an2-dlg.an2-dlg-s { max-width: 560px; }
.an2-dlg .px-dlg-logo { display: none; }
.an2-db { display: flex; flex-direction: column; gap: 14px; }
.an2-dsub { margin: -6px 0 0 !important; }
.an2-dk { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.an2-dk > div { display: flex; flex-direction: column; gap: 3px; padding: 12px 14px; border-radius: 14px; background: var(--glass-in-bg); border: 1px solid var(--glass-in-line); min-width: 0; }
.an2-dk b { font-size: 1.2rem; font-weight: 600; letter-spacing: -.02em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-variant-numeric: tabular-nums; }
.an2-dk small { font-size: .72rem; }
.an2-dbox { padding: 14px 16px; border-radius: 16px; background: color-mix(in srgb, var(--glass-in-bg) 70%, transparent); border: 1px solid var(--glass-in-line); display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.an2-dbox > .lab .who { text-transform: none; letter-spacing: 0; }
.an2-dg2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.an2-dlg table.t td { font-variant-numeric: tabular-nums; }
.an2-dlg table.t .r { text-align: right; }
.an2-dlg table.t .nm { display: flex; align-items: center; gap: 8px; }
.an2-dlg table.t tr.sum td { border-top: 1.5px solid var(--hair); }
.an2-heat .hc { text-align: center; font-size: .76rem; font-weight: 600; border-radius: 6px; padding: 8px 2px; background: color-mix(in srgb, #3d7bff calc(var(--h) * 78%), transparent);
  border: 2px solid transparent; background-clip: padding-box; }
.an2-heat .hc.fut { outline: 1px dashed color-mix(in srgb, #3d7bff 55%, transparent); outline-offset: -3px; }
.an2-heat .hc.na { background: transparent; color: var(--faint); font-weight: 400; }
.an2-heat th { text-align: center; }
.an2-heat th:first-child { text-align: left; }
.an2-heat td { border-top: 0 !important; padding: 0 !important; }
.an2-heat td:first-child { padding-right: 10px !important; }
.an2-dtools { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.an2-dtools .an2-fsrch { flex: 1; min-width: 200px; }
.an2-iso { display: inline-flex; align-items: center; justify-content: center; min-width: 32px; height: 20px; padding: 0 5px; border-radius: 6px; font-size: .66rem; font-weight: 700; letter-spacing: .04em; background: var(--neu-bg); color: var(--mut); }
.an2-shr { display: inline-grid; grid-template-columns: 70px 52px; align-items: center; gap: 8px; }
.an2-src p { margin: 0 0 .7rem; line-height: 1.55; }
.an2-tip { position: fixed; z-index: 10000; pointer-events: none; max-width: 300px; padding: 7px 11px; border-radius: 10px; background: rgba(24,25,32,.92); color: #f5f5f7; font-size: .76rem; font-weight: 600;
  line-height: 1.4; box-shadow: 0 10px 30px rgba(0,0,0,.25); opacity: 0; transition: opacity .1s; }
.an2-tip.on { opacity: 1; }
@media (max-width: 1180px) { .an2-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); } .an2-kp .kv { font-size: 1.4rem; } }
@media (max-width: 920px) {
  .an2-top { gap: 8px; }
  .an2-top .an-tt { flex: 1 1 calc(100% - 64px); min-width: 0; }
  .an2-top .sp { display: none; }
  .an2-top .an-srcb { order: 1; }
  .an2-top .an-mode { order: 2; }
  .an2-top .an-stepper { order: 3; margin-left: auto; }
  .an2-top .an-now { display: none; }
  .an2-fwrap { order: 4; flex: 1 1 100%; }
  .an2-afb { width: 100%; justify-content: flex-start; }
  .an2-afb > svg:last-child { margin-left: auto; }
  .an2-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .an2-kp { padding: 11px 12px 9px; }
  .an2-kp .kv { font-size: 1.3rem; }
  .an2-kp .kl { font-size: .6rem; letter-spacing: .06em; }
  .an2-kp .ks { font-size: .7rem; }
  .an2-grid { display: flex; flex-direction: column; gap: 10px; }
  .an2-pc { display: block; }
  .an2-pc > .card { overflow: visible; height: auto; }
  .an2-morel, .an-editb, .an2-ebar, .an2-grip, .an2-tgrip, .an2-rs { display: none !important; }
  .an2-ah .res-seg.an2-sm, .an2-dtools .res-seg.an2-sm { width: 100%; order: 5; display: flex; flex-wrap: nowrap; }
  .an2-top .an-srcb span { display: none; }
  .an2-top .an-srcb { padding: .45rem .55rem; }
  .an2-ah .res-seg.an2-sm button { flex: 1; padding: .35rem .3rem; }
  .an2-mst { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .an2-tr.p { grid-template-columns: 10px minmax(0, 1fr) 44px 50px 40px; }
  .an2-tr.p > :nth-child(6) { display: none; }
  .an2-tr.a { grid-template-columns: minmax(0, 1fr) 46px 50px 76px; }
  .an2-tr.a > :nth-child(2), .an2-tr.a > :nth-child(6), .an2-tr.a > :nth-child(7) { display: none; }
  .an2-tr.n, .an2-tr.n.oth { grid-template-columns: 10px minmax(0, 1fr) 42px 52px 48px; margin-right: 0; width: 100%; }
  .an2-tr.n.oth > svg { display: none; }
  .an2-tr.n.x, .an2-tr.n.x.oth { grid-template-columns: 10px minmax(0, 1fr) 40px 46px 70px; }
  .an2-tr.n.x > :nth-child(5) { display: none; }
  .an2-two, .an2-rets, .an2-dg2 { grid-template-columns: 1fr; }
  .an2-dk { grid-template-columns: 1fr 1fr; gap: 8px; }
  .an2-dk > div { padding: 10px 12px; }
  .an2-dk b { font-size: 1.05rem; }
  .an2-vb.many .an2-vbc em { display: none; }
  .an2-dtools .res-seg.an2-sm { width: 100%; }
  .an2-dtools .res-seg.an2-sm button { flex: 1; }
  .an2-ret { flex-wrap: wrap; }
  .an2-ret .sts { justify-content: flex-start; flex-basis: 100%; }
  .an2-shr { grid-template-columns: 40px 48px; }
  .px-modal.an2-dlg, .px-modal.an2-dlg.an2-dlg-s { max-width: none; }
}

/* ============================================================
   Úklidy — návrh 6 „Kombinace“ (PC) + telefon řešení A „Kompaktní“ (Marco 24. 10. 2026; plátno 4r9JmSUw…, klikací verze ExmsFm2Z…).
   Třídy u6-* (PC i telefon), u6m-* jen telefon. Plochy = mléčné sklo (--glass-*), nikdy --well. Telefonní úpravy jen za branou ≤ 920 px.
   ============================================================ */
/* reset globálního tlačítka (width 100 %, modré pozadí) pro drobné ovladače sekce */
.u6-chev, .u6-done, .u6-dst, .u6-more, .u6-pmenu button, .u6-chp, .u6-badd, .u6-chipb, .u6-stp button, .u6-itc button, .u6-itadd button, .u6-lnk, .u6-ib,
.u6-latechip, .u6-vnav > button, .u6m-ib, .u6m-pill, .u6m-chk, .u6m-abk, .u6-mbc {
  width: auto; margin: 0; padding: 0; border: 0; background: transparent; box-shadow: none; color: var(--ink); font: inherit; font-weight: 500; cursor: pointer; }
.u6-i { width: 14px; height: 14px; flex: none; }
.u6-lab { font-size: 11px; letter-spacing: 1.1px; text-transform: uppercase; font-weight: 700; color: var(--mut); white-space: nowrap; }
.u6-lab.acc { color: var(--acc); }
.u6-strike { text-decoration: line-through; color: var(--faint) !important; }
.u6-hint { margin: .45rem 0 0; font-size: .78rem; line-height: 1.45; }
.u6-cps .tag, .u6-sec .tag, .u6-dlg .tag, .u6-sheet .tag, .u6m-c .tag, .u6-row .tag, .u6-dayw .tag, .u6m-hero .tag { display: inline-flex; align-items: center; gap: 4px; }
.tag .u6-i { width: 12px; height: 12px; }
.tag.u6-eq { background: var(--neu-bg); color: var(--ink); font-weight: 500; } .tag.u6-eq .u6-i { color: var(--ok); }
/* stavový čtverec */
.u6-sq { width: 36px; height: 36px; border-radius: 10px; flex: none; display: inline-flex; align-items: center; justify-content: center; background: var(--neu-bg); color: var(--mut); }
.u6-sq .u6-i { width: 16px; height: 16px; }
.u6-sq.s { width: 30px; height: 30px; border-radius: 9px; } .u6-sq.s .u6-i { width: 14px; height: 14px; }
.u6-sq.ok { background: var(--ok-bg); color: var(--ok); } .u6-sq.err { background: var(--err-bg); color: var(--err); } .u6-sq.warn { background: var(--warn-bg); color: var(--warn); }
.u6-sq.acc { background: var(--acc-soft); color: var(--acc); } .u6-sq.neu { background: var(--neu-bg); color: var(--mut); }
.k-next { --kc: var(--acc); --kb: var(--acc-soft); } .k-today { --kc: var(--warn-dot); --kb: var(--warn-bg); } .k-late { --kc: var(--err-dot); --kb: var(--err-bg); }
.k-done { --kc: var(--ok-dot); --kb: var(--ok-bg); } .k-cancel { --kc: var(--faint); --kb: var(--neu-bg); }

/* ---------- horní karta: šipka rozbalení vždy vpravo nahoře v tabuli ---------- */
.cl-gp.u6-pan { position: relative; }
.u6-chev { position: absolute; top: 12px; right: 12px; width: 32px; height: 32px; border-radius: 999px; border: 1px solid var(--btn-line); background: var(--btn-bg); box-shadow: var(--btn-shadow);
  display: inline-flex; align-items: center; justify-content: center; color: var(--ink); }
.u6-chev svg { width: 16px; height: 16px; transition: transform .25s cubic-bezier(.4,0,.2,1); } .u6-chev.op svg { transform: rotate(180deg); }
.u6-pan:has(> .u6-chev) > .cl-ch, .u6-pan:has(> .u6-chev) > .cl-mh { padding-right: 42px; }
.u6-mtabs { margin-top: .6rem; } .u6-mtabs .res-seg { margin: 0; }
@media (prefers-reduced-motion: reduce) { .u6-chev svg { transition: none; } }

/* ---------- karta seznamu a lišta filtrů ---------- */
.card.u6-lc { padding: 18px 20px; display: flex; flex-direction: column; gap: 16px; }
.u6-tb { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.u6-tb .sp { flex: 1; }
.u6-tb .res-seg, .u6m-seg .res-seg { margin: 0; flex: none; flex-wrap: nowrap; }
.u6-fseg button { flex: none; padding: .42rem .95rem; }
.u6-fseg button.zero { opacity: .55; }
.u6-vseg button { flex: none; display: inline-flex; align-items: center; gap: 6px; padding: .4rem .85rem; }
.u6-sel { width: auto !important; height: 34px !important; border-radius: 999px; padding: 0 30px 0 13px; font-size: .8rem; font-weight: 600; background-color: var(--glass-in-bg); border-color: var(--glass-in-line); }
.u6-latechip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px 6px 9px; border: 1px solid color-mix(in srgb, var(--err-dot) 30%, transparent); border-radius: 999px;
  background: var(--err-bg); color: var(--err); font-size: .8rem; font-weight: 600; white-space: nowrap; }
.u6-latechip svg { width: 14px; height: 14px; }
.u6-legend { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; font-size: .76rem; color: var(--mut); }
.u6-legend span { display: inline-flex; align-items: center; gap: 5px; } .u6-legend i { width: 10px; height: 10px; border-radius: 3px; display: inline-block; background: var(--kc); }
.u6-grp { display: flex; flex-direction: column; gap: 8px; }
.u6-gh { display: flex; align-items: center; gap: 8px; padding: 0 8px; scroll-margin-top: 80px; }
.u6-ghr { font-size: .76rem; color: var(--faint); margin-left: auto; text-align: right; }
.u6-div { display: flex; align-items: center; gap: 10px; margin-top: 4px; }
.u6-div::after { content: ''; order: 1; flex: 1; height: 1px; background: var(--hair); }
.u6-div .u6-lab { color: var(--faint); } .u6-div .u6-ghr { order: 2; margin: 0; }
.u6-rows { padding: 4px 6px; border-radius: 16px; background: var(--glass-bg); border: 1px solid var(--glass-edge); box-shadow: var(--glass-shadow); }
.u6-late { border-color: color-mix(in srgb, var(--err-dot) 38%, transparent); }
.u6-lateh { display: flex; align-items: center; gap: 12px; padding: 10px 12px; }
.u6-lateh .tx { flex: 1; min-width: 0; } .u6-lateh b { display: block; font-size: .92rem; } .u6-lateh .tx span { font-size: .8rem; color: var(--mut); }
.u6-lateh .mini { display: inline-flex; align-items: center; gap: .35rem; } .u6-lateh .mini svg { width: 14px; height: 14px; }
.u6-moreb { align-self: center; }
.u6-empty { display: flex; align-items: center; justify-content: center; gap: .7rem; flex-wrap: wrap; padding: 22px; text-align: center; border: 1px dashed var(--hair); border-radius: 16px; }
.u6-empty .cl-tg svg { width: 13px; height: 13px; }
/* řádek úklidu */
.u6-row { position: relative; display: grid; grid-template-columns: 36px 150px 150px 200px minmax(0, 1fr) auto; align-items: center; gap: 16px; padding: 11px 12px; border-radius: 12px; cursor: pointer; }
.u6-row + .u6-row { border-top: 1px solid var(--hair); border-radius: 0; }
@media (hover: hover) { .u6-row:hover { background: var(--glass-row); } }
.u6-row.past > :not(.u6-ra) { opacity: .68; }
.u6-ap { min-width: 0; } .u6-ap b { display: block; font-size: .92rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.u6-ap span { display: block; font-size: .76rem; color: var(--mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.u6-wh { display: flex; flex-direction: column; gap: 5px; min-width: 0; } .u6-wh > b { font-size: .88rem; white-space: nowrap; font-variant-numeric: tabular-nums; }
.u6-dl { font-size: .72rem; font-weight: 600; color: var(--err); white-space: nowrap; }
.u6-arr { display: inline-flex; align-items: center; gap: 5px; font-size: .8rem; color: var(--mut); white-space: nowrap; } .u6-arr b { color: var(--ink); } .u6-arr .u6-i { color: var(--faint); }
.u6-arr.fa { color: var(--faint); }
.u6-cps { display: flex; flex-wrap: wrap; gap: 6px; min-width: 0; }
.u6-ra { display: flex; align-items: center; justify-content: flex-end; gap: 4px; min-width: 170px; }
.u6-db { position: relative; display: block; height: 6px; border-radius: 99px; background: var(--neu-bg); }
.u6-db > i { position: absolute; top: 0; bottom: 0; border-radius: 99px; background: var(--kc); }
.u6-db > i.open { background: linear-gradient(90deg, var(--kc), transparent); }
.u6-db > em { position: absolute; top: -3px; bottom: -3px; width: 2px; margin-left: -1px; border-radius: 2px; background: var(--ink); }
.u6-db > u { position: absolute; top: -4px; bottom: -4px; width: 1.5px; background: var(--err-dot); }
.u6-done { display: inline-flex; align-items: center; gap: 7px; padding: 6px 13px 6px 8px; border-radius: 999px; border: 1px solid var(--btn-line); background: var(--btn-bg); box-shadow: var(--btn-shadow);
  font-size: .8rem; font-weight: 600; white-space: nowrap; }
.u6-ring { width: 17px; height: 17px; border-radius: 50%; border: 1.8px solid var(--hair); flex: none; box-sizing: border-box; }
.u6-done.late .u6-ring { border-color: var(--err-dot); } .u6-done.today .u6-ring { border-color: var(--warn-dot); }
.u6-dst { display: inline-flex; align-items: center; gap: 6px; padding: 4px 8px 4px 4px; border-radius: 999px; font-size: .8rem; color: var(--mut); white-space: nowrap; }
@media (hover: hover) { .u6-dst:hover { background: var(--neu-bg); } }
.u6-dt { font-variant-numeric: tabular-nums; }
.u6-okc { width: 20px; height: 20px; border-radius: 50%; background: linear-gradient(180deg, #3ddc75, #22a654); display: inline-flex; align-items: center; justify-content: center; flex: none; color: #fff; }
.u6-okc svg { width: 11px; height: 11px; }
.u6-mw { position: relative; }
.u6-more { width: 32px; height: 32px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center; color: var(--mut); }
.u6-more svg { width: 16px; height: 16px; } @media (hover: hover) { .u6-more:hover { background: var(--neu-bg); color: var(--ink); } }
.u6-pmenu { position: absolute; right: 0; top: calc(100% + 4px); z-index: 20; min-width: 220px; padding: 6px; border-radius: 14px; display: flex; flex-direction: column;
  background: color-mix(in srgb, var(--panel) 88%, transparent); -webkit-backdrop-filter: blur(24px) saturate(1.6); backdrop-filter: blur(24px) saturate(1.6);
  border: 1px solid var(--glass-edge); box-shadow: 0 20px 50px rgba(0,0,0,.22); cursor: default; }
.u6-pmenu button { display: flex; align-items: center; gap: 9px; padding: 9px 10px; border-radius: 9px; font-size: .84rem; text-align: left; white-space: nowrap; }
@media (hover: hover) { .u6-pmenu button:hover { background: var(--neu-bg); } }
.u6-pmenu button.err { color: var(--err); } .u6-pmenu .u6-i { color: var(--mut); } .u6-pmenu button.err .u6-i { color: var(--err); }

/* ---------- týdenní tabule a časová osa dne ---------- */
.u6-board { display: grid; min-width: 760px; } .u6-board.month { min-width: 900px; } .u6-board > div { min-width: 0; }
.u6-bh { padding: 8px 8px 7px; display: flex; flex-direction: column; gap: 1px; border-radius: 12px 12px 0 0; }
.u6-bh small { font-size: 10px; letter-spacing: 1px; text-transform: uppercase; font-weight: 700; color: var(--faint); } .u6-bh b { font-size: .94rem; font-weight: 600; }
.u6-bh.td { background: var(--acc-soft); } .u6-bh.td small { color: var(--acc); } .u6-bh.ps b { color: var(--mut); } .u6-bh.dim { opacity: .45; }
.u6-bhl { justify-content: flex-end; } .u6-bhl span { font-size: 10px; letter-spacing: 1px; text-transform: uppercase; font-weight: 700; color: var(--faint); }
.u6-bl { padding: 8px 10px; border-top: 1px solid var(--hair); display: flex; align-items: center; gap: 8px; min-width: 0; }
.u6-bl > div { min-width: 0; } .u6-bl b { display: block; font-size: .85rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.u6-bl > div > span { display: block; font-size: .7rem; color: var(--mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.u6-bc { padding: 5px 4px; border-top: 1px solid var(--hair); display: flex; flex-direction: column; gap: 4px; min-height: 54px; }
.u6-bc.td { background: var(--acc-soft); } .u6-bc.dim > * { opacity: .38; }
.u6-badd { flex: 1; min-height: 42px; border-radius: 10px; border: 1.4px dashed transparent; color: var(--acc); font-size: .76rem; font-weight: 600; display: flex; align-items: center; justify-content: center; gap: 4px; opacity: 0; }
.u6-badd svg { width: 12px; height: 12px; }
.u6-bc:hover .u6-badd, .u6-badd:focus-visible { opacity: 1; border-color: var(--acc); }
.u6-chp { width: 100%; text-align: left; padding: 6px 8px; border-radius: 10px; border: 1px solid transparent; background: var(--kb); display: flex; flex-direction: column; gap: 2px; color: var(--ink); }
.u6-chp .t { display: flex; align-items: center; gap: 4px; font-size: .78rem; font-weight: 700; white-space: nowrap; } .u6-chp .t svg { color: var(--kc); width: 12px; height: 12px; flex: none; }
.u6-chp .t .x { margin-left: auto; display: flex; } .u6-chp .t .x svg { color: var(--mut); width: 11px; height: 11px; }
.u6-chp .s { font-size: .7rem; color: var(--mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.u6-chp .s.err { color: var(--err); font-weight: 600; } .u6-chp .s.warn { color: var(--warn); font-weight: 600; } .u6-chp .s.acc { color: var(--acc); font-weight: 600; }
.u6-chp.past { opacity: .72; } @media (hover: hover) { .u6-chp:hover { border-color: var(--kc); } }
.u6-chp.dot { padding: 0; height: 22px; border-radius: 6px; align-items: center; justify-content: center; } .u6-chp.dot svg { color: var(--kc); width: 12px; height: 12px; }
.u6-bf { padding: 8px; border-top: 2px solid var(--hair); } .u6-bf b { font-size: .78rem; } .u6-bf span { display: block; font-size: .7rem; color: var(--mut); }
.u6-bf.td { background: var(--acc-soft); border-radius: 0 0 12px 12px; }
.u6-board.month .u6-bh { padding: 6px 2px; align-items: center; } .u6-board.month .u6-bh b { font-size: .76rem; } .u6-board.month .u6-bh small { font-size: 8.5px; }
.u6-board.month .u6-bc { padding: 4px 2px; min-height: 40px; } .u6-board.month .u6-bf { padding: 6px 2px; text-align: center; }
.u6-ava { flex: none; border-radius: 50%; color: #fff; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; letter-spacing: .02em; }
.u6-dayw { display: flex; gap: 16px; align-items: flex-start; }
.cl-gp.u6-dtl { flex: 1; min-width: 0; padding: 14px 12px 12px; }
.u6-dtl .ax { display: flex; gap: 12px; align-items: flex-end; } .u6-dtl .ax .lb { width: 160px; flex: none; } .u6-dtl .ax .ac { width: 120px; flex: none; }
.u6-dtl .trk { position: relative; flex: 1; min-width: 0; }
.u6-dtl .hrs { position: relative; height: 22px; } .u6-dtl .hrs span { position: absolute; transform: translateX(-50%); font-size: .7rem; color: var(--faint); white-space: nowrap; }
.u6-dtl .hrs span:first-child { transform: none; }
.u6-dtl .nowt { position: absolute; top: -3px; transform: translateX(-50%); padding: 1px 6px; border-radius: 6px; background: var(--err-dot); color: #fff !important; font-size: .66rem !important; font-weight: 700; z-index: 1; }
.u6-ln { display: flex; align-items: center; gap: 12px; border-top: 1px solid var(--hair); cursor: pointer; }
@media (hover: hover) { .u6-ln:hover { background: var(--glass-row); } }
.u6-ln .lb { width: 160px; flex: none; padding: 8px 10px; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.u6-ln .lb b { font-size: .85rem; } .u6-ln .lb > span:not(.tag) { font-size: .7rem; color: var(--mut); } .u6-ln .lb .tag { align-self: flex-start; margin-top: 3px; }
.u6-ln .trk { position: relative; flex: 1; min-width: 0; height: 58px; }
.u6-ln .gl { position: absolute; top: 0; bottom: 0; width: 1px; background: var(--hair); }
.u6-ln .bar2 { position: absolute; top: 14px; height: 30px; box-sizing: border-box; border-radius: 9px; background: var(--kb); border: 1px solid var(--kc); display: flex; align-items: center; gap: 6px; padding: 0 10px;
  font-size: .76rem; font-weight: 600; color: var(--kc); white-space: nowrap; overflow: hidden; }
.u6-ln .bar2.open { border-color: transparent; background: linear-gradient(90deg, var(--kb), transparent); }
.u6-ln .bar2 svg { width: 12px; height: 12px; flex: none; }
.u6-ln .inm { position: absolute; top: 8px; bottom: 8px; width: 2px; margin-left: -1px; border-radius: 2px; background: var(--ink); }
.u6-ln .inl { position: absolute; top: 19px; font-size: .76rem; color: var(--mut); white-space: nowrap; display: flex; align-items: center; gap: 4px; } .u6-ln .inl b { color: var(--ink); }
.u6-ln .nowl { position: absolute; top: 0; bottom: 0; width: 2px; margin-left: -1px; background: var(--err-dot); }
.u6-ln .ac { width: 120px; flex: none; display: flex; justify-content: flex-end; padding-right: 4px; }
.u6-free { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; padding: 12px 10px 2px; border-top: 1px solid var(--hair); font-size: .8rem; color: var(--mut); }
.u6-pill { padding: 2px 8px; border-radius: 7px; background: var(--neu-bg); font-size: .76rem; font-weight: 600; color: var(--ink); white-space: nowrap; }
.cl-gp.u6-summ { width: 310px; flex: none; display: flex; flex-direction: column; gap: 4px; }
.u6-si { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-top: 1px solid var(--hair); }
.u6-si .tx { flex: 1; min-width: 0; } .u6-si .tx b { display: block; font-size: .85rem; } .u6-si .tx span { font-size: .76rem; color: var(--mut); }
.u6-si .u6-done .u6-dt, .u6-ln .u6-done .u6-dt { display: none; } .u6-si .u6-done, .u6-ln .u6-done { padding: 6px; }
.u6-tom { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--hair); }
.u6-nr { display: flex; align-items: center; gap: 8px; font-size: .8rem; padding: 4px 0; } .u6-nr .sp { flex: 1; }

/* ---------- okno detailu a Přidat úklid — mléčné sklo ---------- */
.px-modal.u6-glass { background: color-mix(in srgb, var(--panel) 62%, transparent); -webkit-backdrop-filter: blur(36px) saturate(1.8); backdrop-filter: blur(36px) saturate(1.8);
  border: 1px solid var(--glass-edge); box-shadow: var(--glass-shadow), 0 30px 80px rgba(0,0,0,.22); }
.px-modal.u6-glass input:not([type="checkbox"]):not([type="radio"]), .px-modal.u6-glass select, .px-modal.u6-glass textarea { background-color: var(--glass-in-bg); border-color: var(--glass-in-line); }
.px-modal.u6-dlg { max-width: 1040px; }
.u6-dlg .px-modal-a { display: none; }
.u6-glass .px-dlg-logo { display: none; }
.u6-dlg .px-modal-h > .u6-sq { width: 38px; height: 38px; }
.u6-shd { flex: none; } .u6-shd .res-seg { margin: 0; flex-wrap: nowrap; } .u6-shd .res-seg button { flex: none; padding: .38rem .9rem; }
.u6-dsub { margin: -4px 0 .9rem !important; font-size: .84rem; color: var(--mut); }
.u6-ec2 { display: grid; grid-template-columns: 1fr 1fr; } .u6-ec2 > div { padding: 0 20px; min-width: 0; display: flex; flex-direction: column; gap: 18px; }
.u6-ec2 > div:first-child { padding-left: 0; } .u6-ec2 > div:last-child { padding-right: 0; border-left: 1px solid var(--hair); }
.u6-stack { display: flex; flex-direction: column; gap: 18px; }
.u6-eh { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; font-size: .86rem; font-weight: 600; } .u6-eh .u6-i { color: var(--acc); }
.u6-eh .r { margin-left: auto; font-size: .74rem; font-weight: 400; color: var(--mut); }
.u6-eb textarea { min-height: 84px; resize: vertical; line-height: 1.45; }
.u6-tln { display: flex; align-items: flex-start; gap: 4px; margin-bottom: 12px; }
.u6-tln .nd { width: 92px; flex: none; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 3px; }
.u6-tln .nd b { font-size: .88rem; font-variant-numeric: tabular-nums; } .u6-tln .nd > span:last-child { font-size: .72rem; color: var(--mut); white-space: nowrap; }
.u6-tln .md { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 7px; padding-top: 11px; }
.u6-tln .md i { display: block; width: 100%; height: 8px; border-radius: 99px; background: var(--kc); } .u6-tln .md i.open { background: linear-gradient(90deg, var(--kc), transparent); }
.u6-tln .md span { font-size: .76rem; font-weight: 600; white-space: nowrap; }
.u6-tgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
label.u6-fld { display: flex; flex-direction: column; gap: 4px; margin: 0; font-size: .78rem; }
label.u6-fld .who { font-weight: 400; }
.u6-pr { display: flex; align-items: center; gap: 10px; padding: 7px 0; border-top: 1px solid var(--hair); } .u6-pr:first-of-type { border-top: 0; }
.u6-pr .l { flex: 1; min-width: 0; } .u6-pr .l b { display: block; font-size: .86rem; } .u6-pr .l span { font-size: .74rem; color: var(--mut); }
.u6-pr.tot { padding-top: 9px; } .u6-pr.tot b { font-size: .82rem; }
.u6-stp { display: inline-flex; align-items: center; gap: 2px; padding: 2px; border-radius: 999px; background: var(--glass-in-bg); border: 1px solid var(--glass-in-line); flex: none; }
.u6-stp button { width: 30px; height: 30px; border-radius: 999px; display: flex; align-items: center; justify-content: center; }
.u6-stp button svg { width: 14px; height: 14px; }
@media (hover: hover) { .u6-stp button:hover { background: var(--neu-bg); } } .u6-stp button:disabled { opacity: .35; }
.u6-stp b { min-width: 28px; text-align: center; font-size: .86rem; font-variant-numeric: tabular-nums; }
.u6-segw .res-seg { margin: 0; display: inline-flex; flex-wrap: nowrap; } .u6-segw .res-seg button { flex: none; padding: .4rem 1rem; }
.u6-chips { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.u6-chipb { display: inline-flex; align-items: center; gap: 5px; padding: 6px 12px; border-radius: 999px; border: 1px solid var(--glass-in-line); background: var(--glass-in-bg); font-size: .8rem; font-weight: 600; white-space: nowrap; }
.u6-chipb svg { width: 12px; height: 12px; color: var(--mut); }
.u6-chipb.on { border-color: var(--acc); background: var(--acc-soft); color: var(--acc); } .u6-chipb.on svg { color: var(--acc); }
.u6-whow { display: flex; flex-direction: column; gap: 6px; } .u6-whow .u6-sel { width: 100% !important; border-radius: 10px; height: 2.5rem !important; font-size: .9rem; font-weight: 500; }
.u6-whow > .who { font-size: .76rem; line-height: 1.45; }
.u6-reps .cl-mi:first-child { border-top: 0; padding-top: 0; }
.u6-warn { display: flex; align-items: center; gap: 10px; margin-top: 10px; padding: 10px 12px; border-radius: 12px; background: var(--warn-bg); font-size: .8rem; flex-wrap: wrap; }
.u6-warn > .u6-i { color: var(--warn); } .u6-warn > span { flex: 1; min-width: 12rem; }
.u6-dfoot { flex: none; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding-top: 14px; border-top: 1px solid var(--hair); }
.u6-dfoot > button.prim, .u6-dfoot > button.sec { width: auto; margin: 0; padding: .55rem 1.1rem; display: inline-flex; align-items: center; gap: .4rem; }
.u6-dfoot > button svg { width: 14px; height: 14px; }
.u6-dfoot .sp { flex: 1; } .u6-fnote { font-size: .78rem; margin-left: 4px; }
.u6-lnk { display: inline-flex; align-items: center; gap: 5px; padding: 6px 8px; border-radius: 8px; color: var(--acc); font-size: .8rem; font-weight: 600; text-decoration: none; white-space: nowrap; }
.u6-lnk.err { color: var(--err); } @media (hover: hover) { .u6-lnk:hover { background: var(--neu-bg); text-decoration: none; } }

/* ---------- Nastavení úklidů: panel sekcí vlevo, vpravo jen vybraná sekce ---------- */
.u6-dual { display: grid; grid-template-columns: 290px minmax(0, 1fr); gap: 16px; align-items: start; }
.card.u6-nav { position: sticky; top: 16px; padding: 14px; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.u6-navh { display: flex; flex-direction: column; gap: 2px; padding: 2px 6px; } .u6-navh b { font-size: .92rem; } .u6-navh span { font-size: .76rem; color: var(--mut); }
.u6-vnav { position: relative; display: flex; flex-direction: column; gap: 2px; padding: 4px; border-radius: 14px; background: var(--neu-bg); }
.u6-vnav > button { position: relative; z-index: 1; display: flex; align-items: center; gap: 10px; padding: 10px; border-radius: 12px; text-align: left; }
.u6-vnav > button .nt { flex: 1; min-width: 0; } .u6-vnav > button .nt b { display: block; font-size: .86rem; font-weight: 500; } .u6-vnav > button.on .nt b { font-weight: 600; }
.u6-vnav > button .nt span { display: block; font-size: .72rem; color: var(--mut); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.u6-vnav > button > svg { width: 14px; height: 14px; color: var(--faint); flex: none; }
.u6-vnav .ci { width: 30px; height: 30px; border-radius: 9px; flex: none; display: inline-flex; align-items: center; justify-content: center; background: var(--glass-in-bg); color: var(--mut); }
.u6-vnav > button.on .ci { background: var(--acc-soft); color: var(--acc); }
.u6-vnav .seg-glide { position: absolute; left: 0; top: 0; z-index: 0; width: 0; height: 0; border-radius: 12px; background: var(--sn-on-bg); box-shadow: var(--sn-on-shadow); pointer-events: none;
  transition: transform .32s cubic-bezier(.4,0,.2,1), width .32s cubic-bezier(.4,0,.2,1), height .32s cubic-bezier(.4,0,.2,1); }
@media (prefers-reduced-motion: reduce) { .u6-vnav .seg-glide { transition: none; } }
.u6-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--warn-dot); flex: none; }
.u6-navf { margin: 2px 4px 0; font-size: .76rem; color: var(--mut); line-height: 1.5; } .u6-navf b { color: var(--ink); }
.card.u6-pane { margin: 0; padding: 18px 20px; display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.u6-paneh { display: flex; align-items: center; gap: 10px; } .u6-paneh h2 { margin: 0; font-size: 1.15rem; } .u6-paneh .sp { flex: 1; } .u6-paneh .who { font-size: .78rem; }
.cl-gp.u6-sec { display: flex; flex-direction: column; gap: 14px; padding: 16px 18px; }
.u6-sec.anim { animation: u6SecIn .28s cubic-bezier(.3,.75,.2,1); }
@keyframes u6SecIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .u6-sec.anim { animation: none; } }
.u6-sech { display: flex; align-items: flex-start; gap: 12px; } .u6-sech .tx { flex: 1; min-width: 0; }
.u6-sech h3 { margin: 0; font-size: 1.02rem; } .u6-sech p { margin: 3px 0 0; font-size: .8rem; color: var(--mut); line-height: 1.45; }
.u6-sub { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: .88rem; font-weight: 600; margin-bottom: 8px; } .u6-sub .sp { flex: 1; } .u6-sub .who { font-weight: 400; }
.u6-sub .mini, .u6-sfoot .mini, .u6-nlr .mini, .u6-asgf .mini, .u6-shw .mini, .u6-bulk .mini, .u6-person > .mini { display: inline-flex; align-items: center; gap: .35rem; }
.u6-sub .mini svg, .u6-shw .mini svg, .u6-nlr .mini svg { width: 13px; height: 13px; }
.u6-summ3 { display: flex; align-items: stretch; gap: 18px; flex-wrap: wrap; } .u6-summ3 > div { display: flex; flex-direction: column; gap: 2px; } .u6-summ3 b { font-size: 1.25rem; }
.u6-summ3 .vl, .u6-cols2 > .vl { width: 1px; background: var(--hair); }
.u6-warnt { color: var(--warn); } .u6-okt { color: var(--ok); }
.u6-ptab { width: 100%; border-collapse: collapse; font-size: .84rem; }
.u6-ptab th { font-size: 9.5px; letter-spacing: 1.1px; text-transform: uppercase; color: var(--faint); font-weight: 600; text-align: left; padding: 8px 10px; white-space: nowrap; }
.u6-ptab th.r, .u6-ptab td.r { text-align: right; } .u6-ptab td { padding: 6px 10px; border-top: 1px solid var(--hair); vertical-align: middle; }
.u6-kc { position: relative; display: inline-block; }
.u6-kc input { width: 118px !important; height: 34px !important; text-align: right; padding-right: 32px !important; font-variant-numeric: tabular-nums; background-color: var(--glass-in-bg); border-color: var(--glass-in-line); }
.u6-kc i { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); font-style: normal; font-size: .76rem; color: var(--faint); pointer-events: none; }
.u6-kc.warn input { border-color: var(--warn-dot); }
.u6-sfoot { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding-top: 12px; border-top: 1px solid var(--hair); } .u6-sfoot .sp { flex: 1; }
.u6-bulk { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: .8rem; color: var(--mut); }
.u6-chkw { display: flex; gap: 22px; align-items: flex-start; } .u6-chkw > .l { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 12px; }
.u6-catg { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.u6-catc { padding: 12px 14px; border-radius: 14px; display: flex; flex-direction: column; gap: 10px; min-width: 0; background: var(--glass-in-bg); border: 1px solid var(--glass-in-line); }
.u6-catc .h { display: flex; align-items: center; gap: 8px; }
.u6-catn { flex: 1; min-width: 0; height: 34px !important; font-weight: 600; font-size: .88rem; }
.u6-ctseg { margin: 0; flex: none; flex-wrap: nowrap; } .u6-ctseg button { flex: none; padding: .3rem .7rem; font-size: .76rem; }
.u6-ib { width: 32px; height: 32px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center; color: var(--mut); flex: none; }
.u6-ib svg, .u6-ib .u6-i { width: 15px; height: 15px; } @media (hover: hover) { .u6-ib:hover { background: var(--neu-bg); color: var(--ink); } }
.u6-rep3 { display: flex; align-items: center; gap: 5px; font-size: .76rem; color: var(--mut); flex-wrap: wrap; } .u6-rep3 .sp { flex: 1; }
.u6-itc { display: inline-flex; align-items: center; gap: 6px; padding: 4px 5px 4px 11px; border-radius: 999px; background: var(--glass-in-bg); border: 1px solid var(--glass-in-line); font-size: .8rem; font-weight: 500; white-space: nowrap; }
.u6-itc button { width: 18px; height: 18px; border-radius: 50%; background: var(--neu-bg); display: inline-flex; align-items: center; justify-content: center; color: var(--mut); }
.u6-itc button svg { width: 10px; height: 10px; } @media (hover: hover) { .u6-itc button:hover { background: var(--err-bg); color: var(--err); } }
.u6-itadd { display: inline-flex; align-items: center; gap: 4px; border-radius: 999px; border: 1.4px dashed var(--hair); padding: 1px 3px 1px 10px; }
.u6-itadd input:not([type="checkbox"]):not([type="radio"]):not([type="file"]) { border: 0 !important; background: transparent !important; width: 130px; height: 26px !important; padding: 0 !important; font-size: .8rem; outline: none; }
.u6-itadd button { color: var(--acc); font-weight: 600; font-size: .76rem; padding: 4px 8px; border-radius: 999px; display: inline-flex; align-items: center; gap: 3px; }
.u6-itadd button svg { width: 12px; height: 12px; }
.u6-people { display: flex; flex-direction: column; }
.u6-person { display: flex; align-items: flex-start; gap: 12px; padding: 11px 2px; border-top: 1px solid var(--hair); } .u6-person:first-child { border-top: 0; }
.u6-person.rev { opacity: .6; } .u6-person .tx { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.u6-person .nm { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; } .u6-person .nm b { font-size: .9rem; } .u6-person .who { font-size: .76rem; }
.u6-asgl { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; margin-top: 3px; font-size: .78rem; color: var(--mut); }
.u6-asg { display: flex; flex-direction: column; gap: 8px; margin-top: 6px; padding: 10px 12px; border-radius: 12px; background: var(--glass-row); border: 1px solid var(--acc); }
.u6-asgf { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; } .u6-asgf .who { font-size: .74rem; }
.u6-nlbox, .u6-nlok { margin-top: 8px; padding: 14px 16px; border-radius: 14px; display: flex; flex-direction: column; gap: 12px; }
.u6-nlbox { background: var(--glass-in-bg); border: 1px solid var(--glass-in-line); }
.u6-nlok { background: var(--ok-bg); border: 1px solid color-mix(in srgb, var(--ok-dot) 30%, transparent); }
.u6-nlh, .u6-nlr { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; } .u6-nlh .sp, .u6-nlr .sp { flex: 1; }
.u6-lnk2 { flex: 1; min-width: 0; padding: 9px 12px; border-radius: 10px; background: var(--glass-in-bg); border: 1px solid var(--glass-in-line); font-size: .82rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; user-select: all; }
.u6-hr { height: 1px; background: var(--hair); }
.u6-cols2 { display: grid; grid-template-columns: minmax(0, 1fr) 1px minmax(0, 1fr); gap: 22px; } .u6-cols2 > .vl { width: auto; }
.u6-wrow { display: flex; gap: 16px; align-items: center; }
.u6-win { flex: 1; min-width: 0; } .u6-win .b { position: relative; height: 30px; border-radius: 10px; background: var(--neu-bg); overflow: hidden; }
.u6-win .b i { position: absolute; top: 0; bottom: 0; right: 0; background: var(--acc-soft); } .u6-win .b em { position: absolute; top: -2px; bottom: -2px; width: 2px; background: var(--acc); }
.u6-win .b span { position: absolute; top: 50%; transform: translateY(-50%); font-size: .72rem; font-weight: 600; color: var(--mut); white-space: nowrap; } .u6-win .b span.r { right: 10px; color: var(--acc); } .u6-win .b span.l { left: 10px; }
.u6-win .d { display: flex; justify-content: space-between; margin-top: 5px; font-size: .7rem; color: var(--faint); } .u6-win .d b { color: var(--acc); }
.u6-wsts { display: flex; flex-direction: column; gap: 8px; flex: none; }
.u6-cols2 .u6-wrow { flex-direction: column; align-items: stretch; } .u6-cols2 .u6-wsts { flex-direction: row; flex-wrap: wrap; gap: 8px 22px; } .u6-cols2 .u6-wst > span:first-child { width: auto; }
.u6-wst { display: flex; align-items: center; gap: 8px; font-size: .8rem; color: var(--mut); } .u6-wst > span:first-child { width: 80px; }
.u6-shw { display: flex; flex-direction: column; gap: 10px; padding: 13px 14px; border-radius: 14px; background: var(--warn-bg); border: 1px solid color-mix(in srgb, var(--warn-dot) 30%, transparent); }
.u6-shw.off { background: var(--neu-bg); border-color: var(--hair); }
.u6-shw .t { display: flex; align-items: center; gap: 10px; font-size: .86rem; font-weight: 600; } .u6-shw p { margin: 0; font-size: .8rem; color: var(--mut); line-height: 1.5; }
.u6-ruler { position: relative; height: 44px; border-radius: 12px; background: var(--neu-bg); }
.u6-ruler > span { position: absolute; top: 0; bottom: 0; display: flex; align-items: center; justify-content: center; font-size: .76rem; font-weight: 600; overflow: hidden; white-space: nowrap; }
.u6-ruler > span.b { background: rgba(122,79,214,0.12); color: #6b3fd0; border-radius: 12px 0 0 12px; } .u6-ruler > span.c { background: var(--ok-bg); color: var(--ok); }
.u6-ruler > span.a { background: var(--acc-soft); color: var(--acc); border-radius: 0 12px 12px 0; }
html[data-vz="dark"] .u6-ruler > span.b, html[data-vz="violet"] .u6-ruler > span.b, html[data-vz="gold"] .u6-ruler > span.b { background: rgba(194,176,255,0.22); color: #c4a8ff; }
.u6-ruler > em { position: absolute; top: 50%; width: 18px; height: 18px; margin: -9px 0 0 -9px; border-radius: 50%; background: #fff; border: 2px solid var(--acc); box-shadow: 0 2px 6px rgba(0,0,0,.3); box-sizing: border-box; }
.u6-rticks { position: relative; height: 16px; margin-top: 6px; } .u6-rticks span { position: absolute; transform: translateX(-50%); font-size: .7rem; color: var(--faint); }
.u6-ages { display: flex; gap: 28px; flex-wrap: wrap; }
.u6-ex { padding: 11px 13px; border-radius: 12px; background: var(--glass-in-bg); border: 1px solid var(--glass-in-line); display: flex; flex-direction: column; gap: 6px; font-size: .82rem; }
.u6-exr { display: flex; align-items: center; gap: 6px; } .u6-exr .u6-i { color: var(--faint); }
@media (max-width: 1300px) and (min-width: 921px) {
  .u6-row { grid-template-columns: 36px 130px 130px 170px minmax(0, 1fr) auto; gap: 12px; }
  .u6-dual { grid-template-columns: 250px minmax(0, 1fr); }
  .u6-ec2 { grid-template-columns: 1fr; } .u6-ec2 > div { padding: 0 !important; border: 0 !important; } .u6-ec2 > div + div { margin-top: 18px; padding-top: 18px !important; border-top: 1px solid var(--hair) !important; }
}

/* ---------- telefon: řešení A „Kompaktní“ ---------- */
.u6m-sp { height: 84px; }
@media (max-width: 920px) {
  .card.u6m-top { padding: 12px; display: flex; flex-direction: column; gap: 10px; margin-bottom: 0; }
  .u6m-hd { display: flex; align-items: center; gap: 8px; } .u6m-hd h1.pg { margin: 0; font-size: 1.45rem; } .u6m-hd .sp { flex: 1; }
  .u6m-ib { position: relative; width: 40px; height: 40px; flex: none; border-radius: 12px; border: 1px solid var(--btn-line); background: var(--btn-bg); box-shadow: var(--btn-shadow);
    display: inline-flex; align-items: center; justify-content: center; color: var(--ink); }
  .u6m-ib svg { width: 18px; height: 18px; }
  .u6m-ib em { position: absolute; top: -5px; right: -5px; min-width: 18px; height: 18px; padding: 0 5px; box-sizing: border-box; border-radius: 999px; background: var(--prim-bg); color: var(--prim-ink);
    font-style: normal; font-size: 11px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
  .u6m-per { display: flex; gap: 8px; align-items: center; }
  .u6m-per .an-stepper { flex: 1; display: flex; min-width: 0; } .u6m-per .an-stepper strong { flex: 1; min-width: 0; font-size: .86rem; overflow: hidden; text-overflow: ellipsis; }
  .u6m-pill { display: inline-flex; align-items: center; gap: 6px; height: 38px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--btn-line); background: var(--btn-bg); box-shadow: var(--btn-shadow);
    font-size: .82rem; font-weight: 600; white-space: nowrap; flex: none; }
  .u6m-pill svg { width: 14px; height: 14px; color: var(--mut); }
  .u6m-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .cl-gp.u6m-kt { width: auto; margin: 0; color: var(--ink); font: inherit; cursor: pointer; display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 9px 10px; border-radius: 14px; text-align: left; min-width: 0; }
  .u6m-kt b { font-size: 1rem; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
  .u6m-kt .u6-lab { font-size: 9.5px; letter-spacing: .9px; }
  .u6m-kt .s { font-size: .7rem; color: var(--mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; } .u6m-kt .s.err { color: var(--err); font-weight: 600; }
  .cl-gp.u6m-kt.late { border-color: color-mix(in srgb, var(--err-dot) 40%, transparent); } .u6m-kt.late b { color: var(--err); }
  .u6m-seg { position: sticky; top: var(--u6-mtop, 56px); z-index: 30; margin: 0 -12px 6px; padding: 8px 12px; background: color-mix(in srgb, var(--bg) 80%, transparent);
    -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); }
  .u6m-seg .res-seg { display: flex; border-radius: 999px; padding: 3px; } .u6m-seg .res-seg .seg-glide { border-radius: 999px; }
  .u6m-seg .res-seg button { flex: 1 1 0; width: auto; min-width: 0; border-radius: 999px; padding: .42rem .2rem; font-size: .8rem; }
  .u6m-seg .res-seg button span { margin-left: .2rem; }
  .u6-grp { gap: 6px; margin-bottom: 12px; } .u6-gh { padding: 0 4px; scroll-margin-top: 120px; }
  .cl-gp.u6m-c { display: flex; align-items: flex-start; gap: 10px; padding: 10px 11px; border-radius: 16px; cursor: pointer; }
  .u6m-c .tx { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
  .u6m-c .l1 { display: flex; align-items: baseline; gap: 6px; min-width: 0; } .u6m-c .l1 b { font-size: .95rem; white-space: nowrap; }
  .u6m-c .l1 span { font-size: .72rem; color: var(--mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .u6m-c .l2 { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; } .u6m-c .l2 > b { font-size: .84rem; font-variant-numeric: tabular-nums; }
  .u6m-c .u6-cps { margin-top: 3px; gap: 4px; } .u6m-c .u6-cps .tag { font-size: .66rem; padding: .14rem .5rem; }
  .u6m-chk { width: 34px; height: 34px; border-radius: 50%; border: 2px solid var(--hair); flex: none; display: inline-flex; align-items: center; justify-content: center; align-self: center; }
  .u6m-chk.late { border-color: var(--err-dot); } .u6m-chk.today { border-color: var(--warn-dot); }
  .u6m-chk.done { border: 0; background: linear-gradient(180deg, #3ddc75, #22a654); color: #fff; } .u6m-chk.done svg { width: 15px; height: 15px; }
  .u6m-fab { position: fixed; right: 16px; bottom: calc(18px + env(safe-area-inset-bottom, 0px)); z-index: 40; width: 56px; height: 56px; margin: 0; padding: 0; border-radius: 18px;
    display: flex; align-items: center; justify-content: center; }
  .u6m-fab svg { width: 24px; height: 24px; }
  /* stránky detailu, Přidat a Nastavení: lišta Zpět drží nahoře, tlačítka dole */
  .u6m-ab { position: sticky; top: var(--u6-mtop, 56px); z-index: 30; display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 6px;
    margin: -12px -12px 10px; padding: 6px 8px; background: color-mix(in srgb, var(--bg) 84%, transparent); -webkit-backdrop-filter: blur(18px) saturate(1.4); backdrop-filter: blur(18px) saturate(1.4);
    border-bottom: 1px solid var(--hair); }
  .u6m-abk { justify-self: start; display: inline-flex; align-items: center; min-height: 44px; padding: 0 10px 0 0; color: var(--acc); font-size: 1rem; font-weight: 600; }
  .u6m-abk svg { width: 24px; height: 24px; }
  .u6m-at { font-size: .95rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 52vw; text-align: center; }
  .u6m-ar { justify-self: end; display: flex; gap: 6px; } .u6m-ar .u6m-ib { width: 36px; height: 36px; color: var(--err); }
  .cl-gp.u6m-hero { display: flex; align-items: center; gap: 10px; padding: 11px 12px; margin-bottom: 10px; } .u6m-hero .tx { flex: 1; min-width: 0; }
  .u6m-hero .tx b { display: block; font-size: .9rem; } .u6m-hero .tx span { font-size: .76rem; color: var(--mut); }
  .cl-gp.u6m-blk { padding: 14px; }
  .u6m-blk .u6-eb + .u6-eb { padding-top: 16px; border-top: 1px solid var(--hair); }
  .u6m-blk .u6-segw .res-seg { display: flex; width: 100%; border-radius: 999px; padding: 3px; } .u6m-blk .u6-segw .res-seg button { flex: 1 1 0; width: auto; border-radius: 999px; }
  .u6m-blk .u6-segw .res-seg .seg-glide { border-radius: 999px; }
  .u6m-blk .u6-tln .nd { width: 72px; }
  .u6m-foot { position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; display: flex; gap: 8px; padding: 10px 12px calc(12px + env(safe-area-inset-bottom, 0px));
    background: var(--glass-bg); border-top: 1px solid var(--glass-edge); box-shadow: 0 -10px 30px rgba(0,0,0,.08); -webkit-backdrop-filter: var(--glass-filter); backdrop-filter: var(--glass-filter); border-radius: 18px 18px 0 0; }
  .u6m-foot > button { flex: 1; margin: 0; min-height: 46px; border-radius: 999px; font-size: .92rem; display: inline-flex; align-items: center; justify-content: center; gap: .4rem; }
  .u6m-foot > button svg { width: 15px; height: 15px; }
  .u6m-done { border: 1.5px solid var(--hair) !important; background: var(--btn-bg) !important; color: var(--ink) !important; font-weight: 600 !important; box-shadow: var(--btn-shadow) !important; }
  .u6m-done.on { border-color: var(--ok-dot) !important; background: var(--ok-bg) !important; color: var(--ok) !important; }
  .u6m-done .u6-ring { border-color: var(--ok-dot); width: 18px; height: 18px; }
  .u6-vnav.u6m-set { background: transparent; padding: 0; gap: 8px; }
  .u6-vnav.u6m-set > button { padding: 12px; border-radius: 16px; background: var(--glass-bg); border: 1px solid var(--glass-edge); box-shadow: var(--glass-shadow); -webkit-backdrop-filter: var(--glass-filter); backdrop-filter: var(--glass-filter); }
  .u6-vnav.u6m-set .nt span { white-space: normal; }
  .u6-navf { margin: 12px 4px 0; }
  .cl-gp.u6-sec { padding: 14px; } .u6-sec .u6-sech > .u6-sq { display: none; }
  /* listy (filtry, období, náklady, vzkazy, po termínu) */
  .u6-sheet .px-modal-b { display: flex; flex-direction: column; }
  .u6-shs { display: flex; flex-direction: column; gap: 16px; } .u6-shs .u6-lab { display: block; margin-bottom: 8px; }
  .u6-shs .res-seg { display: flex; width: 100%; border-radius: 999px; padding: 3px; margin: 0; } .u6-shs .res-seg button { flex: 1 1 0; width: auto; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; gap: 6px; }
  .u6-shs .res-seg .seg-glide { border-radius: 999px; }
  .u6-shs > .mini { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; padding: .6rem; } .u6-shs > .mini svg { width: 14px; height: 14px; }
  .u6-sheet .u6-mtabs .res-seg { display: flex; border-radius: 999px; padding: 3px; } .u6-sheet .u6-mtabs .res-seg button { flex: 1 1 0; width: auto; border-radius: 999px; } .u6-sheet .u6-mtabs .res-seg .seg-glide { border-radius: 999px; }
  .u6-sheet .cl-costp.u6-shcost { padding: 0; background: transparent; border: 0; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
  .u6-sheet .cl-costp .u6-chev { display: none; } .u6-sheet .cl-cr .n { width: 8.5rem; }
  .u6-sheet .cl-ch { flex-wrap: wrap; gap: .5rem; } .u6-sheet .cl-prog { margin-left: 0; width: 100%; align-items: stretch; } .u6-sheet .cl-prog .bar { width: 100%; }
  .u6-sheet .u6m-c + .u6m-c { margin-top: 8px; }
  .u6-wide { width: 100% !important; margin-top: 12px !important; display: inline-flex; align-items: center; justify-content: center; gap: .4rem; padding: .6rem !important; }
  .u6-wide svg { width: 14px; height: 14px; }
  /* mini tabule týdne */
  .cl-gp.u6-mboard { padding: 10px; }
  .u6-mbn { display: flex; align-items: center; justify-content: space-between; padding: 0 2px 8px; } .u6-mbn b { font-size: .86rem; }
  .u6-mbg { display: grid; grid-template-columns: 76px repeat(7, minmax(0, 1fr)); gap: 3px; align-items: center; }
  .u6-mbh { display: flex; flex-direction: column; align-items: center; padding: 4px 0; border-radius: 8px; } .u6-mbh small { font-size: 9px; color: var(--faint); font-weight: 700; text-transform: uppercase; }
  .u6-mbh b { font-size: .8rem; } .u6-mbh.td { background: var(--acc-soft); } .u6-mbh.td small { color: var(--acc); }
  .u6-mbl { display: flex; align-items: center; gap: 4px; min-width: 0; } .u6-mbl b { font-size: .74rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .u6-mbx { height: 40px; border-radius: 8px; display: flex; align-items: center; justify-content: center; } .u6-mbx.td { background: var(--acc-soft); }
  .u6-mbc { width: 100%; height: 36px; border-radius: 8px; background: var(--kb); color: var(--kc); display: flex; flex-direction: column; align-items: center; justify-content: center; }
  .u6-mbc svg { width: 12px; height: 12px; } .u6-mbc i { font-style: normal; font-size: 10px; font-weight: 700; color: var(--ink); }
  .u6-mboard .u6-legend { margin-top: 10px; gap: 8px; font-size: .7rem; }
  /* sekce nastavení na telefonu */
  .u6-tgrid { grid-template-columns: 1fr 1fr; }
  .u6-catg { grid-template-columns: 1fr; } .u6-chkw { flex-direction: column; }
  .u6-cols2 { grid-template-columns: 1fr; gap: 14px; } .u6-cols2 > .vl { display: none; }
  .u6-wrow { flex-direction: column; align-items: stretch; }
  .u6-ptab thead { display: none; } .u6-ptab, .u6-ptab tbody, .u6-ptab tr, .u6-ptab td { display: block; width: 100%; }
  .u6-ptab tr { padding: 10px 0; border-top: 1px solid var(--hair); display: grid; grid-template-columns: 1fr 1fr; gap: 8px; } .u6-ptab tr:first-child { border-top: 0; }
  .u6-ptab td { border: 0; padding: 0; } .u6-ptab td:first-child { grid-column: 1 / -1; } .u6-ptab td.r { text-align: left; } .u6-ptab td.hm { display: none; }
  .u6-ptab td[data-l]::before { content: attr(data-l); display: block; font-size: .7rem; color: var(--mut); margin-bottom: 3px; }
  .u6-kc { display: block; } .u6-kc input { width: 100% !important; }
  .u6-person { flex-wrap: wrap; } .u6-person .tx { flex: 1 1 calc(100% - 60px); } .u6-person > .mini { margin-left: 50px; }
  .u6-sec .u6-sub > .who { display: none; }
  .u6-summ3 { display: grid; grid-template-columns: 1fr 1fr; } .u6-summ3 .vl { display: none; }
  .u6-ctseg { display: inline-flex !important; border-radius: 999px !important; padding: 3px !important; } .u6-ctseg button { border-radius: 999px !important; width: auto !important; }
  .u6-ctseg .seg-glide { border-radius: 999px !important; }
  .u6-sfoot .mini { flex: 1; justify-content: center; }
  .u6-summ3 { gap: 12px; } .u6-summ3 b { font-size: 1.05rem; }
}

/* ===================== Rezervace — detail v okně a Přidat rezervaci (návrh 8 „Souhrn“, Marco 25. 10. 2026; app/js/rezervace-okno.js) =====================
   Okno z mléčného skla s rozmazaným pozadím jako detail úklidu (.u6-glass), ukotvené nahoře, výška podle obsahu. Vše pod .rz8w (okno i stránka na telefonu),
   tlačítka a popisky mají vlastní vzhled — základní pravidla button / label aplikace se tu ruší přes :where() (nízká váha, komponenty je přebijí). */
.rz8w :where(button) { width: auto; margin: 0; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; color: inherit; font: inherit; font-weight: inherit; cursor: pointer; }
.rz8w :where(button:disabled) { cursor: default; }
.rz8w :where(label) { display: block; margin: 0; font-size: inherit; font-weight: inherit; color: inherit; }
.rz8w :where(h2, h3, h5, p) { margin: 0; }
.rz8w svg.rzi { width: 15px; height: 15px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.rz8w .who { font-size: 12px; color: var(--mut); font-weight: 400; } .rz8w .fa { color: var(--faint); } .rz8w .errt { color: var(--err); }
.rz8w .acct { color: var(--acc); font-weight: 600; } .rz8w .warnt { color: var(--warn); font-weight: 600; }
.rz8w .tag { display: inline-flex; align-items: center; gap: 4px; }
.rz8w .btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 7px 13px; min-height: 34px; border-radius: 10px; border: 1px solid var(--btn-line); background: var(--btn-bg);
  box-shadow: var(--btn-shadow); font-size: 12.5px; font-weight: 600; white-space: nowrap; color: var(--ink); text-decoration: none; }
.rz8w .btn.prim { background: var(--prim-bg); color: var(--prim-ink); border-color: transparent; box-shadow: var(--prim-shadow); }
.rz8w .btn.danger { color: var(--err); } .rz8w .btn.dfill { background: var(--err-dot); color: #fff; border-color: transparent; box-shadow: 0 8px 18px rgba(217,74,63,.3); }
.rz8w .btn.bgb { padding: 9px 16px; font-size: 13px; } .rz8w .btn.sm { min-height: 28px; padding: 4px 10px; font-size: 12px; border-radius: 9px; }
.rz8w .btn:disabled { opacity: .45; filter: saturate(.6); } .rz8w .btn .rzi { width: 14px; height: 14px; }
@media (hover: hover) { .rz8w .btn:not(:disabled):hover { filter: brightness(1.05); } .rz8w .lnk:not(:disabled):hover { text-decoration: underline; } }
.rz8w .lnk { display: inline-flex; align-items: center; gap: 5px; padding: 2px 0; color: var(--acc); font-weight: 600; font-size: 12.5px; white-space: nowrap; }
.rz8w .lnk.err { color: var(--err); } .rz8w .lnk.mut { color: var(--mut); } .rz8w .lnk:disabled { opacity: .45; text-decoration: none; }
.rz8w .ib { width: 30px; height: 30px; flex: none; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center; color: var(--mut); }
@media (hover: hover) { .rz8w .ib:not(:disabled):hover { background: var(--neu-bg); color: var(--ink); } }
.rz8w .icq { width: 30px; height: 30px; flex: none; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center; background: var(--neu-bg); color: var(--faint); }
.rz8w .icq.acc { background: var(--acc-soft); color: var(--acc); } .rz8w .icq.warn { background: var(--warn-bg); color: var(--warn); } .rz8w .icq.err { background: var(--err-bg); color: var(--err); } .rz8w .icq.ok { background: var(--ok-bg); color: var(--ok); }
.rz8w .rz-gp { background: var(--glass-bg); border: 1px solid var(--glass-edge); box-shadow: var(--glass-shadow); border-radius: 18px; }
.rz8w .fld { display: flex; flex-direction: column; gap: 5px; min-width: 0; } .rz8w .fld > span { font-size: 12px; font-weight: 600; color: var(--ink); display: flex; align-items: center; gap: 3px; flex-wrap: wrap; }
.rz8w .fld > span .who { font-size: 11.5px; }
.rz8w .inp { width: 100%; min-width: 0; border-radius: 10px; font-size: 13.5px; }
.rz8w textarea.inp.ta { min-height: 120px; padding: 10px 12px; line-height: 1.5; resize: vertical; font-size: 13px; }
.rz8w .inp[aria-invalid="true"] { border-color: var(--err-dot); box-shadow: 0 0 0 3px var(--err-bg); }
.rz8p input:not([type="checkbox"]):not([type="radio"]), .rz8p select, .rz8p textarea { background-color: var(--glass-in-bg); border-color: var(--glass-in-line); }
.rz8w .chipb { display: inline-flex; align-items: center; gap: 5px; padding: 5px 11px; border-radius: 999px; border: 1px solid var(--btn-line); color: var(--mut); font-size: 12px; font-weight: 500; white-space: nowrap; }
.rz8w .chipb.on { border-color: var(--acc); background: var(--acc-soft); color: var(--ink); font-weight: 600; } .rz8w .chipb .rzi { width: 12px; height: 12px; stroke-width: 2.6; color: var(--acc); }
.rz8w .rz-empty { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 12px 14px; border-radius: 14px; border: 1px dashed var(--hair); color: var(--mut); font-size: 13px; }
.rz8w .rz-empty > span { flex: 1; min-width: 12rem; }
.rz8-msg { margin-top: 8px; padding: 9px 12px; border-radius: 11px; font-size: 12.5px; line-height: 1.5; }
.rz8-msg.ok { background: var(--ok-bg); color: var(--ok); font-weight: 600; } .rz8-msg.info { background: var(--acc-soft); color: var(--ink); }
.rz8-msg.err { background: var(--err-bg); color: var(--err); } .rz8-msg.warn { background: var(--warn-bg); color: var(--ink); }
.rz8-msg .btn { display: flex; width: max-content; margin-top: 8px; }
.rz8w .rz-ferr { margin: 0; color: var(--err); font-size: 13px; font-weight: 600; }
.rz8w .stripr { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 14px; margin: 10px 0 0; border-radius: 12px; font-size: 13px; }
.rz8w .stripr.warn { background: var(--warn-bg); border: 1px solid color-mix(in srgb, var(--warn-dot) 30%, transparent); } .rz8w .stripr.warn > .rzi { color: var(--warn); }
.rz8w .stripr > span:not(.sp) { flex: 1; min-width: 14rem; } .rz8w .stripr b { font-weight: 600; } .rz8w .stripr .m { color: var(--mut); }
/* vysvětlivka ⓘ — bublina se posune dovnitř displeje (rzFitTip) */
.rz8w .rz-inf { position: relative; display: inline-flex; vertical-align: middle; }
.rz8w .rz-inf > button { width: 20px; height: 20px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; color: var(--faint); cursor: help; }
.rz8w .rz-inf > button .rzi { width: 14px; height: 14px; }
.rz8w .rz-tip { position: absolute; top: calc(100% + 8px); left: -12px; z-index: 40; width: 320px; max-width: calc(100vw - 24px); box-sizing: border-box; padding: 11px 13px; border-radius: 14px; background: var(--stp-bg); border: 1px solid var(--stp-line);
  box-shadow: var(--stp-sh); font-size: 12.5px; font-weight: 400; line-height: 1.55; color: var(--ink); letter-spacing: 0; text-transform: none; white-space: normal; opacity: 0; visibility: hidden; transform: translateY(-4px); transition: opacity .14s, transform .14s, visibility 0s linear .14s; }
.rz8w .rz-inf.open .rz-tip, .rz8w .rz-inf:focus-within .rz-tip { opacity: 1; visibility: visible; transform: none; transition: opacity .16s, transform .16s, visibility 0s; }
@media (hover: hover) { .rz8w .rz-inf:hover .rz-tip { opacity: 1; visibility: visible; transform: none; transition: opacity .16s .12s, transform .16s .12s, visibility 0s; } .rz8w .rz-inf:hover > button { color: var(--acc); } }

/* ---------- okno (PC) ---------- */
#px_modal.rz8-veil { align-items: flex-start; padding-top: clamp(20px, 5vh, 56px); padding-bottom: clamp(20px, 5vh, 56px); }
.px-modal.rz8-dlg { max-width: min(1240px, calc(100vw - 48px)); max-height: calc(100dvh - 2 * clamp(20px, 5vh, 56px)); padding: 0; gap: 0; border-radius: 24px; }
html[data-pz] .px-modal.rz8-dlg { max-height: calc(100dvh / var(--pz) - 2 * clamp(20px, 5vh, 56px)); }
.px-modal.rz8-dlg.rz8-add { max-width: min(1040px, calc(100vw - 48px)); }
.rz8-dlg > .px-modal-h { padding: 18px 22px 14px; gap: 14px; border-bottom: 1px solid var(--hair); align-items: center; }
.rz8-dlg > .px-modal-h > .px-x { align-self: flex-start; }
.rz8-dlg > .px-modal-b { margin: 0 !important; padding: 16px 22px 20px !important; overscroll-behavior: contain; }
.rz8-dlg > .msg, .rz8-dlg > .px-modal-a { display: none !important; }
.rz8-hd { flex: 1; min-width: 0; display: flex; align-items: center; gap: 14px; } .rz8-hd > .tx { flex: 1; min-width: 0; }
.rz8-hd .rzsub { margin: 3px 0 0; font-size: 13px; color: var(--mut); }
.rz8-foot { display: none; }
.rz8-foot.on { flex: none; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 12px 22px 14px; border-top: 1px solid var(--hair); background: color-mix(in srgb, var(--warn) 6%, transparent);
  border-radius: 0 0 24px 24px; animation: rz8up .22s cubic-bezier(.3,.7,.3,1); }
.rz8-foot.on.rm, .rz8-add .rz8-foot.on { background: none; animation: none; }
.rz8-foot .sp { flex: 1; } .rz8-foot .note { font-size: 12px; color: var(--mut); margin-left: 4px; }
.rz8-foot .dirty { display: inline-flex; align-items: center; gap: 7px; font-size: 12.5px; font-weight: 600; color: var(--warn); margin-left: 4px; } .rz8-foot .dirty i { width: 7px; height: 7px; border-radius: 50%; background: var(--warn-dot); }
@keyframes rz8up { from { transform: translateY(100%); opacity: 0; } to { transform: none; opacity: 1; } }
.rz-sq { width: 40px; height: 40px; flex: none; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; color: #fff; background: var(--pc);
  box-shadow: 0 6px 16px color-mix(in srgb, var(--pc) 38%, transparent), inset 0 1px 0 rgba(255,255,255,.3); }
.rz-sq .rzi { width: 19px; height: 19px; } .rz-sq.big { width: 46px; height: 46px; border-radius: 14px; } .rz-sq.big .rzi { width: 22px; height: 22px; }
.rz-sq.add { background: var(--prim-bg); color: var(--prim-ink); box-shadow: var(--prim-shadow); }
.rz8-t { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; } .rz8-t h2 { font-size: 21px; font-weight: 600; letter-spacing: -.3px; margin-right: 2px; }
.rz8-t .tag, .rz8-s .tag { flex: none; } .rz8-t .rel, .rz8-s .rel { font-size: 12.5px; color: var(--mut); }
.rz8-s { display: flex; align-items: center; gap: 8px; margin-top: 6px; flex-wrap: wrap; }
.rz8-m { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: 6px; font-size: 13px; color: var(--mut); }
.rz8-m > span { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; } .rz8-m .rzi { color: var(--faint); width: 14px; height: 14px; } .rz8-m b { color: var(--ink); font-weight: 600; }
.rz8-m.m8 { flex-direction: column; gap: 4px; margin-top: 8px; } .rz8-m.m8 > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: flex; } .rz8-m .sp8 { display: inline-block; width: 14px; }
.rz8-nav { display: flex; align-items: center; gap: 2px; padding: 3px; border-radius: 999px; background: var(--neu-bg); font-size: 12px; color: var(--mut); flex: none; align-self: center; }
.rz8-nav span { padding: 0 6px; font-variant-numeric: tabular-nums; white-space: nowrap; } .rz8-nav .ib { width: 28px; height: 28px; border-radius: 999px; } .rz8-nav .ib:disabled { opacity: .3; }
.rz8w .btn.hed { align-self: center; } .rz8w .btn.hed.on { border-color: var(--acc); color: var(--acc); }
.rz8 { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.rz8w .rzcol { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.rz8w .rzp { padding: 16px 18px 18px; min-width: 0; container-type: inline-size; }
.rz8w .rzph { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; min-height: 30px; } .rz8w .rzph h3 { font-size: 14.5px; font-weight: 600; display: flex; align-items: center; }
.rz8w .rzph .r { margin-left: auto; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-end; } .rz8w .rzph .icq .rzi { width: 15px; height: 15px; }
.rz8w .rzsub { font-size: 13px; color: var(--mut); line-height: 1.5; } .rz8w .rzsub.sm { font-size: 12px; margin: -2px 0 12px; }
.rz8w .rzg2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 14px; } .rz8w .rzg2 .full { grid-column: 1 / -1; }
.rz8w .rzg3.pr { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 96px; gap: 12px 14px; margin: 0 0 12px; }
.rz8w .obn { margin: 6px 0 0; font-size: 12.5px; color: var(--mut); line-height: 1.5; }
.rz8w .oba { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 9px; align-items: center; } .rz8w .oba .sp { flex: 1; }
.rz8w details.obd { margin-top: 8px; } .rz8w details.obd > summary { cursor: pointer; color: var(--acc); font-size: 13px; font-weight: 500; list-style: none; display: inline-flex; align-items: center; gap: 6px; }
.rz8w details.obd > summary::-webkit-details-marker { display: none; }
.rz8w details.obd > summary::before { content: '▸'; font-size: 11px; transition: transform .2s; } .rz8w details.obd[open] > summary::before { transform: rotate(90deg); }
.rz8w .stp2 { display: inline-flex; align-items: center; gap: 2px; padding: 3px; border-radius: 999px; background: var(--glass-in-bg); border: 1px solid var(--glass-in-line); width: max-content; height: 38px; box-sizing: border-box; }
.rz8w .stp2 button { width: 30px; height: 30px; border-radius: 999px; display: flex; align-items: center; justify-content: center; color: var(--ink); }
@media (hover: hover) { .rz8w .stp2 button:not(:disabled):hover { background: var(--neu-bg); } } .rz8w .stp2 button:disabled { opacity: .3; }
.rz8w .stp2 .rzi { width: 14px; height: 14px; } .rz8w .stp2 b { min-width: 30px; text-align: center; font-size: 14px; font-variant-numeric: tabular-nums; }
/* řádky se souhrnem (otevřený vždy jen jeden) */
.rz8w .acc8 { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.rz8w .ac8 { container-type: inline-size; transition: box-shadow .2s; }
.rz8w .ac8.op { box-shadow: 0 0 0 1.5px color-mix(in srgb, var(--acc) 45%, transparent), var(--glass-shadow); }
.rz8w .ac8h { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 66px; padding: 12px 16px; color: var(--ink); text-align: left; border-radius: 18px; }
@media (hover: hover) { .rz8w .ac8h:hover { background: var(--glass-row); } }
.rz8w .ac8.op > .ac8h { border-radius: 18px 18px 0 0; }
.rz8w .ac8h .icq { width: 36px; height: 36px; border-radius: 11px; } .rz8w .ac8h .icq .rzi { width: 16px; height: 16px; }
.rz8w .ac8h .t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; } .rz8w .ac8h .t > b { font-size: 14.5px; font-weight: 600; display: flex; align-items: center; gap: 8px; }
.rz8w .ac8h .t > .s { font-size: 12.5px; color: var(--mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .rz8w .ac8h .t > .s b { color: var(--ink); font-weight: 600; }
.rz8w .ac8h .tg { display: flex; gap: 6px; flex: none; } .rz8w .ac8h .chv, .rz8w .s3 .chv, .rz8w .hrh .chv { display: flex; color: var(--faint); transition: transform .2s; }
.rz8w .ac8.op .ac8h .chv { transform: rotate(180deg); }
.rz8w .ac8b { padding: 14px 16px 18px; border-top: 1px solid var(--hair); }
.rz8w .si { white-space: nowrap; } .rz8w .si.wr { white-space: normal; }
.rz8w .gn8 { display: inline-flex; align-items: center; gap: 5px; margin-right: 12px; color: var(--ink); } .rz8w .gn8 b { color: var(--mut); font-weight: 700; } .rz8w .gn8.miss { color: var(--warn); }
.rz8w i.d { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--hair); flex: none; }
.rz8w i.d.ok { background: var(--ok-dot); } .rz8w i.d.warn { background: var(--warn-dot); } .rz8w i.d.err { background: var(--err-dot); } .rz8w i.d.acc { background: var(--acc); } .rz8w i.d.off { background: var(--hair); }
.rz8w .dots8 { display: inline-flex; gap: 3px; margin-right: 8px; vertical-align: middle; }
@container (max-width: 520px) { .rz8w .ac8h .tg { display: none; } }
/* osa Odbavení: tečka na čáře + štítek; modře pulzuje krok na řadě, červeně po termínu, zelená bez pulzu (Marco 25. 10. 2026) */
.rz8w .ob3 { margin: 0 0 0 6px; }
.rz8w .s3 { position: relative; padding-left: 20px; }
.rz8w .s3::before { content: ''; position: absolute; left: -5px; top: 17px; width: 12px; height: 12px; border-radius: 50%; background: var(--hair); z-index: 1; }
.rz8w .s3.ok::before { background: var(--ok-dot); } .rz8w .s3.warn::before { background: var(--warn-dot); }
.rz8w .s3.acc { --pc: var(--acc); } .rz8w .s3.err { --pc: var(--err-dot); }
.rz8w .s3.acc::before, .rz8w .s3.err::before { background: var(--pc); }
/* pulz bodu = kruh pod bodem (::before tlačítka řádku, poloha vůči .s3 — bod i čára už zabírají ::before / ::after řádku), který se zvětší a zprůhlední:
   jen transform + opacity, takže ho kreslí grafika bez překreslování skla okna (dřív animovaný box-shadow; stejně jako pulz baneru UbyPort, 26. 10. 2026) */
.rz8w .s3.acc > .s3h::before, .rz8w .s3.err > .s3h::before { content: ''; position: absolute; left: -5px; top: 17px; width: 12px; height: 12px; border-radius: 50%;
  background: var(--pc); opacity: 0; pointer-events: none; animation: rz8ring 1.8s ease-out infinite; }
@keyframes rz8ring { 0% { opacity: .65; transform: scale(1); } 70%, 100% { opacity: 0; transform: scale(2.5); } }
.rz8w .s3:not(:last-child)::after { content: ''; position: absolute; left: 0; top: 33px; bottom: -13px; width: 2px; border-radius: 1px; background: var(--hair); }
.rz8w .s3h { display: flex; align-items: center; gap: 10px; width: 100%; padding: 8px; border-radius: 12px; text-align: left; color: var(--ink); }
@media (hover: hover) { .rz8w .s3h:hover { background: var(--glass-row); } }
.rz8w .s3.nx > .s3h { background: var(--glass-row); } .rz8w .s3.cur > .s3h { background: color-mix(in srgb, var(--acc) 9%, transparent); } .rz8w .s3.cur.late > .s3h { background: var(--err-bg); }
.rz8w .s3t { flex: 1; min-width: 0; display: flex; flex-direction: column; } .rz8w .s3t b { font-size: 14px; font-weight: 700; letter-spacing: -.01em; }
.rz8w .s3t span { font-size: 12px; color: var(--mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .rz8w .s3.off .s3t b { color: var(--mut); font-weight: 600; }
.rz8w .s3.op .chv { transform: rotate(180deg); }
.rz8w .s3b { display: none; padding: 0 8px 14px; } .rz8w .s3.op .s3b { display: block; } .rz8w .s3b > .oba:first-child { margin-top: 2px; }
.rz8w .todo8 { display: flex; flex-direction: column; gap: 3px; margin: 2px 0 10px; padding: 12px 14px; border-radius: 14px; background: color-mix(in srgb, var(--acc) 8%, transparent); border: 1px solid color-mix(in srgb, var(--acc) 24%, transparent); }
.rz8w .todo8.late { background: var(--err-bg); border-color: color-mix(in srgb, var(--err-dot) 30%, transparent); }
.rz8w .todo8 .lab { font-size: 9.5px; letter-spacing: 1.3px; text-transform: uppercase; font-weight: 700; color: var(--acc); } .rz8w .todo8.late .lab { color: var(--err); }
.rz8w .todo8 b { font-size: 14px; } .rz8w .todo8 > span:not(.lab) { font-size: 12.5px; color: var(--mut); line-height: 1.45; } .rz8w .todo8 .oba { margin-top: 8px; }
/* hosté: řádky na jedné mřížce (sloupec UbyPort pevný), rozbalení = 3 zarovnané skupiny */
.rz8w .gl4 { display: flex; flex-direction: column; }
.rz8w .hrhd, .rz8w .hrh { display: grid; grid-template-columns: 26px minmax(0, 1fr) minmax(0, 1.15fr) 196px 22px; gap: 12px; align-items: center; }
.rz8w .hrhd { padding: 0 8px 8px; font-size: 9.5px; letter-spacing: 1.1px; text-transform: uppercase; color: var(--faint); font-weight: 600; border-bottom: 1px solid var(--hair); }
.rz8w .hrhd > span:nth-child(4) { justify-self: end; }
.rz8w .hr { border-bottom: 1px solid var(--hair); }
.rz8w .hrh { padding: 10px 8px; border-radius: 12px; cursor: pointer; }
@media (hover: hover) { .rz8w .hrh[data-rd]:hover { background: var(--glass-row); } }
.rz8w .hr.op > .hrh { background: var(--glass-row); border-radius: 12px 12px 0 0; }
.rz8w .hrn { color: var(--mut); font-weight: 700; font-variant-numeric: tabular-nums; }
.rz8w .hrm, .rz8w .hrd { display: flex; flex-direction: column; min-width: 0; } .rz8w .hrm b { font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rz8w .hrm > span, .rz8w .hrd > span { font-size: 12px; color: var(--mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .rz8w .hrd > span:first-child { color: var(--ink); font-size: 13px; }
.rz8w .hrm abbr { text-decoration: none; }
.rz8w .hru { justify-self: end; display: flex; gap: 4px; flex-wrap: wrap; justify-content: flex-end; } .rz8w .hr.op .hrh .chv { transform: rotate(180deg); }
.rz8w .hrb { padding: 6px 8px 14px 46px; background: var(--glass-row); border-radius: 0 0 12px 12px; }
.rz8w .hr.miss .hrh { cursor: default; } .rz8w .hr.ednew > .hrh { cursor: default; }
.rz8w .hr.miss .gm { display: inline-block; width: max-content; padding: 3px 10px; border-radius: 999px; border: 1px dashed var(--warn-line); color: var(--warn); font-size: 12px; font-weight: 600; }
.rz8w .gd4 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px 22px; }
.rz8w .gd4 section { display: flex; flex-direction: column; gap: 9px; min-width: 0; }
.rz8w .gd4 h5 { font-size: 11px; letter-spacing: .9px; text-transform: uppercase; color: var(--acc); font-weight: 700; }
.rz8w .kv4 { display: flex; flex-direction: column; gap: 1px; min-width: 0; } .rz8w .kv4 > span { font-size: 11.5px; color: var(--mut); } .rz8w .kv4 > b { font-size: 13px; font-weight: 600; overflow-wrap: anywhere; }
.rz8w .kv4 > .tag { align-self: flex-start; margin-top: 2px; } .rz8w .pkr .cap.warnt { color: var(--warn); font-weight: 700; }
.rz8w .rz-sig { display: block; max-height: 40px; max-width: 150px; margin-top: 3px; background: #fff; border: 1px solid var(--line); border-radius: 6px; }
.rz8w .rz-ghint { margin: 8px 0 0; }
.rz8w .hrb .oba { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--hair); }
.rz8w .gadd { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
@container (max-width: 560px) { .rz8w .hrhd, .rz8w .hrh { grid-template-columns: 24px minmax(0, 1fr) auto 20px; } .rz8w .hrd { display: none !important; } .rz8w .hrb { padding-left: 10px; } .rz8w .gd4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@container (max-width: 380px) { .rz8w .gd4 { grid-template-columns: 1fr; } }
/* úprava hosta v kartě */
.rz8w .ge4 { display: flex; flex-direction: column; gap: 14px; padding-top: 4px; }
.rz8w .gd4.ed { display: flex; flex-direction: column; gap: 0; }
.rz8w .gd4.ed section { gap: 10px; padding: 14px 0; border-top: 1px solid var(--hair); } .rz8w .gd4.ed section:first-child { border-top: 0; padding-top: 4px; }
.rz8w .gd4.ed .fld > span { font-size: 11.5px; color: var(--mut); }
.rz8w .gd4.ed .fld.chg > span::after { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--warn-dot); margin-left: 4px; }
.rz8w .gd4.ed .fld.chg .inp { border-color: color-mix(in srgb, var(--warn-dot) 55%, transparent); }
.rz8w .ge2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 14px; align-items: start; } .rz8w .ge2 > .full { grid-column: 1 / -1; }
@container (max-width: 480px) { .rz8w .ge2 { grid-template-columns: 1fr; } }
.rz8w .rz-seg { margin: 0; width: max-content; max-width: 100%; } .rz8w .rz-seg button { flex: none; padding: .38rem .8rem; font-size: 12px; }
.rz8w .gsw { border-radius: 12px; border: 1px solid var(--glass-in-line); background: var(--glass-in-bg); } .rz8w .gsw.on { border-color: color-mix(in srgb, var(--acc) 40%, transparent); }
.rz8w .gswh { display: flex; align-items: flex-start; gap: 10px; width: 100%; padding: 9px 10px; text-align: left; color: var(--ink); }
.rz8w .gswh .switch { margin-top: 1px; pointer-events: none; } .rz8w .gswh .tx { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.rz8w .gswh b { font-size: 12.5px; font-weight: 600; } .rz8w .gswh .tx span { font-size: 11px; color: var(--mut); line-height: 1.35; }
.rz8w .gsw.chg .gswh b::after { content: ''; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--warn-dot); margin-left: 6px; vertical-align: middle; }
.rz8w .gswb { padding: 0 10px 10px; display: flex; flex-direction: column; gap: 10px; }
.rz8w .gmore { font-size: 12px; } .rz8w .gmore .rzi { width: 12px; height: 12px; } .rz8w .gehint { margin: -4px 0 0; }
.rz8w .genew { margin: 0; display: flex; align-items: center; gap: 7px; } .rz8w .genew .rzi { color: var(--acc); }
.rz8w .gecor { display: flex; gap: 12px; align-items: flex-start; padding: 12px 14px; border-radius: 14px; background: var(--warn-bg); border: 1px solid color-mix(in srgb, var(--warn-dot) 30%, transparent); }
.rz8w .gecor .tx { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; } .rz8w .gecor b { font-size: 13px; } .rz8w .gecor .tx > span { font-size: 12px; color: var(--mut); } .rz8w .gecor .inp { margin-top: 6px; }
.rz8w .ge4f { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding-top: 12px; border-top: 1px solid var(--hair); } .rz8w .gecnt { margin-left: 4px; }
/* příjezd, odjezd a úklid */
.rz8w .tr3 { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-top: 1px solid var(--hair); flex-wrap: wrap; } .rz8w .tr3:first-child { border-top: 0; padding-top: 0; }
.rz8w .tr3 .tx { flex: 1; min-width: 12rem; display: flex; flex-direction: column; } .rz8w .tr3 .tx b { font-size: 13.5px; } .rz8w .tr3 .tx span { font-size: 12.5px; color: var(--mut); } .rz8w .tr3 .tx s { margin-left: 4px; }
.rz8w .trr { display: flex; align-items: center; gap: 8px; margin-left: auto; flex-wrap: nowrap; }
.rz8w .ted { margin: 2px 0 10px 42px; padding: 12px; border-radius: 14px; background: var(--glass-row); display: flex; flex-direction: column; gap: 8px; } .rz8w .ted .fld { max-width: 180px; }
.rz8w .ted.rz-gone, .rz8w .ted.rz-dob { margin-left: 0; } .rz8w .ted.rz-gone .fld, .rz8w .ted.rz-dob .fld { max-width: none; } .rz8w .ted > b { font-size: 13.5px; }
.rz8w .eff { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; font-size: 12.5px; color: var(--mut); line-height: 1.45; }
.rz8w .eff li { display: flex; gap: 8px; align-items: flex-start; } .rz8w .eff .rzi { color: var(--acc); margin-top: 2px; }
.rz8w .gonebar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding-top: 12px; border-top: 1px solid var(--hair); } .rz8w .gonebar .btn:not(:disabled) { color: var(--warn); }
/* cena a doklady */
.rz8w .mrs { padding: 4px 14px; border-radius: 14px; background: var(--glass-in-bg); border: 1px solid var(--glass-in-line); }
.rz8w .mrs > .rz-empty { margin: 8px 0; border: 0; padding: 4px 0; }
.rz8w .mr { display: flex; align-items: baseline; gap: 12px; padding: 9px 0; border-top: 1px solid var(--hair); font-size: 13px; } .rz8w .mr:first-child { border-top: 0; }
.rz8w .mr .l { flex: 1; min-width: 0; } .rz8w .mr .l small { display: block; font-size: 11.5px; color: var(--mut); margin-top: 1px; }
.rz8w .mr .v { white-space: nowrap; font-variant-numeric: tabular-nums; font-weight: 600; } .rz8w .mr.sum .l, .rz8w .mr.sum .v { font-weight: 700; }
.rz8w .mr.tot { border-top: 1.5px solid var(--ink); padding-top: 10px; } .rz8w .mr.tot .l { font-weight: 700; } .rz8w .mr.tot .v { font-size: 16px; font-weight: 700; }
.rz8w .dh3 { display: flex; align-items: baseline; gap: 8px; margin: 16px 0 6px; } .rz8w .dh3 b { font-size: 13.5px; }
.rz8w .dr3 { display: flex; align-items: center; gap: 10px; padding: 9px 0; border-top: 1px solid var(--hair); flex-wrap: wrap; }
.rz8w .dr3 .tx { flex: 1; min-width: 12rem; display: flex; flex-direction: column; } .rz8w .dr3 .tx b { font-size: 13px; } .rz8w .dr3 .tx span { font-size: 12px; color: var(--mut); }
/* výběr apartmánu */
.rz8w .pk { display: flex; flex-direction: column; gap: 10px; }
.rz8w .pkt { display: flex; gap: 8px; align-items: center; } .rz8w .pkq { position: relative; flex: 1; min-width: 0; display: flex; align-items: center; } .rz8w .pkq > .rzi { position: absolute; left: 12px; color: var(--faint); } .rz8w .pkq .inp { padding-left: 36px; }
.rz8w .pkp { display: flex; gap: 6px; flex-wrap: wrap; }
.rz8w .pkl { display: flex; flex-direction: column; gap: 4px; max-height: 300px; overflow-y: auto; overscroll-behavior: contain; padding: 4px; margin: 0 -4px; border-radius: 14px; background: color-mix(in srgb, var(--glass-in-bg) 40%, transparent); }
.rz8w .pkr { display: grid; grid-template-columns: minmax(62px, auto) minmax(0, 1fr) auto auto; gap: 10px; align-items: center; width: 100%; min-height: 44px; padding: 6px 10px; border: 1px solid transparent; border-radius: 11px; color: var(--ink); text-align: left; }
@media (hover: hover) { .rz8w .pkr:not(.busy):hover { background: var(--glass-row); } }
.rz8w .pkr .c { font-weight: 700; font-size: 13.5px; white-space: nowrap; } .rz8w .pkr .m { font-size: 12.5px; color: var(--mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rz8w .pkr .cap { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: var(--mut); font-variant-numeric: tabular-nums; } .rz8w .pkr .cap .rzi { width: 13px; height: 13px; }
.rz8w .pkr.busy { opacity: .55; cursor: not-allowed; } .rz8w .pkr.on { border-color: var(--acc); background: var(--acc-soft); }
.rz8w .pkf { font-size: 12px; color: var(--mut); } .rz8w .pkf b { color: var(--ok); } .rz8w .pke { padding: 14px; text-align: center; font-size: 12.5px; color: var(--mut); }
.rz8w .pks { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 14px; border: 1px solid color-mix(in srgb, var(--acc) 35%, transparent); background: var(--acc-soft); }
.rz8w .pks.busy { border-color: color-mix(in srgb, var(--err-dot) 40%, transparent); background: var(--err-bg); }
.rz8w .pks .t { flex: 1; min-width: 0; display: flex; flex-direction: column; } .rz8w .pks .t b { font-size: 14px; } .rz8w .pks .t span { font-size: 12px; color: var(--mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* Přidat rezervaci */
.rz8w .rza8 { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.rz8w .stn { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; background: var(--prim-bg); color: var(--prim-ink); font-size: 12px; font-weight: 700; margin-right: 9px; }
.rz8w .ndn { display: flex; align-items: center; gap: 7px; margin-top: 12px; font-size: 13px; color: var(--mut); } .rz8w .ndn b { color: var(--ink); } .rz8w .ndn .rzi { color: var(--acc); }
.rz8w .tipb { display: flex; align-items: flex-start; gap: 9px; margin-top: 14px; padding: 10px 12px; border-radius: 12px; background: var(--acc-soft); font-size: 12.5px; line-height: 1.5; } .rz8w .tipb .rzi { color: var(--acc); margin-top: 2px; }
/* režim úprav: volby s „Co se stane“ */
.rz8w .rmw { display: flex; flex-direction: column; gap: 12px; }
.rz8w .rmg { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.rz8w .rma { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 72px; padding: 12px 14px; border-radius: 16px; text-align: left; color: var(--ink); }
@media (hover: hover) { .rz8w .rma:not(.off):hover { box-shadow: 0 0 0 1.5px var(--acc), var(--glass-shadow); } }
.rz8w .rma .icq { width: 36px; height: 36px; border-radius: 11px; } .rz8w .rma .t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.rz8w .rma .t b { font-size: 14px; } .rz8w .rma .t span { font-size: 12px; color: var(--mut); line-height: 1.4; } .rz8w .rma .chv { display: flex; color: var(--faint); }
.rz8w .rma.off { opacity: .55; cursor: default; } .rz8w .rma.off .t b { color: var(--mut); }
.rz8w .rmdel { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 4px 4px 0; }
.rz8w .rmf { display: flex; flex-direction: column; gap: 14px; } .rz8w .rmf .rzph { margin-bottom: 0; }
.rz8w .rmph { font-size: 10px; letter-spacing: 1.2px; text-transform: uppercase; font-weight: 700; color: var(--faint); margin-bottom: -6px; }
.rz8w .eff8 { list-style: none; margin: 0; padding: 4px 14px; border-radius: 14px; background: var(--glass-in-bg); border: 1px solid var(--glass-in-line); }
.rz8w .eff8 li { display: flex; gap: 10px; align-items: flex-start; padding: 9px 0; border-top: 1px solid var(--hair); font-size: 13px; line-height: 1.45; } .rz8w .eff8 li:first-child { border-top: 0; }
.rz8w .eff8 li .rzi { width: 15px; height: 15px; margin-top: 2px; color: var(--faint); } .rz8w .eff8 li.acc .rzi { color: var(--acc); } .rz8w .eff8 li.warn .rzi { color: var(--warn); } .rz8w .eff8 li.err .rzi, .rz8w .eff8 li.err b { color: var(--err); }
.rz8w .rmt { font-size: 17px; margin: 2px 0 10px; }
@media (max-width: 1180px) { .rz8, .rz8w .rza8 { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .rz8w .s3.acc > .s3h::before, .rz8w .s3.err > .s3h::before, .rz8-foot.on { animation: none; } }

/* ---------- seznam: filtr apartmánu vedle filtru stavu (PC), na telefonu domeček v hlavičce a kapsle „Jen BYT“ ---------- */
.rz-frow { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 0 0 .8rem; } .rz-frow > .res-seg { margin: 0; }
.rz-aptf { position: relative; display: inline-flex; align-items: center; margin: 0; } .rz-aptf > .rzi { position: absolute; left: 12px; width: 15px; height: 15px; color: var(--faint); pointer-events: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.rz-aptf select { width: auto; height: 38px !important; border-radius: 999px; padding-left: 34px; padding-right: 30px; font-weight: 600; font-size: .82rem; background-color: var(--neu-bg); border-color: transparent; }
.rz-aptf.on select { background-color: var(--acc-soft); color: var(--acc); } .rz-aptf.on > .rzi { color: var(--acc); }
/* Safari (Marco 26. 10. 2026: „po výběru nemovitosti se filtr v horním baneru špatně vykresluje“ — UbyPort, Domovní kniha): select se systémovým
   vzhledem kreslí WebKit jako nabídku macOS a zahodí vlastní odsazení (padding-left 34 px → 0), název bytu pak jel přes domeček. Proto vlastní vzhled
   bez systémové nabídky a šipka jako ::after kapsle — v Safari, Chromu i Firefoxu stejně. */
.rz-aptf select { -webkit-appearance: none; appearance: none; background-image: none; }
.rz-aptf::after { content: ''; position: absolute; right: 14px; top: 50%; width: 6px; height: 6px; margin-top: -5px; border-right: 2px solid var(--faint); border-bottom: 2px solid var(--faint); transform: rotate(45deg); pointer-events: none; }
.rz-aptf.on::after { border-color: var(--acc); }
.rz-aptib { position: relative; margin: 0; cursor: pointer; } .rz-aptib .rzi { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.rz-aptib select { position: absolute; inset: 0; width: 100%; height: 100% !important; opacity: 0; cursor: pointer; font-size: 16px; }
.rz-aptib.on { border-color: var(--acc); background: var(--acc-soft); color: var(--acc); }
.rz-aptib .bd { position: absolute; top: -3px; right: -3px; width: 10px; height: 10px; border-radius: 50%; background: var(--acc); border: 2px solid var(--panel); }
.rz-aptchip { display: flex; align-items: center; gap: 8px; margin: -2px 0 10px; padding: 6px 6px 6px 12px; border-radius: 999px; background: var(--acc-soft); color: var(--acc); font-size: .8rem; width: max-content; max-width: 100%; }
.rz-aptchip > span { color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .rz-aptchip .rzi { width: 14px; height: 14px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.rz-aptchip button { width: 24px; height: 24px; flex: none; margin: 0; padding: 0; border: 0; border-radius: 50%; background: var(--glass-bg); color: var(--mut); box-shadow: none; display: flex; align-items: center; justify-content: center; }
.rz-aptchip button .rzi { width: 12px; height: 12px; }
/* telefon: jednoduché karty (jméno, byt · termín · noci, stav + 5 teček) */
.rcl { display: flex; flex-direction: column; gap: 8px; margin: 4px 0 10px; }
.rcard { display: flex; align-items: center; gap: 12px; width: 100%; margin: 0; padding: 12px 12px 12px 0; border-radius: 16px; text-align: left; color: var(--ink); overflow: hidden; font-weight: 400;
  background: var(--glass-bg); border: 1px solid var(--glass-edge); box-shadow: var(--glass-shadow); }
.rcard.dim { opacity: .6; }
.rcard .rcb { width: 4px; align-self: stretch; border-radius: 0 4px 4px 0; flex: none; }
.rcard .rcm { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; } .rcard .rcm b { font-size: .92rem; } .rcard .rcm > span { font-size: .76rem; color: var(--mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rcard .rcs { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; flex: none; }
.rcard .rdots { display: flex; gap: 3px; } .rcard .rdots i { width: 7px; height: 7px; border-radius: 50%; background: var(--hair); } .rcard .rdots i.ok { background: var(--ok-dot); } .rcard .rdots i.warn { background: var(--warn-dot); } .rcard .rdots i.err { background: var(--err-dot); } .rcard .rdots i.acc { background: var(--acc); }
.rcard .errt { color: var(--err); }
@media (max-width: 920px) {
  .rz-list .res-cnt { display: none; }   /* telefon: hlavička jen „Rezervace ⓘ · domeček · kalendář · ⟳ · +“ (Marco 24. 10. 2026: filtry zabíraly třetinu displeje) */
  .rz-frow { margin: .5rem 0 .6rem; } .rz-frow > .rz-aptf { display: none; }
  .rz-frow > .res-seg.rz-fseg { width: 100%; }
  .res-seg.res-seg-2l.rz-fseg button { flex-direction: row; justify-content: center; gap: 4px; padding: .42rem .1rem; font-size: .76rem; }
  .res-seg.res-seg-2l.rz-fseg button > span:last-child { font-size: .74rem; color: var(--faint); font-weight: 500; }
  .res-seg.res-seg-2l.rz-fseg button.on > span:last-child { color: inherit; opacity: .75; }
}

/* ---------- telefon: detail a Přidat rezervaci jako stránka v sekci ---------- */
.rz8p { display: flex; flex-direction: column; gap: 12px; padding-bottom: 8px; }
.rz8p-bar { display: flex; align-items: center; gap: 8px; min-height: 40px; } .rz8p-bar .sp { flex: 1; }
.rz8-back.res-x { position: static; z-index: auto; display: inline-flex; align-items: center; gap: 2px; padding: 6px 0; font-size: 15px; font-weight: 500; line-height: 1.2; color: var(--acc); }
.rz8-back .rzi { width: 20px; height: 20px; }
.rz8p-bar .btn.hed { width: 38px; height: 38px; padding: 0; } .rz8p-bar .btn.hed span { display: none; } .rz8p-bar .rz8-nav span { display: none; }
.rz8p-hd { padding: 14px; } .rz8p-hd h2 { font-size: 20px; } .rz8p-hd .rz8-t h2 { font-size: 20px; }
.rz8p .nxt { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding: 12px; border-radius: 18px; border: 1px solid transparent; }
.rz8p .nxt .icq { width: 36px; height: 36px; border-radius: 11px; } .rz8p .nxt .tx { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.rz8p .nxt .lab { font-size: 9.5px; letter-spacing: 1.3px; text-transform: uppercase; font-weight: 700; } .rz8p .nxt b { font-size: 14.5px; } .rz8p .nxt .tx > span:last-child { font-size: 12.5px; color: var(--mut); line-height: 1.45; }
.rz8p .nxt .acts { display: flex; gap: 8px; flex-wrap: wrap; width: 100%; } .rz8p .nxt .acts .btn { flex: 1 1 auto; min-height: 40px; }
.rz8p .nxt.now { background: color-mix(in srgb, var(--acc) 9%, transparent); border-color: color-mix(in srgb, var(--acc) 26%, transparent); } .rz8p .nxt.now .lab { color: var(--acc); }
.rz8p .nxt.late { background: var(--err-bg); border-color: color-mix(in srgb, var(--err-dot) 32%, transparent); } .rz8p .nxt.late .lab { color: var(--err); }
.rz8p .ac8h { min-height: 60px; padding: 10px 12px; } .rz8p .ac8b { padding: 12px 12px 14px; }
/* souhrn řádků na telefonu: každá položka na vlastním řádku (telefon ani e-mail se nikdy nerozdělí) */
.rz8p .ac8h .t > .s { white-space: normal; display: flex; flex-direction: column; gap: 1px; overflow: visible; }
.rz8p .ac8h .t > .s .sep { display: none; } .rz8p .ac8h .t > .s .si { overflow: hidden; text-overflow: ellipsis; } .rz8p .ac8h .t > .s .si.wr { display: flex; flex-wrap: wrap; row-gap: 2px; }
/* časy na telefonu: štítky a tlačítka vždy pod textem vlevo */
.rz8p .tr3 { display: grid; grid-template-columns: 30px minmax(0, 1fr); column-gap: 12px; row-gap: 8px; align-items: center; }
.rz8p .tr3 > .icq { align-self: start; } .rz8p .tr3:has(> .trr) > .icq { grid-row: span 2; } .rz8p .tr3 > .tx { min-width: 0; }
.rz8p .tr3 > .trr { grid-column: 2; margin: 0; justify-content: flex-start; flex-wrap: wrap; } .rz8p .ted { margin-left: 0; }
.rz8p .rzg2, .rz8p .rza8, .rz8p .rmg { grid-template-columns: 1fr; } .rz8p .rzg3.pr { grid-template-columns: 1fr 1fr; } .rz8p .rzg3.pr > :last-child { grid-column: 1 / -1; }
.rz8p .s3b { padding-left: 4px; padding-right: 0; }
.rz8p .pkp { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin: 0 -2px; padding: 0 2px; } .rz8p .pkp::-webkit-scrollbar { display: none; } .rz8p .pkp .chipb { flex: none; }
.rz8p .pkr { grid-template-columns: minmax(54px, auto) minmax(0, 1fr) auto; } .rz8p .pkr .tag { grid-column: 2 / -1; justify-self: start; margin-top: -4px; } .rz8p .pkl { max-height: 340px; }
.rz8p-foot.rz8-foot { position: sticky; bottom: calc(env(safe-area-inset-bottom, 0px) + 8px); z-index: 6; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 10px 12px; border-radius: 16px;
  background: color-mix(in srgb, var(--panel) 92%, transparent); -webkit-backdrop-filter: blur(20px) saturate(1.5); backdrop-filter: blur(20px) saturate(1.5); border: 1px solid var(--glass-edge); box-shadow: var(--glass-shadow), 0 10px 30px rgba(0,0,0,.18); animation: none; }
.rz8p-foot .btn { flex: 1 1 auto; min-height: 44px; } .rz8p-foot .dirty, .rz8p-foot .note, .rz8p-foot .sp { display: none; }
.rz8p .hrm > span { white-space: normal; }   /* telefon: „nar. … · stát · Dítě“ se raději zalomí, než aby se usekl */

/* ============================================================
   Domovní kniha + UbyPort — nové rozvržení (Marco 25. 10. 2026; klikací Q65uQWENu… a DBxoimn2…, plátna 3ardB5sQ… a HxqHF2ZW…)
   kp-* = společné (PC i telefon), kpm-* = telefon. Kniha = návrh 1 + detail hosta 1, UbyPort = návrh 1. Panely z mléčného skla (--glass-*).
   ============================================================ */
.kpi { width: 15px; height: 15px; flex: none; }
.kp-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.kp-head > .px-st { margin: 0; }
.kp-head > .sp, .kp-fr > .sp, .kp-bkh > .sp, .kp-df > .sp, .kp-dlfoot > .sp, .kp-dll > .sp, .kp-bar > .sp, .kpm-h > .sp { flex: 1 1 0; min-width: 4px; }
.kp-btn, .kp-df .mini, .kp-bar .mini, .kp-dlfoot .mini, .kp-t .kp-ra .mini { display: inline-flex; align-items: center; justify-content: center; gap: 6px; width: auto; margin: 0; }
.kp-fr { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 0 0 1rem; position: relative; z-index: 5; }
.kp-fr .res-seg { margin: 0; }
.res-seg.kp-seg { display: inline-flex; flex-wrap: nowrap; margin: 0; }
.res-seg.kp-seg button { flex: none; display: inline-flex; align-items: center; gap: 6px; padding: .45rem .95rem; }
.kp-dot { width: 7px; height: 7px; border-radius: 50%; display: inline-block; flex: none; background: var(--faint); }
.tag > .kp-dot { margin-right: 5px; vertical-align: 1px; }
.kp-dg > section > .tag, .kp-dg > section > .kp-sig { align-self: flex-start; }
.kp-dot.ok { background: var(--ok-dot); } .kp-dot.warn { background: var(--warn-dot); } .kp-dot.err { background: var(--err-dot); }
.kp-apt { flex: none; } .kp-apt select { max-width: 16rem; text-overflow: ellipsis; }
.kp-fx { display: inline-flex; align-items: center; gap: 6px; width: auto; height: 32px; margin: 0; padding: 0 12px 0 10px; border-radius: 999px; border: 0; background: var(--acc-soft); color: var(--acc); font-size: .8rem; font-weight: 600; box-shadow: none; }
.kp-fx .kpi { width: 13px; height: 13px; }
.kp-srch { position: relative; display: flex; align-items: center; flex: 1 1 240px; min-width: 200px; max-width: 330px; margin: 0; }
.kp-srch > .kpi { position: absolute; left: 13px; color: var(--faint); pointer-events: none; }
.kp-srch input { width: 100%; height: 38px; margin: 0; border-radius: 999px; padding: 0 2.2rem 0 2.3rem; background: var(--glass-in-bg); border: 1px solid var(--glass-in-line); }
.kp-srch input::-webkit-search-cancel-button { display: none; }
.kp-srch[hidden] { display: none; }
.kp-clr { position: absolute; right: 5px; width: 28px; height: 28px; margin: 0; padding: 0; border: 0; border-radius: 50%; background: transparent; box-shadow: none; color: var(--faint); display: flex; align-items: center; justify-content: center; }
.kp-clr .kpi { width: 13px; height: 13px; }
/* adresář vlevo (rozvržení beze změny, mléčné sklo + tečky stavu) */
.pol-grid.kp-grid { grid-template-columns: 14.5rem minmax(0, 1fr); gap: 1.2rem; }
.dir-panel.kp-dir { border: 1px solid var(--glass-edge); background: var(--glass-bg); box-shadow: var(--glass-shadow); -webkit-backdrop-filter: var(--glass-filter); backdrop-filter: var(--glass-filter); border-radius: 16px; padding: .75rem .5rem .7rem; position: relative; z-index: 4; }
.kp-dcap { font-size: .64rem; text-transform: uppercase; letter-spacing: 1.3px; color: var(--faint); font-weight: 600; padding: 0 .6rem .55rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kp-yr { width: 100%; margin: 0; display: flex; align-items: center; justify-content: space-between; padding: .5rem .6rem; border: 0; background: transparent; box-shadow: none; color: var(--ink); font-weight: 650; font-size: .95rem; border-radius: 10px; }
.kp-yr .kpi { color: var(--faint); transition: transform .2s; } .kp-yr.open .kpi { transform: rotate(180deg); }
.kp-yr:hover, .kp-mon:hover { background: var(--glass-row); filter: none; }
.kp-mon { width: 100%; margin: 0; display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .55rem .6rem .55rem .85rem; border: 0; border-top: 1px solid var(--hair); background: transparent; box-shadow: none; color: var(--ink); font-weight: 400; font-size: .88rem; text-align: left; border-radius: 10px; position: relative; }
.kp-mon.on { background: var(--sn-on-bg); box-shadow: var(--sn-on-shadow); font-weight: 650; border-top-color: transparent; }
.kp-mon.on + .kp-mon { border-top-color: transparent; }
.kp-mon.multi::before { content: ''; position: absolute; left: 4px; top: 9px; bottom: 9px; width: 3px; border-radius: 3px; background: var(--acc); }
.kp-cnt { display: inline-flex; align-items: center; gap: .45rem; font-size: .78rem; color: var(--mut); font-variant-numeric: tabular-nums; }
.kp-cnt b { color: var(--ink); font-weight: 650; } .kp-cnt em { font-style: normal; color: var(--warn); font-weight: 600; font-size: .72rem; }
.kp-dleg { display: flex; flex-wrap: wrap; gap: .25rem .8rem; padding: .7rem .6rem .1rem; margin-top: .4rem; border-top: 1px solid var(--hair); font-size: .72rem; color: var(--faint); }
.kp-dleg span { display: inline-flex; align-items: center; gap: .3rem; }
.per-wrap.kp-perw { display: block; margin: .55rem .15rem 0; }
.kp-per { width: 100%; margin: 0; display: flex; align-items: center; gap: .5rem; padding: .5rem .65rem; border: 1px dashed var(--hair); border-radius: 10px; background: transparent; box-shadow: none; color: var(--acc); font-size: .8rem; font-weight: 600; text-align: left; }
.kp-per:hover { background: var(--glass-row); filter: none; } .kp-per.on { border-style: solid; border-color: transparent; background: var(--acc-soft); }
/* panel Vlastní období: kotví k adresáři a otvírá se DOLŮ vedle něj (nahoru lezl pod hlavičkovou kartu a přes něj prosvítal přepínač — Marco 25. 10. 2026);
   neprůhledný (--panel), adresář s otevřeným panelem nad ostatním obsahem karty (i nad plovoucí lištou Odeslat) */
.per-wrap.kp-perw { position: static; }
.kp-perw .per-pop { top: 0; bottom: auto; left: calc(100% + 12px); z-index: 30; box-shadow: 0 18px 48px rgba(0,0,0,.32); }
.dir-panel.kp-dir:has(.per-pop) { z-index: 12; }
@media (max-width: 1100px) { .pol-grid.kp-grid { grid-template-columns: 1fr; } .kp-perw .per-pop { top: calc(100% + 6px); left: 0; } }
/* kniha / seznam vpravo */
.kp-body { min-width: 0; }
.kp-bkh { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; padding: .15rem 0 .7rem; border-bottom: 1px solid var(--hair); margin-bottom: .8rem; }
.kp-bkh h2 { margin: 0 .1rem 0 0; font-size: 1.2rem; letter-spacing: -.01em; }
.kp-meta { font-size: .8rem; color: var(--mut); } .kp-pdfn { color: var(--warn); font-weight: 600; }
.kp-info { padding: .8rem 1.1rem; border-radius: 14px; margin: 0 0 .9rem; background: var(--glass-bg); border: 1px solid var(--glass-edge); box-shadow: var(--glass-shadow); -webkit-backdrop-filter: var(--glass-filter); backdrop-filter: var(--glass-filter); line-height: 1.7; font-size: .9rem; }
.kp-p { font-size: .85rem; color: var(--mut); margin: -.2rem 0 .7rem; line-height: 1.5; }
.kp-et { color: var(--err); font-weight: 600; } .kp-wt { color: var(--warn); font-weight: 600; }
/* podpis VŽDY tmavý tah na bílé dlaždici (i v tmavém vzhledu; Marco 25. 10. 2026) */
.kp-sig { display: inline-flex; align-items: center; justify-content: center; width: 92px; height: 34px; padding: 3px 8px; box-sizing: border-box; border-radius: 8px; background: #fff; border: 1px solid rgba(20,24,40,.12); box-shadow: 0 1px 3px rgba(0,0,0,.14); vertical-align: middle; }
.kp-sig img { display: block; max-width: 100%; max-height: 100%; }
.kp-sig.big { width: 100%; max-width: 260px; height: 90px; padding: 8px 14px; border-radius: 12px; }
.kp-sig.sm { width: 64px; height: 26px; padding: 2px 6px; border-radius: 6px; }
table.t.dk2 td.kp-sigc { overflow: visible; }
/* rozbalený host — detail 1 „Tři skupiny“ (kniha) / Co půjde policii · Host · Pobyt (UbyPort) */
tr.gdet.kp-det > td { background: var(--glass-row); padding: 1rem 1rem 1rem 2rem; white-space: normal; }
.kp-dg { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) 15rem; gap: 1.1rem; align-items: start; }
.kp-dg.kp-dg3 { grid-template-columns: 1.15fr 1fr 1fr; }
.kp-dg > section { display: flex; flex-direction: column; gap: .55rem; min-width: 0; }
.kp-dg h4 { display: flex; align-items: center; gap: .4rem; margin: 0; font-size: .78rem; font-weight: 650; color: var(--mut); text-transform: none; letter-spacing: 0; }
.kp-dg h4 .kpi { width: 14px; height: 14px; color: var(--acc); }
.kp-kv { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.kp-kv > span { font-size: .62rem; text-transform: uppercase; letter-spacing: 1px; color: var(--faint); font-weight: 600; }
.kp-kv > b { font-weight: 400; font-size: .88rem; line-height: 1.4; overflow-wrap: anywhere; } .kp-kv > b strong { font-weight: 650; }
.kp-kv code { font-size: .8rem; padding: 1px 6px; border-radius: 6px; background: var(--neu-bg); }
.kp-df { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; margin-top: .9rem; padding-top: .75rem; border-top: 1px solid var(--hair); font-size: .82rem; }
.kp-dfs { display: inline-flex; align-items: center; gap: .45rem; color: var(--mut); min-width: 0; flex-wrap: wrap; } .kp-dfs .kpi { color: var(--faint); width: 14px; height: 14px; }
.kp-sep { width: 1px; height: 16px; background: var(--hair); }
.kp-a { display: inline-flex; align-items: center; gap: 6px; text-decoration: none; padding: .38rem .75rem; background: var(--btn-bg); border: 1px solid var(--btn-line); border-radius: 9px; color: var(--ink); font-size: .8rem; font-weight: 600; white-space: nowrap; }
.kp-a .kpi { width: 14px; height: 14px; }
.msg.kp-note { display: block; margin: .7rem 0 0; }
/* Evidenční kniha — rozbalený host, návrh 1 „Tři skupiny“ (26. 10. 2026): stejné rozložení kp-det; otevřený řádek podbarvený sklem
   (i odpuštěný — žlutá se vrátí po zavření), výběry na skle, poplatek s výpočtem, „Neuloženo“ až po změně */
table.t tr.ev-open > td { background: var(--glass-row); }
tr.ev-det [hidden] { display: none !important; }
.ev-dsel { width: 100%; max-width: 100%; margin: 2px 0 0; padding: .48rem .7rem; border-radius: 10px; font-size: .88rem; color: var(--ink);
  background-color: var(--glass-in-bg); border: 1px solid var(--glass-in-line); box-shadow: var(--glass-in-shadow); }
.ev-dsel.need { border-color: var(--warn); box-shadow: 0 0 0 3px var(--warn-bg); }
.ev-fee { display: flex; align-items: baseline; gap: .5rem; flex-wrap: wrap; }
.ev-fee b { font-size: 1.28rem; font-weight: 700; letter-spacing: -.02em; font-variant-numeric: tabular-nums; } .ev-fee b.z { color: var(--kid); }
p.ev-kid { margin: 0; font-size: .8rem; line-height: 1.45; }
.ev-dirty { display: inline-flex; align-items: center; gap: 6px; color: var(--warn); font-weight: 600; font-size: .82rem; }
/* UbyPort — Čeká */
.kp-t td.kp-ckc { padding-left: .4rem; } .kp-t td.kp-ra { text-align: right; }
.kp-ck { width: 18px !important; height: 18px; margin: 0; accent-color: var(--acc); cursor: pointer; }
tr.kp-bad > td { background: color-mix(in srgb, var(--err-bg) 55%, transparent); }
tr.msec.kp-gh > td > span { display: inline-flex; align-items: center; gap: .5rem; }
tr.msec.kp-gh em { font-style: normal; text-transform: none; letter-spacing: 0; font-weight: 500; color: var(--faint); margin-left: .3rem; }
tr.msec.kp-lat { cursor: pointer; } tr.msec.kp-lat:hover > td { background: var(--acc-soft); }
.kp-bar { position: sticky; bottom: 14px; z-index: 6; display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; margin-top: 1rem; padding: .6rem .7rem .6rem 1rem; border-radius: 16px; background: var(--panel); border: 1px solid var(--card-line); box-shadow: 0 14px 36px rgba(0,0,0,.22); }
.kp-bar .tx { display: flex; flex-direction: column; min-width: 0; font-size: .8rem; color: var(--mut); } .kp-bar .tx b { color: var(--ink); font-size: .9rem; }
/* okna Stáhnout PDF / Stáhnout doručenky / Období */
.px-modal.kp-dlg { max-width: 640px; }
.kp-dlp { margin: 0 0 .9rem; font-size: .85rem; color: var(--mut); line-height: 1.5; }
.kp-dls { display: flex; flex-direction: column; gap: .5rem; margin: 0 0 1rem; }
.kp-dll { display: flex; align-items: center; gap: .5rem; font-size: .64rem; text-transform: uppercase; letter-spacing: 1.2px; color: var(--faint); font-weight: 650; }
.kp-lnk { width: auto; margin: 0; padding: 0; border: 0; background: none; box-shadow: none; color: var(--acc); font-size: .8rem; font-weight: 600; text-transform: none; letter-spacing: 0; }
.kp-chips { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0 0 .2rem; }
.kp-achips { max-height: 8.5rem; overflow-y: auto; }
.kp-chip { width: auto; margin: 0; display: inline-flex; align-items: center; gap: .35rem; padding: .35rem .75rem; border-radius: 999px; border: 1px solid var(--btn-line); background: transparent; box-shadow: none; color: var(--mut); font-size: .8rem; font-weight: 500; }
.kp-chip:hover { filter: none; border-color: var(--faint); }
.kp-chip.on { border-color: var(--acc); background: var(--acc-soft); color: var(--ink); font-weight: 600; } .kp-chip .kpi { width: 12px; height: 12px; color: var(--acc); }
.kp-chip span { color: var(--faint); font-weight: 500; }
.kp-dlr { display: flex; align-items: center; gap: .5rem; font-size: .85rem; } .kp-dlr .kpi { color: var(--acc); } .kp-dlr span { font-weight: 600; }
.kp-dli { display: flex; gap: .6rem; flex-wrap: wrap; } .kp-dli label { display: flex; flex-direction: column; gap: .25rem; flex: 1 1 9rem; font-size: .78rem; color: var(--mut); margin: 0; } .kp-dli input { margin: 0; }
.kp-dlsum { padding: .8rem .95rem; border-radius: 14px; margin: 0 0 .9rem; background: var(--glass-bg); border: 1px solid var(--glass-edge); box-shadow: var(--glass-shadow); display: flex; flex-direction: column; gap: .45rem; }
.kp-dlh { display: flex; flex-direction: column; gap: 2px; } .kp-dlh b { font-size: .95rem; } .kp-dlh span { font-size: .8rem; color: var(--mut); line-height: 1.45; }
.kp-dlf { list-style: none; margin: 0; padding: 0; }
.kp-dlf li { display: flex; align-items: center; gap: .5rem; padding: .3rem 0; border-top: 1px solid var(--hair); font-size: .78rem; min-width: 0; } .kp-dlf li:first-child { border-top: 0; }
.kp-dlf li span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: ui-monospace, 'SF Mono', Menlo, monospace; font-size: .74rem; }
.kp-dlf li em { font-style: normal; color: var(--faint); flex: none; } .kp-dlf .kpi { color: var(--faint); width: 14px; height: 14px; }
.kp-dlsum p { margin: 0; font-size: .76rem; }
.kp-sw { width: 100%; margin: 0 0 .8rem; display: flex; align-items: center; gap: .6rem; padding: .4rem .2rem; border: 0; background: none; box-shadow: none; color: var(--ink); font-size: .85rem; font-weight: 500; text-align: left; }
.kp-sw:hover { filter: none; }
.kp-tgl { position: relative; width: 38px; height: 22px; flex: none; border-radius: 999px; background: var(--hair); transition: background .2s; }
.kp-tgl::after { content: ''; position: absolute; top: 2px; left: 2px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.3); transition: transform .2s; }
.kp-tgl.on { background: var(--acc); } .kp-tgl.on::after { transform: translateX(16px); }
.kp-dlfoot { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; padding-top: .8rem; border-top: 1px solid var(--hair); }
.kp-ynav { display: flex; align-items: center; justify-content: center; gap: .4rem; margin: 0 0 .4rem; } .kp-ynav b { min-width: 3.2rem; text-align: center; }
.kp-ib { width: 32px; height: 32px; margin: 0; padding: 0; border: 0; border-radius: 50%; background: transparent; box-shadow: none; color: var(--ink); display: inline-flex; align-items: center; justify-content: center; }
.kp-ib:hover:not(:disabled) { background: var(--glass-row); filter: none; } .kp-ib:disabled { opacity: .3; }
.kp-mgrid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .4rem; margin: 0 0 .7rem; }
.kp-mgrid button { width: auto; margin: 0; display: flex; flex-direction: column; align-items: center; gap: 2px; padding: .45rem .2rem; border-radius: 11px; border: 1px solid var(--btn-line); background: var(--btn-bg); box-shadow: none; color: var(--ink); }
.kp-mgrid button b { font-size: .84rem; font-weight: 600; } .kp-mgrid button span { display: inline-flex; align-items: center; gap: .25rem; font-size: .7rem; color: var(--mut); font-variant-numeric: tabular-nums; }
.kp-mgrid button.on { background: var(--prim-bg); border-color: transparent; color: var(--prim-ink); } .kp-mgrid button.on span { color: var(--prim-ink); }
.kp-mgrid button:disabled { opacity: .4; }
/* vysvětlivka ⓘ */
.kp-inf { position: relative; display: inline-flex; vertical-align: middle; }
.kp-inf > button { width: 22px; height: 22px; margin: 0; padding: 0; border: 0; border-radius: 999px; background: transparent; box-shadow: none; color: var(--faint); display: inline-flex; align-items: center; justify-content: center; cursor: help; }
.kp-inf > button .kpi { width: 15px; height: 15px; }
.kp-tip { position: absolute; top: calc(100% + 8px); left: -12px; z-index: 40; width: 320px; max-width: calc(100vw - 24px); box-sizing: border-box; padding: 11px 13px; border-radius: 14px; background: var(--stp-bg); border: 1px solid var(--stp-line); box-shadow: var(--stp-sh); font-size: .82rem; font-weight: 400; line-height: 1.55; color: var(--ink); text-transform: none; letter-spacing: 0; opacity: 0; visibility: hidden; transform: translateY(-4px); transition: opacity .16s, transform .16s, visibility 0s linear .16s; pointer-events: none; -webkit-backdrop-filter: blur(24px); backdrop-filter: blur(24px); }
.kp-inf.open .kp-tip, .kp-inf:focus-within .kp-tip { opacity: 1; visibility: visible; transform: none; transition: opacity .16s, transform .16s, visibility 0s; }
@media (hover: hover) { .kp-inf:hover .kp-tip { opacity: 1; visibility: visible; transform: none; transition: opacity .16s .12s, transform .16s .12s, visibility 0s; } .kp-inf:hover > button { color: var(--acc); } }
@media (max-width: 1220px) { .kp-dg { grid-template-columns: repeat(2, minmax(0, 1fr)); } .kp-dg.kp-dg3 { grid-template-columns: 1fr 1fr; } }
@media print { .kph-row > :not(.px-st), .kp-fr, .kp-dir, .kp-head .kp-btn, .kp-bar, .kpm-strip, .kpm-h .ibtn { display: none !important; } .pol-grid.kp-grid { grid-template-columns: 1fr; } }
/* telefon (≤ 920 px): stejná forma jako Rezervace, Úklidy A a rejstřík knih */
@media (max-width: 920px) {
  .card.kpm { display: flex; flex-direction: column; gap: .6rem; }
  .kpm-h { display: flex; align-items: center; gap: .4rem; }
  .kpm-h > .px-st { margin: 0; min-width: 0; }
  .kpm-h .ibtn { width: 38px; height: 38px; border-radius: 11px; position: relative; flex: none; }
  .kpm-h .ibtn svg { width: 17px; height: 17px; }
  .kp-aptib { cursor: pointer; } .kp-aptib select { position: absolute; inset: 0; width: 100%; height: 100% !important; opacity: 0; cursor: pointer; font-size: 16px; margin: 0; }
  .kp-aptib.on { background: var(--acc-soft); color: var(--acc); border-color: transparent; }
  .kp-bd { display: none; position: absolute; top: 6px; right: 6px; width: 7px; height: 7px; border-radius: 50%; background: var(--acc); box-shadow: 0 0 0 2px var(--panel); } .kp-aptib.on .kp-bd { display: block; }
  .kpm-book { width: 100%; margin: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 3px; padding: .6rem .8rem; border-radius: 14px; border: 1px solid var(--glass-edge); background: var(--glass-bg); box-shadow: var(--glass-shadow); color: var(--ink); text-align: left; font-weight: 400; }
  .kpm-book:hover { filter: none; }
  .kpm-book .t1 { display: flex; align-items: center; gap: .35rem; min-width: 0; max-width: 100%; font-size: .95rem; } .kpm-book .t1 b { white-space: nowrap; font-weight: 650; } .kpm-book .t1 .kpi { width: 14px; height: 14px; color: var(--acc); }
  .kpm-book .ap { color: var(--mut); font-size: .82rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .kpm-book .t2 { font-size: .76rem; color: var(--mut); line-height: 1.4; }
  .kpm-tags { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; font-size: .78rem; }
  .kpm-strip { position: sticky; top: var(--kp-mtop, 56px); z-index: 20; display: flex; align-items: center; gap: .45rem; padding: .4rem; border-radius: 16px; background: color-mix(in srgb, var(--panel) 82%, transparent); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); border: 1px solid var(--glass-edge); }
  .kpm-strip .res-seg.kp-seg { display: flex; flex: 1; min-width: 0; grid-template-columns: none; border-radius: 999px; padding: 3px; gap: 2px; }
  .kpm-strip .res-seg.kp-seg .seg-glide { border-radius: 999px; }
  .kpm-strip .res-seg.kp-seg button { flex: 1 1 auto; width: auto; min-width: 0; justify-content: center; padding: .42rem .3rem; font-size: .8rem; border-radius: 999px; gap: 4px; white-space: nowrap; }
  .kpm-strip .res-seg.kp-seg button span { margin-left: 0; }
  .kpm-strip .ibtn { width: 36px; height: 36px; border-radius: 11px; flex: none; }
  .kpm-strip .kp-srch, .kp-srch.kpm-srch { max-width: none; flex: 1 1 auto; min-width: 0; }
  .kpm-back { width: auto; margin: 0; display: inline-flex; align-items: center; gap: 4px; padding: .3rem .4rem; border: 0; background: transparent; box-shadow: none; color: var(--acc); font-weight: 600; font-size: .9rem; }
  .kpm-back .kpi { width: 16px; height: 16px; } .kpm-bt { flex: 1; text-align: right; font-size: .9rem; padding-right: .3rem; }
  .kpm-chip { display: flex; align-items: center; gap: 8px; align-self: flex-start; max-width: 100%; padding: 5px 6px 5px 12px; border-radius: 999px; background: var(--acc-soft); color: var(--acc); font-size: .8rem; }
  .kpm-chip > span { color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .kpm-chip .kpi { width: 14px; height: 14px; }
  .kpm-chip button { width: 24px; height: 24px; flex: none; margin: 0; padding: 0; border: 0; border-radius: 50%; background: var(--glass-bg); color: var(--mut); box-shadow: none; display: flex; align-items: center; justify-content: center; } .kpm-chip button .kpi { width: 12px; height: 12px; }
  #ubyTop:empty { display: none; } #ubyTop { display: flex; flex-direction: column; gap: .5rem; }
  .kpm-err { width: 100%; margin: 0; display: flex; align-items: center; gap: 8px; padding: .55rem .75rem; border-radius: 12px; border: 1px solid var(--err-line); background: var(--err-bg); color: var(--ink); box-shadow: none; font-size: .8rem; font-weight: 400; text-align: left; }
  .kpm-err > .kpi { color: var(--err); } .kpm-err span { flex: 1; min-width: 0; } .kpm-err .cv { color: var(--faint); width: 14px; height: 14px; }
  .kpm-gh { display: flex; align-items: center; gap: .45rem; flex-wrap: wrap; padding: .7rem .25rem .3rem; font-size: .66rem; letter-spacing: 1px; text-transform: uppercase; color: var(--mut); font-weight: 650; }
  .kpm-gh em { font-style: normal; text-transform: none; letter-spacing: 0; font-weight: 500; color: var(--faint); font-size: .74rem; }
  .kpm-gh.kpm-lat { cursor: pointer; border-radius: 10px; }
  .kpm-row { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; align-items: center; gap: .6rem; padding: .6rem .35rem; border-top: 1px solid var(--hair); border-radius: 10px; cursor: pointer; }
  .kpm-row.kpm-row2 { grid-template-columns: minmax(0, 1fr) auto; }
  .kpm-row.open { background: var(--glass-row); } .kpm-row.kp-bad { background: color-mix(in srgb, var(--err-bg) 55%, transparent); }
  .kpm-n { font-size: .74rem; color: var(--faint); text-align: center; font-variant-numeric: tabular-nums; }
  .kpm-t { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
  .kpm-t .l1 { display: flex; align-items: baseline; gap: .4rem; min-width: 0; } .kpm-t .l1 b { font-weight: 500; font-size: .9rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .kpm-t .l1 strong { font-weight: 700; }
  .kpm-t .c { font-size: .74rem; color: var(--mut); white-space: nowrap; flex: none; }
  .kpm-t .l2 { font-size: .74rem; color: var(--mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .kpm-t .l2 b { color: var(--ink); font-weight: 600; }
  .kpm-r { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; } .kpm-r.rr { flex-direction: row; align-items: center; gap: 8px; }
  .kpm-r .cv { width: 15px; height: 15px; color: var(--faint); }
  .kpm-dd { font-size: .74rem; color: var(--mut); white-space: nowrap; font-variant-numeric: tabular-nums; }
  .kp-ibs { width: 32px; height: 32px; flex: none; border-radius: 10px; border: 1px solid var(--btn-line); background: var(--btn-bg); color: var(--ink); display: inline-flex; align-items: center; justify-content: center; }
  .kpm-det { margin: 0 .1rem .5rem; padding: .8rem; border-radius: 14px; background: var(--glass-bg); border: 1px solid var(--glass-edge); box-shadow: var(--glass-shadow); }
  .kpm-det .kp-dg, .kpm-det .kp-dg.kp-dg3 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem .9rem; }
  .kpm-det .kp-dg > section.w, .kpm-det .kp-dg > section.kp-sgs, .kpm-det .kp-dg3 > section:first-child { grid-column: 1 / -1; }
  .kp-dg2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem .9rem; }
  .kpm-det .kp-sig.big { max-width: none; height: 88px; }
  .kpm-det .kp-df { gap: .5rem; } .kpm-det .kp-df .mini, .kpm-det .kp-df .kp-a { flex: 1 1 auto; justify-content: center; }
  .kpm-det .kp-sep { display: none; }
  .kpm-det .kp-dfs { flex-wrap: nowrap; align-items: flex-start; } .kpm-det .kp-dfs > .kpi { margin-top: 2px; }
  .kpm-bar { position: sticky; bottom: calc(env(safe-area-inset-bottom, 0px) + 10px); margin: .6rem 0 0; }
  .kpm-ml { display: flex; flex-direction: column; }
  .kpm-mr { width: 100%; margin: 0; display: flex; align-items: center; gap: .7rem; padding: .7rem .2rem; border: 0; border-top: 1px solid var(--hair); background: transparent; box-shadow: none; color: var(--ink); text-align: left; font-weight: 400; border-radius: 0; }
  .kpm-mr:first-child { border-top: 0; } .kpm-mr .ico { width: 36px; height: 36px; flex: none; border-radius: 11px; background: var(--acc-soft); color: var(--acc); display: inline-flex; align-items: center; justify-content: center; }
  .kpm-mr.err .ico { background: var(--err-bg); color: var(--err); } .kpm-mr .tx { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; } .kpm-mr .tx b { font-size: .9rem; font-weight: 600; } .kpm-mr .tx span { font-size: .76rem; color: var(--mut); }
  .kpm-mr .cv { width: 15px; height: 15px; color: var(--faint); }
  .kp-mgrid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .kp-dlfoot .mini { flex: 1 1 auto; min-height: 42px; }
}

/* ---------- hlavička v jednom řádku s nadpisem — návrh 2 „Lupa jako na telefonu“ (Marco 26. 10. 2026; klikací Q65uQWENu… a DBxoimn2…, plátna 5. / 4. kolo) ----------
   nadpis ⓘ · přepínač · apartmán · … · lupa · hlavní akce · ⋯. Karta = kontejner (container-type), řádek .kph-row uvnitř (kontejnerový dotaz nesmí stylovat sám kontejner). */
.kp-head.kph { display: block; container-type: inline-size; }
.kph-row { display: flex; align-items: center; gap: 12px; flex-wrap: nowrap; min-height: 38px; }
.kph-row > .px-st { margin: 0 .35rem 0 0; flex: none; white-space: nowrap; }
.kph-row > .sp { flex: 1 1 0; min-width: 4px; }
.kph-row > .res-seg.kp-seg, .kph-row > #domSigW, .kph-row > #domFx { flex: none; }
.kph-row > #domFx:empty { display: none; }
.kph-row > .kp-apt { flex: 0 1 auto; min-width: 0; overflow: hidden; border-radius: 999px; }
.kph-row > .kp-apt select { width: 100%; min-width: 0; max-width: 17rem; text-overflow: ellipsis; }   /* Safari u selectu „…“ neumí — o 2rem víc místa pro název bytu (26. 10. 2026) */
.kp-hr { display: flex; align-items: center; justify-content: flex-end; gap: 10px; flex: 0 1 auto; }
.kp-hib { width: 38px; height: 38px; flex: none; margin: 0; padding: 0; display: inline-flex; align-items: center; justify-content: center; border-radius: 11px; border: 1px solid var(--btn-line); background: var(--btn-bg); color: var(--ink); box-shadow: none; }
.kp-hib:hover:not(:disabled) { filter: none; border-color: var(--faint); }
.kp-hib:disabled { opacity: .6; }
.kp-hib .kpi { width: 17px; height: 17px; }
.kp-hr .kp-btn { height: 38px; flex: none; white-space: nowrap; }   /* nezalamovat — jinak je min. šířka skupiny menší a přeteče doleva přes kapsli */
.kp-sx { display: flex; align-items: center; justify-content: flex-end; flex: 0 1 auto; min-width: 38px; }
.kp-sx > .kp-srch { display: none; }
.kp-sx.open { flex: 0 1 18rem; min-width: 10rem; }
.kp-sx.open > .kp-srch { display: flex; flex: 1 1 auto; min-width: 0; max-width: none; animation: kpSxIn .22s ease; }
.kp-sx.open > .kp-sxb { display: none; }
@keyframes kpSxIn { from { opacity: 0; transform: translateX(14px); } to { opacity: 1; transform: none; } }
.kp-more { position: relative; flex: none; }
.kp-more.open > .kp-hib { background: var(--acc-soft); color: var(--acc); border-color: transparent; }
.kp-mm { display: none; position: absolute; top: calc(100% + 8px); right: 0; z-index: 40; min-width: 13rem; padding: 6px; border-radius: 14px; background: var(--panel); border: 1px solid var(--card-line); box-shadow: 0 18px 44px rgba(0,0,0,.28); flex-direction: column; }
.kp-more.open > .kp-mm { display: flex; }
.kp-mm button { width: 100%; margin: 0; display: flex; align-items: center; gap: 10px; padding: .6rem .75rem; border: 0; border-radius: 10px; background: transparent; box-shadow: none; color: var(--ink); font-weight: 600; font-size: .86rem; text-align: left; white-space: nowrap; }
.kp-mm button:hover { background: var(--glass-row); filter: none; }
.kp-mm button .kpi { color: var(--acc); width: 17px; height: 17px; }
.kph .kph-row > .kp-apt select option { color: var(--ink); }
@container (min-width: 1011px) { .kph-uby.sxo .kph-row > .kp-apt { flex: none; width: 38px; } .kph-uby.sxo .kph-row > .kp-apt::after { display: none; } .kph-uby.sxo .kph-row > .kp-apt select { width: 38px !important; max-width: 38px; padding: 0 !important; color: transparent; background-image: none; } .kph-uby.sxo .kph-row > .kp-apt > .rzi { left: 11.5px; } }   /* s otevřenou lupou je apartmán domeček (výběr zůstává) */
@container (min-width: 881px) { .kph-dom.sxo .kph-row > .kp-apt { flex: none; width: 38px; } .kph-dom.sxo .kph-row > .kp-apt::after { display: none; } .kph-dom.sxo .kph-row > .kp-apt select { width: 38px !important; max-width: 38px; padding: 0 !important; color: transparent; background-image: none; } .kph-dom.sxo .kph-row > .kp-apt > .rzi { left: 11.5px; } }
/* užší okno: otevřená lupa → hlavní akce jen ikonou a kapsle apartmánu domečkem; když se řádek nevejde, pravá skupina sjede na druhý řádek (hledání se roztáhne, kapsle zase s názvem) */
@container (max-width: 1100px) { .kph.sxo .kp-hr .kp-btn .tx { display: none; } .kph.sxo .kp-hr .kp-btn { width: 38px; padding: 0; } }
@container (max-width: 1010px) {   /* UbyPort: 4–5 záložek; hranice počítaná i se záložkou Chybná */
  .kph-uby .kph-row { flex-wrap: wrap; row-gap: 10px; } .kph-uby .kph-row > .sp { display: none; } .kph-uby .kph-row > .kp-hr { flex: 1 1 100%; }
  .kph-uby .kp-sx.open { flex: 1 1 auto; max-width: none; } .kph-uby.sxo .kp-hr .kp-btn .tx { display: inline; } .kph-uby.sxo .kp-hr .kp-btn { width: auto; padding: 0 .9rem; }
  .kph-uby .kph-row > .kp-apt { flex: none; width: 38px; } .kph-uby .kph-row > .kp-apt::after { display: none; } .kph-uby .kph-row > .kp-apt select { width: 38px !important; max-width: 38px; padding: 0 !important; color: transparent; background-image: none; } .kph-uby .kph-row > .kp-apt > .rzi { left: 11.5px; }   /* 1. řádek: nadpis · přepínač · domeček */
}
@container (max-width: 880px) {
  .kph-dom .kph-row { flex-wrap: wrap; row-gap: 10px; } .kph-dom .kph-row > .sp { display: none; } .kph-dom .kph-row > .kp-hr { flex: 1 1 100%; }
  .kph-dom .kp-sx.open { flex: 1 1 auto; max-width: none; } .kph-dom.sxo .kp-hr .kp-btn .tx { display: inline; } .kph-dom.sxo .kp-hr .kp-btn { width: auto; padding: 0 .9rem; }
  .kph-dom .kph-row > .kp-apt { flex: none; width: 38px; } .kph-dom .kph-row > .kp-apt::after { display: none; } .kph-dom .kph-row > .kp-apt select { width: 38px !important; max-width: 38px; padding: 0 !important; color: transparent; background-image: none; } .kph-dom .kph-row > .kp-apt > .rzi { left: 11.5px; }   /* 1. řádek: nadpis · přepínač · domeček */
}

/* ---------- Banery Přehledu 2.0 (Marco 26. 10. 2026 — výběr z plátna „Přehled — banery po řádcích“, prehled.js b2Tile) ----------
   Ikona ve skle v barvě stavu, štítky změny a stavu, prsten, tři období, křivka 6 měsíců, mřížka bytů, sloupce po měsících (návrh B),
   živé počasí (animace jen transform + opacity — kouřový test), KeyLocker s úpravou kódů a historií, okno „zobrazit vše“. Vnitřní panely = mléčné sklo. */
.tile .tile-x.t2-x { display: block; flex: none; min-height: 0; overflow: visible; margin-top: .45rem; padding-top: 0; border-top: 0; }
.t2-hero { display: flex; align-items: center; gap: 12px; margin: .35rem 0 .25rem; min-width: 0; }
.t2-hero .tile-v { margin: 0; }
.t2-hero .tx { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.t2-ic { width: 38px; height: 38px; flex: none; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; color: var(--acc);
  background: var(--glass-bg); border: 1px solid var(--glass-edge); box-shadow: var(--glass-shadow); }
.t2-ic .b2-i { width: 18px; height: 18px; stroke-width: 1.8; }
.t2-ic.ok { color: var(--ok); } .t2-ic.warn { color: var(--warn); } .t2-ic.err { color: var(--err); } .t2-ic.neu { color: var(--mut); }
.t2-meta { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; min-width: 0; }
.t2-delta, .t2-chip { display: inline-flex; align-items: center; gap: 4px; padding: 1px 7px; border-radius: 999px; font-size: .7rem; font-weight: 600; white-space: nowrap; background: var(--neu-bg); color: var(--mut); font-variant-numeric: tabular-nums; }
.t2-delta .b2-i, .t2-chip .b2-i { width: 11px; height: 11px; stroke-width: 2.4; }
.t2-delta.ok, .t2-chip.ok { background: var(--ok-bg); color: var(--ok); } .t2-delta.err, .t2-chip.err { background: var(--err-bg); color: var(--err); }
.t2-delta.warn, .t2-chip.warn { background: var(--warn-bg); color: var(--warn); } .t2-delta.acc, .t2-chip.acc { background: var(--acc-soft); color: var(--acc); }
.t2-ring { width: 56px; height: 56px; flex: none; }
.t2-ring .tr { fill: none; stroke: var(--track); stroke-width: 5; }
.t2-ring .va { fill: none; stroke: var(--acc); stroke-width: 5; stroke-linecap: round; transform: rotate(-90deg); transform-origin: center; }
.t2-ring .va.ok { stroke: var(--ok-dot); } .t2-ring .va.warn { stroke: var(--warn-dot); } .t2-ring .va.err { stroke: var(--err-dot); }
.t2-ring text { font-size: 13px; font-weight: 700; fill: var(--ink); font-family: inherit; } .t2-ring text.sm { font-size: 10.5px; }
.t2-spark { display: block; width: 100%; height: auto; margin: .2rem 0 .1rem; overflow: visible; }
.t2-spark .ln { fill: none; stroke: var(--acc); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.t2-spark .ar { fill: var(--acc); opacity: .12; }
.t2-spark .dt { fill: var(--acc); } .t2-spark .dt.cur { stroke: var(--bg); stroke-width: 2; }
.t2-spark .ax { font-size: 9px; fill: var(--faint); font-family: inherit; font-weight: 600; } .t2-spark .ax.cur { fill: var(--acc); }
.t2-bars3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.t2-b3 { display: flex; flex-direction: column; align-items: stretch; gap: 3px; min-width: 0; margin: 0; padding: 7px 9px 8px; border-radius: 10px; background: var(--glass-bg); border: 1px solid var(--glass-edge); box-shadow: none; color: var(--ink); text-align: center; font: inherit; cursor: pointer; }
.t2-b3.on { box-shadow: inset 0 0 0 1px var(--acc); }
.t2-b3 .l { font-size: .6rem; text-transform: uppercase; letter-spacing: .9px; color: var(--faint); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.t2-b3 b { font-size: .84rem; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tile-h .t2-b3 { padding: 6px 6px 7px; } .tile-h .t2-b3 b { font-size: .76rem; }
.t2-b3 .who { font-size: .66rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.t2-b3 .bar { height: 4px; border-radius: 2px; background: var(--track); overflow: hidden; } .t2-b3 .bar i { display: block; height: 100%; background: var(--acc); border-radius: 2px; }
.t2-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); gap: 6px; }
.t2-cell { position: relative; padding: 6px 8px 8px; border-radius: 10px; border: 1px solid var(--glass-edge); background: var(--glass-bg); display: flex; flex-direction: column; gap: 1px; min-width: 0; overflow: hidden; }
.t2-cell b { font-size: .86rem; font-variant-numeric: tabular-nums; line-height: 1.1; }
.t2-cell span { font-size: .66rem; color: var(--mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.t2-cell i { position: absolute; left: 0; bottom: 0; height: 3px; border-radius: 0 2px 0 0; background: var(--acc); }
.t2-cell.hi b { color: var(--ok); } .t2-cell.hi i { background: var(--ok-dot); } .t2-cell.lo b { color: var(--warn); } .t2-cell.lo i { background: var(--warn-dot); }
.t2-leg { display: flex; gap: .7rem; flex-wrap: wrap; font-size: .7rem; color: var(--mut); margin-top: .35rem; }
.t2-leg span { display: inline-flex; align-items: center; gap: .3rem; } .t2-leg i { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.t2-more { margin: .4rem 0 0; width: auto; align-self: flex-start; border: 0; background: transparent; box-shadow: none; padding: 0; color: var(--acc); font-weight: 600; font-size: .76rem; display: inline-flex; align-items: center; gap: 3px; cursor: pointer; }
.t2-more .b2-i { width: 12px; height: 12px; stroke-width: 2.4; } .t2-more:hover { text-decoration: underline; filter: none; }
.t2-ava { width: 22px; height: 22px; flex: none; border-radius: 50%; font-size: .56rem; font-weight: 700; color: #fff; display: inline-flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #4a80f0, #7d5bd6); }
.tile-l .tile-view { margin-left: auto; }
.tile-l .tile-view .b2-i { width: 12px; height: 12px; }
/* sloupce po měsících (Poplatek pro město, graf obsazenosti v režimu sloupců) */
.b-cols { display: block; width: 100%; height: auto; margin: .4rem 0 .1rem; overflow: visible; }
.b-cols .b-c { fill: var(--acc); } .b-cols .b-c.cur { fill: var(--ok-dot); } .b-cols .b-c.fut { opacity: .32; }
.b-cols .b-ax { font-size: 9px; fill: var(--faint); font-family: inherit; font-weight: 600; } .b-cols .b-ax.cur { fill: var(--ink); }
.b-cols .b-vl { font-size: 9px; fill: var(--mut); font-family: inherit; font-weight: 600; } .b-cols .b-vl.cur { fill: var(--ink); font-weight: 700; }
.b-cols .b-avg { stroke: var(--faint); stroke-width: 1; stroke-dasharray: 3 3; }
.b2-osp .osp { height: 150px; }
/* graf Výdaje a výdělky s osou Y */
.pnl-chart .pnl-gl { stroke: var(--hair); stroke-width: 1; stroke-dasharray: 3 3; } .pnl-chart .pnl-gl.zero { stroke-dasharray: none; }
.pnl-chart .pnl-ay { font-size: 10px; fill: var(--faint); font-family: inherit; font-weight: 600; }
.pnl-chart .pnl-vl { font-size: 10px; font-family: inherit; font-weight: 700; fill: var(--ink); } .pnl-chart .pnl-vl.e { fill: var(--warn); } .pnl-chart .pnl-vl.z { fill: var(--ok); }
/* zisk po apartmánech: jeden pruh = tržby, oranžově zleva z toho výdaje */
.pnl-one { position: relative; height: 10px; border-radius: 5px; background: var(--track); overflow: hidden; min-width: 0; }
.pnl-one .r, .pnl-one .e { position: absolute; left: 0; top: 0; bottom: 0; display: block; }
.pnl-one .r { background: var(--acc); border-radius: 5px; } .pnl-one .e { background: var(--warn-dot); border-radius: 5px 0 0 5px; } .pnl-one .e.over { background: var(--err-dot); }
.pnl-zv { display: flex; flex-direction: column; align-items: flex-end; line-height: 1.2; } .pnl-zv small { font-size: .64rem; color: var(--mut); font-weight: 500; }
b.pnl-pos, span.pnl-pos { color: var(--ok); } b.pnl-neg, span.pnl-neg { color: var(--err); }
/* Konektivita — karta na napojení s pruhem čerstvosti */
.b-pcards { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 8px; margin-top: .45rem; }
.b-pcards.one { grid-template-columns: 1fr; gap: 5px; }
.b-pcard { padding: 8px 10px; border-radius: 11px; border: 1px solid var(--glass-edge); background: var(--glass-bg); display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.b-pcard.warn { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--warn-dot) 55%, transparent); }
.b-ph { display: flex; align-items: center; gap: 6px; min-width: 0; } .b-ph b { font-size: .8rem; white-space: nowrap; } .b-ph .who { font-size: .66rem; flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.b-ph .tag { font-size: .64rem; padding: .05rem .4rem; }
.b-pcard .tile-bar { flex: none; height: 5px; } .b-pcard .tile-bar i.warn { background: var(--warn-dot); }
.b-pcard > .who { font-size: .68rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* živé počasí */
.wx { display: block; overflow: visible; flex: none; }
.wx [class*="wx-"] { transform-box: fill-box; transform-origin: center; }
.wx-sun { color: var(--warn); animation: wx-breathe 5s ease-in-out infinite; }
.wx-rays { animation: wx-spin 52s linear infinite; }
.wx-moon { color: #e9e7f2; animation: wx-sway 7s ease-in-out infinite; }
.wx-star { fill: currentColor; color: #f3e9b8; animation: wx-twinkle 2.8s ease-in-out infinite; }
html[data-theme="light"] .wx-moon, html[data-theme="lavender"] .wx-moon, html[data-theme="cream"] .wx-moon, html:not([data-theme]) .wx-moon { color: #6b6f8a; }
html[data-theme="light"] .wx-star, html[data-theme="lavender"] .wx-star, html[data-theme="cream"] .wx-star, html:not([data-theme]) .wx-star { color: #b48a1e; }
.wx-cloud { color: var(--mut); animation: wx-drift 7s ease-in-out infinite; } .wx-cloud.b { animation-duration: 10s; animation-direction: reverse; } .wx-cloud.dark { color: var(--ink); opacity: .8; }
.wx-drop { color: var(--acc); animation: wx-drop 1.15s linear infinite; }
.wx-flake { color: var(--acc); fill: currentColor; animation: wx-flake 2.7s ease-in-out infinite; }
.wx-bolt { color: var(--warn); fill: currentColor; animation: wx-flash 3.6s linear infinite; }
.wx-fog { color: var(--mut); animation: wx-fog 5s ease-in-out infinite; } .wx-fog.b { animation-delay: -2.5s; }
.wx.st [class*="wx-"] { animation: none; }   /* předpověď na další dny: statické ikony */
@keyframes wx-spin { to { transform: rotate(360deg); } }
@keyframes wx-breathe { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.05); } }
@keyframes wx-sway { 0%, 100% { transform: rotate(-6deg); } 50% { transform: rotate(6deg); } }
@keyframes wx-twinkle { 0%, 100% { opacity: .25; transform: scale(.8); } 50% { opacity: 1; transform: scale(1.15); } }
@keyframes wx-drift { 0%, 100% { transform: translateX(-2.5px); } 50% { transform: translateX(2.5px); } }
@keyframes wx-drop { 0% { transform: translateY(-2px); opacity: 0; } 15% { opacity: 1; } 80% { opacity: 1; } 100% { transform: translateY(6px); opacity: 0; } }
@keyframes wx-flake { 0% { transform: translate(0, -2px); opacity: 0; } 20% { opacity: 1; } 50% { transform: translate(1.3px, 3px); } 85% { opacity: 1; } 100% { transform: translate(-.7px, 8px); opacity: 0; } }
@keyframes wx-flash { 0%, 7%, 100% { opacity: 0; } 2% { opacity: 1; } 4% { opacity: .15; } 5.5% { opacity: 1; } 58% { opacity: 0; } 60% { opacity: .9; } 62% { opacity: 0; } }
@keyframes wx-fog { 0%, 100% { transform: translateX(-3px); opacity: .45; } 50% { transform: translateX(3px); opacity: 1; } }
.tile-weather.night { overflow: hidden; }
.wx-sky { position: absolute; inset: 0; pointer-events: none; }
.wx-sky i { position: absolute; width: 3px; height: 3px; border-radius: 50%; background: #f3e9b8; animation: wx-twinkle 3.2s ease-in-out infinite; }
html[data-theme="light"] .wx-sky i, html[data-theme="lavender"] .wx-sky i, html[data-theme="cream"] .wx-sky i, html:not([data-theme]) .wx-sky i { background: #b48a1e; }
@media (prefers-reduced-motion: reduce) { .wx [class*="wx-"], .wx-sky i { animation: none !important; } }
/* KeyLocker — úprava kódů v baneru + historie */
.kl-rows { margin-top: .45rem; display: flex; flex-direction: column; gap: .2rem; }
.kl-row { display: flex; align-items: center; gap: .5rem; min-width: 0; padding: 3px 8px; margin: 0 -8px; border-radius: 10px; }
.kl-row.on { background: var(--glass-row); flex-wrap: wrap; }
.kl-row .tile-rn { flex: 0 1 auto; max-width: 40%; color: var(--ink); font-weight: 600; font-size: .8rem; }
.kl-chips { display: flex; gap: .3rem; align-items: center; flex-wrap: wrap; margin-left: auto; }
.kl-chip { width: auto; margin: 0; display: inline-flex; align-items: center; gap: 5px; padding: 2px 8px 2px 7px; border-radius: 8px; border: 1px solid var(--glass-in-line, var(--btn-line)); background: var(--glass-in-bg, transparent); box-shadow: none; color: var(--mut); font-size: .72rem; font-weight: 500; font-variant-numeric: tabular-nums; white-space: nowrap; cursor: pointer; }
.kl-chip .b2-i { width: 11px; height: 11px; color: var(--faint); }
.kl-chip b { color: var(--ink); font-weight: 700; letter-spacing: 1px; }
.kl-chip.empty { color: var(--faint); border-style: dashed; background: transparent; }
.kl-chip:hover { border-color: var(--acc); color: var(--ink); filter: none; }
.kl-chip.fresh { box-shadow: inset 0 0 0 1px var(--ok-dot); } .kl-chip.fresh .b2-i { color: var(--ok); }
.kl-ed { flex-basis: 100%; display: flex; align-items: flex-end; gap: 10px; flex-wrap: wrap; padding: 8px 0 4px; }
.kl-fld { display: flex; flex-direction: column; gap: 4px; margin: 0; }
.kl-fld > span:first-child { font-size: .6rem; text-transform: uppercase; letter-spacing: 1px; color: var(--faint); font-weight: 600; }
.kl-inw { display: flex; align-items: center; gap: 4px; }
input.kl-code { width: 112px; height: 34px; margin: 0; padding: 0 10px; border-radius: 9px; font-weight: 700; font-size: 15px; letter-spacing: 3px; font-variant-numeric: tabular-nums; }
.kl-gen { width: 34px; height: 34px; margin: 0; padding: 0; border-radius: 9px; border: 1px solid var(--btn-line); background: var(--btn-bg); box-shadow: var(--btn-shadow); color: var(--mut); display: inline-flex; align-items: center; justify-content: center; }
.kl-gen .b2-i { width: 15px; height: 15px; }
.kl-acts { display: flex; gap: 6px; align-items: center; margin-left: auto; }
.kl-note { flex-basis: 100%; font-size: .72rem; color: var(--mut); line-height: 1.45; display: flex; gap: 6px; align-items: flex-start; }
.kl-note .b2-i { width: 13px; height: 13px; flex: none; margin-top: 2px; color: var(--acc); }
.kl-hd { display: inline-flex; gap: 4px; margin-left: auto; }
.kl-hd .ib { width: 24px; height: 24px; margin: 0; padding: 0; border: 0; border-radius: 7px; background: transparent; box-shadow: none; color: var(--mut); display: inline-flex; align-items: center; justify-content: center; }
.kl-hd .ib:hover { background: var(--neu-bg); color: var(--ink); } .kl-hd .ib .b2-i { width: 14px; height: 14px; }
.kl-srch { display: flex; align-items: center; gap: 6px; margin-top: .45rem; padding: 0 8px; height: 30px; border-radius: 9px; border: 1px solid var(--glass-in-line, var(--btn-line)); background: var(--glass-in-bg, transparent); color: var(--mut); }
.kl-srch .b2-i { width: 13px; height: 13px; flex: none; }
.kl-srch input { flex: 1; min-width: 0; margin: 0; padding: 0; height: auto; border: 0; background: transparent; box-shadow: none; color: var(--ink); font-size: .8rem; outline: none; }
.kl-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 7px; margin-top: .45rem; }
.kl-card { padding: 7px 9px 8px; border-radius: 11px; border: 1px solid var(--glass-edge); background: var(--glass-bg); display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.kl-card[hidden] { display: none; }
.kl-card.on { box-shadow: inset 0 0 0 1px var(--acc); grid-column: 1 / -1; }
.kl-card .nm { font-size: .78rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kl-card .cc { display: flex; gap: 4px; flex-wrap: wrap; }
.klh { display: flex; flex-direction: column; }
.klh-day { font-size: .66rem; text-transform: uppercase; letter-spacing: 1px; color: var(--faint); font-weight: 600; padding: 12px 0 4px; }
.klh-row { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 8px 0; border-top: 1px solid var(--hair); font-size: .86rem; }
.klh-t { font-variant-numeric: tabular-nums; color: var(--mut); }
.klh-m { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.klh-chg { display: inline-flex; align-items: center; gap: 6px; font-size: .82rem; color: var(--mut); white-space: nowrap; }
.klh-chg s { color: var(--faint); letter-spacing: 1px; } .klh-chg strong { color: var(--ink); letter-spacing: 1px; } .klh-chg .b2-i { width: 12px; height: 12px; color: var(--faint); }
.klh-who { font-size: .8rem; color: var(--mut); white-space: nowrap; display: inline-flex; align-items: center; gap: 6px; } .klh-who .b2-i { width: 13px; height: 13px; }
.klh-empty { padding: 20px 0; color: var(--mut); font-size: .86rem; text-align: center; }
/* okno „zobrazit vše“ */
.px-modal.b2-win { width: min(640px, calc(100vw - 32px)); }
.phw-srch { display: flex; align-items: center; gap: 8px; padding: 0 10px; height: 36px; border-radius: 10px; border: 1px solid var(--glass-in-line, var(--btn-line)); background: var(--glass-in-bg, transparent); color: var(--mut); margin-bottom: .6rem; }
.phw-srch .b2-i { width: 15px; height: 15px; flex: none; }
.phw-srch input { flex: 1; min-width: 0; margin: 0; padding: 0; height: auto; border: 0; background: transparent; box-shadow: none; color: var(--ink); font-size: .9rem; outline: none; }
.b2-list .tile-rows { gap: .45rem; } .b2-list .tile-row { font-size: .86rem; } .b2-list .tile-rn { max-width: 45%; }
.b2-list .pnl-arow { grid-template-columns: minmax(6rem, 10rem) minmax(0, 1fr) auto; }
.b2-list [hidden] { display: none !important; }
.phw-none { padding: 18px 0; color: var(--mut); font-size: .86rem; text-align: center; }
@media (max-width: 760px) {
  .t2-hero { gap: 9px; margin: .2rem 0 .15rem; }
  .t2-ic { width: 30px; height: 30px; border-radius: 9px; } .t2-ic .b2-i { width: 15px; height: 15px; }
  .t2-ring { width: 42px; height: 42px; }
  .t2-delta, .t2-chip { font-size: .62rem; padding: 1px 5px; }
  .t2-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5px; }
  .kl-row .tile-rn { max-width: 30%; }
  input.kl-code { width: 96px; height: 38px; font-size: 14px; }
  .kl-acts { margin-left: 0; flex-basis: 100%; } .kl-acts .mini { flex: 1; min-height: 38px; }
  .kl-grid { grid-template-columns: 1fr; }
  .b-pcards { grid-template-columns: 1fr; }
}
/* ½ baneru s ikonou / prstenem: číslo menším písmem a „Kč“ na stejném řádku — dlouhé částky se jinak usekly (Tržby 627 900 CZK, 26. 10. 2026) */
.t2-hero .tile-v small { white-space: nowrap; }
@media (min-width: 761px) { .tile.tile-h .t2-hero .tile-v { font-size: 1.4rem; } .tile.tile-h .t2-hero .tile-v small { font-size: .85rem; } }

/* ---------- Banery — Widgety (Marco 27. 10. 2026 večer — návrh 1 ze 4. kola plátna Přehledu, klikací předloha
   zalohy/platna/prehled-velikosti-4kolo-2026-10-27/kv.css; skládá app/js/prehled-velikosti.js) ----------
   Mřížka ze čtverců: --kv-cols sloupců (6 na PC, 4 na menším notebooku, 2 na telefonu), výška řádku = šířka sloupce --kv-cell (počítá kvFit
   z šířky mřížky). Velikosti .kv-s Malý čtverec 1 × 1 · .kv-w Malý obdélník 2 × 1 (vlevo .kv-a číslo, vpravo .kv-b díl) · .kv-l Velký čtverec 2 × 2 ·
   .kv-x Velký obdélník 4 × 2 (hlavička přes celou šířku). Grafika (.kv-vis) se kreslí po rozmístění přesně na plochu, seznamy (.kv-rows) po celých
   řádcích + „a dalších N“, dlaždice bytů (.kv-cg) vyplní plochu. Panely, dlaždice a karty = mléčné sklo (--glass-*), nikdy --well. Animace jen
   transform / opacity. Dřívější „Políčka“ (.vz-*, dashTilesFit) nahrazena. */
#view[data-sec="dash"] { max-width: 1760px; }   /* Přehled širší než ostatní sekce: 6 čtverců po ~250 bodech na monitoru 1920 px jako v klikací verzi (s 1400 px by měly ~200) */
.dash-tiles.kv-grid { display: grid; grid-template-columns: repeat(var(--kv-cols, 6), minmax(0, 1fr)); grid-auto-rows: var(--kv-cell, 250px); gap: var(--kv-gap, 14px); grid-auto-flow: row dense; overflow-anchor: none; }
.kv-cut { display: none !important; }

/* ---------- baner ---------- */
.kv-t { padding: 14px 16px; overflow: hidden; min-height: 0; }
.kv-t .tile-l { flex: none; flex-wrap: nowrap; min-height: 18px; }
.kv-tt { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kv-s .kv-tt { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-height: 1.35; }
.kv-t .tile-lsub { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kv-ctl { margin-left: auto; display: inline-flex; align-items: center; gap: .35rem; flex: none; }
.kv-ctl .tile-per, .kv-ctl .tile-view { margin-left: 0; }
.kv-hist { width: 22px; height: 22px; margin: 0; padding: 0; border-radius: 7px; display: inline-flex; align-items: center; justify-content: center; } .kv-hist .b2-i { width: 13px; height: 13px; }
.kv-hero { flex: none; margin: 10px 0 0; gap: 11px; min-width: 0; }
.kv-hero.noic { margin-top: 6px; }
.kv-hero .tx { flex: 1; min-width: 0; }
.kv-hero .tile-v { line-height: 1.12; }
.kv-t .tile-v small { white-space: nowrap; }
.kv-hero.tight > .t2-ic { display: none; }
.kv-hero.tighter .tile-v { font-size: 1.3rem; }
.kv-bh { flex: none; display: flex; justify-content: flex-end; margin-bottom: -2px; }
.kv-bh .tile-per, .kv-bh .tile-view { margin-left: 0; }
.kv-meta { overflow: hidden; }
.kv-s .kv-meta { max-height: 21px; }
.kv-fill { flex: 1 1 0; min-height: 0; display: flex; flex-direction: column; gap: 10px; margin-top: 12px; }
.kv-vis { flex: 1 1 0; min-height: 0; position: relative; overflow: hidden; }
.kv-vis > svg { display: block; margin: 0 !important; width: auto; height: auto; overflow: visible; }
.kv-foot { flex: none; margin-top: auto; padding-top: 8px; font-size: .74rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kv-up { color: var(--ok); font-size: .72em; } .kv-dn { color: var(--err); font-size: .72em; }
.cx-dot { width: 8px; height: 8px; border-radius: 50%; flex: none; background: var(--ok-dot); }
.cx-dot.warn { background: var(--warn-dot); } .cx-dot.err { background: var(--err-dot); } .cx-dot.neu { background: var(--faint); }

/* ---------- seznamy po celých řádcích ---------- */
.kv-rows { flex: 1 1 0; min-height: 0; overflow: hidden; position: relative; margin: 0; display: flex; flex-direction: column; gap: .34rem; }
.kv-t .tile-row { flex-wrap: nowrap; flex: none; }
.kv-t .tile-row .tile-rn { max-width: 56%; }
.kv-s .tile-row .tile-rn { max-width: 70%; min-width: 0; }
.kv-t .tile-row .tile-cut:empty { flex: 1 1 0; }
.kv-rows > .kv-more { margin-top: 1px; flex: none; }
.kv-rows.nat { flex: 0 1 auto; }
.kv-pr { margin: 0; width: 100%; padding: 1px 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.kv-pr .tile-rn { color: var(--mut); } .kv-pr.on .tile-rn { color: var(--ink); font-weight: 600; } .kv-pr.on b { color: var(--acc); }
.kv-pr:hover { filter: none; } .kv-pr:hover .tile-rn { color: var(--ink); }
.kv-rows.two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 14px; row-gap: 6px; align-content: start; }
.kv-rows.two > .kv-sec, .kv-rows.two > .kv-more, .kv-rows.two > .kv-empty { grid-column: 1 / -1; }
.kv-sec { flex: none; margin-top: 3px; font-size: .62rem; text-transform: uppercase; letter-spacing: 1px; font-weight: 600; color: var(--faint); }
.kv-rows > .kv-sec:first-child { margin-top: 0; }
.kv-empty { font-size: .8rem; color: var(--mut); }
.kv-rows.rich { gap: 6px; }
.kv-rows.rich > .tile-row { padding: 6px 10px; border-radius: 10px; background: var(--glass-row, var(--glass-in-bg)); min-height: 38px; }
.kv-rows.rich > .tile-row.tile-rowlink:hover { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--acc) 45%, transparent); }
.kv-r2 .kv-two { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
.kv-r2 .kv-two b { font-weight: 600; font-size: .8rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kv-r2 .kv-two .who { font-size: .7rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kv-t .b-t { flex: 0 0 auto; min-width: 2.5rem; font-variant-numeric: tabular-nums; color: var(--ink); font-size: .78rem; }
.kv-kmini { margin: 0; border: 1px solid var(--glass-in-line); background: var(--glass-in-bg); border-radius: 7px; padding: 1px 7px; font-size: .72rem; color: var(--mut); white-space: nowrap; box-shadow: none; width: auto; }
.kv-kmini b { color: var(--ink); letter-spacing: .5px; } .kv-kmini.empty { border-style: dashed; color: var(--faint); background: transparent; }
.tile-bar i.hi { background: var(--ok-dot); } .tile-bar i.mid { background: var(--acc); } .tile-bar i.lo { background: var(--warn-dot); }
.tile-bar i.acc { background: var(--acc); } .tile-bar i.warn { background: var(--warn-dot); } .tile-bar i.neu { background: var(--faint); }

/* ---------- Malý obdélník: vlevo číslo, vpravo díl · Velký obdélník: hlavička přes celou šířku ---------- */
.kv-t.kv-w { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); column-gap: 18px; }
.kv-a, .kv-b { display: flex; flex-direction: column; min-width: 0; min-height: 0; gap: 10px; }
.kv-w > .kv-a { gap: 0; }
.kv-b { border-left: 1px solid var(--hair); padding-left: 16px; }
.kv-w > .kv-b > .kv-vis, .kv-w > .kv-b > .kv-rows { flex: 1 1 0; }
.kv-t.kv-x { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.7fr); grid-template-rows: auto minmax(0, 1fr) auto; column-gap: 22px; }
.kv-x > .kv-hd, .kv-x > .kv-foot { grid-column: 1 / -1; }
.kv-x > .kv-a { gap: 12px; }
.kv-x > .kv-b { margin-top: 12px; }
.kv-x > .kv-a > .kv-vis { flex: 1 1 0; }

/* ---------- počasí ---------- */
.kv-wx { display: flex; align-items: center; gap: 12px; margin-top: 8px; flex: none; min-width: 0; }
.kv-wx .tx { min-width: 0; } .kv-wx .tile-v { margin: 0; }
.kv-wx .who { font-size: .76rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kv-wd { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.kv-wdd { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-width: 0; border-radius: 12px; background: var(--glass-bg); border: 1px solid var(--glass-edge); padding: 4px 2px; }
.kv-wdd .who { font-size: .68rem; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kv-wt { font-size: .8rem; white-space: nowrap; font-variant-numeric: tabular-nums; }
.kv-t .tile-wx.kv-wxi { display: grid; grid-template-columns: repeat(auto-fill, minmax(6.6rem, max-content)); gap: .3rem 1.1rem; flex: none; margin-top: 8px; overflow: hidden; }   /* .tile-wx je jinak schované (jen celý baner) */
.kv-x .tile-wx.kv-wxi { grid-template-columns: auto auto auto auto; }
.kv-wxi .tile-wxi .b2-i { width: 15px; height: 15px; flex: none; color: var(--faint); }

/* ---------- grafy kreslené na plochu ---------- */
.kv-line .ln { fill: none; stroke: #3d7bff; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.kv-line .ln.fut { stroke-dasharray: 5 5; opacity: .85; }
.kv-line .dt { fill: #3d7bff; opacity: .55; }
.kv-line .cd { fill: #3d7bff; stroke: var(--bg); stroke-width: 2; }
.kv-gl { stroke: var(--hair); stroke-width: 1; }
.kv-ay, .kv-ax { font-size: 9.5px; fill: var(--faint); font-family: inherit; font-weight: 600; }
.kv-ax.cur { fill: var(--acc); }
.kv-vl { font-size: 10px; fill: var(--mut); font-family: inherit; font-weight: 600; } .kv-vl.cur { fill: var(--ink); font-weight: 700; }
.kv-cols .b-c.neg { fill: var(--err-dot); }
.kv-week .kv-wb { opacity: .5; fill: var(--acc); } .kv-week .kv-wb.cur { opacity: 1; }
.kv-week.in .kv-wb { fill: var(--ok-dot); } .kv-week.out .kv-wb { fill: var(--warn-dot); }
.kv-week .kv-wb.none { fill: var(--track); opacity: 1; }
.kv-wn, .kv-wl { font-size: 10px; fill: var(--mut); font-weight: 600; font-family: inherit; } .kv-wn.cur, .kv-wl.cur { fill: var(--ink); }
.kv-seg { flex: none; display: flex; flex-direction: column; gap: 5px; }
.kv-seg .who { font-size: .72rem; } .kv-seg .b-stack, .kv-seg .pnl-split { margin: 0; } .kv-seg .pnl-leg { font-size: .7rem; }
.kv-strip { flex: none; } .kv-strip .b-strip { margin: 16px 0 2px; }
.kv-tbl { flex: none; display: flex; flex-direction: column; gap: .4rem; }
.kv-w .kv-a > .kv-tbl { margin-top: 10px; gap: .25rem; }
.kv-cap { font-size: .62rem; text-transform: uppercase; letter-spacing: 1px; font-weight: 600; color: var(--faint); height: 18px; }
.kv-mt { flex: 1 1 0; min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: repeat(12, minmax(0, 1fr)); gap: 2px; max-height: 300px; }
.kv-mr { display: grid; grid-template-columns: 4.6rem minmax(0, 1fr) 2.6rem; align-items: center; gap: 8px; font-size: .76rem; color: var(--mut); }
.kv-mr i { height: 6px; border-radius: 3px; background: var(--track); overflow: hidden; } .kv-mr i b { display: block; height: 100%; background: #3d7bff; border-radius: 3px; }
.kv-mr em { font-style: normal; text-align: right; font-variant-numeric: tabular-nums; color: var(--ink); font-weight: 600; }
.kv-mr.cur span, .kv-mr.cur em { color: var(--acc); font-weight: 700; } .kv-mr.fut i b { opacity: .45; } .kv-mr.fut em { color: var(--mut); font-weight: 500; }
.kv-osp { grid-row: 1 / 3; align-self: center; width: 100%; height: 28px; } .kv-osp polyline { fill: none; stroke: var(--oc); stroke-width: 1.6; stroke-linejoin: round; }
.kv-wl { display: flex; flex-direction: column; }
.kv-wlr { display: grid; grid-template-columns: 4.8rem 24px 2.6rem 1.8rem minmax(0, 1fr) 1.8rem; align-items: center; gap: 8px; font-size: .78rem; border-top: 1px solid var(--hair); }
.kv-wlr:first-child { border-top: 0; } .kv-wlr .dn { color: var(--ink); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .kv-wlr .rn { color: var(--acc); font-size: .7rem; font-weight: 600; }
.kv-wlr .tl { color: var(--mut); text-align: right; font-variant-numeric: tabular-nums; } .kv-wlr .th { font-weight: 600; font-variant-numeric: tabular-nums; }
.kv-wlr .tb { position: relative; height: 5px; border-radius: 3px; background: var(--track); } .kv-wlr .tb i { position: absolute; top: 0; bottom: 0; border-radius: 3px; background: linear-gradient(90deg, #5aa7ff, #ffb648); }
.kv-gx { font-size: 9.5px; fill: var(--faint); font-weight: 600; font-family: inherit; } .kv-gn { font-size: 10.5px; fill: var(--mut); font-weight: 600; font-family: inherit; }
.kv-gt { fill: var(--track); } .kv-gb.on { fill: var(--ok-dot); } .kv-gb.nx { fill: var(--acc); opacity: .85; } .kv-gnow { stroke: var(--err-dot); stroke-width: 1.5; }
.kv-note { flex: none; font-size: .78rem; color: var(--mut); line-height: 1.45; } .kv-note b { color: var(--ink); }
.kv-leg { flex: none; }
.kv-t .t2-bars3 { flex: none; margin-top: 0; }
.kv-t .t2-leg { margin-top: 0; flex: none; }
.kv-shared { flex: none; display: flex; justify-content: space-between; gap: 6px 12px; align-items: center; flex-wrap: wrap; font-size: .74rem; }
.kv-shared .who b { font-variant-numeric: tabular-nums; }
/* pruhy a osa dne (návrh B banerů 2.0) */
.b-seg { display: flex; gap: 2px; border-radius: 4px; overflow: hidden; }
.b-seg i { flex: 1; display: block; background: var(--track); }
.b-seg i.hi { background: var(--ok-dot); } .b-seg i.mid { background: var(--acc); } .b-seg i.lo { background: var(--warn-dot); } .b-seg i.free { background: var(--track); }
.t2-leg i.hi { background: var(--ok-dot); } .t2-leg i.mid { background: var(--acc); } .t2-leg i.lo { background: var(--warn-dot); }
.t2-leg i.ok { background: var(--ok-dot); } .t2-leg i.neu { background: var(--track); border: 1px solid var(--hair); box-sizing: border-box; } .t2-leg i.err { background: var(--err-dot); } .t2-leg i.warn, .t2-leg i.wnd { background: var(--warn-dot); }
.b-stack { display: flex; border-radius: 99px; overflow: hidden; background: var(--track); margin-top: .45rem; }
.b-stack i { display: block; height: 100%; }
.b-stack i.ok { background: var(--ok-dot); } .b-stack i.neu { background: var(--faint); opacity: .55; } .b-stack i.err { background: var(--err-dot); } .b-stack i.warn { background: var(--warn-dot); }
.b-strip { position: relative; height: 40px; margin: .55rem 0 .15rem; border-bottom: 1px solid var(--hair); }
.b-tk { position: absolute; bottom: -1.05rem; transform: translateX(-50%); font-size: .62rem; color: var(--faint); font-weight: 600; }
.b-tk::before { content: ''; position: absolute; left: 50%; top: -5px; width: 1px; height: 4px; background: var(--hair); }
.b-dot { position: absolute; bottom: 4px; width: 12px; height: 12px; margin-left: -6px; border-radius: 50%; background: var(--acc); box-shadow: 0 0 0 2px var(--bg); }
.b-dot.in { background: var(--ok-dot); } .b-dot.out { background: var(--warn-dot); }
.b-dot b { position: absolute; bottom: 15px; left: 50%; transform: translateX(-50%); font-size: .68rem; color: var(--ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
.b-strip.dense .b-dot b { display: none; }

/* ---------- dlaždice, které vyplní plochu (byty, platformy) ---------- */
.kv-cg { display: grid; align-content: start; }
.kv-cmore { margin: 0; width: auto; border: 1px dashed var(--glass-in-line); border-radius: 10px; background: transparent; box-shadow: none; color: var(--acc); font-weight: 600; font-size: .76rem; display: flex; align-items: center; justify-content: center; gap: 4px; padding: 0 6px; }
.kv-cmore .b2-i { width: 12px; height: 12px; stroke-width: 2.4; }
.kv-oc { --oc: var(--acc); position: relative; overflow: hidden; min-width: 0; line-height: 1.15; padding: 3px 9px; border-radius: 9px; border: 1px solid var(--glass-edge); background: var(--glass-bg); color: var(--ink); display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: left; }
.kv-oc.b-hi { --oc: var(--ok-dot); } .kv-oc.b-lo { --oc: var(--warn-dot); }
.kv-oc:not(.m):not(.l) { background: color-mix(in srgb, var(--oc) 24%, transparent); border-color: color-mix(in srgb, var(--oc) 42%, transparent); padding: 0; }
.kv-oc b { font-size: .78rem; font-variant-numeric: tabular-nums; line-height: 1.1; }
.kv-oc.m { align-items: flex-start; } .kv-oc.m span { font-size: .66rem; color: var(--mut); white-space: nowrap; max-width: 100%; overflow: hidden; text-overflow: ellipsis; } .kv-oc.m b { font-size: .92rem; }
.kv-oc.l { display: grid; grid-template-columns: minmax(0, 1fr) minmax(40px, 90px) auto; align-content: center; column-gap: 8px; row-gap: 1px; }
.kv-oc.l .nm { grid-row: 1 / 3; align-self: center; font-size: .82rem; font-weight: 600; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kv-oc.l .nm small { display: block; font-weight: 500; font-size: .68rem; color: var(--mut); }
.kv-oc.l b { grid-column: 3; justify-self: end; font-size: 1.2rem; } .kv-oc.l .who { grid-column: 3; justify-self: end; font-size: .68rem; white-space: nowrap; }
.kv-oc i { position: absolute; left: 0; bottom: 0; height: 3px; background: var(--oc); border-radius: 0 2px 0 0; }
.kv-pc { min-width: 0; overflow: hidden; padding: 6px 10px; border-radius: 10px; border: 1px solid var(--glass-edge); background: var(--glass-bg); display: grid; grid-template-columns: minmax(0, 1fr) auto; align-content: center; gap: 3px 8px; }
.kv-pc .nm { font-size: .78rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kv-pc .nm small { display: block; font-size: .66rem; font-weight: 500; color: var(--mut); }
.kv-pc > b { justify-self: end; font-size: .86rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
.kv-pc.l > b { font-size: 1.08rem; }
.kv-pc > .who { justify-self: end; grid-column: 2; font-size: .68rem; white-space: nowrap; }
.kv-pc.l .nm { grid-row: span 2; align-self: center; }
.kv-pc .pnl-one { grid-column: 1 / -1; height: 7px; }
.kv-pc .kv-pcx { grid-column: 1 / -1; justify-self: start; }
.kv-t .kv-po { flex: 1 1 0; height: 7px; }
.kv-kc { min-width: 0; overflow: hidden; padding: 6px 10px; border-radius: 10px; border: 1px solid var(--glass-edge); background: var(--glass-bg); display: flex; align-items: center; gap: 4px 8px; flex-wrap: wrap; align-content: center; }
.kv-kc .nm { flex: 1 1 auto; min-width: 3.2rem; font-size: .8rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kv-kc .nm small { display: block; font-size: .66rem; font-weight: 500; color: var(--mut); }
.kv-kc .cc { display: flex; gap: 5px; flex: none; }
.kv-kc > .who { flex: 1 0 100%; font-size: .68rem; }
.kv-cx { justify-content: center; } .kv-cx.l { gap: 7px; padding: 10px 12px; } .kv-cx > .who { white-space: normal; }
.kv-srch { flex: none; margin-top: 0; }
.kv-hl { flex: 1 1 0; min-height: 0; overflow: hidden; display: flex; flex-direction: column; gap: .36rem; }
.kl-win .kl-ed { margin: 0; padding: 0; border: 0; background: transparent; }

/* ---------- Malý čtverec: menší ikona a prsten ---------- */
.kv-s .t2-ic { width: 34px; height: 34px; border-radius: 11px; } .kv-s .t2-ic .b2-i { width: 16px; height: 16px; }
.kv-s .t2-ring { width: 46px; height: 46px; }
.kv-s .kv-fill { margin-top: 10px; gap: 8px; }

/* ---------- úpravy: tah za roh, přesun, výběr velikosti ---------- */
.kv-ed { -webkit-user-select: none; user-select: none; }
.kv-ed .kv-t { cursor: grab; outline: 1.5px dashed color-mix(in srgb, var(--acc) 55%, transparent); outline-offset: -1.5px; touch-action: pan-y; animation: none; }
.kv-ed .kv-t > :not(.kv-pick):not(.kv-rs) { pointer-events: none; }
.kv-ed .kv-hd { padding-right: 150px; }
.kv-ed .kv-w .kv-hd { padding-right: 0; }
.kv-ed .kv-s .kv-hd { padding-right: 0; margin-top: 26px; }
.kv-ed .kv-w > .kv-b { padding-top: 26px; }
.kv-pick { position: absolute; top: 7px; right: 7px; z-index: 4; display: inline-flex; align-items: center; gap: 2px; padding: 3px; border-radius: 10px; background: var(--glass-bg); border: 1px solid var(--glass-edge); box-shadow: var(--glass-shadow); -webkit-backdrop-filter: var(--glass-filter); backdrop-filter: var(--glass-filter); }
.kv-pick button { width: 30px; height: 22px; margin: 0; padding: 0; border: 0; border-radius: 7px; background: transparent; box-shadow: none; display: flex; align-items: center; justify-content: center; cursor: pointer; }
.kv-pick button.on { background: var(--sn-on-bg); box-shadow: var(--sn-on-shadow); }
.kv-pick .kv-hide { width: 22px; margin-left: 2px; color: var(--mut); font-size: .7rem; line-height: 1; }
.kv-pick .kv-hide:hover { color: var(--err); filter: none; }
.kv-ic { width: 24px; height: 14px; display: block; flex: none; }
.kv-ic .o { fill: none; stroke: var(--faint); stroke-width: .8; opacity: .8; } .kv-ic .f { fill: var(--acc); }
.kv-rs { position: absolute; right: 6px; bottom: 6px; z-index: 4; width: 26px; height: 26px; border-radius: 8px; background: var(--prim-bg); color: var(--prim-ink); box-shadow: var(--prim-shadow); display: flex; align-items: center; justify-content: center; cursor: nwse-resize; touch-action: none; }
.kv-rs .b2-i { width: 14px; height: 14px; }
.kv-t.kv-drag { outline: 2px solid var(--acc) !important; outline-offset: -2px; z-index: 6; }
html.kv-dragging, html.kv-dragging * { cursor: grabbing !important; }
.kv-tip { position: fixed; z-index: 9999; pointer-events: none; transform: translate(16px, 16px); padding: 4px 11px; border-radius: 999px; background: var(--prim-bg); color: var(--prim-ink); font-size: 12px; font-weight: 600; white-space: nowrap; box-shadow: var(--prim-shadow); }
.kv-legrow { display: flex; align-items: center; gap: 8px 18px; flex-wrap: wrap; margin: .1rem 0 .7rem; font-size: 12.5px; }
.kv-legrow .kv-leg { display: inline-flex; align-items: center; gap: 6px; } .kv-legrow .kv-leg .who { font-size: 11.5px; color: var(--mut); }
.kv-legrow .mini { margin-left: auto; }

/* ---------- telefon (2 sloupce, menší písmo v Malém) ---------- */
@media (max-width: 760px) {
  .kv-t { padding: 11px 12px; }
  .kv-s .tile-v { font-size: 1.28rem; }
  .kv-s .t2-ic { width: 28px; height: 28px; border-radius: 9px; } .kv-s .t2-ic .b2-i { width: 14px; height: 14px; }
  .kv-s .t2-ring { width: 38px; height: 38px; }
  .kv-s .kv-hero { gap: 8px; margin-top: 7px; }
  .kv-s .kv-fill { margin-top: 7px; gap: 6px; }
  .kv-s .tile-row { font-size: .72rem; }
  .kv-t.kv-w { column-gap: 12px; } .kv-b { padding-left: 12px; }
  .kv-ed .kv-hd { padding-right: 0; margin-top: 26px; }
  .kv-legrow .kv-leg { display: none; }
  .kv-w .tile-wx.kv-wxi { display: none; }   /* telefon: vedle předpovědi se nevejde (jako v klikací verzi) */
}

/* ===================== PORTÁL HOSTA — editor návrh 8 „Osnova + psaní v náhledu“ (29. 10. 2026, app/js/portal-editor.js) =====================
   Celá stránka jen pro kartu Portál hosta (seznam apartmánů → ikonka s nabídkou, řádek Nastavení → kapsle), osnova · stránka · náhled
   skutečného portálu (rám ../host/?editor=1), úpravy přes celou obrazovku (#pe7), bubliny dlaždic (#pePop). Panely = mléčné sklo (.agp). */
.pe-row, .pe-ogl.own, .pe-oadd, .pe-oaddc, .pe-lrow, .pe-chip, .pe-lbtn, .pe-cap, .pe-aptb, .pe-fly > button, .pe-ib, .pe-icb, .pe-icmenu button, .pe-pmenu button,
.pe-tgl, .pe-tadd, .pe-tb button, .pe-tx, .pe-bgt, .pe-gitem, .pe-fb, .pe-zv, .pe-lnk, .pe-fab, .pe-icgrid button, .pe-open, .pe-osnback {
  width: auto; margin: 0; padding: 0; border: 0; background: none; box-shadow: none; color: inherit; font: inherit; font-weight: inherit; filter: none; text-align: left; }
.pe-i { width: 16px; height: 16px; flex: none; }
.pe-pi { flex: none; display: block; }
.pe-sp { flex: 1; }
.pe-lab { font-size: 9.5px; letter-spacing: 1.1px; text-transform: uppercase; color: var(--faint); font-weight: 600; white-space: nowrap; }
.pe-load { padding: 40px; }
/* celá stránka */
.aptx.pe-full > .aptx-nav { display: none; }
html.pe-fullon #view > .sett-head { display: none; }
html.pe-fullon #view { max-width: 1900px; }   /* celá stránka editoru: osnova · stránka · náhled potřebují šířku monitoru (jinak #view do 1400 px) */
.aptx.pe-full .aptx-ht > .apt-ava { display: none; }
.aptx.pe-in > .aptx-pane { animation: peIn .36s cubic-bezier(.3,.75,.2,1) both; }
@keyframes peIn { from { opacity: 0; transform: translateX(-18px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .aptx.pe-in > .aptx-pane { animation: none; } }
.pe-hov { position: relative; }
.pe-cap { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 12px 0 11px; border-radius: 999px; border: 1px solid var(--btn-line); background: var(--btn-bg); box-shadow: var(--btn-shadow); color: var(--ink); font-weight: 600; font-size: 13.5px; white-space: nowrap; cursor: pointer; }
.pe-chv { width: 13px; height: 13px; color: var(--faint); }
.pe-sep { color: var(--faint); display: inline-flex; } .pe-sep .pe-i { width: 14px; height: 14px; }
.pe-aptb { position: relative; display: inline-flex; border-radius: 50%; cursor: pointer; }
.pe-aptb .apt-ava { box-shadow: 0 0 0 2px var(--glass-edge), 0 8px 20px rgba(0,0,0,.2); }
.pe-cnt { position: absolute; right: -5px; bottom: -3px; min-width: 21px; height: 21px; padding: 0 6px; box-sizing: border-box; border-radius: 999px; background: var(--prim-bg); color: var(--prim-ink); font-size: 11px; font-weight: 700; display: flex; align-items: center; justify-content: center; box-shadow: 0 0 0 2px var(--card-bg); }
.pe-fly { position: absolute; top: calc(100% + 8px); left: 0; z-index: 60; min-width: 270px; max-width: calc(100vw - 40px); padding: 6px; border-radius: 16px; background: var(--panel); border: 1px solid var(--card-line); box-shadow: 0 24px 60px rgba(0,0,0,.28);
  display: flex; flex-direction: column; gap: 2px; opacity: 0; visibility: hidden; transform: translateY(-4px); transition: opacity .16s, transform .16s, visibility 0s linear .16s; text-align: left; }
.pe-hov.open > .pe-fly { opacity: 1; visibility: visible; transform: none; transition: opacity .16s, transform .16s; }
.pe-fly::before { content: ''; position: absolute; left: 0; right: 0; top: -12px; height: 12px; }
.pe-fly.r { left: auto; right: 0; }
.pe-fly > button { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 42px; padding: 6px 10px; border-radius: 10px; color: var(--ink); font-size: 13.5px; font-weight: 500; cursor: pointer; }
@media (hover: hover) { .pe-fly > button:hover { background: var(--neu-bg); } }
.pe-fly > button.on { background: var(--acc-soft); }
.pe-fly > button > .pe-i { color: var(--faint); }
.pe-fly > button small { margin-left: auto; color: var(--mut); font-size: 11.5px; font-weight: 400; white-space: nowrap; }
.pe-fly > button.add { color: var(--acc); font-weight: 600; } .pe-fly > button.add .pe-i { color: var(--acc); }
.pe-fly > button.nofill .pe-nt b, .pe-fly > button.nofill .pe-nt span { color: var(--faint); }
.pe-fly > button .pe-fd { margin-left: auto; }
.pe-nt { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.3; } .pe-nt b { font-weight: 600; font-size: 13.5px; } .pe-nt span { font-size: 12px; color: var(--mut); }
.pe-flh { padding: 6px 10px 4px; font-size: 9.5px; letter-spacing: 1.1px; text-transform: uppercase; color: var(--faint); font-weight: 600; }
.pe-fln { margin: 4px 10px 6px; font-size: 11.5px; color: var(--faint); line-height: 1.4; }
.pe-flapt { min-width: 340px; } .pe-flall { width: 34px; height: 34px; flex: none; border-radius: 50%; background: var(--neu-bg); display: flex; align-items: center; justify-content: center; color: var(--mut); }
.pe-ok { color: var(--ok); margin-left: auto; }
.aptx-ht .pe-hd { flex: none; }
/* rozložení: editor (osnova + stránka) a náhled */
.pe8 { min-width: 0; }
.pe-grid { display: grid; grid-template-columns: minmax(0, 1fr) clamp(360px, 27vw, 480px); gap: 16px; align-items: start; }
.pe-ed { min-width: 0; }
.pe-v4g { display: grid; grid-template-columns: clamp(210px, 16vw, 260px) minmax(0, 1fr); gap: 16px; align-items: start; }
.pe-osn { position: sticky; top: 0; padding: 14px 8px 12px; border-radius: 18px; background: var(--glass-bg); border: 1px solid var(--glass-edge); box-shadow: var(--glass-shadow); -webkit-backdrop-filter: var(--glass-filter); backdrop-filter: var(--glass-filter); max-height: calc(100vh - 230px); overflow-y: auto; scrollbar-width: thin; }
.pe-pg { min-width: 0; }
.pe-crumb { font-size: 12.5px; color: var(--mut); margin: 2px 2px 12px; } .pe-crumb b { color: var(--ink); }
.pe-osnback { display: none; }
.pe-pv { position: sticky; top: 0; padding: 12px 14px; border-radius: 20px; background: var(--glass-bg); border: 1px solid var(--glass-edge); box-shadow: var(--glass-shadow); -webkit-backdrop-filter: var(--glass-filter); backdrop-filter: var(--glass-filter); min-width: 0; }
.pe-fabs { display: none; }
/* osnova */
.pe-leg { display: flex; flex-wrap: wrap; gap: 4px 14px; padding: 0 10px 12px; font-size: 11.5px; color: var(--mut); }
.pe-leg span { display: inline-flex; align-items: center; gap: 6px; } .pe-leg i { width: 9px; height: 9px; border-radius: 50%; }
.pe-leg .on1 { color: var(--ink); } .pe-leg .on1 i { background: var(--acc); } .pe-leg .off1 { color: var(--faint); } .pe-leg .off1 i { box-shadow: inset 0 0 0 1.6px var(--acc); }
.pe-olab { padding: 0 10px 6px; font-size: 9.5px; letter-spacing: 1.1px; text-transform: uppercase; color: var(--faint); font-weight: 600; } .pe-olab.ol2 { margin-top: 16px; }
.pe-onote { margin: -2px 10px 4px; font-size: 11.5px; color: var(--faint); line-height: 1.4; } .pe-onote b { color: var(--mut); font-weight: 600; }
.pe-oem { margin: 6px 4px; font-size: 12.5px; line-height: 1.45; }
.pe-rows { display: flex; flex-direction: column; gap: 1px; }
.pe-row { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 34px; padding: 5px 10px; border-radius: 10px; color: var(--ink); cursor: pointer; }
.pe-row.st { min-height: 46px; }
.pe-row > .pe-i, .pe-row > .pe-pi { width: 16px; height: 16px; }
.pe-row .pe-nm { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.3; }
.pe-row .pe-nm b { font-size: 13.5px; font-weight: 500; } .pe-row .pe-nm span { font-size: 11.5px; color: var(--mut); margin-top: 1px; }
.pe-row.on { background: var(--sn-on-bg); box-shadow: var(--sn-on-shadow); } .pe-row.on .pe-nm b { font-weight: 600; }
@media (hover: hover) { .pe-row:not(.on):hover { background: var(--neu-bg); } }
/* vyplněno = tmavě s plnou modrou tečkou, nevyplněno = šedě s modrým prázdným kroužkem (Marco 29. 10. 2026) */
.pe-row.fill .pe-nm b { color: var(--ink); } .pe-row.fill > .pe-i, .pe-row.fill > .pe-pi { color: var(--ink); opacity: .8; }
.pe-row.nofill .pe-nm b, .pe-row.nofill .pe-nm span { color: var(--faint); } .pe-row.nofill > .pe-i, .pe-row.nofill > .pe-pi { color: var(--faint); opacity: .75; }
.pe-row.nofill.on .pe-nm b { color: var(--mut); }
.pe-row.on > .pe-i, .pe-row.on > .pe-pi { color: var(--acc); opacity: 1; }
.pe-fd { width: 9px; height: 9px; border-radius: 50%; flex: none; }
.fill > .pe-fd { background: var(--acc); } .nofill > .pe-fd { box-shadow: inset 0 0 0 1.6px var(--acc); }
.pe-hid { display: inline-flex; color: var(--faint); } .pe-hid .pe-i { width: 14px; height: 14px; }
.pe-ogl { display: flex; align-items: center; gap: 6px; padding: 8px 10px 2px; flex-wrap: wrap; } .pe-ogl b { font-size: 11.5px; font-weight: 600; color: var(--mut); } .pe-ogl span { font-size: 11px; color: var(--faint); }
.pe-ogl.own { width: 100%; border-radius: 10px; cursor: pointer; padding: 8px 10px 4px; } .pe-ogl.own b { color: var(--ink); } .pe-ogl.own .tag { font-size: 10px; padding: 1px 6px; }
.pe-oed { width: 12px; height: 12px; margin-left: auto; color: var(--faint); }
.pe-ogl.own.on { background: var(--sn-on-bg); box-shadow: var(--sn-on-shadow); }
@media (hover: hover) { .pe-ogl.own:not(.on):hover { background: var(--neu-bg); } }
.pe-oadd { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 30px; padding: 4px 10px; border-radius: 10px; color: var(--acc); font-size: 12px; font-weight: 500; cursor: pointer; }
.pe-oadd .pe-i { width: 14px; height: 14px; }
@media (hover: hover) { .pe-oadd:hover { background: var(--acc-soft); } }
.pe-oaddc { display: flex; align-items: center; gap: 10px; width: 100%; margin-top: 10px; padding: 9px 10px; box-sizing: border-box; border: 1px dashed color-mix(in srgb, var(--acc) 45%, transparent); border-radius: 12px; color: var(--acc); cursor: pointer; }
.pe-oaddc span { display: flex; flex-direction: column; line-height: 1.3; min-width: 0; } .pe-oaddc b { font-size: 13px; font-weight: 600; } .pe-oaddc small { font-size: 11px; color: var(--mut); }
@media (hover: hover) { .pe-oaddc:hover { background: var(--acc-soft); } }
.pe-ofoot { display: flex; gap: 8px; padding: 14px 6px 2px; flex-wrap: wrap; }
.pe-ofoot .mini { display: inline-flex; align-items: center; gap: 6px; }
/* stránky */
.pe-card + .pe-card { margin-top: 14px; }
.pe-card .agp-h { margin-bottom: 12px; align-items: flex-start; }
.pe-f label { margin: 0 0 .3rem; }
.pe-f + .pe-f { margin-top: 10px; }
.pe-g2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 12px 14px; align-items: end; }
.pe-g2 > .pe-f + .pe-f, .pe-g3 > .pe-f + .pe-f { margin-top: 0; }
.pe-g3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px 12px; }
.pe-cgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr)); gap: 14px; align-items: start; }
.pe-cgrid > .pe-card + .pe-card { margin-top: 0; }
.pe-ro { min-height: 40px; display: flex; align-items: center; padding: 7px 12px; box-sizing: border-box; border-radius: 10px; background: var(--neu-bg); font-size: 12.5px; color: var(--mut); line-height: 1.4; }
.pe-pw { display: flex; gap: 6px; } .pe-pw input { flex: 1; min-width: 0; } .pe-pw .mini { display: inline-flex; align-items: center; }
.pe-trow { display: flex; align-items: center; gap: 10px; font-size: 13.5px; min-height: 40px; flex-wrap: wrap; line-height: 1.4; margin: 0; color: var(--ink); }
.pe-tgl { position: relative; width: 42px; height: 25px; flex: none; border-radius: 999px; background: var(--hair); transition: background .2s; cursor: pointer; }
.pe-tgl::after { content: ''; position: absolute; top: 2.5px; left: 2.5px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.3); transition: transform .2s; }
.pe-tgl.on { background: var(--acc); } .pe-tgl.on::after { transform: translateX(17px); }
.pe-hint { font-size: 11.5px; color: var(--faint); margin: 0 0 5px; line-height: 1.45; } .pe-hint b { color: var(--mut); font-weight: 500; }
.pe-note { display: flex; gap: 8px; margin: 10px 0 0; font-size: 12px; color: var(--mut); line-height: 1.45; } .pe-note .pe-i { flex: none; width: 14px; height: 14px; color: var(--acc); margin-top: 1px; } .pe-note b { color: var(--ink); }
.pe-acts { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; } .pe-acts .mini { display: inline-flex; align-items: center; gap: 6px; }
.pe-phrow { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; } .pe-phtx { flex: 1; min-width: 200px; }
.pe-noph { width: 96px; height: 96px; border-radius: 28%; background: var(--neu-bg); color: var(--mut); display: flex; align-items: center; justify-content: center; } .pe-noph .pe-i { width: 40%; height: 40%; }
/* výřez profilovky */
.pe-crop { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 14px; }
.pe-cbox { position: relative; flex: none; border-radius: 28%; background-color: #cfc7bd; background-repeat: no-repeat; box-shadow: 0 0 0 1px var(--glass-edge), 0 10px 26px rgba(0,0,0,.22); cursor: grab; touch-action: none; overflow: hidden; }
.pe-cbox.drag { cursor: grabbing; box-shadow: 0 0 0 3px var(--acc), 0 10px 26px rgba(0,0,0,.22); }
.pe-cgl { position: absolute; inset: 0; opacity: 0; transition: opacity .15s; pointer-events: none;
  background: linear-gradient(90deg, transparent 33%, rgba(255,255,255,.45) 33%, rgba(255,255,255,.45) calc(33% + 1px), transparent calc(33% + 1px), transparent 66%, rgba(255,255,255,.45) 66%, rgba(255,255,255,.45) calc(66% + 1px), transparent calc(66% + 1px)),
    linear-gradient(0deg, transparent 33%, rgba(255,255,255,.45) 33%, rgba(255,255,255,.45) calc(33% + 1px), transparent calc(33% + 1px), transparent 66%, rgba(255,255,255,.45) 66%, rgba(255,255,255,.45) calc(66% + 1px), transparent calc(66% + 1px)); }
.pe-cbox:hover .pe-cgl, .pe-cbox.drag .pe-cgl { opacity: 1; }
.pe-chand { position: absolute; right: 7px; bottom: 7px; width: 26px; height: 26px; border-radius: 50%; background: rgba(20,20,24,.62); color: #fff; display: flex; align-items: center; justify-content: center; pointer-events: none; } .pe-chand .pe-i { width: 14px; height: 14px; }
.pe-cctl { flex: 1; min-width: 180px; display: flex; flex-direction: column; gap: 7px; } .pe-cctl b { font-size: 13.5px; } .pe-cctl .who { font-size: 12px; line-height: 1.45; }
.pe-crz { display: flex; align-items: center; gap: 8px; color: var(--mut); margin: 0; } .pe-crz input { flex: 1; min-width: 0; padding: 0; border: 0; background: none; accent-color: var(--acc); }
.pe-cctl .mini { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; }
/* pozadí */
.pe-bgs { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 170px), 1fr)); gap: 12px; }
.pe-bgt { display: flex; flex-direction: column; gap: 8px; padding: 6px 6px 10px; border: 1px solid var(--hair); border-radius: 16px; background: var(--glass-row); color: var(--ink); cursor: pointer; }
@media (hover: hover) { .pe-bgt:not(.on):hover { border-color: color-mix(in srgb, var(--acc) 50%, transparent); } }
.pe-bgt.on { border-color: var(--acc); box-shadow: 0 0 0 2px var(--acc); }
.pe-bgi { position: relative; display: block; aspect-ratio: 16 / 9; border-radius: 11px; background: center / cover no-repeat #cfc7bd; }
.pe-bgok { position: absolute; right: 7px; top: 7px; width: 22px; height: 22px; border-radius: 50%; background: var(--acc); box-shadow: 0 2px 8px rgba(0,0,0,.3); }
.pe-bgok::after { content: ''; position: absolute; left: 7px; top: 4px; width: 6px; height: 10px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.pe-bgn { display: flex; flex-direction: column; gap: 1px; padding: 0 4px; line-height: 1.3; } .pe-bgn b { font-size: 13px; font-weight: 600; } .pe-bgn small { font-size: 11.5px; color: var(--mut); }
.pe-bgs.off .pe-bgt { opacity: .55; cursor: default; }   /* Basic: pozadí je Profi */
.pe-bgs.sm { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; } .pe-bgs.sm .pe-bgt { padding: 4px 4px 6px; gap: 4px; border-radius: 12px; } .pe-bgs.sm .pe-bgn b { font-size: 11px; }
/* jazyky */
.pe-lctl { display: flex; align-items: center; gap: 8px 10px; flex-wrap: wrap; margin: 0 0 12px; }
.pe-lbtn { display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 12px; border-radius: 12px; border: 1px solid var(--btn-line); background: var(--btn-bg); box-shadow: var(--btn-shadow); color: var(--ink); font-size: 13.5px; white-space: nowrap; cursor: pointer; }
.pe-lbtn small { font-size: 11.5px; color: var(--mut); font-weight: 500; } .pe-lbtn small.warn { color: var(--warn); } .pe-lbtn small.ok { color: var(--ok); }
.pe-trn { font-size: 12px; color: var(--mut); line-height: 1.4; flex: 1; min-width: 200px; }
.pe-lfly { width: 400px; }
.pe-lexp { margin: 2px 10px 8px; font-size: 11.5px; color: var(--mut); line-height: 1.45; } .pe-lexp b { color: var(--ink); } .pe-card .pe-lexp { margin: 12px 0 0; font-size: 12.5px; }
.pe-lrows { display: flex; flex-direction: column; gap: 2px; max-height: 330px; overflow-y: auto; }
.pe-lrow { display: grid; grid-template-columns: minmax(0, 1fr) 72px 58px; align-items: center; gap: 10px; width: 100%; min-height: 40px; padding: 4px 10px; box-sizing: border-box; border-radius: 10px; color: var(--ink); font-size: 13.5px; cursor: pointer; }
.pe-lrow .tag { grid-column: span 2; justify-self: end; }
@media (hover: hover) { .pe-lrow:hover { background: var(--neu-bg); } }
.pe-lrow.on { background: var(--acc-soft); } .pe-lrow.on .pe-ln { font-weight: 600; }
.pe-bar { display: block; height: 6px; border-radius: 99px; background: var(--neu-bg); overflow: hidden; min-width: 60px; } .pe-bar i { display: block; height: 100%; border-radius: 99px; background: var(--acc); }
.pe-pc { display: flex; flex-direction: column; align-items: flex-end; font-variant-numeric: tabular-nums; white-space: nowrap; line-height: 1.15; }
.pe-pc b { font-size: 12.5px; font-weight: 700; } .pe-pc small { font-size: 10.5px; font-weight: 500; color: var(--mut); margin-top: 1px; } .pe-pc.warn b { color: var(--warn); } .pe-pc.ok b { color: var(--ok); }
.pe-lfoot { display: flex; align-items: center; gap: 10px; padding: 8px 6px 4px; border-top: 1px solid var(--hair); margin-top: 4px; } .pe-lfoot .mini { display: inline-flex; align-items: center; gap: 4px; }
.pe-skel { margin: 8px 4px 2px; padding: 10px 10px 8px; border-radius: 12px; background: var(--glass-row); } .pe-skel.big { margin: 0; padding: 0; background: transparent; }
.pe-skh { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 8px; flex-wrap: wrap; } .pe-skh .who { font-size: 11.5px; }
.pe-chips { display: flex; flex-wrap: wrap; gap: 5px; }
.pe-chip { display: inline-flex; align-items: center; gap: 4px; height: 24px; padding: 0 9px; border-radius: 999px; border: 1px dashed var(--hair); color: var(--faint); font-size: 11.5px; font-weight: 500; white-space: nowrap; cursor: pointer; }
.pe-chip .pe-i { width: 11px; height: 11px; }
.pe-chip small, .pe-ln small { font-weight: 400; color: var(--faint); font-size: .9em; margin-left: 3px; }   /* původní název jazyka vedle přeloženého (30. 10. 2026) */
@media (hover: hover) { button.pe-chip:not(.on):not(:disabled):hover { color: var(--acc); border-color: var(--acc); background: var(--acc-soft); } }
.pe-chip.on { border: 1px solid transparent; background: var(--neu-bg); color: var(--ink); font-weight: 600; cursor: default; } button.pe-chip.on { cursor: pointer; }
.pe-skel.big .pe-chip { height: 28px; padding: 0 11px; font-size: 12.5px; }
.pe-skn { margin: 8px 0 0; font-size: 11.5px; line-height: 1.45; color: var(--mut); } .pe-skn b { color: var(--ink); } .pe-skel.big .pe-skn { font-size: 12.5px; margin-top: 12px; }
.pe-trstrip { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-radius: 12px; background: var(--warn-bg); border: 1px solid var(--warn-line); font-size: 12.5px; line-height: 1.45; margin: -2px 0 12px; } .pe-trstrip .pe-i { color: var(--warn); }
.pe-trnote { display: flex; gap: 10px; padding: 12px 14px; border-radius: 12px; background: var(--acc-soft); font-size: 12.5px; line-height: 1.5; color: var(--ink); } .pe-trnote .pe-i { color: var(--acc); margin-top: 1px; }
.pe-lmhead { display: grid; grid-template-columns: minmax(150px, 1.2fr) minmax(0, 2fr); gap: 12px; margin-top: 14px; padding: 0 2px; }
.pe-lmlist { display: flex; flex-direction: column; margin-top: 6px; border-top: 1px solid var(--hair); }
.pe-lmrow { display: grid; grid-template-columns: minmax(150px, 1.2fr) minmax(80px, 1fr) auto auto; align-items: center; gap: 12px; padding: 10px 2px; border-bottom: 1px solid var(--hair); }
.pe-lmrow .pe-ln { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; } .pe-lmn { grid-column: span 2; font-size: 12.5px; }
.pe-lma { display: flex; gap: 4px; align-items: center; justify-content: flex-end; } .pe-lma .mini { display: inline-flex; align-items: center; gap: 4px; }
/* vlastní kategorie */
.pe-catacts { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 12px; } .pe-catacts .mini { display: inline-flex; align-items: center; gap: 4px; } .pe-catacts .who { font-size: 12px; }
.pe-clist { display: flex; flex-direction: column; }
.pe-gitem { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 50px; padding: 6px 8px; border-top: 1px solid var(--hair); color: var(--ink); cursor: pointer; } .pe-gitem:first-child { border-top: 0; }
.pe-gi { width: 36px; height: 36px; flex: none; border-radius: 10px; background: var(--acc-soft); color: var(--acc); display: flex; align-items: center; justify-content: center; }
.pe-gitem .pe-nm { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.3; } .pe-gitem .pe-nm b { font-size: 14px; font-weight: 600; } .pe-gitem .pe-nm span { font-size: 12px; color: var(--mut); }
.pe-catsug { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 12px; } .pe-catsug .pe-chip { height: 28px; padding: 0 11px; font-size: 12.5px; }
/* editor podkategorie a bloků */
.pe-ched { display: flex; flex-direction: column; }
.pe-chead { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: end; gap: 10px; }
.pe-ttl { font-weight: 600; font-size: 15px; }
.pe-icw { position: relative; display: inline-flex; }
.pe-icb { width: 42px; height: 42px; flex: none; border: 1px solid var(--btn-line); border-radius: 12px; background: var(--btn-bg); box-shadow: var(--btn-shadow); color: var(--ink); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.pe-icb.sm { width: 32px; height: 32px; border-radius: 9px; }
.pe-ib { width: 30px; height: 30px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; color: var(--mut); cursor: pointer; }
@media (hover: hover) { .pe-ib:not(:disabled):hover { background: var(--neu-bg); color: var(--ink); } }
.pe-ib.del { color: var(--err); } .pe-ib:disabled { opacity: .35; cursor: default; }
.pe-icmenu { position: absolute; z-index: 40; left: 0; top: calc(100% + 6px); display: grid; grid-template-columns: repeat(8, 34px); gap: 2px; padding: 6px; border-radius: 14px; background: var(--panel); border: 1px solid var(--card-line); box-shadow: 0 14px 40px rgba(0,0,0,.3); }
.pe-icmenu button { width: 34px; height: 34px; border-radius: 8px; color: var(--ink); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.pe-icmenu button:hover, .pe-icmenu button.on { background: var(--neu-bg); } .pe-icmenu button.on { color: var(--acc); }
.pe-pmenu { position: absolute; z-index: 40; right: 0; top: calc(100% + 6px); min-width: 230px; padding: 6px; border-radius: 12px; background: var(--panel); border: 1px solid var(--card-line); box-shadow: 0 14px 40px rgba(0,0,0,.3); display: flex; flex-direction: column; }
.pe-pmenu button { display: flex; align-items: center; gap: 9px; width: 100%; padding: 9px 10px; border-radius: 8px; color: var(--ink); font-size: 13px; cursor: pointer; }
.pe-pmenu button:hover:not(:disabled) { background: var(--neu-bg); } .pe-pmenu button.del { color: var(--err); } .pe-pmenu button:disabled { opacity: .4; cursor: default; }
.pe-cmeta { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 10px 14px; margin-top: 12px; padding: 12px 14px; border-radius: 14px; background: var(--glass-row); }
.pe-cmeta .pe-f + .pe-f { margin-top: 0; } .pe-cmeta .pe-trow { font-size: 12.5px; }
.pe-blab { display: flex; align-items: center; gap: 10px; margin: 16px 2px 8px; flex-wrap: wrap; } .pe-blab .who { font-size: 11.5px; }
.pe-blocks { display: flex; flex-direction: column; gap: 10px; }
.pe-blk { padding: 10px 12px 12px; border-radius: 14px; background: var(--glass-bg); border: 1px solid var(--glass-edge); box-shadow: var(--glass-shadow); }
.pe-bh { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; flex-wrap: wrap; } .pe-bh .tag { display: inline-flex; align-items: center; gap: 5px; } .pe-bh .tag .pe-i { width: 13px; height: 13px; }
.pe-grip { width: 15px; height: 15px; color: var(--faint); } .pe-bnote { font-size: 11.5px; }
.pe-ta { min-height: 44px; line-height: 1.5; resize: vertical; } .pe-ta.one { min-height: 36px; resize: none; overflow: hidden; } .pe-ta.bold { font-weight: 600; } .pe-ta.url { word-break: break-all; }
.pe-ta.warn { background: var(--warn-bg); border-color: var(--warn-line); }
.pe-items { display: flex; flex-direction: column; gap: 6px; }
.pe-ir { display: flex; align-items: flex-start; gap: 8px; } .pe-ir .pe-ta { flex: 1; min-width: 0; }
.pe-iadd { display: flex; align-items: center; gap: 10px; margin-top: 4px; flex-wrap: wrap; } .pe-iadd .who { font-size: 11.5px; } .pe-iadd .mini { display: inline-flex; align-items: center; gap: 4px; }
.pe-thumbs { display: flex; gap: 12px; flex-wrap: wrap; align-items: flex-start; }
.pe-thumb { width: 124px; display: flex; flex-direction: column; gap: 4px; }
.pe-pic { position: relative; display: block; width: 124px; height: 84px; border-radius: 10px; background: center / cover no-repeat #cfc7bd; }
.pe-tb { position: absolute; left: 4px; bottom: 4px; display: inline-flex; gap: 2px; }
.pe-tb button, .pe-tx { width: 24px; height: 24px; border-radius: 7px; border: 1px solid var(--card-line); background: var(--panel); color: var(--ink); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.pe-tb button:disabled { opacity: .45; } .pe-tb .pe-i, .pe-tx .pe-i { width: 12px; height: 12px; }
.pe-tx { position: absolute; top: -7px; right: -7px; width: 22px; height: 22px; border-radius: 50%; color: var(--err); }
.pe-cap { height: 30px; font-size: 12px; padding: 0 8px; }
.pe-tadd { width: 124px; height: 84px; flex: none; border: 1px dashed var(--hair); border-radius: 10px; color: var(--mut); display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; font-size: 12px; font-weight: 500; text-align: center; cursor: pointer; }
.pe-tadd small { font-size: 10px; color: var(--faint); }
.pe-addblk { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--hair); } .pe-addblk .who { font-size: 12px; margin-right: 4px; } .pe-addblk .mini { display: inline-flex; align-items: center; gap: 5px; }
.pe-msgs h2 { margin-top: 0; }
/* náhled */
.pe-pvh { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-bottom: 8px; }
.pe-pvh .mini { display: inline-flex; align-items: center; gap: 5px; padding: .3rem .6rem; font-size: 12px; min-height: 30px; white-space: nowrap; }
.pe-pvh .pe-i { width: 13px; height: 13px; }
/* 1. řádek: název + zařízení vpravo (název se zkrátí, nezalamuje — v Safari se jinak hlavička rozpadla na 5 řádků, Marco 29. 10. 2026) */
.pe-pvt { flex: 1 1 0; display: flex; flex-direction: column; min-width: 0; line-height: 1.3; } .pe-pvt b { font-size: 14px; } .pe-pvt span { font-size: 12px; color: var(--mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pe-seg { margin: 0; flex: none; flex-wrap: nowrap; }
.pe-seg button { display: inline-flex; align-items: center; gap: 5px; flex: 0 0 auto; padding: .3rem .55rem; font-size: 12px; white-space: nowrap; }
.pe-seg button.on { background: var(--btn-bg); box-shadow: var(--btn-shadow); }
.pe-seg .pe-i { width: 13px; height: 13px; }
.pe-zoom { display: inline-flex; align-items: center; gap: 1px; padding: 2px; border-radius: 11px; background: var(--neu-bg); flex: none; } .pe-zoom .pe-ib { width: 26px; height: 26px; }
.pe-zv { min-width: 56px; height: 26px; padding: 0 8px; border-radius: 9px; color: var(--ink); font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; line-height: 1.05; text-align: center; cursor: pointer; }
.pe-zv small { font-size: 9.5px; font-weight: 500; color: var(--mut); } .pe-zv.on { background: var(--btn-bg); box-shadow: var(--btn-shadow); }
.pe-fmt { display: inline-flex; gap: 2px; padding: 3px; border-radius: 12px; background: var(--neu-bg); flex: none; }
.pe-fb { min-width: 34px; height: 32px; padding: 0 9px; border-radius: 9px; color: var(--ink); font-size: 14px; font-weight: 600; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.pe-fb i { font-family: Georgia, 'Times New Roman', serif; font-size: 15px; font-weight: 600; } .pe-fb.w { font-size: 12.5px; font-weight: 500; }
.pe-fb.on { background: var(--btn-bg); box-shadow: var(--btn-shadow); color: var(--acc); } .pe-fmt.plain .pe-fb { opacity: .45; }
.pe-ed8n { margin: 0; flex: 1; min-width: 180px; }
.pe-slot { display: flex; gap: 22px; justify-content: center; align-items: flex-start; min-height: 200px; }
.pe-pvframe { display: flex; flex-direction: column; align-items: center; gap: 8px; min-width: 0; }
.pe-pvframe:has(.pe-pvpan:not([hidden])) { width: 100%; }
.pe-pvsz { position: relative; overflow: hidden; border-radius: 34px; border: 1px solid var(--glass-edge); box-shadow: 0 0 0 6px rgba(20,20,28,.88), 0 22px 50px rgba(0,0,0,.3); background: #e9edf5; }
.pe-pvframe.pc .pe-pvsz { border-radius: 12px; box-shadow: 0 0 0 5px rgba(20,20,28,.88), 0 22px 50px rgba(0,0,0,.28); }
.pe-pvsz iframe { position: absolute; left: 0; top: 0; border: 0; transform-origin: 0 0; background: #e9edf5; }
.pe-pvcap { font-size: 12px; color: var(--mut); display: inline-flex; gap: 6px; align-items: center; } .pe-pvcap .pe-i { width: 13px; height: 13px; }
.pe-pvpan { width: 100%; max-width: 100%; margin: 2px 0 0; padding: 0; border: 0; background: none; accent-color: var(--acc); }
.pe-pvn { display: flex; gap: 8px; margin: 12px 2px 0; font-size: 11.5px; color: var(--mut); line-height: 1.45; } .pe-pvn .pe-i { flex: none; margin-top: 1px; color: var(--acc); }
.pe-open { display: inline-flex; align-items: center; gap: 6px; margin: 8px 2px 0; font-size: 12.5px; color: var(--acc); font-weight: 600; text-decoration: none; }
/* úpravy přes celou obrazovku */
html.pe7on, html.pe7on body { overflow: hidden; }
.pe7 { position: fixed; inset: 0; z-index: 8000; display: flex; flex-direction: column; gap: 10px; padding: 10px 14px; box-sizing: border-box; background: var(--body-bg); background-color: var(--bg); animation: pe7In .3s cubic-bezier(.3,.75,.2,1) both; }
@keyframes pe7In { from { opacity: 0; transform: scale(.985); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .pe7 { animation: none; } }
.pe7-tool { flex: none; padding: 10px 12px; display: flex; flex-direction: column; gap: 8px; }
.pe7-r { display: flex; align-items: center; justify-content: space-between; gap: 8px 14px; flex-wrap: wrap; }
.pe7-l, .pe7-rr { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; min-width: 0; }
.pe7-l .mini, .pe7-rr .mini { display: inline-flex; align-items: center; gap: 6px; }
.pe7-ttl { display: inline-flex; align-items: center; gap: 9px; padding-right: 8px; border-right: 1px solid var(--hair); } .pe7-ttl > span:last-child { display: flex; flex-direction: column; line-height: 1.2; } .pe7-ttl b { font-size: 13.5px; } .pe7-ttl small { font-size: 11px; color: var(--mut); }
.pe7-a .pe-sh { display: none; }
.pe7-st { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--mut); white-space: nowrap; } .pe7-st .pe-i { width: 13px; height: 13px; color: var(--ok); }
.pe7-tip { margin: 0; align-items: flex-start; } .pe7-tip .pe-ib { margin-left: auto; width: 24px; height: 24px; }
.pe7-slot { flex: 1; min-height: 0; gap: 24px; }
.pe7 .pe-trstrip { margin: 0; }
/* bublina údajů části portálu */
.pe-pop { position: fixed; z-index: 8500; width: min(360px, calc(100vw - 20px)); box-sizing: border-box; padding: 14px 14px 12px; border-radius: 18px; background: var(--panel); border: 1px solid var(--card-line); box-shadow: 0 24px 60px rgba(0,0,0,.34); animation: pePopIn .18s ease-out both; }
.pe-pop[hidden] { display: none; }
@keyframes pePopIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.pe-poph { display: flex; align-items: flex-start; gap: 10px; } .pe-popt { flex: 1; min-width: 0; } .pe-popt b { font-size: 14.5px; } .pe-popt p { margin: 3px 0 0; font-size: 12px; color: var(--mut); line-height: 1.45; }
.pe-x { display: inline-flex; align-items: center; justify-content: center; padding: 0; width: 30px; height: 30px; }
.pe-popb { margin-top: 12px; display: flex; flex-direction: column; gap: 10px; } .pe-popb .pe-g2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 140px), 1fr)); }
.pe-popb .pe-crop { margin: 0; gap: 12px; } .pe-popb .pe-cctl { min-width: 150px; }
.pe-popf { display: flex; align-items: center; gap: 8px; margin-top: 12px; }
.pe-lnk { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--acc); font-weight: 600; cursor: pointer; }
/* okna */
.px-modal.pe-dlg.wide { max-width: 980px; } .px-modal.pe-dlg.big { max-width: 520px; }
.pe-dlg .pe-f + .pe-f { margin-top: 10px; }
.pe-dlg .pe-slot { margin-top: 10px; }
.pe-icgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(46px, 1fr)); gap: 4px; }
.pe-icgrid button { height: 46px; border-radius: 10px; color: var(--ink); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
@media (hover: hover) { .pe-icgrid button:hover { background: var(--neu-bg); } } .pe-icgrid button.on { background: var(--acc-soft); color: var(--acc); }
.pe-smp { display: flex; flex-direction: column; max-height: 52vh; overflow-y: auto; }
.pe-srow { display: flex; align-items: center; gap: 10px; padding: 8px 4px; margin: 0; border-bottom: 1px solid var(--hair); color: var(--ink); font-size: 13px; font-weight: 400; cursor: pointer; }
.pe-srow input { width: auto; } .pe-srow .pe-nm { flex: 1; min-width: 0; display: flex; flex-direction: column; } .pe-srow .pe-nm span { font-size: 11.5px; color: var(--mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* telefon a úzké okno: osnova / stránka po sobě, náhled v okně nebo na celý displej */
@media (max-width: 920px) {
  .pe-grid { display: block; } .pe-pv { display: none; }
  .pe-v4g { display: block; }
  .pe-v4g[data-osn="page"] .pe-osn { display: none; }
  .pe-v4g[data-osn="list"] .pe-pg { display: none; }
  .pe-osn { position: static; max-height: none; }
  .pe-osnback { display: inline-flex; margin-bottom: 8px; }
  .pe-row { min-height: 44px; } .pe-row .pe-nm b { font-size: 14.5px; } .pe-row.st { min-height: 54px; }
  .pe-lmrow { grid-template-columns: minmax(0, 1fr) auto; } .pe-lmrow .pe-bar, .pe-lmrow .pe-pc { grid-column: 1; } .pe-lmn { grid-column: 1 / -1; }
  .pe-lfly { width: 320px; }
  .pe-fabs { position: sticky; bottom: 110px; z-index: 20;   /* nad lepivou patičkou Uložit (#aptFoot ~95 px) */ display: flex; justify-content: center; gap: 8px; margin: 14px 0 0; }
  .pe-fab { display: inline-flex; align-items: center; gap: 8px; padding: 12px 18px; border-radius: 999px; background: var(--prim-bg); color: var(--prim-ink); box-shadow: var(--prim-shadow); font-size: 13.5px; font-weight: 600; cursor: pointer; }
  .pe-fab.f2 { background: var(--btn-bg); color: var(--ink); box-shadow: var(--btn-shadow); border: 1px solid var(--btn-line); }
  .pe7 { padding: 8px 10px; } .pe7-tool { padding: 8px 10px; }
  .pe7-a .pe-lg, .pe7-tip, .pe7-ttl small { display: none; } .pe7-a .pe-sh { display: inline; }
  .pe-g3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pe-bgs { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; } .pe-bgt { padding: 4px 4px 8px; border-radius: 13px; } .pe-bgn small { display: none; }
}