/* Prémiová vrstva rozhraní Evida.
   – Palety (palety.css) se tu mapují na proměnné aplikace.
   – Přehled je „bento": velké zaoblené dlaždice, počítadla, prstenec dnů, tenké sloupce.
   – Skleněná horní lišta, úzký boční panel, rychlé hledání (Ctrl+K).
   – Mikrointerakce: oslava úspěchu, mazání, tekutá výplň nahrávání.
   Pohyb je jen tam, kde nic neomezuje: systémové omezení pohybu i volba „Utlumené"
   ho vypnou. Nic se neanimuje donekonečna. Soubor se načítá jako poslední. */

/* ------------------------------ Tokeny ------------------------------ */
/* Specifičnost body[a][b] (0,2,1) + pořadí načtení přebije výchozí téma i styl „web". */
body[data-paleta][data-theme] {
  --bg:var(--p-bg);--bg-card:var(--p-card);--surface:var(--p-card);--bg-elev:var(--p-elev);
  --border:var(--p-line);--border-strong:var(--p-line-2);
  --text:var(--p-text);--text-2:var(--p-text-2);--text-3:var(--p-text-3);--muted:var(--p-text-2);
  --radius:16px;--radius-velky:22px;
  --stin-dlazdice:inset 0 1px 0 color-mix(in srgb,var(--p-text) 5%,transparent);
  --ease-premium:cubic-bezier(.22,1,.36,1);
  --ease-pruzina:cubic-bezier(.34,1.56,.64,1);
}
body[data-paleta][data-theme="light"] {
  --stin-dlazdice:0 1px 0 #fff inset,0 1px 2px color-mix(in srgb,var(--p-text) 6%,transparent),0 14px 34px -18px color-mix(in srgb,var(--p-text) 26%,transparent);
}
.sr-only{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* Jemná záře palety za obsahem – jako světlo nad stolem, ne pozadí na obrázku. */
body[data-paleta] #app .main{
  background:
    radial-gradient(900px 520px at 100% -10%,color-mix(in srgb,var(--p-glow) 11%,transparent),transparent 70%),
    radial-gradient(760px 460px at -10% 108%,color-mix(in srgb,var(--p-b) 6%,transparent),transparent 70%);
}
body[data-paleta][data-theme] .sidebar{background:var(--p-side);border-right-color:var(--p-line)}

/* --------------------------- Skleněná lišta --------------------------- */
body[data-paleta][data-styl] .topbar{
  background:color-mix(in srgb,var(--bg) 66%,transparent);
  -webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4);
  border-bottom:1px solid color-mix(in srgb,var(--p-line) 70%,transparent);
}
.topbar-left{display:flex;align-items:center;gap:14px;min-width:0}
.hledat-btn{
  display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:6px 8px 6px 12px;
  border:1px solid var(--border);border-radius:999px;background:color-mix(in srgb,var(--bg-card) 70%,transparent);
  color:var(--text-2);font:450 13px var(--font);cursor:pointer;white-space:nowrap;
  transition:border-color .2s,color .2s,background-color .2s;
}
.hledat-btn:hover{color:var(--text);border-color:var(--border-strong)}
.hledat-btn kbd,.prikazy kbd{font:500 11px var(--mono);padding:2px 6px;border-radius:6px;border:1px solid var(--border);background:var(--bg-elev);color:var(--text-2)}
@media (max-width:820px){.hledat-btn{display:none}}

/* ------------------------------ Karty -------------------------------- */
body[data-paleta][data-styl] .card{border-radius:var(--radius);box-shadow:var(--stin-dlazdice);border-color:var(--p-line)}
body[data-paleta][data-styl] .nav-item.active{background:color-mix(in srgb,var(--accent) 14%,transparent);color:var(--accent-ink)}

/* --------------------------- Bento přehled --------------------------- */
.bento{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px;margin-bottom:18px}
body[data-styl] .bento>#statGrid,body[data-styl] .bento>.overview-layout{display:contents}
body[data-paleta][data-styl] .bento .bento-tile{
  position:relative;margin:0;min-width:0;padding:22px 24px;
  background:var(--bg-card);border:1px solid var(--p-line);border-radius:var(--radius-velky);
  box-shadow:var(--stin-dlazdice);overflow:hidden;isolation:isolate;
}
body[data-paleta][data-styl] .bento .stat+.stat{border-left:1px solid var(--p-line)}
.bento-hero{grid-column:span 6;grid-row:span 2;display:flex;flex-direction:column}
.bento-hodiny{grid-column:span 3}
.bento-km{grid-column:span 3}
.bento-graf{grid-column:span 6}
.bento-souhrn{grid-column:span 12}
/* Kompaktní režim graf skrývá – souhrn pak zaplní místo vedle velké dlaždice. */
body[data-rozhrani="compact"] .bento-souhrn{grid-column:span 6}
body[data-paleta][data-styl] .bento .bento-hero{
  background:
    radial-gradient(120% 90% at 100% 0%,color-mix(in srgb,var(--p-glow) 16%,transparent),transparent 62%),
    var(--bg-card);
}
.bento-pozdrav{margin:0;padding-bottom:18px;font:600 clamp(22px,2.2vw,30px)/1.2 var(--font);letter-spacing:-.03em;color:var(--text)}
body[data-styl] .bento .bento-hero .stat-value.bento-velke{font-size:clamp(34px,4.2vw,56px);letter-spacing:-.045em;line-height:1.08;margin:8px 0 18px;color:var(--text)}
body[data-styl] .bento .bento-hero .stat-value .dph-radek{display:block;font:400 13px/1.5 var(--font);letter-spacing:0;color:var(--text-2);margin-top:6px}
body[data-styl] .bento .stat .stat-value{font-variant-numeric:tabular-nums}

/* Rozpad částky: jeden tenký pruh, 2px mezery mezi díly, popisky pod ním. */
.rozpad{display:flex;gap:2px;height:10px;border-radius:999px;overflow:hidden;background:var(--bg-elev)}
.rozpad-seg{flex:var(--podil) 1 0;min-width:6px;background:var(--barva);border-radius:2px}
.rozpad-seg:first-child{border-radius:999px 2px 2px 999px}.rozpad-seg:last-child{border-radius:2px 999px 999px 2px}.rozpad-seg:only-child{border-radius:999px}
.rozpad-legenda{display:flex;flex-wrap:wrap;gap:8px 22px;list-style:none;margin:14px 0 0;padding:0;font-size:13px;color:var(--text-2)}
.rozpad-legenda li{display:flex;align-items:center;gap:8px}
.rozpad-legenda i{width:10px;height:10px;border-radius:3px;background:var(--barva);flex:none}
.rozpad-legenda strong{font:500 13px var(--mono);color:var(--text);margin-left:2px}

/* Prstenec odpracovaných dní. */
.bento-ring-radek{display:flex;align-items:center;justify-content:space-between;gap:12px}
.bento-ring{width:78px;height:78px;flex:none;transform:rotate(-90deg)}
.bento-ring-obal{display:flex;flex-direction:column;align-items:center;gap:4px;flex:none}
.bento-ring-obal small{font:500 11px/1.2 var(--font);color:var(--text-2);white-space:nowrap}
.bento-ring circle{fill:none;stroke-width:6}
.ring-stopa{stroke:var(--bg-elev)}
.ring-hodnota{stroke:var(--p-graf);stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:calc(100 - var(--hodnota))}
.bento-ring text{transform:rotate(90deg);transform-origin:32px 32px;fill:var(--text);font:600 12.5px var(--mono)}

/* Sloupce: tenké, zaoblené nahoře, ukotvené u základny; popisek jen u nejdelšího dne. */
body[data-styl] .bento .bar-chart{height:230px;gap:2px;align-items:flex-end;justify-content:space-between;padding-top:34px}
body[data-paleta][data-styl] .bento .bar{
  flex:1 1 0;max-width:22px;border:0;padding:0;cursor:pointer;
  background:var(--p-graf);opacity:.92;border-radius:6px 6px 2px 2px;
}
body[data-paleta][data-styl] .bento .bar.weekend:not(.empty){background:var(--p-graf);opacity:.42}
body[data-paleta][data-styl] .bento .bar.nej{background:var(--p-graf-2);opacity:1}
body[data-paleta][data-styl] .bento .bar.empty{background:var(--p-line);opacity:1}
body[data-paleta][data-styl] .bento .bar.dnes{outline:2px solid var(--p-a);outline-offset:2px}
body[data-paleta][data-styl] .bento .bar:hover,body[data-paleta][data-styl] .bento .bar:focus-visible{opacity:1}
.bar-stitek{position:absolute;left:50%;bottom:calc(100% + 7px);transform:translateX(-50%);padding:3px 8px;border-radius:999px;
  background:var(--text);color:var(--bg);font:600 11px var(--mono);white-space:nowrap;pointer-events:none}
/* Bublina při najetí nebo fokusu – číslo i datum, text v barvě textu. */
.bento .bar[data-tip]:is(:hover,:focus-visible)::after{
  content:attr(data-tip);position:absolute;z-index:3;left:50%;bottom:calc(100% + 9px);transform:translateX(-50%);
  padding:6px 10px;border-radius:10px;background:var(--text);color:var(--bg);font:500 12px var(--font);white-space:nowrap;
  box-shadow:0 8px 20px -8px #0008;pointer-events:none;
}
.bento .bar.nej[data-tip]:is(:hover,:focus-visible) .bar-stitek{opacity:0}

@media (max-width:1180px){
  .bento-hero{grid-column:span 12;grid-row:auto}
  .bento-hodiny,.bento-km{grid-column:span 6}
  .bento-graf,.bento-souhrn,body[data-rozhrani="compact"] .bento-souhrn{grid-column:span 12}
}
@media (max-width:600px){
  .bento{gap:12px}
  .bento-hodiny,.bento-km{grid-column:span 12}
  body[data-paleta][data-styl] .bento .bento-tile{padding:18px;border-radius:18px}
  body[data-paleta][data-styl] .bento .stat+.stat{border-left:1px solid var(--p-line)}
  .bento-pozdrav{padding-bottom:14px}
  body[data-styl] .bento .bar-chart{height:180px}
}

/* Další kroky jako pilulky nad přehledem – tmavá, akcentová, obrysová. */
body[data-paleta] #overviewActions:not(.hidden){display:flex;flex-wrap:wrap;gap:10px;padding:0;background:none;border:0;box-shadow:none}
body[data-paleta] .overview-next{display:inline-flex;gap:12px;min-height:44px;padding:6px 6px 6px 16px;border-radius:999px;background:var(--bg-card);border:1px solid var(--p-line);font:500 13px var(--font)}
body[data-paleta] .overview-next strong{display:inline-grid;place-items:center;min-width:32px;height:32px;padding:0 10px;border-radius:999px;background:var(--bg-elev);font:600 12px var(--mono)}
body[data-paleta] .overview-next:first-child{background:var(--p-text);color:var(--p-bg);border-color:transparent}
body[data-paleta] .overview-next:first-child strong{background:var(--accent-fill,var(--accent));color:var(--accent-text)}
body[data-paleta] .overview-next:hover{border-color:var(--border-strong)}

/* ------------------------- Výběr palety --------------------------- */
.paleta-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}
.paleta-karta{display:flex;flex-direction:column;gap:9px;padding:8px 8px 10px;border:1px solid var(--border);border-radius:16px;background:transparent;color:var(--text);cursor:pointer;text-align:left;font:500 13px var(--font);transition:border-color .2s,transform .2s var(--ease-premium)}
.paleta-karta:hover{border-color:var(--border-strong)}
.paleta-karta[aria-checked="true"]{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.paleta-nazev{padding:0 4px}
.paleta-nahled{position:relative;display:grid;grid-template-columns:18px 1.4fr 1fr;grid-template-rows:1fr 34px;gap:5px;height:92px;padding:6px;border-radius:11px;background:var(--p-bg);overflow:hidden}
.paleta-nahled i{display:block;border-radius:6px;background:var(--p-card);border:1px solid var(--p-line)}
.paleta-nahled .pn-bok{grid-row:span 2;background:var(--p-side)}
.paleta-nahled .pn-velka{background:radial-gradient(120% 100% at 100% 0,color-mix(in srgb,var(--p-a) 30%,transparent),transparent 65%),var(--p-card);position:relative}
.paleta-nahled .pn-velka b{position:absolute;left:7px;bottom:7px;width:46%;height:7px;border-radius:4px;background:var(--p-text)}
.paleta-nahled .pn-dlazdice em{display:block;width:26px;height:26px;margin:10px auto;border-radius:50%;border:4px solid var(--p-line);border-top-color:var(--p-graf);border-right-color:var(--p-graf)}
.paleta-nahled .pn-graf{grid-column:2/4;display:flex;align-items:flex-end;gap:3px;padding:5px 7px}
.paleta-nahled .pn-graf u{flex:1;border-radius:3px 3px 1px 1px;background:var(--p-graf)}
.paleta-nahled .pn-graf u:nth-child(1){height:40%}.paleta-nahled .pn-graf u:nth-child(2){height:70%}.paleta-nahled .pn-graf u:nth-child(3){height:55%}.paleta-nahled .pn-graf u:nth-child(4){height:100%;background:var(--p-graf-2)}.paleta-nahled .pn-graf u:nth-child(5){height:30%}
.rezim-volba{display:inline-flex;gap:2px;padding:3px;border:1px solid var(--border);border-radius:999px;background:var(--bg-elev);flex:none}
.rezim-volba button{display:inline-flex;align-items:center;gap:6px;min-height:34px;padding:6px 13px;border:0;border-radius:999px;background:transparent;color:var(--text-2);font:500 13px var(--font);cursor:pointer}
.rezim-volba button[aria-pressed="true"]{background:var(--bg-card);color:var(--text);box-shadow:0 1px 3px #0003}
#paletaCard .card-head{flex-wrap:wrap;align-items:flex-start}

/* ------------------------ Úzký boční panel ------------------------ */
.side-sbalit{display:none}
@media (min-width:821px){
  .sidebar{position:sticky}
  .side-sbalit{display:inline-flex;align-items:center;justify-content:center;position:absolute;top:16px;right:10px;width:32px;height:32px;border:0;border-radius:9px;background:transparent;color:var(--text-3);cursor:pointer;transition:color .2s,background-color .2s}
  .side-sbalit:hover{color:var(--text);background:var(--bg-elev)}
  body[data-bocni="uzky"][data-styl] .sidebar{width:76px}
  body[data-bocni="uzky"] .side-sbalit{position:static;margin:0 auto 6px}
  body[data-bocni="uzky"] .side-sbalit svg{transform:scaleX(-1)}
  body[data-bocni="uzky"][data-styl] .side-brand{justify-content:center;padding-inline:0}
  body[data-bocni="uzky"] :is(.side-brand span,.nav-sekce span,.chip-brzy,.hvezda,.agenda-name,.agenda-btn .chev,.side-help span,.side-user-name,.side-user .dim,.side-verze){display:none}
  body[data-bocni="uzky"][data-styl] .side-nav{padding-inline:10px}
  body[data-bocni="uzky"][data-styl] .nav-item{font-size:0;justify-content:center;padding-inline:0;gap:0}
  body[data-bocni="uzky"] .nav-sekce{justify-content:center;min-height:14px;padding:0;pointer-events:none}
  body[data-bocni="uzky"] .nav-sekce::after{content:"";width:22px;height:1px;background:var(--border)}
  body[data-bocni="uzky"] .nav-sekce .sip{display:none}
  body[data-bocni="uzky"] .nav-obsah{display:flex!important;flex-direction:column}
  body[data-bocni="uzky"] :is(.side-help,.side-user,.agenda-btn){justify-content:center}
}

/* ------------------------ Rychlé hledání ------------------------- */
.prikazy{width:min(620px,calc(100% - 32px));max-height:min(560px,76vh);margin:12vh auto auto;padding:0;border:1px solid var(--border-strong);border-radius:20px;background:var(--bg-card);color:var(--text);box-shadow:0 30px 90px -20px #000a;overflow:hidden}
.prikazy::backdrop{background:color-mix(in srgb,var(--bg) 55%,transparent);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.prikazy-box{display:flex;flex-direction:column;max-height:inherit}
.prikazy-pole{display:flex;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid var(--border);color:var(--text-2)}
.prikazy-pole input{flex:1;min-width:0;border:0;background:transparent;color:var(--text);font:450 17px var(--font);outline:none}
.prikazy-pole input::placeholder{color:var(--text-3)}
.prikazy-seznam{list-style:none;margin:0;padding:8px;overflow-y:auto;flex:1}
.prikazy-seznam li{display:flex;align-items:center;gap:12px;min-height:44px;padding:9px 12px;border-radius:12px;cursor:pointer;color:var(--text-2)}
.prikazy-seznam li[aria-selected="true"]{background:color-mix(in srgb,var(--accent) 14%,transparent);color:var(--text)}
.prikaz-nazev{flex:1;font:500 14px var(--font)}
.prikaz-typ{font:400 12px var(--font);color:var(--text-3)}
.prikaz-vzorek{width:18px;height:18px;border-radius:50%;background:conic-gradient(var(--p-a) 0 50%,var(--p-bg) 0);border:1px solid var(--p-line-2);flex:none}
.prikazy-prazdno{padding:18px 12px;color:var(--text-2);cursor:default}
.prikazy-napoveda{display:flex;gap:18px;margin:0;padding:10px 18px;border-top:1px solid var(--border);color:var(--text-3);font-size:12px}
.prikazy-napoveda kbd{margin-right:3px}

/* -------------------------- Oslava úspěchu ------------------------- */
.oslava{position:fixed;z-index:120;left:50%;bottom:28px;display:flex;align-items:center;gap:12px;padding:12px 20px 12px 12px;border:1px solid var(--border-strong);border-radius:999px;background:var(--bg-card);color:var(--text);font:600 14px var(--font);box-shadow:0 22px 50px -18px #000b;transform:translate(-50%,0);opacity:1}
.oslava[hidden]{display:none}
.oslava:not(.je){opacity:0;transform:translate(-50%,12px);transition:opacity .3s,transform .3s}
.oslava-znak{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:color-mix(in srgb,var(--green) 18%,transparent)}
.oslava-znak svg{width:30px;height:30px}
.oslava-znak circle,.oslava-znak path{fill:none;stroke:var(--green);stroke-width:4;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:820px){.oslava{bottom:calc(84px + env(safe-area-inset-bottom))}}

/* ---------------------- Mazání, které sní popisek ------------------- */
.snida{position:relative;overflow:hidden;justify-content:flex-start}
.snida .sned{display:inline-flex;white-space:pre}
.snida .sned i{display:inline-block;font-style:normal}
.snida .kos{position:absolute;right:10px;top:50%;width:20px;height:20px;margin-top:-10px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* ------------------------ Tekutá výplň nahrávání -------------------- */
:is(#tkZeSouboru,#ftZeSouboru,#tkVyfotit,#ftVyfotit,#podpisNahratBtn,#agendaImportBtn){position:relative;overflow:hidden;isolation:isolate}
:is(#tkZeSouboru,#ftZeSouboru,#tkVyfotit,#ftVyfotit,#podpisNahratBtn,#agendaImportBtn)::before{
  content:"";position:absolute;z-index:-1;left:-10%;right:-10%;bottom:0;height:0;
  background:color-mix(in srgb,var(--accent) 22%,transparent);border-radius:45% 45% 0 0/18px 18px 0 0;
}

/* ------------------- Přihlášení: noční horizont ------------------- */
body[data-paleta] #authScreen{
  background:
    radial-gradient(70% 45% at 50% 108%,color-mix(in srgb,var(--p-a) 22%,transparent),transparent 70%),
    radial-gradient(40% 30% at 82% 12%,color-mix(in srgb,var(--p-b) 10%,transparent),transparent 70%);
}
body[data-paleta][data-theme] #authScreen .primary{background:var(--accent-fill,var(--accent));color:var(--accent-text)}

/* ------------------------------ Pohyb ------------------------------ */
@media (prefers-reduced-motion:no-preference){
  /* Dlaždice vyjedou po sobě; styl „web" jinak animace karet vypíná. */
  body:not([data-animace="klidne"])[data-paleta][data-styl] .bento-vstup .bento .bento-tile{animation:bento-in .7s var(--ease-premium) both!important;animation-delay:calc(var(--i,0)*70ms)!important}
  body:not([data-animace="klidne"])[data-paleta][data-styl] .bento .bento-tile{transition:transform .35s var(--ease-premium),border-color .3s,box-shadow .35s}
  body:not([data-animace="klidne"])[data-paleta][data-styl] .bento .bento-tile:hover{transform:translateY(-3px)!important;border-color:color-mix(in srgb,var(--p-a) 30%,var(--p-line));box-shadow:var(--stin-dlazdice),0 18px 40px -22px color-mix(in srgb,var(--p-a) 45%,transparent)!important}
  body:not([data-animace="klidne"]) .bento-vstup .ring-hodnota{animation:ring-in 1.1s .25s var(--ease-premium) both}
  body:not([data-animace="klidne"]) .bento-vstup .rozpad-seg{animation:rozpad-in .9s .2s var(--ease-premium) both;transform-origin:left}
  body:not([data-animace="klidne"])[data-paleta][data-styl] .bento .bar{transition:opacity .15s,transform .2s var(--ease-premium)}
  body:not([data-animace="klidne"])[data-paleta][data-styl] .bento .bar:not(.empty):hover{transform:scaleY(1.03)}
  body:not([data-animace="klidne"]) .bento-vstup .bar-stitek{animation:stitek-in .45s .9s var(--ease-pruzina) both}
  body:not([data-animace="klidne"]) .bento .bar[data-tip]:is(:hover,:focus-visible)::after{animation:tip-in .18s var(--ease-premium) both}
  body[data-animace="svizne"] .bento-vstup .bento .bento-tile{animation-duration:.42s!important;animation-delay:calc(var(--i,0)*40ms)!important}
  body[data-animace="vyrazne"] .bento-vstup .bento .bento-tile{animation-name:bento-in-vyrazne!important;animation-duration:.9s!important}

  /* Menu: aktivní položka dostane výplň plynule, ikona se při najetí pohne. */
  body:not([data-animace="klidne"]) .sidebar,body:not([data-animace="klidne"]) .sidebar .nav-item{transition:width .35s var(--ease-premium),background-color .25s,color .25s,padding .35s var(--ease-premium)}
  body:not([data-animace="klidne"]) .nav-item .ico{transition:transform .3s var(--ease-pruzina)}
  body:not([data-animace="klidne"]) .nav-item:hover .ico{transform:translateX(2px) scale(1.06)}
  body:not([data-animace="klidne"]) .nav-item.active .ico{animation:ikona-aktivni .5s var(--ease-pruzina)}

  body:not([data-animace="klidne"]) .prikazy[open]{animation:prikazy-in .28s var(--ease-premium)}
  body:not([data-animace="klidne"]) .prikazy[open]::backdrop{animation:fade-in .2s ease}
  body:not([data-animace="klidne"]) .paleta-karta:hover{transform:translateY(-2px)}

  body:not([data-animace="klidne"]) .oslava.je{animation:oslava-in .5s var(--ease-pruzina) both}
  body:not([data-animace="klidne"]) .oslava.je circle{stroke-dasharray:100;animation:kresli .6s .1s var(--ease-premium) both}
  body:not([data-animace="klidne"]) .oslava.je path{stroke-dasharray:100;animation:kresli .45s .55s var(--ease-premium) both}
  body:not([data-animace="klidne"]) .oslava.je .oslava-znak{animation:znak-puls .6s 1s ease-out both}

  .snida .sned i{animation:padej .5s cubic-bezier(.55,0,.75,.2) both;animation-delay:calc(120ms + var(--i)*35ms)}
  .snida .kos-vicko{transform-box:fill-box;transform-origin:100% 100%;animation:vicko calc(420ms + var(--n,8)*35ms) ease both}
  .snida .kos{animation:kos-pecet .5s calc(380ms + var(--n,8)*35ms) ease-out both;border-radius:50%}

  :is(#tkZeSouboru,#ftZeSouboru,#tkVyfotit,#ftVyfotit,#podpisNahratBtn,#agendaImportBtn)::before{transition:height .55s var(--ease-premium),border-radius .55s}
  :is(#tkZeSouboru,#ftZeSouboru,#tkVyfotit,#ftVyfotit,#podpisNahratBtn,#agendaImportBtn):is(:hover,:focus-visible)::before{height:120%;border-radius:0}

  body:not([data-animace="klidne"]) #authScreen .auth-card{animation:evido-product-arrive .7s var(--ease-premium) both}
}
@keyframes bento-in{from{opacity:0;transform:translateY(18px) scale(.985)}to{opacity:1;transform:none}}
@keyframes bento-in-vyrazne{0%{opacity:0;transform:translateY(34px) scale(.94)}70%{opacity:1;transform:translateY(-3px) scale(1.005)}100%{opacity:1;transform:none}}
@keyframes ring-in{from{stroke-dashoffset:100}}
@keyframes rozpad-in{from{transform:scaleX(0)}}
@keyframes stitek-in{from{opacity:0;transform:translate(-50%,6px) scale(.8)}}
@keyframes tip-in{from{opacity:0;transform:translate(-50%,4px)}}
@keyframes ikona-aktivni{40%{transform:scale(1.18) rotate(-6deg)}}
@keyframes prikazy-in{from{opacity:0;transform:translateY(-10px) scale(.97)}}
@keyframes fade-in{from{opacity:0}}
@keyframes oslava-in{from{opacity:0;transform:translate(-50%,24px) scale(.9)}}
@keyframes kresli{from{stroke-dashoffset:100}to{stroke-dashoffset:0}}
@keyframes znak-puls{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--green) 45%,transparent)}100%{box-shadow:0 0 0 14px transparent}}
@keyframes padej{0%{transform:none;opacity:1}100%{transform:translate(calc((var(--n,8) - var(--i))*.55em + 1.2em),.7em) rotate(40deg) scale(.15);opacity:0}}
@keyframes vicko{0%,100%{transform:none}12%,80%{transform:rotate(28deg)}}
@keyframes kos-pecet{0%{box-shadow:0 0 0 0 color-mix(in srgb,currentColor 50%,transparent)}100%{box-shadow:0 0 0 10px transparent}}

/* Velká čísla v bento dlaždicích: čisté bezpatkové písmo s tabulkovými číslicemi. */
body[data-styl] .bento .stat .stat-value{font-family:var(--font);font-weight:600;letter-spacing:-.035em;font-variant-numeric:tabular-nums}

/* Text na zeslabeném akcentu nese čitelný odstín (--accent-ink), ne čistý akcent:
   medová žlutá na krémové měla 1,5 : 1. */
body[data-paleta] .time-chip{color:var(--accent-ink)}

/* Kalendář: dnešek a víkend čitelným odstínem, dny jiného měsíce jako vedlejší text. */
body[data-paleta] .kal-hlava-den.dnes .kal-hlava-dt{color:var(--accent-ink)}
body[data-paleta] :is(.kal-hlava-den.vikend,.kal-hlava-den.svatek) .kal-hlava-dt{color:var(--red-strong)}
body[data-paleta] :is(.kal-mc-den.jiny,.kal-mbunka.jiny .kal-mcislo){color:var(--text-2)}

/* ------------------------------ Nastavení ------------------------------
   Na počítači: vlevo svislé menu sekcí (skupiny Osobní / Firma, krátký popis,
   klouzavá výplň aktivní položky), vpravo obsah. Na užší obrazovce vodorovný
   pás záložek, který jde posouvat – nic se neusekne. */
.set-uzivatel,.set-skupina,.set-tab-popis{display:none}
.set-tab-text{display:inline-flex;flex-direction:column;min-width:0}
body[data-paleta] .glass-capsule{background:color-mix(in srgb,var(--accent) 14%,transparent);border-color:color-mix(in srgb,var(--accent) 34%,transparent);box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
body[data-paleta] #setTabs.glass-tabs{background:color-mix(in srgb,var(--bg-card) 86%,transparent);border-color:var(--border);box-shadow:var(--stin-dlazdice)}
body[data-paleta] #setTabs .set-tab.active .ico{color:var(--accent-ink);opacity:1}
/* Vodorovný pás: okraje se ztrácejí, aby bylo vidět, že pokračuje. */
body[data-paleta] #setTabs.glass-tabs{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);scroll-padding-inline:12px}
.view[data-view="nastaveni"] .set-panel{max-width:920px;min-width:0}
.view[data-view="nastaveni"] .set-panel>.card,.view[data-view="nastaveni"] .settings-cols{max-width:none}
.view[data-view="nastaveni"] .card{scroll-margin-top:136px}
body[data-paleta][data-styl] .view[data-view="nastaveni"] .card{padding:24px;border-radius:20px}
body[data-styl] .view[data-view="nastaveni"] .card-head h4{font-size:17px;letter-spacing:-.02em}
body[data-styl] .view[data-view="nastaveni"] .card-foot{gap:10px;flex-wrap:wrap}

@media (min-width:1100px){
  body[data-paleta] .view[data-view="nastaveni"].active{display:grid;grid-template-columns:268px minmax(0,1fr);column-gap:36px;align-items:start;max-width:1240px;margin-inline:auto}
  body[data-paleta] .view[data-view="nastaveni"] #setTabs.glass-tabs{grid-column:1;grid-row:1/span 30;position:sticky;top:88px;flex-direction:column;align-items:stretch;gap:2px;margin:0;padding:10px;border-radius:24px;overflow:hidden auto;max-height:calc(100dvh - 112px);-webkit-mask-image:none;mask-image:none}
  body[data-paleta] .view[data-view="nastaveni"] .set-panel{grid-column:2}
  body[data-paleta] .view[data-view="nastaveni"] #setTabs .set-tab{justify-content:flex-start;align-items:flex-start;gap:12px;text-align:left;white-space:normal;min-height:54px;padding:10px 12px;border-radius:14px;font-size:14px}
  body[data-paleta] .view[data-view="nastaveni"] #setTabs .set-tab .ico{margin-top:2px;flex:none}
  body[data-paleta] #setTabs .glass-capsule{border-radius:14px}
  .set-tab-popis{display:block;margin-top:2px;font:400 12px/1.4 var(--font);color:var(--text-3)}
  .set-tab.active .set-tab-popis{color:var(--text-2)}
  .set-skupina{display:block;margin:16px 12px 6px;font:600 11px var(--font);text-transform:uppercase;letter-spacing:.08em;color:var(--text-3)}
  .set-skupina[hidden]{display:none}
  .set-uzivatel{display:flex;align-items:center;gap:12px;padding:8px 10px 16px;margin-bottom:2px;border-bottom:1px solid var(--border)}
  .set-uzivatel .avatar{width:42px;height:42px;font-size:14px;background:var(--accent-fill,var(--accent));color:var(--accent-text,#fff);border:0}
  .set-uzivatel-text{display:flex;flex-direction:column;min-width:0}
  .set-uzivatel-text b{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .set-uzivatel-text small{font-size:12px;color:var(--text-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}

/* Rychlé skoky na karty v dlouhé sekci. */
.set-obsah{position:sticky;top:64px;z-index:6;display:flex;gap:8px;overflow-x:auto;margin:0 0 14px;padding:10px 2px;scrollbar-width:none;background:color-mix(in srgb,var(--bg) 82%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.set-obsah::-webkit-scrollbar{display:none}
.set-obsah button{flex:none;min-height:40px;padding:8px 15px;border:1px solid var(--border);border-radius:999px;background:var(--bg-card);color:var(--text-2);font:500 13px var(--font);white-space:nowrap;cursor:pointer;transition:color .2s,border-color .2s}
.set-obsah button:hover{color:var(--text);border-color:var(--border-strong)}

/* Zaškrtávátka: srovnaná s prvním řádkem textu, v barvě palety.
   Uvnitř .field je label blokový – bez tohohle spadlo políčko pod text. */
.view[data-view="nastaveni"] :is(label.check-row,.field label.check-row){display:flex;align-items:flex-start;gap:12px;margin:0 0 10px;padding:14px 16px;border:1px solid var(--border);border-radius:14px;background:color-mix(in srgb,var(--bg-elev) 55%,transparent);font:400 13.5px/1.55 var(--font);color:var(--text);cursor:pointer;transition:background-color .2s,border-color .2s}
.view[data-view="nastaveni"] label.check-row:hover{border-color:var(--border-strong)}
.view[data-view="nastaveni"] label.check-row:has(input:checked){background:color-mix(in srgb,var(--accent) 7%,var(--bg-card))}
.view[data-view="nastaveni"] label.check-row>span{flex:1;min-width:0}
.view[data-view="nastaveni"] label.check-row b{font-weight:600}
/* Několik voleb pod sebou tvoří jednu skupinu s oddělovači. */
.view[data-view="nastaveni"] label.check-row:has(+ label.check-row){margin-bottom:0;border-bottom-left-radius:0;border-bottom-right-radius:0}
.view[data-view="nastaveni"] label.check-row+label.check-row{border-top:0;border-top-left-radius:0;border-top-right-radius:0}
.view[data-view="nastaveni"] label.check{display:flex;align-items:center;gap:12px;margin:4px 0 16px;padding:12px 16px;border:1px solid var(--border);border-radius:14px;font:500 14px var(--font);cursor:pointer}
.view[data-view="nastaveni"] :is(label.check-row,label.check) input[type=checkbox]{flex:none;width:18px;height:18px;margin:2px 0 0;accent-color:var(--accent);cursor:pointer}
.view[data-view="nastaveni"] label.check input[type=checkbox]{margin:0}

@media (prefers-reduced-motion:no-preference){
  body:not([data-animace="klidne"]) .set-karta-zvyraznena{animation:karta-zvyrazneni 1.4s var(--ease-premium)}
}
@keyframes karta-zvyrazneni{0%,100%{box-shadow:var(--stin-dlazdice)}25%{box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 45%,transparent),var(--stin-dlazdice)}}

/* Vstupní animace zmenšuje obsah na 99,2 %. U dlouhé sekce (Agenda má přes
   10 000 px) by střed jako počátek posunul horní okraj o desítky pixelů a obsah
   by poskočil. Počátek nahoře drží začátek obsahu na místě. */
body[data-paleta] :is(.content,.view,.set-panel){transform-origin:50% 0}

/* Rychlé údaje ve velké dlaždici přehledu. */
.bento-ukazatele{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin:0 0 auto;padding:0 0 22px}
.bento-ukazatele>div{min-width:0;padding:12px 14px;border:1px solid var(--p-line);border-radius:14px;background:color-mix(in srgb,var(--bg-elev) 55%,transparent)}
.bento-ukazatele dt{font:400 12px/1.4 var(--font);color:var(--text-2)}
.bento-ukazatele dd{margin:4px 0 0;display:flex;align-items:baseline;gap:6px;font:600 19px/1.25 var(--font);letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--text);overflow-wrap:anywhere}
.bento-ukazatele small{display:block;margin-top:2px;font:400 11px var(--font);color:var(--text-3)}
.trend-znak{font-size:14px}.trend-znak.nahoru{color:var(--green)}.trend-znak.dolu{color:var(--red-strong)}.trend-znak.rovne{color:var(--text-3)}
.bento-ukazatele>div.pozor{border-color:color-mix(in srgb,var(--red-strong) 40%,var(--p-line))}
@media (prefers-reduced-motion:no-preference){body:not([data-animace="klidne"]) .bento-ukazatele>div{animation:bento-in .5s var(--ease-premium) both}body:not([data-animace="klidne"]) .bento-ukazatele>div:nth-child(2){animation-delay:60ms}body:not([data-animace="klidne"]) .bento-ukazatele>div:nth-child(3){animation-delay:120ms}}

/* Dotykové cíle: styl „web“ nastavuje malým tlačítkům 36 px a přebíjel tím
   dotykové zvětšení ze styles.css. Na telefonu tak „+ Nový úkol“, „Dnes“ nebo
   „Termín“ měly 36 px. Platí jen pro ovládání prstem; myš zůstává beze změny. */
@media (pointer: coarse){
  body[data-styl] :is(.btn,.btn.small,.btn.btn-sm,.seg-btn){min-height:42px}
  body[data-styl] :is(.day-label,.kal-titulek,.kal-hlava-cislo){min-height:40px}
}