/* ===========================================================================
   Hourleaf – styles
   Farebné tokeny + svetlá/tmavá téma. Meň hodnoty tu, ovplyvní to celú appku.
   =========================================================================== */
:root {
  --bg:#FBFBF9; --surface:#FFFFFF; --surface-2:#F5F5F1; --ink:#1B1B1A; --muted:#75746F; --faint:#A2A19C;
  --line:#EAE9E3; --line-strong:#DEDDD6; --today:#F3F2ED;
  --shadow:0 1px 2px rgba(30,30,28,.05),0 8px 24px -12px rgba(30,30,28,.14); --shadow-soft:0 1px 2px rgba(30,30,28,.05);
  --accent:#33417A; --accent-ink:#FFFFFF; --radius:12px; --radius-sm:9px; color-scheme:light;
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
  --bg:#151519; --surface:#1E1E24; --surface-2:#26262E; --ink:#ECECEA; --muted:#A3A2AA; --faint:#6C6C76;
  --line:#2C2C34; --line-strong:#3A3A43; --today:#212129;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 12px 30px -14px rgba(0,0,0,.6); --shadow-soft:0 1px 2px rgba(0,0,0,.3);
  --accent:#97A6E8; --accent-ink:#16161A; color-scheme:dark; } }
:root[data-theme="dark"]{
  --bg:#151519; --surface:#1E1E24; --surface-2:#26262E; --ink:#ECECEA; --muted:#A3A2AA; --faint:#6C6C76;
  --line:#2C2C34; --line-strong:#3A3A43; --today:#212129;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 12px 30px -14px rgba(0,0,0,.6); --shadow-soft:0 1px 2px rgba(0,0,0,.3);
  --accent:#97A6E8; --accent-ink:#16161A; color-scheme:dark; }

*{box-sizing:border-box;} html,body{margin:0;padding:0;}
body{background:var(--bg);color:var(--ink);font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;font-size:15px;line-height:1.45;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
@media (prefers-reduced-motion: reduce){*{animation-duration:.001ms !important;transition-duration:.001ms !important;}}

.wrap{max-width:1160px;margin:0 auto;padding:28px 22px 90px;}
header.app{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-bottom:20px;}
.title-block h1{font-family:inherit;font-weight:700;font-size:clamp(30px,5vw,42px);letter-spacing:-0.015em;margin:0;line-height:1;}
.title-block .sub{color:var(--muted);font-size:14px;margin-top:8px;}
.head-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}

.btn{font:inherit;font-size:13px;font-weight:500;border:1px solid var(--line-strong);background:var(--surface);color:var(--ink);padding:8px 14px;border-radius:999px;cursor:pointer;display:inline-flex;align-items:center;gap:7px;transition:background .14s,border-color .14s,transform .06s;box-shadow:var(--shadow-soft);}
.btn:hover{background:var(--surface-2);} .btn:active{transform:translateY(1px);} .btn svg{width:15px;height:15px;}
.btn.primary{background:var(--accent);color:var(--accent-ink);border-color:transparent;} .btn.primary:hover{filter:brightness(1.06);background:var(--accent);}
.btn.add{border-color:color-mix(in srgb,var(--accent) 40%,var(--line-strong));color:var(--accent);}
.btn.add:hover{background:color-mix(in srgb,var(--accent) 8%,var(--surface));}
.btn.danger{color:#b1483f;border-color:transparent;background:transparent;box-shadow:none;} .btn.danger:hover{background:color-mix(in srgb,#b1483f 12%,transparent);}
.btn.ghost{border-color:transparent;background:transparent;box-shadow:none;color:var(--muted);} .btn.ghost:hover{background:var(--surface-2);color:var(--ink);}
.btn.block{width:100%;justify-content:center;}
.btn.hidden{display:none;}
.btn:focus-visible,.card:focus-visible,.icon-btn:focus-visible,.daytab:focus-visible,.side-arrow:focus-visible,.mini-arrow:focus-visible,.seg button:focus-visible,.swatch:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}

.icon-btn{width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--muted);cursor:pointer;display:grid;place-items:center;box-shadow:var(--shadow-soft);transition:background .14s;}
.icon-btn:hover{background:var(--surface-2);color:var(--ink);}

.weeknav{display:flex;align-items:stretch;gap:14px;}
.week-main{flex:1 1 auto;min-width:0;}
.side-arrow{flex:0 0 auto;align-self:center;width:46px;height:46px;border-radius:50%;border:1px solid var(--line-strong);background:var(--surface);color:var(--muted);cursor:pointer;display:grid;place-items:center;box-shadow:var(--shadow-soft);transition:background .14s,color .14s,border-color .14s,transform .08s;}
.side-arrow:hover{background:var(--surface-2);color:var(--ink);} .side-arrow:active{transform:scale(.94);} .side-arrow svg{width:22px;height:22px;}
.weeknav.moving .side-arrow{border-color:color-mix(in srgb,var(--accent) 55%,transparent);color:var(--accent);}

.week-center{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:16px;}
.week-label{text-align:center;line-height:1.15;}
.week-range{font-size:15px;font-weight:600;letter-spacing:-0.01em;font-variant-numeric:tabular-nums;}
.week-rel{font-size:12px;color:var(--muted);margin-top:1px;} .week-rel.now{color:var(--accent);}
.mini-arrow{display:none;width:36px;height:36px;border-radius:50%;border:1px solid var(--line-strong);background:var(--surface);color:var(--muted);cursor:pointer;place-items:center;box-shadow:var(--shadow-soft);} .mini-arrow svg{width:18px;height:18px;}

.grid{display:grid;grid-template-columns:66px repeat(5,1fr);gap:8px;}
.dayhead{display:flex;align-items:baseline;gap:7px;padding:2px 6px 10px;font-size:13px;font-weight:600;color:var(--muted);border-bottom:1px solid var(--line);}
.dayhead .full{color:var(--ink);} .dayhead .num{color:var(--faint);font-weight:500;font-variant-numeric:tabular-nums;}
.dayhead.is-today,.dayhead.is-today .full{color:var(--accent);}
.timelabel{font-size:11.5px;color:var(--faint);text-align:right;padding:12px 8px 0 0;font-variant-numeric:tabular-nums;white-space:nowrap;}
.cell{min-height:78px;border-radius:var(--radius-sm);}
.cell.today-col{background:var(--today);}
.cell.empty{border:1px dashed transparent;}
.cell.droppable{border:1.5px dashed color-mix(in srgb,var(--accent) 55%,transparent);background:color-mix(in srgb,var(--accent) 8%,transparent);cursor:pointer;transition:background .12s;display:grid;place-items:center;}
.cell.droppable::after{content:"+";font-size:20px;color:var(--accent);font-weight:500;opacity:.35;}
.cell.droppable:hover{background:color-mix(in srgb,var(--accent) 16%,transparent);} .cell.droppable:hover::after{opacity:1;}

.card{--show:var(--c);width:100%;height:100%;min-height:78px;text-align:left;background:var(--surface);border:1px solid var(--line);border-left:3px solid var(--show);border-radius:var(--radius-sm);padding:11px 12px;cursor:pointer;display:flex;flex-direction:column;gap:6px;font:inherit;color:var(--ink);box-shadow:var(--shadow-soft);transition:transform .09s,box-shadow .16s;}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .card{--show:var(--cl);}}
:root[data-theme="dark"] .card{--show:var(--cl);} :root[data-theme="light"] .card{--show:var(--c);}
.card:hover{transform:translateY(-1px);box-shadow:var(--shadow);}
.card .cname{font-weight:600;font-size:13.5px;letter-spacing:-0.006em;line-height:1.25;}
.card .cmeta{display:flex;align-items:center;flex-wrap:wrap;gap:6px;font-size:11.5px;color:var(--muted);margin-top:auto;}
.card .cmeta .room{font-variant-numeric:tabular-nums;}
.pill{display:inline-flex;align-items:center;align-self:flex-start;font-size:10.5px;font-weight:600;letter-spacing:.01em;padding:2px 8px;border-radius:999px;color:var(--show);background:color-mix(in srgb,var(--show) 14%,transparent);}
.card.moved{border-style:solid;}
.tag{display:inline-flex;align-items:center;gap:4px;font-size:10px;font-weight:600;} .tag.move{color:var(--accent);} .tag svg{width:11px;height:11px;}
.tag.recur{color:var(--faint);}

.movebar{position:fixed;left:50%;bottom:22px;transform:translateX(-50%) translateY(calc(100% + 60px));background:var(--ink);color:var(--bg);padding:11px 12px 11px 18px;border-radius:999px;display:flex;align-items:center;gap:14px;z-index:60;box-shadow:0 12px 34px -10px rgba(0,0,0,.4);font-size:13.5px;font-weight:500;transition:transform .22s cubic-bezier(.2,.8,.25,1);max-width:calc(100vw - 24px);}
.movebar.show{transform:translateX(-50%) translateY(0);}
.movebar button{font:inherit;font-weight:600;font-size:13px;cursor:pointer;border:none;border-radius:999px;padding:7px 14px;background:color-mix(in srgb,var(--bg) 18%,transparent);color:var(--bg);white-space:nowrap;}
.movebar button:hover{background:color-mix(in srgb,var(--bg) 30%,transparent);}

.daytabs{display:none;gap:6px;margin-bottom:16px;overflow-x:auto;padding-bottom:2px;}
.daytab{flex:1 0 auto;min-width:56px;text-align:center;cursor:pointer;border:1px solid var(--line);background:var(--surface);color:var(--muted);border-radius:10px;padding:8px 6px;font:inherit;font-size:13px;font-weight:500;}
.daytab .d-num{display:block;font-size:11px;color:var(--faint);margin-top:2px;font-variant-numeric:tabular-nums;}
.daytab.active{background:var(--accent);color:var(--accent-ink);border-color:transparent;} .daytab.active .d-num{color:color-mix(in srgb,var(--accent-ink) 75%,transparent);}
.daytab.has-today{border-color:color-mix(in srgb,var(--accent) 55%,transparent);}
.daylist{display:none;flex-direction:column;gap:8px;}
.dayrow{display:grid;grid-template-columns:58px 1fr;gap:10px;align-items:stretch;}
.dayrow .time{font-size:11.5px;color:var(--faint);padding-top:12px;font-variant-numeric:tabular-nums;}
.dayrow .void{display:flex;align-items:center;min-height:52px;padding:0 14px;color:var(--faint);font-size:12.5px;border:1px dashed var(--line-strong);border-radius:var(--radius-sm);}
.dayrow .void.droppable{border-color:color-mix(in srgb,var(--accent) 55%,transparent);background:color-mix(in srgb,var(--accent) 8%,transparent);color:var(--accent);cursor:pointer;font-weight:500;}
@media (max-width:760px){.grid{display:none;}.daytabs{display:flex;}.daylist{display:flex;}.wrap{padding:22px 16px 100px;}.side-arrow{display:none;}.mini-arrow{display:grid;}}

.scrim{position:fixed;inset:0;background:rgba(15,15,14,.42);opacity:0;pointer-events:none;transition:opacity .2s;z-index:70;} .scrim.show{opacity:1;pointer-events:auto;}
.drawer{position:fixed;top:0;right:0;height:100%;width:400px;max-width:92vw;background:var(--surface);z-index:80;box-shadow:-20px 0 50px -20px rgba(0,0,0,.3);transform:translateX(102%);transition:transform .26s cubic-bezier(.2,.8,.25,1);display:flex;flex-direction:column;} .drawer.show{transform:translateX(0);}
.drawer-head{--show:var(--c);padding:22px 22px 20px;position:relative;background:color-mix(in srgb,var(--show) 12%,var(--surface));border-bottom:1px solid var(--line);}
:root[data-theme="dark"] .drawer-head{--show:var(--cl);} @media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .drawer-head{--show:var(--cl);}}
.drawer-head .pill{margin-bottom:12px;} .drawer-head h2{margin:0;font-size:21px;font-weight:650;letter-spacing:-0.01em;line-height:1.2;padding-right:34px;}
.drawer-close{position:absolute;top:16px;right:16px;width:32px;height:32px;border-radius:50%;border:none;background:color-mix(in srgb,var(--ink) 6%,transparent);color:var(--ink);cursor:pointer;display:grid;place-items:center;} .drawer-close:hover{background:color-mix(in srgb,var(--ink) 12%,transparent);}
.drawer-body{padding:20px 22px;overflow-y:auto;flex:1;}
.meta-grid{display:grid;grid-template-columns:auto 1fr;gap:12px 16px;margin-bottom:22px;}
.meta-grid dt{color:var(--faint);font-size:12.5px;display:flex;align-items:center;gap:8px;} .meta-grid dt svg{width:15px;height:15px;opacity:.8;}
.meta-grid dd{margin:0;font-size:14px;font-weight:500;}
.section-label{font-size:12px;font-weight:600;color:var(--muted);margin:0 0 8px;} .desc{font-size:13.5px;color:var(--muted);line-height:1.55;margin:0 0 22px;}
textarea.notes{width:100%;min-height:108px;resize:vertical;font:inherit;font-size:14px;color:var(--ink);background:var(--surface-2);border:1px solid var(--line);border-radius:var(--radius-sm);padding:12px 13px;line-height:1.5;}
textarea.notes:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:transparent;} textarea.notes::placeholder{color:var(--faint);}
.save-hint{font-size:11.5px;color:var(--faint);margin-top:7px;height:14px;transition:opacity .3s;}
.drawer-foot{padding:16px 22px 22px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:10px;}
.move-note{display:flex;align-items:flex-start;gap:8px;font-size:12.5px;color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,transparent);padding:9px 12px;border-radius:var(--radius-sm);line-height:1.4;} .move-note svg{width:15px;height:15px;flex-shrink:0;margin-top:1px;}

/* One-off (this-week-only) edit box inside the drawer */
.once-box{border:1px solid var(--line);border-radius:var(--radius-sm);padding:14px;margin-bottom:22px;background:var(--surface-2);}
.once-box .oh{font-size:12px;font-weight:700;color:var(--ink);margin:0 0 4px;}
.once-box .ohint{font-size:11.5px;color:var(--faint);margin:0 0 12px;line-height:1.4;}
.once-box .field:last-child{margin-bottom:0;}

.toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%) translateY(calc(100% + 60px));background:var(--ink);color:var(--bg);padding:11px 18px;border-radius:999px;font-size:13.5px;font-weight:500;z-index:95;box-shadow:0 10px 30px -8px rgba(0,0,0,.4);transition:transform .24s cubic-bezier(.2,.8,.25,1);max-width:calc(100vw - 24px);text-align:center;} .toast.show{transform:translateX(-50%) translateY(0);}

/* Modals (settings / class form / onboarding) */
.modal{position:fixed;left:50%;top:50%;transform:translate(-50%,-46%);opacity:0;pointer-events:none;width:460px;max-width:92vw;max-height:88vh;background:var(--surface);border-radius:16px;box-shadow:0 24px 60px -16px rgba(0,0,0,.4);z-index:85;display:flex;flex-direction:column;transition:opacity .18s,transform .18s;}
.modal.show{opacity:1;pointer-events:auto;transform:translate(-50%,-50%);}
.modal-head{padding:20px 22px 14px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid var(--line);}
.modal-head h2{margin:0;font-size:19px;font-weight:650;letter-spacing:-0.01em;}
.modal-head .mh-sub{font-size:12.5px;color:var(--muted);margin-top:3px;}
.modal-body{padding:18px 22px;overflow-y:auto;}
.modal-foot{padding:14px 22px 20px;border-top:1px solid var(--line);display:flex;gap:10px;align-items:center;}
.modal-foot .spacer{flex:1;}

.seg{display:inline-flex;background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:3px;gap:3px;flex-wrap:wrap;}
.seg button{border:none;background:transparent;color:var(--muted);font:inherit;font-size:13px;font-weight:500;padding:7px 13px;border-radius:8px;cursor:pointer;}
.seg button.active{background:var(--surface);color:var(--ink);box-shadow:var(--shadow-soft);}
.setting-row{margin-bottom:22px;} .setting-row:last-child{margin-bottom:4px;}
.setting-row>.lbl{font-size:13px;font-weight:600;margin-bottom:9px;display:block;}
.setting-hint{font-size:12px;color:var(--muted);margin-top:10px;line-height:1.45;}

.field{margin-bottom:14px;} .field>label{display:block;font-size:12.5px;font-weight:600;color:var(--muted);margin-bottom:6px;}
.field input,.field select{width:100%;font:inherit;font-size:14px;padding:9px 11px;border:1px solid var(--line-strong);border-radius:9px;background:var(--surface);color:var(--ink);}
.field input:focus,.field select:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:transparent;}
.field input:disabled{color:var(--muted);background:var(--surface-2);}
.field-row{display:flex;gap:12px;} .field-row .field{flex:1;}
.swatches{display:flex;gap:9px;flex-wrap:wrap;}
.swatch{width:28px;height:28px;border-radius:8px;cursor:pointer;border:2px solid transparent;padding:0;}
.swatch.active{box-shadow:0 0 0 2px var(--surface),0 0 0 4px var(--ink);}

/* --- Datované poznámky --- */
.btn-sm{padding:5px 10px;font-size:12px;}
.notes-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px;}
.notes-head .section-label{margin:0;}
.notes-empty{font-size:12.5px;color:var(--faint);line-height:1.5;margin:0;}
.note-item{border:1px solid var(--line);border-radius:var(--radius-sm);padding:10px;margin-bottom:10px;background:var(--surface-2);}
.note-item.hit{border-color:color-mix(in srgb,var(--accent) 55%,transparent);box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 30%,transparent);}
.note-item textarea.note-text{width:100%;min-height:52px;resize:vertical;font:inherit;font-size:13.5px;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:9px 10px;line-height:1.45;}
.note-item textarea.note-text:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:transparent;}
.note-row{display:flex;align-items:center;gap:8px;margin-top:8px;}
.note-row .note-date{flex:1;font:inherit;font-size:12.5px;padding:6px 8px;border:1px solid var(--line-strong);border-radius:8px;background:var(--surface);color:var(--ink);}
.note-del{width:32px;height:32px;flex:0 0 auto;border:1px solid var(--line);background:var(--surface);color:var(--muted);border-radius:8px;cursor:pointer;display:grid;place-items:center;}
.note-del:hover{color:#b1483f;border-color:color-mix(in srgb,#b1483f 40%,var(--line));}
.tag.note{color:var(--accent);}
.note-dot{width:6px;height:6px;border-radius:50%;background:var(--muted);opacity:.6;display:inline-block;}

/* --- Klikateľné prázdne bunky (rýchle pridanie hodiny) --- */
.cell.empty.addable{cursor:pointer;transition:background .12s;}
.cell.empty.addable:hover{background:color-mix(in srgb,var(--accent) 7%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 30%,transparent);}
.void.addable{cursor:pointer;} .void.addable:hover{border-color:color-mix(in srgb,var(--accent) 45%,transparent);color:var(--accent);}

/* --- Onboarding wizard --- */
.ob-steps{display:flex;gap:8px;margin-top:12px;}
.ob-steps .dot{flex:1;height:4px;border-radius:2px;background:var(--line-strong);transition:background .2s;}
.ob-steps .dot.done{background:color-mix(in srgb,var(--accent) 55%,var(--line-strong));}
.ob-steps .dot.active{background:var(--accent);}
.ob-card{min-height:190px;}
.ob-choices{display:flex;flex-direction:column;gap:10px;}
.ob-choice{display:flex;align-items:center;justify-content:space-between;gap:10px;text-align:left;font:inherit;font-size:14px;font-weight:500;padding:14px 16px;border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:var(--surface);color:var(--ink);cursor:pointer;box-shadow:var(--shadow-soft);}
.ob-choice:hover{background:var(--surface-2);}
.ob-choice.active{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent);}
.ob-choice[disabled]{opacity:.55;cursor:not-allowed;}
.ob-choice .soon{font-size:11px;font-weight:600;color:var(--faint);border:1px solid var(--line-strong);border-radius:999px;padding:2px 8px;}
.ob-body-title{font-size:15px;font-weight:650;margin:0 0 4px;} .ob-body-desc{font-size:13px;color:var(--muted);line-height:1.5;margin:0 0 16px;}

/* --- Prepínač pohľadov --- */
.viewswitch{display:inline-flex;background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:3px;gap:3px;margin-bottom:18px;}
.viewswitch button{border:none;background:transparent;color:var(--muted);font:inherit;font-size:13.5px;font-weight:600;padding:8px 18px;border-radius:8px;cursor:pointer;}
.viewswitch button.active{background:var(--surface);color:var(--ink);box-shadow:var(--shadow-soft);}

/* --- Zošity v detaile hodiny --- */
.nb-box{margin-top:22px;padding-top:20px;border-top:1px solid var(--line);}
.nb-link-row{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;text-align:left;font:inherit;font-size:13.5px;font-weight:500;color:var(--ink);background:var(--surface-2);border:1px solid var(--line);border-radius:9px;padding:10px 12px;cursor:pointer;margin-bottom:8px;}
.nb-link-row:hover{background:color-mix(in srgb,var(--accent) 8%,var(--surface-2));} .nb-link-row .chev{color:var(--faint);font-size:18px;}

/* =========================================================================
   REDIZAJN — glass / macOS (desktop rozvrh). Prekrýva len potrebné časti;
   mobilné zobrazenie (daytabs/daylist) a drawer/okná ostávajú funkčné.
   ========================================================================= */
:root {
  --accent: #0a84ff; --accent-ink: #ffffff;
}
body {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Inter", system-ui, sans-serif;
  background:
    radial-gradient(75% 65% at 12% 6%, rgba(78,140,255,.20), transparent 60%),
    radial-gradient(55% 55% at 92% 92%, rgba(120,175,255,.16), transparent 60%),
    linear-gradient(160deg, #eef3fd 0%, #f4f8ff 55%, #e9f1fd 100%);
  background-attachment: fixed;
}
:root[data-theme="dark"] body, :root:not([data-theme="light"]) body {
}
.wrap { max-width: 1440px; padding: 30px 40px 90px; }
.title-block h1 { font-family: inherit; font-weight: 700; letter-spacing: -0.03em; color: #1d1d1f; }
.title-block .sub { color: #6e6e73; }

/* header controls */
.btn { border-radius: 11px; font-weight: 600; letter-spacing: -0.01em; border-color: rgba(60,70,110,.10); box-shadow: 0 1px 2px rgba(30,40,90,.05), 0 7px 16px -12px rgba(30,40,90,.45); }
.btn.add, .btn.primary { background: #0a84ff; color: #fff; border-color: transparent; box-shadow: 0 1px 2px rgba(10,90,200,.3), 0 8px 18px -8px rgba(10,120,255,.5); }
.btn.add:hover, .btn.primary:hover { background: #0b79e8; filter: none; }
.icon-btn { border-radius: 11px; border-color: rgba(60,70,110,.10); box-shadow: 0 1px 2px rgba(30,40,90,.05), 0 7px 16px -12px rgba(30,40,90,.45); }
.viewswitch { background: rgba(118,118,128,.12); border-radius: 11px; padding: 3px; border: none; }
.viewswitch button { border-radius: 8px; font-weight: 500; color: #3a3a3c; padding: 7px 18px; }
.viewswitch button.active { background: #fff; color: #1d1d1f; font-weight: 600; box-shadow: 0 1px 3px rgba(30,40,90,.16); }

/* week nav → compact chip row (hide big side arrows, show mini as chips) */
.weeknav { gap: 0; }
.side-arrow { display: none !important; }
.week-center { gap: 8px; margin-bottom: 20px; }
.mini-arrow { display: grid !important; width: 38px; height: 38px; border-radius: 11px; border: 1px solid rgba(60,70,110,.10); background: rgba(255,255,255,.8); color: #3a3a3c; box-shadow: 0 1px 2px rgba(30,40,90,.05), 0 7px 16px -12px rgba(30,40,90,.45); }
.week-label { display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 15px; border-radius: 11px; background: rgba(255,255,255,.8); border: 1px solid rgba(60,70,110,.10); box-shadow: 0 1px 2px rgba(30,40,90,.05), 0 7px 16px -12px rgba(30,40,90,.45); }
.week-range { font-size: 13.5px; font-weight: 600; color: #1d1d1f; }
.week-rel { font-size: 12px; color: #6e6e73; margin-top: 0; } .week-rel.now { color: #0a84ff; }
.week-rel:empty { display: none; }
.today-btn { height: 38px; }

/* desktop grid container becomes a plain block holding the calendar panel */
#grid { display: block; }
@media (max-width: 760px) { #grid { display: none; } }

.cal-panel { border-radius: 20px; overflow: hidden;
  background: rgba(255,255,255,.55); backdrop-filter: blur(30px) saturate(1.5); -webkit-backdrop-filter: blur(30px) saturate(1.5);
  border: 1px solid rgba(255,255,255,.8);
  box-shadow: 0 1px 2px rgba(30,40,90,.04), 0 30px 70px -34px rgba(30,40,90,.4), inset 0 1px 0 rgba(255,255,255,.8); }
.cal-head { display: grid; grid-template-columns: 58px repeat(5, 1fr); border-bottom: 1px solid rgba(60,70,110,.10); }
.cal-head .corner { border-right: 1px solid rgba(60,70,110,.06); }
.dh { text-align: center; padding: 13px 4px 11px; border-right: 1px solid rgba(60,70,110,.06); }
.dh:last-child { border-right: none; }
.dh .dnum { font-size: 19px; font-weight: 600; color: #1d1d1f; line-height: 1.05; font-variant-numeric: tabular-nums; }
.dh .dnm { font-size: 11.5px; font-weight: 500; color: #8e8e93; margin-top: 3px; text-transform: uppercase; letter-spacing: .03em; }
.dh.today { box-shadow: inset 0 -2px 0 #0a84ff; }
.dh.today .dnum { color: #fff; width: 32px; height: 32px; line-height: 32px; border-radius: 50%; margin: 0 auto; background: #0a84ff; box-shadow: 0 6px 14px -5px rgba(10,120,255,.7); }
.dh.today .dnm { color: #0a84ff; }
.cal-body { display: grid; grid-template-columns: 58px repeat(5, 1fr); position: relative; }
.gutter { position: relative; border-right: 1px solid rgba(60,70,110,.06); }
.gutter .hl { position: absolute; right: 8px; font-size: 11px; color: #aeaeb2; font-variant-numeric: tabular-nums; }
.daycol { position: relative; border-right: 1px solid rgba(60,70,110,.06);
  background-image: repeating-linear-gradient(to bottom, rgba(60,70,110,.07) 0, rgba(60,70,110,.07) 1px, transparent 1px, transparent 88px); }
.daycol:last-child { border-right: none; }
.daycol.today { background-color: rgba(10,132,255,.045); }
.slot { position: absolute; left: 5px; right: 5px; border-radius: 12px; z-index: 1; }
.slot.addable { cursor: pointer; transition: background .12s; }
.slot.addable:hover { background: rgba(10,132,255,.06); box-shadow: inset 0 0 0 1px rgba(10,132,255,.28); }
.slot.droppable { border: 1.5px dashed rgba(10,132,255,.5); background: rgba(10,132,255,.07); cursor: pointer; display: grid; place-items: center; }
.slot.droppable::after { content: "+"; color: #0a84ff; font-size: 20px; opacity: .5; }
.slot.droppable:hover { background: rgba(10,132,255,.14); }

/* now indicator */
.nowline { position: absolute; left: 58px; right: 0; height: 0; z-index: 6; pointer-events: none; }
.nowline .nowln { position: absolute; left: 0; right: 0; top: 0; height: 2px; background: #0a84ff; }
.nowline .nowdot { position: absolute; left: -4px; top: -4px; width: 10px; height: 10px; border-radius: 50%; background: #0a84ff; box-shadow: 0 0 0 3px rgba(10,132,255,.18); }
.nowline .nowtm { position: absolute; left: -56px; top: -8px; width: 48px; text-align: right; font-size: 11px; font-weight: 600; color: #0a84ff; font-variant-numeric: tabular-nums; }

/* glass event cards (desktop, absolutely placed) */
.gcard { position: absolute; left: 6px; right: 6px; border-radius: 13px; padding: 9px 11px; z-index: 4;
  display: flex; flex-direction: column; gap: 4px; cursor: pointer; overflow: hidden; text-align: left; font: inherit;
  --show: var(--c);
  background: rgba(255,255,255,.72); backdrop-filter: blur(10px) saturate(1.5); -webkit-backdrop-filter: blur(10px) saturate(1.5);
  border: 1px solid rgba(255,255,255,.9);
  box-shadow: 0 1px 2px rgba(30,40,90,.05), 0 10px 22px -14px rgba(30,40,90,.45), inset 0 1px 0 rgba(255,255,255,.8);
  transition: transform .3s cubic-bezier(.2,.9,.25,1.2), box-shadow .3s; }
:root[data-theme="dark"] .gcard { --show: var(--cl); background: rgba(40,42,52,.7); border-color: rgba(255,255,255,.08); }
.gcard:hover { transform: translateY(-2px) scale(1.012); box-shadow: 0 18px 34px -16px rgba(30,40,90,.5); z-index: 8; }
.gc-top { display: flex; align-items: center; gap: 7px; }
.gc-icn { width: 24px; height: 24px; border-radius: 8px; display: grid; place-items: center; flex: 0 0 auto; background: color-mix(in srgb, var(--show) 15%, transparent); color: var(--show); }
.gc-icn svg { width: 14px; height: 14px; }
.gc-kind { font-size: 10px; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; color: var(--show); }
.gc-name { font-size: 13.5px; font-weight: 600; line-height: 1.2; letter-spacing: -0.015em; color: #1d1d1f; }
:root[data-theme="dark"] .gc-name { color: #ececea; }
.gc-meta { margin-top: auto; display: flex; align-items: center; gap: 6px; font-size: 11px; color: #6e6e73; font-variant-numeric: tabular-nums; flex-wrap: wrap; }
.gc-meta .dot { width: 3px; height: 3px; border-radius: 50%; background: currentColor; opacity: .5; }
.gc-meta .note-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--show); opacity: .8; margin-left: 2px; }
.gbadge { display: inline-flex; align-items: center; gap: 3px; margin-left: auto; font-size: 9px; font-weight: 700; padding: 2px 6px; border-radius: 999px; white-space: nowrap; }
.gbadge svg { width: 9px; height: 9px; }
.gbadge.moved { color: #4a3ba8; background: rgba(120,110,240,.18); }
.gbadge.note { color: #b06a12; background: rgba(240,170,40,.22); }

/* =========================================================================
   POHYB & SKLO — plynulé macOS prechody, centrované sklenené okno detailu
   ========================================================================= */
:root { --ease-spring: cubic-bezier(.34,1.4,.5,1); --ease-soft: cubic-bezier(.22,.9,.28,1); }

/* aby sa rozvrh zmestil bez scrollovania */
.wrap { padding-bottom: 22px; }

/* jemné dorazy na tlačidlách */
.btn, .icon-btn, .nav-btn, .mini-arrow, .cta, .viewswitch button, .today-btn {
  transition: background .2s var(--ease-soft), color .2s, transform .12s var(--ease-soft), box-shadow .2s, filter .2s;
}
.btn:active, .icon-btn:active, .nav-btn:active, .mini-arrow:active, .cta:active, .today-btn:active { transform: scale(.96); }

/* animácia mriežky pri prepnutí týždňa / pohľadu */
@keyframes calIn { from { opacity: 0; transform: translateY(10px) scale(.994); } to { opacity: 1; transform: none; } }
#grid.anim .cal-panel { animation: calIn .42s var(--ease-soft) both; }
@keyframes fadeUp { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
#notebooksView:not([hidden]) { animation: fadeUp .34s var(--ease-soft) both; }

/* karty – mäkší hover (prepis) */
.gcard { transition: transform .34s var(--ease-spring), box-shadow .34s var(--ease-soft); }

/* zadné stmavenie s jemným rozostrením */
.scrim { background: rgba(18,24,45,.30); backdrop-filter: blur(4px) saturate(1.1); -webkit-backdrop-filter: blur(4px) saturate(1.1); transition: opacity .34s var(--ease-soft); }

/* DETAIL PREDMETU — centrované sklenené okno, ktoré sa pružne roztiahne do stredu */
.drawer {
  top: 50%; left: 50%; right: auto; bottom: auto; height: auto;
  width: min(600px, 94vw); max-height: 86vh;
  border-radius: 26px; overflow: hidden;
  background: rgba(255,255,255,.72);
  backdrop-filter: blur(44px) saturate(1.8); -webkit-backdrop-filter: blur(44px) saturate(1.8);
  border: 1px solid rgba(255,255,255,.85);
  box-shadow: 0 50px 120px -34px rgba(20,30,70,.55), 0 2px 8px rgba(20,30,70,.12), inset 0 1px 0 rgba(255,255,255,.9);
  transform: translate(-50%, -50%) scale(.82);
  opacity: 0; will-change: transform, opacity;
  transition: transform .46s var(--ease-spring), opacity .3s ease;
  display: flex; flex-direction: column;
}
.drawer.show { transform: translate(-50%, -50%) scale(1); opacity: 1; }
.drawer-head { background: linear-gradient(color-mix(in srgb, var(--show, var(--accent)) 20%, transparent), transparent); border-bottom: 1px solid rgba(0,0,0,.05); }
.drawer-body, .drawer-foot { background: transparent; }
.drawer-foot { border-top: 1px solid rgba(0,0,0,.06); }
:root[data-theme="dark"] .drawer { background: rgba(32,34,44,.72); border-color: rgba(255,255,255,.1); }

/* OKNÁ (nastavenia / formulár / onboarding) — sklo + pružné otvorenie */
.modal {
  background: rgba(255,255,255,.74);
  backdrop-filter: blur(44px) saturate(1.8); -webkit-backdrop-filter: blur(44px) saturate(1.8);
  border: 1px solid rgba(255,255,255,.85);
  box-shadow: 0 50px 120px -34px rgba(20,30,70,.55), inset 0 1px 0 rgba(255,255,255,.9);
  transform: translate(-50%, -50%) scale(.9);
  transition: opacity .24s ease, transform .4s var(--ease-spring);
}
.modal.show { transform: translate(-50%, -50%) scale(1); }
:root[data-theme="dark"] .modal { background: rgba(32,34,44,.74); border-color: rgba(255,255,255,.1); }
#mscrim { backdrop-filter: blur(4px) saturate(1.1); -webkit-backdrop-filter: blur(4px) saturate(1.1); }

/* pohyblivá lišta presunu + toast – jemnejší nábeh */
.movebar, .toast { transition: transform .34s var(--ease-spring); }

@media (prefers-reduced-motion: reduce) {
  .drawer, .modal, .scrim, .mscrim, .gcard, .movebar, .toast, .btn, .icon-btn, .nav-btn, .mini-arrow, .cta { transition: none !important; }
  #grid.anim .cal-panel, #notebooksView:not([hidden]) { animation: none !important; }
}

/* =========================================================================
   OPRAVA + DOLADENIE
   ========================================================================= */
/* KRITICKÉ: skryté centrované okno detailu nesmie zachytávať kliky na karty pod ním */
.drawer { pointer-events: none; }
.drawer.show { pointer-events: auto; }

/* viac priestoru po bokoch aj dole; rozvrh nemá byť edge-to-edge */
.wrap { max-width: 1320px; padding-left: clamp(22px, 3.5vw, 60px); padding-right: clamp(22px, 3.5vw, 60px); padding-bottom: 30px; }

/* =========================================================================
   Detail popup — sprievodca jednorazovej zmeny (krok miestnosť/vyučujúci)
   ========================================================================= */
#onceView { padding-top: 2px; }
.oe-title { font-size: 15px; font-weight: 650; margin: 2px 0 6px; color: #1d1d1f; letter-spacing: -0.01em; }
:root[data-theme="dark"] .oe-title { color: #ececea; }
.oe-hint { font-size: 12.5px; color: #6e6e73; line-height: 1.5; margin: 0 0 18px; }
/* jemný „morph" prechod medzi obrazovkami popupu */
@keyframes viewIn { from { opacity: 0; transform: translateX(14px); } to { opacity: 1; transform: none; } }
#onceView:not([hidden]) { animation: viewIn .26s var(--ease-soft) both; }
#detailView:not([hidden]) { animation: viewIn .26s var(--ease-soft) both; }
@media (prefers-reduced-motion: reduce) { #onceView:not([hidden]), #detailView:not([hidden]) { animation: none !important; } }

/* =========================================================================
   Okno „Zmeny" – zoznam dočasných zmien
   ========================================================================= */
.change-item { display: flex; gap: 10px; align-items: flex-start; padding: 12px 13px; margin-bottom: 10px; cursor: pointer;
  border: 1px solid rgba(60,70,110,.12); border-left: 3px solid var(--c); border-radius: 12px;
  background: rgba(255,255,255,.5); transition: background .15s var(--ease-soft), transform .12s var(--ease-soft); }
.change-item:hover { background: rgba(255,255,255,.85); transform: translateY(-1px); }
.change-item:last-child { margin-bottom: 0; }
:root[data-theme="dark"] .change-item { border-left-color: var(--cl); background: rgba(255,255,255,.04); }
.change-item .ci-main { flex: 1; min-width: 0; }
.change-item .ci-name { font-weight: 600; font-size: 13.5px; color: #1d1d1f; letter-spacing: -0.01em; }
:root[data-theme="dark"] .change-item .ci-name { color: #ececea; }
.change-item .ci-week { font-size: 11px; color: #8e8e93; margin: 2px 0 7px; }
.change-item .ci-part { font-size: 12px; color: #4a4a4f; line-height: 1.55; font-variant-numeric: tabular-nums; }
:root[data-theme="dark"] .change-item .ci-part { color: #b7b7bd; }
.ci-del { flex: 0 0 auto; width: 30px; height: 30px; border: none; background: transparent; color: #b8b8be; border-radius: 8px; cursor: pointer; display: grid; place-items: center; transition: background .15s, color .15s; }
.ci-del:hover { color: #b1483f; background: rgba(177,72,63,.12); }
.ci-del svg { width: 16px; height: 16px; }

/* =========================================================================
   Čas od–do: presun na presný čas, krátke hodiny
   ========================================================================= */
.daycol.dropcol { cursor: copy; background-color: rgba(10,132,255,.05); }
.daycol.dropcol:hover { background-color: rgba(10,132,255,.09); }
.gcard.compact { gap: 3px; padding: 8px 11px; justify-content: center; }
.gcard.compact .gc-top { gap: 6px; }
.gcard.compact .gc-icn { width: 18px; height: 18px; border-radius: 6px; }
.gcard.compact .gc-icn svg { width: 11px; height: 11px; }
.gcard.compact .gc-name { font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; flex: 1; min-width: 0; }
.gcard.compact .gc-meta { font-size: 10.5px; }
.mobile-drop { padding: 14px; text-align: center; border: 1.5px dashed rgba(10,132,255,.5); background: rgba(10,132,255,.07); color: #0a84ff; font-weight: 600; border-radius: 12px; margin-bottom: 10px; cursor: pointer; }

/* =========================================================================
   THEME ENGINE — farba akcentu (data-accent) + svetlé/tmavé plochy (data-theme).
   Prekrýva pevné hodnoty redizajnu premennými. Silver = tmavá téma.
   ========================================================================= */
:root {
  --accent:#0a84ff; --accent-ink:#fff;
  --ink:#1d1d1f; --ink2:#6e6e73; --ink3:#8e8e93;
  --card-bg:rgba(255,255,255,.68); --card-bd:rgba(255,255,255,.85);
  --panel-bg:rgba(255,255,255,.55); --panel-bd:rgba(255,255,255,.8);
  --line:rgba(60,70,110,.10); --line-soft:rgba(60,70,110,.06); --hourline:rgba(60,70,110,.07);
  --chip-bg:rgba(255,255,255,.8); --chip-bd:rgba(60,70,110,.10);
  --seg-bg:rgba(118,118,128,.12); --seg-on:#fff;
  --today-tint:color-mix(in srgb, var(--accent) 6%, transparent);
  --amb:radial-gradient(75% 65% at 12% 6%,rgba(78,140,255,.22),transparent 60%),radial-gradient(55% 55% at 92% 92%,rgba(120,175,255,.16),transparent 60%),linear-gradient(160deg,#eef3fd 0%,#f4f8ff 55%,#e9f1fd 100%);
}
/* akcent + ambient podľa témy */
:root[data-accent="blue"]  { --accent:#0a84ff; --amb:radial-gradient(75% 65% at 12% 6%,rgba(78,140,255,.22),transparent 60%),radial-gradient(55% 55% at 92% 92%,rgba(120,175,255,.16),transparent 60%),linear-gradient(160deg,#eef3fd 0%,#f4f8ff 55%,#e9f1fd 100%); }
:root[data-accent="lime"]  { --accent:#6cae14; --amb:radial-gradient(75% 65% at 12% 6%,rgba(150,215,80,.26),transparent 60%),radial-gradient(55% 55% at 92% 92%,rgba(190,228,120,.18),transparent 60%),linear-gradient(160deg,#f0f7e6 0%,#f6faed 55%,#edf6e1 100%); }
:root[data-accent="pink"]  { --accent:#e7b5ce; --accent-ink:#4a1631; --amb:radial-gradient(75% 65% at 12% 6%,rgba(231,181,206,.34),transparent 60%),radial-gradient(55% 55% at 92% 92%,rgba(240,200,221,.24),transparent 60%),linear-gradient(160deg,#fcf0f6 0%,#fdf5f9 55%,#faebf3 100%); }
:root[data-accent="red"]   { --accent:#e14b47; --amb:radial-gradient(75% 65% at 12% 6%,rgba(240,122,112,.22),transparent 60%),radial-gradient(55% 55% at 92% 92%,rgba(250,162,152,.16),transparent 60%),linear-gradient(160deg,#fdeeeb 0%,#fef3f1 55%,#fbe8e5 100%); }
:root[data-accent="yellow"]{ --accent:#dd9a0b; --amb:radial-gradient(75% 65% at 12% 6%,rgba(250,205,80,.26),transparent 60%),radial-gradient(55% 55% at 92% 92%,rgba(255,226,140,.18),transparent 60%),linear-gradient(160deg,#fdf6df 0%,#fef9e8 55%,#fbf2d6 100%); }
:root[data-accent="silver"]{ --accent:#c7cdd8; --accent-ink:#22252b; --amb:radial-gradient(80% 70% at 12% 6%,rgba(198,206,222,.16),transparent 62%),radial-gradient(60% 60% at 92% 94%,rgba(150,158,176,.14),transparent 62%),linear-gradient(160deg,#24272c 0%,#2d3138 55%,#202329 100%); }
/* tmavé plochy (Silver) */
:root[data-theme="dark"] {
  --ink:#e9ebef; --ink2:#a3a7b1; --ink3:#80848e;
  --card-bg:rgba(60,64,72,.55); --card-bd:rgba(255,255,255,.09);
  --panel-bg:rgba(42,45,51,.5); --panel-bd:rgba(255,255,255,.07);
  --line:rgba(255,255,255,.10); --line-soft:rgba(255,255,255,.055); --hourline:rgba(255,255,255,.06);
  --chip-bg:rgba(64,68,76,.6); --chip-bd:rgba(255,255,255,.09);
  --seg-bg:rgba(255,255,255,.08); --seg-on:rgba(255,255,255,.16);
}

/* aplikácia premenných na redizajn */
body { background: var(--amb); background-attachment: fixed; min-height: 100vh; color: var(--ink); }
html { background: #e9ecf2; } :root[data-theme="dark"] { background: #202329; }
.title-block h1 { color: var(--ink); } .title-block .sub { color: var(--ink2); }
.btn.add, .btn.primary, .cta { background: var(--accent); color: var(--accent-ink); box-shadow: 0 1px 2px rgba(20,30,60,.2), 0 8px 18px -8px color-mix(in srgb, var(--accent) 60%, transparent); }
.btn.add:hover, .btn.primary:hover, .cta:hover { background: color-mix(in srgb, var(--accent) 90%, #000); filter: none; }
.chip, .nav-btn, .week-label, .mini-arrow, .icon-btn, .today-btn { background: var(--chip-bg); border-color: var(--chip-bd); color: var(--ink); }
.week-rel { color: var(--ink2); } .week-rel.now { color: var(--accent); }
.viewswitch { background: var(--seg-bg); }
.viewswitch button { color: var(--ink2); } .viewswitch button.active { background: var(--seg-on); color: var(--ink); }
.cal-panel { background: var(--panel-bg); border-color: var(--panel-bd); }
.cal-head { border-bottom-color: var(--line); } .cal-head .corner, .dh { border-right-color: var(--line-soft); }
.dh .dnum { color: var(--ink); } .dh .dnm { color: var(--ink3); }
.dh.today { box-shadow: inset 0 -2px 0 var(--accent); }
.dh.today .dnum { background: var(--accent); color: var(--accent-ink); box-shadow: 0 6px 14px -5px color-mix(in srgb, var(--accent) 65%, transparent); }
.dh.today .dnm { color: var(--accent); }
.gutter { border-right-color: var(--line-soft); } .gutter .hl { color: var(--ink3); }
.daycol { border-right-color: var(--line-soft); background-image: repeating-linear-gradient(to bottom, var(--hourline) 0, var(--hourline) 1px, transparent 1px, transparent 88px); }
.daycol.today { background-color: var(--today-tint); }
.nowline .nowln, .nowline .nowdot { background: var(--accent); }
.nowline .nowdot { box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent); }
.nowline .nowtm { color: var(--accent); }
.gcard { background: var(--card-bg); border-color: var(--card-bd); }
.gc-name { color: var(--ink); } .gc-meta { color: var(--ink2); }
.daycol.dropcol { background-color: color-mix(in srgb, var(--accent) 5%, transparent); }
.daycol.dropcol:hover { background-color: color-mix(in srgb, var(--accent) 9%, transparent); }

/* okno tém */
.theme-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.theme-card { display: flex; flex-direction: column; gap: 8px; padding: 8px; border-radius: 14px; border: 1px solid var(--line); background: transparent; cursor: pointer; font: inherit; }
.theme-card:hover { background: color-mix(in srgb, var(--ink) 5%, transparent); }
.theme-card.active { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent); }
.tc-prev { position: relative; height: 66px; border-radius: 10px; overflow: hidden; display: flex; align-items: center; gap: 6px; padding: 10px; }
.tc-mini { height: 34px; border-radius: 7px; background: rgba(255,255,255,.7); box-shadow: 0 3px 8px -4px rgba(20,30,60,.4); }
.tc-mini.a { width: 34%; } .tc-mini.b { width: 26%; }
.tc-dot { position: absolute; right: 10px; bottom: 10px; width: 14px; height: 14px; border-radius: 50%; box-shadow: 0 2px 6px -1px rgba(0,0,0,.3); }
.tc-name { font-size: 13px; font-weight: 600; color: var(--ink); text-align: center; }
.tc-cur { color: var(--accent); }
/* mini náhľady jednotlivých tém */
.theme-card.acc-lime  .tc-prev { background:linear-gradient(150deg,#f0f7e6,#e6f2d4); } .theme-card.acc-lime  .tc-dot{ background:#6cae14; }
.theme-card.acc-pink  .tc-prev { background:linear-gradient(150deg,#fcf0f6,#f6dcea); } .theme-card.acc-pink  .tc-dot{ background:#e7b5ce; }
.theme-card.acc-red   .tc-prev { background:linear-gradient(150deg,#fdeeeb,#fbd8d3); } .theme-card.acc-red   .tc-dot{ background:#e14b47; }
.theme-card.acc-yellow.tc-prev, .theme-card.acc-yellow .tc-prev { background:linear-gradient(150deg,#fdf6df,#fbebbf); } .theme-card.acc-yellow .tc-dot{ background:#dd9a0b; }
.theme-card.acc-blue  .tc-prev { background:linear-gradient(150deg,#eef3fd,#d7e6ff); } .theme-card.acc-blue  .tc-dot{ background:#0a84ff; }
.theme-card.acc-silver .tc-prev { background:linear-gradient(150deg,#2d3138,#20242a); } .theme-card.acc-silver .tc-mini{ background:rgba(90,96,106,.7); } .theme-card.acc-silver .tc-dot{ background:#c7cdd8; }

/* =========================================================================
   DRAG & DROP — jemná mriežka (5/15 min), ghost karta, štítok s časom,
   potvrdzovacie okno presunu. Farby cez --accent, funguje vo všetkých témach.
   ========================================================================= */
/* hodinové čiary podľa skutočnej výšky hodiny (predtým napevno 88px) */
.daycol { background-size: 100% var(--hour, 88px); background-image: linear-gradient(to bottom, var(--hourline) 0, var(--hourline) 1px, transparent 1px); }
.gcard { touch-action: manipulation; -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
#grid .gcard { cursor: grab; }
.dd-dragging, .dd-dragging * { cursor: grabbing !important; -webkit-user-select: none !important; user-select: none !important; }

/* mriežka počas ťahania: jemné čiary každých 15 min, výraznejšie celé hodiny */
.cal-body.dd-active .daycol {
  background-image:
    linear-gradient(to bottom, var(--hourline) 0, var(--hourline) 1px, transparent 1px),
    repeating-linear-gradient(to bottom, transparent 0, transparent calc(var(--hour) / 4 - 1px), color-mix(in srgb, var(--accent) 8%, transparent) calc(var(--hour) / 4 - 1px), color-mix(in srgb, var(--accent) 8%, transparent) calc(var(--hour) / 4));
  background-size: 100% var(--hour), 100% var(--hour);
}
.cal-body.dd-active .daycol.dd-target { background-color: color-mix(in srgb, var(--accent) 7%, transparent); }

/* pôvodná karta počas ťahania */
.gcard.dd-source { opacity: .35; filter: saturate(.6); box-shadow: none; transform: none; }

/* ghost – kde hodina pristane */
.gcard.dd-ghost {
  pointer-events: none; z-index: 20; transition: none !important;
  outline: 2px solid var(--accent); outline-offset: -1px;
  box-shadow: 0 16px 34px -12px rgba(20,30,60,.35), 0 0 0 5px color-mix(in srgb, var(--accent) 14%, transparent);
  background: color-mix(in srgb, var(--card-bg) 85%, var(--accent) 15%);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
}
.gcard.dd-ghost.dd-hover { opacity: .9; display: flex; align-items: flex-start; }
.gcard.dd-ghost.dd-hover .gc-name { font-size: 12.5px; font-weight: 600; color: var(--ink); }

/* plávajúci štítok s časom nad ghostom */
.dd-tag {
  position: absolute; left: 50%; transform: translate(-50%, calc(-100% - 7px)); z-index: 21; pointer-events: none;
  background: var(--accent); color: var(--accent-ink); font-size: 12px; font-weight: 650; letter-spacing: .01em;
  padding: 4px 10px; border-radius: 999px; white-space: nowrap; font-variant-numeric: tabular-nums;
  box-shadow: 0 6px 16px -6px color-mix(in srgb, var(--accent) 70%, transparent);
}
.dd-tag::after { content: ""; position: absolute; left: 50%; bottom: -4px; width: 8px; height: 8px; background: inherit; transform: translateX(-50%) rotate(45deg); border-radius: 1px; }

/* potvrdzovacie okno presunu */
#moveModal { width: 420px; }
#moveModal .mh-sub { color: var(--ink2); font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mv-from { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; padding: 10px 12px; margin-bottom: 16px; border-radius: 11px;
  background: color-mix(in srgb, var(--ink) 5%, transparent); font-size: 13px; }
.mv-from .mv-k { color: var(--ink2); } .mv-from .mv-v { color: var(--ink); font-weight: 550; text-align: right; font-variant-numeric: tabular-nums; }
.mv-steps { display: flex; align-items: center; gap: 6px; margin-top: -4px; }
.mv-steps button { font: inherit; font-size: 12.5px; font-weight: 600; padding: 6px 11px; border-radius: 9px; cursor: pointer;
  border: 1px solid var(--chip-bd); background: var(--chip-bg); color: var(--ink); font-variant-numeric: tabular-nums; }
.mv-steps button:hover { border-color: color-mix(in srgb, var(--accent) 45%, transparent); color: var(--accent); }
.mv-steps .mv-dur { flex: 1; text-align: center; font-size: 12.5px; color: var(--ink2); font-variant-numeric: tabular-nums; }
.mv-err { color: #e0453f; font-size: 12.5px; margin: 8px 0 0; min-height: 0; }
.mv-err:empty { display: none; }
#moveModal .btn.primary:disabled { opacity: .45; cursor: not-allowed; }
#moveModal .setting-hint { margin: 8px 0 0; }
.week-range { color: var(--ink); }

/* =========================================================================
   ZOŠITY — knižnica (panel predmetov + kartičky), editor, split, prehliadač.
   Všetko cez premenné tém (--accent, --ink, --card-bg…), funguje aj v Silver.
   ========================================================================= */
:root { --paper:#ffffff; --paper-ink:#1d1d1f; --paper-line:rgba(60,70,110,.14); --zs-glass:rgba(255,255,255,.66); --zs-glass-bd:rgba(255,255,255,.9); --zs-pop:rgba(250,251,254,.97); }
:root[data-theme="dark"] { --paper:#2a2d33; --paper-ink:#e9ebef; --paper-line:rgba(255,255,255,.12); --zs-glass:rgba(52,56,64,.6); --zs-glass-bd:rgba(255,255,255,.08); --zs-pop:rgba(44,47,54,.98); }

.zs-dot { width:9px; height:9px; border-radius:50%; flex-shrink:0; background:var(--c, var(--ink3)); }
.zs-dot-none { background:transparent; border:1.5px dashed var(--ink3); box-sizing:border-box; }
.zs-disabled { opacity:.45; pointer-events:none; }

/* --- knižnica --- */
.zs-lib { display:flex; gap:22px; align-items:flex-start; }
.zs-side { width:250px; flex-shrink:0; position:sticky; top:16px; display:flex; flex-direction:column; gap:2px; padding:12px 10px; border-radius:18px;
  background:var(--zs-glass); border:1px solid var(--zs-glass-bd); box-shadow:0 1px 2px rgba(20,30,60,.05), 0 12px 32px -18px rgba(20,30,60,.22);
  -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); max-height:calc(100vh - 32px); overflow-y:auto; box-sizing:border-box; }
.zs-side-item { display:flex; align-items:center; gap:10px; width:100%; border:none; background:transparent; font:inherit; font-size:13.5px; color:var(--ink);
  padding:8px 10px; border-radius:9px; text-align:left; cursor:pointer; min-height:36px; }
.zs-side-item:hover { background:color-mix(in srgb, var(--ink) 6%, transparent); }
.zs-side-item.active { background:color-mix(in srgb, var(--accent) 14%, transparent); color:color-mix(in srgb, var(--accent) 80%, var(--ink)); font-weight:600; }
.zs-side-item svg { flex-shrink:0; }
.zs-side-name { flex:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.zs-cnt { font-size:12px; color:var(--ink2); font-variant-numeric:tabular-nums; }
.zs-side-item.active .zs-cnt { color:inherit; }
.zs-side-label { font-size:11.5px; font-weight:650; color:var(--ink2); padding:16px 10px 6px; }
.zs-side-div { height:1px; background:var(--line); margin:10px 8px; }
.zs-main { flex:1; min-width:0; display:flex; flex-direction:column; gap:16px; }
.zs-bar { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.zs-h2 { margin:0; flex:1; min-width:160px; font-size:22px; font-weight:700; letter-spacing:-0.02em; color:var(--ink); }
.zs-search { display:flex; align-items:center; gap:8px; width:260px; height:38px; padding:0 12px; box-sizing:border-box; border-radius:11px;
  background:var(--chip-bg); border:1px solid var(--chip-bd); color:var(--ink2); }
.zs-search:focus-within { outline:2px solid var(--accent); outline-offset:1px; }
.zs-search input { border:none; background:transparent; font:inherit; font-size:13.5px; outline:none; width:100%; color:var(--ink); }
.zs-sort { height:38px; padding:0 10px; border-radius:11px; background:var(--chip-bg); border:1px solid var(--chip-bd); font:inherit; font-size:13.5px; color:var(--ink); cursor:pointer; }
.zs-new, .zs-empty .btn { display:inline-flex; align-items:center; gap:6px; height:38px; }
.zs-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(250px, 1fr)); gap:14px; }
.zs-card { display:flex; flex-direction:column; gap:9px; padding:16px 16px 14px; border-radius:16px; text-align:left; font:inherit; color:var(--ink); min-height:176px; box-sizing:border-box;
  background:var(--zs-glass); border:1px solid var(--zs-glass-bd); box-shadow:0 1px 2px rgba(20,30,60,.05), 0 12px 32px -20px rgba(20,30,60,.25); cursor:pointer;
  transition:transform .2s cubic-bezier(.2,.8,.25,1), box-shadow .2s; }
.zs-card:hover { transform:translateY(-2px); box-shadow:0 2px 4px rgba(20,30,60,.06), 0 18px 36px -18px rgba(20,30,60,.32); }
.zs-card:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.zs-card-subj { display:flex; align-items:center; gap:7px; font-size:12px; min-width:0; }
.zs-card-sname { font-weight:600; color:color-mix(in srgb, var(--c) 85%, var(--ink)); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.zs-none .zs-card-sname { color:var(--ink2); font-weight:500; }
.zs-badge { margin-left:auto; flex-shrink:0; font-size:10.5px; font-weight:700; padding:2px 7px; border-radius:6px; background:color-mix(in srgb, var(--c) 13%, transparent); color:color-mix(in srgb, var(--c) 85%, var(--ink)); }
:root[data-theme="dark"] .zs-card-sname, :root[data-theme="dark"] .zs-badge { color:color-mix(in srgb, var(--c) 55%, #fff); }
.zs-card-title { font-size:16px; font-weight:650; letter-spacing:-0.01em; line-height:1.3; }
.zs-card-snip { font-size:13px; line-height:1.45; color:var(--ink2); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.zs-card-snip em { font-style:normal; opacity:.8; }
.zs-card-meta { margin-top:auto; display:flex; align-items:center; gap:6px; font-size:12px; color:var(--ink2); }
.zs-sep { opacity:.6; }
.zs-empty { display:flex; flex-direction:column; align-items:center; text-align:center; gap:8px; padding:64px 20px; color:var(--ink2); font-size:14px; }
.zs-empty p { margin:0; max-width:380px; line-height:1.5; }
.zs-empty .zs-empty-t { font-size:17px; font-weight:650; color:var(--ink); }
.zs-empty .btn { margin-top:10px; }
.zs-empty > svg { color:var(--accent); margin-bottom:4px; }

/* --- okno Nový zošit / výber predmetu --- */
.zs-subjlist { display:flex; flex-direction:column; padding:4px; border-radius:12px; background:var(--surface); border:1px solid var(--line); max-height:236px; overflow-y:auto; }
.zs-subj { display:flex; align-items:center; gap:10px; width:100%; border:none; background:transparent; font:inherit; font-size:14px; color:var(--ink); padding:9px 12px; border-radius:9px; text-align:left; cursor:pointer; }
.zs-subj:hover { background:color-mix(in srgb, var(--ink) 6%, transparent); }
.zs-subj.on { background:color-mix(in srgb, var(--accent) 12%, transparent); font-weight:600; }
.zs-subj-n { flex:1; min-width:0; }
.zs-subj .zs-check { color:var(--accent); visibility:hidden; flex-shrink:0; }
.zs-subj.on .zs-check { visibility:visible; }
.zs-seg { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); background:var(--seg-bg, rgba(118,118,128,.12)); border-radius:11px; padding:3px; gap:3px; }
.zs-seg button { border:none; background:transparent; font:inherit; font-size:13.5px; padding:8px 0; border-radius:8px; color:var(--ink2); cursor:pointer; }
.zs-seg button.active { background:var(--seg-on, #fff); color:var(--ink); font-weight:600; box-shadow:0 1px 3px rgba(0,0,0,.08); }
#nbModal .setting-hint { margin:9px 0 0; }
.zs-confirm-text { margin:0; font-size:14px; line-height:1.55; color:var(--ink); }
.btn.zs-danger { background:#d6453d; color:#fff; border-color:#d6453d; }
.btn.zs-danger:hover { background:#bf3a33; }

/* --- popover --- */
.zs-pop { position:fixed; z-index:120; min-width:180px; padding:8px; border-radius:14px; background:var(--zs-pop); border:1px solid var(--line);
  box-shadow:0 24px 50px -16px rgba(20,30,60,.4); color:var(--ink); box-sizing:border-box; -webkit-backdrop-filter:blur(20px); backdrop-filter:blur(20px);
  animation:zsPop .14s cubic-bezier(.2,.8,.25,1); }
@keyframes zsPop { from { opacity:0; transform:translateY(-4px) scale(.98); } }
@media (prefers-reduced-motion: reduce) { .zs-pop { animation:none; } .zs-card { transition:none; } }
.zs-pop-label { display:block; font-size:12px; font-weight:650; color:var(--ink2); padding:4px 6px 6px; }
.zs-pop-subj { width:300px; display:flex; flex-direction:column; gap:8px; }
.zs-subjlist-pop { background:transparent; border:none; padding:0; max-height:220px; }
.zs-subjlist-pop .zs-subj { font-size:13.5px; padding:7px 10px; }
.zs-pop-kind .zs-seg button { font-size:12.5px; padding:6px 0; }
.zs-pop-unlink { border:none; background:transparent; font:inherit; font-size:13px; color:#d6453d; padding:7px 8px; text-align:left; border-radius:8px; cursor:pointer; }
.zs-pop-unlink:hover { background:rgba(214,69,61,.08); }
.zs-menu { display:flex; flex-direction:column; padding:6px; min-width:200px; }
.zs-menu-i { display:flex; align-items:center; gap:10px; border:none; background:transparent; font:inherit; font-size:13.5px; color:var(--ink); padding:8px 10px; border-radius:8px; text-align:left; cursor:pointer; }
.zs-menu-i:hover, .zs-menu-i.on { background:color-mix(in srgb, var(--accent) 12%, transparent); }
.zs-menu-danger { color:#d6453d; }
.zs-blockmenu .zs-bl-h1 { font-size:20px; font-weight:700; } .zs-blockmenu .zs-bl-h2 { font-size:17px; font-weight:650; }
.zs-blockmenu .zs-bl-h3 { font-size:15px; font-weight:650; } .zs-blockmenu .zs-bl-blockquote { font-style:italic; color:var(--ink2); }
.zs-sizemenu { min-width:84px; max-height:300px; overflow-y:auto; } .zs-sizemenu .zs-menu-i { justify-content:center; font-variant-numeric:tabular-nums; }
.zs-palpop { width:206px; }
.zs-pal { display:grid; grid-template-columns:repeat(6, 1fr); gap:6px; padding:6px 4px 2px; }
.zs-sw { width:26px; height:26px; border-radius:7px; border:1px solid rgba(0,0,0,.12); cursor:pointer; padding:0; }
.zs-sw:hover { transform:scale(1.1); }
.zs-pal-none { width:100%; border:none; background:transparent; font:inherit; font-size:13px; color:var(--ink); text-align:left; padding:7px 8px; border-radius:8px; cursor:pointer; }
.zs-pal-none:hover { background:color-mix(in srgb, var(--ink) 6%, transparent); }
.zs-tablepop { padding:10px; }
.zs-tgrid { display:grid; grid-template-columns:repeat(8, 18px); gap:3px; }
.zs-tcell { width:18px; height:18px; border-radius:3px; border:1px solid var(--line); background:var(--surface); padding:0; cursor:pointer; }
.zs-tcell.on { background:color-mix(in srgb, var(--accent) 30%, transparent); border-color:var(--accent); }
.zs-tlbl { font-size:12px; color:var(--ink2); text-align:center; margin-top:8px; font-variant-numeric:tabular-nums; }
.zs-linkpop { width:300px; display:flex; flex-direction:column; gap:4px; padding:12px; }
.zs-linkpop input { font:inherit; font-size:14px; padding:8px 10px; border-radius:9px; border:1px solid var(--line-strong, var(--line)); background:var(--surface); color:var(--ink); margin-bottom:6px; }
.zs-pop-row { display:flex; gap:8px; align-items:center; margin-top:4px; } .zs-pop-row .spacer { flex:1; }

/* --- editor: horná lišta --- */
body.zs-editing .wrap { padding-bottom:0; }
.zs-ed { display:flex; flex-direction:column; gap:12px; }
.zs-top { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.zs-back { display:flex; align-items:center; gap:4px; border:none; background:transparent; font:inherit; font-size:14px; font-weight:600; color:var(--accent); padding:6px 6px 6px 2px; border-radius:8px; cursor:pointer; }
.zs-back:hover { background:color-mix(in srgb, var(--accent) 10%, transparent); }
.zs-title { border:1px solid transparent; background:transparent; font:inherit; font-size:21px; font-weight:700; letter-spacing:-0.02em; color:var(--ink);
  padding:4px 8px; border-radius:9px; min-width:120px; max-width:40vw; text-overflow:ellipsis; }
.zs-title:hover { background:color-mix(in srgb, var(--ink) 5%, transparent); }
.zs-title:focus { outline:2px solid var(--accent); outline-offset:0; background:var(--surface); }
.zs-chip { display:flex; align-items:center; gap:7px; height:34px; padding:0 12px; border-radius:11px; font:inherit; font-size:13px; font-weight:600; cursor:pointer; max-width:340px;
  background:color-mix(in srgb, var(--c) 12%, transparent); border:1px solid color-mix(in srgb, var(--c) 35%, transparent); color:color-mix(in srgb, var(--c) 80%, var(--ink)); }
.zs-chip span:not(.zs-dot) { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
:root[data-theme="dark"] .zs-chip { color:color-mix(in srgb, var(--c) 50%, #fff); }
.zs-chip-none { background:transparent; border-style:dashed; border-color:var(--ink3); color:var(--ink2); }
.zs-chip.open, .zs-pill.open { box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 20%, transparent); }
.zs-flex { flex:1; }
.zs-pill { display:flex; align-items:center; gap:7px; height:36px; padding:0 13px; border-radius:11px; background:var(--chip-bg); border:1px solid var(--chip-bd);
  font:inherit; font-size:13.5px; font-weight:550; color:var(--ink); cursor:pointer; }
.zs-pill:hover { border-color:color-mix(in srgb, var(--accent) 40%, var(--chip-bd)); }
.zs-pill.on { background:var(--accent); border-color:var(--accent); color:var(--accent-ink); }
.zs-pill.zs-ico { width:36px; padding:0; justify-content:center; }
.zs-num { font-size:11.5px; font-weight:700; background:color-mix(in srgb, var(--ink) 12%, transparent); padding:1px 7px; border-radius:999px; }

/* --- editor: pracovná plocha + split --- */
.zs-work { display:grid; grid-template-columns:minmax(0, 1fr); min-height:0; }
.zs-filepane, .zs-divider { display:none; }
.zs-work.split { grid-template-columns:calc(var(--zs-w, .5) * 100% - 11px) 22px minmax(0, 1fr); }
.zs-work.split .zs-filepane { display:flex; }
.zs-work.split .zs-divider { display:flex; }
.zs-work.split.swap { grid-template-columns:minmax(0, 1fr) 22px calc(var(--zs-w, .5) * 100% - 11px); }
.zs-work.split.swap .zs-filepane { order:3; } .zs-work.split.swap .zs-divider { order:2; } .zs-work.split.swap .zs-docpane { order:1; }
.zs-work.resizing { cursor:col-resize; user-select:none; }
.zs-work.resizing .zs-filepane { pointer-events:none; }
.zs-divider { align-items:center; justify-content:center; cursor:col-resize; touch-action:none; border-radius:8px; }
.zs-divider span { width:6px; height:48px; border-radius:999px; background:color-mix(in srgb, var(--ink) 22%, transparent); transition:background .15s, height .15s; }
.zs-divider:hover span, .zs-divider:focus-visible span, .zs-work.resizing .zs-divider span { background:var(--accent); height:72px; }
.zs-divider:focus-visible { outline:none; }
.zs-docpane { display:flex; flex-direction:column; gap:10px; min-width:0; min-height:0; }

/* panel nástrojov */
.zs-toolbar { display:flex; align-items:center; flex-wrap:wrap; gap:2px; padding:5px 8px; border-radius:14px; align-self:center; max-width:100%; box-sizing:border-box;
  background:var(--zs-glass); border:1px solid var(--zs-glass-bd); box-shadow:0 10px 28px -18px rgba(20,30,60,.3); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); }
.zs-tb { flex-shrink:0; min-width:32px; height:32px; border:none; background:transparent; border-radius:8px; display:grid; place-items:center; color:var(--ink); padding:0 4px; font:inherit; cursor:pointer; }
.zs-tb:hover { background:color-mix(in srgb, var(--ink) 8%, transparent); }
.zs-tb.on { background:color-mix(in srgb, var(--accent) 16%, transparent); color:color-mix(in srgb, var(--accent) 85%, var(--ink)); }
.zs-tb:focus-visible, .zs-dd:focus-visible, .zs-pill:focus-visible, .zs-chip:focus-visible { outline:2px solid var(--accent); outline-offset:1px; }
.zs-tb-a { display:flex; flex-direction:column; align-items:center; gap:1px; font-weight:700; font-size:14px; line-height:1; }
.zs-tb-bar { width:16px; height:3px; border-radius:2px; background:#d6453d; }
.zs-tsep { width:1px; height:20px; background:var(--line); margin:0 4px; flex-shrink:0; }
.zs-dd { flex-shrink:0; white-space:nowrap; display:flex; align-items:center; justify-content:space-between; gap:6px; height:32px; padding:0 10px; border:none; background:color-mix(in srgb, var(--ink) 7%, transparent);
  border-radius:8px; font:inherit; font-size:13px; color:var(--ink); cursor:pointer; min-width:112px; }
.zs-dd.zs-dd-size { min-width:56px; margin-left:4px; font-variant-numeric:tabular-nums; }
.zs-dd:hover { background:color-mix(in srgb, var(--ink) 11%, transparent); }
.zs-more-tools { display:none; align-items:center; justify-content:center; width:32px; height:32px; padding:0; border:none; background:transparent; border-radius:8px; color:var(--ink); cursor:pointer; margin-left:auto; }
.zs-more-tools:hover { background:color-mix(in srgb, var(--ink) 8%, transparent); }
.zs-more-tools.on { background:color-mix(in srgb, var(--accent) 16%, transparent); color:var(--accent); }
.zs-work.split .zs-dd:not(.zs-dd-size) { min-width:96px; }
/* v úzkom (split) režime schováme menej používané nástroje */
.zs-work.split .zs-toolbar { align-self:stretch; }
.zs-work.split .zs-toolbar:not(.showall) .x { display:none; }
.zs-work.split .zs-more-tools { display:flex; }

/* papier */
.zs-scroll { flex:1; min-height:0; overflow-y:auto; overflow-x:hidden; padding:4px 4px 40px; border-radius:14px; }
.zs-pages { position:relative; width:100%; max-width:794px; margin:0 auto; }
.zs-sheets { position:absolute; inset:0; pointer-events:none; z-index:0; }
.zs-sheet { position:absolute; left:0; right:0; background:var(--paper); border-radius:6px;
  box-shadow:0 1px 2px rgba(20,30,60,.08), 0 18px 44px -22px rgba(20,30,60,.32); }
.zs-sheet span { position:absolute; bottom:22px; left:0; right:0; text-align:center; font-size:11px; color:color-mix(in srgb, var(--paper-ink) 40%, transparent); font-variant-numeric:tabular-nums; }
.zs-paper { position:relative; z-index:1; width:100%; box-sizing:border-box; padding:76px 80px 76px; background:transparent; color:var(--paper-ink);
  outline:none; font-size:16px; line-height:1.65; word-wrap:break-word; caret-color:var(--accent); }
.zs-work.split .zs-paper { padding:52px 44px 56px; }
.zs-paper hr.zs-pb { border:none; height:16px; margin:0; position:relative; overflow:visible; }
.zs-paper hr.zs-pb::after { content:attr(data-label); position:absolute; left:0; right:0; top:4px; border-top:1px dashed color-mix(in srgb, var(--paper-ink) 25%, transparent);
  font-size:10.5px; color:color-mix(in srgb, var(--paper-ink) 40%, transparent); text-align:center; line-height:1; padding-top:4px; }
.zs-paper:focus, .zs-paper:focus-visible { outline:none; }
.zs-paper > :first-child { margin-top:0; }
.zs-paper p { margin:0 0 .7em; }
.zs-paper h1 { font-size:1.9em; line-height:1.2; font-weight:700; letter-spacing:-0.02em; margin:.9em 0 .4em; }
.zs-paper h2 { font-size:1.4em; line-height:1.25; font-weight:650; letter-spacing:-0.01em; margin:1em 0 .4em; }
.zs-paper h3 { font-size:1.15em; line-height:1.3; font-weight:650; margin:1em 0 .35em; }
.zs-paper blockquote { margin:.8em 0; padding:.2em 0 .2em 1em; border-left:3px solid var(--accent); color:color-mix(in srgb, var(--paper-ink) 75%, transparent); font-style:italic; }
.zs-paper ul, .zs-paper ol { margin:0 0 .7em; padding-left:1.6em; }
.zs-paper li { margin:.15em 0; }
.zs-paper ul.zs-check { list-style:none; padding-left:0; }
.zs-paper ul.zs-check > li { position:relative; padding-left:28px; }
.zs-paper ul.zs-check > li::before { content:""; position:absolute; left:2px; top:.28em; width:17px; height:17px; border-radius:5px; border:1.6px solid color-mix(in srgb, var(--paper-ink) 45%, transparent); box-sizing:border-box; cursor:pointer; background:var(--paper); }
.zs-paper ul.zs-check > li.done::before { background:var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/11px no-repeat; border-color:var(--accent); }
.zs-paper ul.zs-check > li.done { color:color-mix(in srgb, var(--paper-ink) 50%, transparent); text-decoration:line-through; }
.zs-paper a { color:var(--accent); text-decoration:underline; text-underline-offset:2px; }
.zs-paper hr { border:none; border-top:1px solid var(--paper-line); margin:1.4em 0; }
.zs-paper img { max-width:100%; height:auto; border-radius:8px; display:inline-block; }
.zs-paper table { border-collapse:collapse; width:100%; table-layout:fixed; margin:.6em 0 1em; font-size:.95em; }
.zs-paper td, .zs-paper th { border:1px solid var(--paper-line); padding:6px 9px; vertical-align:top; min-width:40px; }
.zs-paper pre, .zs-paper code { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:.9em; background:color-mix(in srgb, var(--paper-ink) 6%, transparent); border-radius:5px; }
.zs-paper pre { padding:10px 12px; white-space:pre-wrap; }
.zs-status { position:fixed; right:28px; bottom:16px; z-index:30; display:flex; align-items:center; gap:8px; font-size:12px; color:var(--ink2); font-variant-numeric:tabular-nums;
  background:var(--chip-bg); padding:6px 12px; border-radius:999px; border:1px solid var(--chip-bd); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); }
#zsSaved.ok { color:#1e8e4e; }
:root[data-theme="dark"] #zsSaved.ok { color:#6fd39a; }

/* --- materiály (popover) --- */
.zs-matpop { width:340px; padding:10px; }
.zs-mhead { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:2px 4px 8px; font-weight:650; font-size:14px; }
.zs-mhead .btn { display:inline-flex; align-items:center; gap:6px; }
.zs-mlist { display:flex; flex-direction:column; gap:2px; max-height:300px; overflow-y:auto; }
.zs-mrow { display:flex; align-items:center; gap:4px; border-radius:10px; }
.zs-mrow.on { background:color-mix(in srgb, var(--accent) 10%, transparent); }
.zs-mopen { flex:1; min-width:0; display:flex; align-items:center; gap:10px; border:none; background:transparent; font:inherit; color:var(--ink); padding:7px 8px; border-radius:10px; text-align:left; cursor:pointer; }
.zs-mopen:hover { background:color-mix(in srgb, var(--ink) 6%, transparent); }
.zs-mname { display:flex; flex-direction:column; min-width:0; font-size:13.5px; }
.zs-mname span { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .zs-mname small { color:var(--ink2); font-size:11.5px; }
.zs-mdel { width:32px; height:32px; border:none; background:transparent; border-radius:8px; color:var(--ink2); display:grid; place-items:center; cursor:pointer; flex-shrink:0; }
.zs-mdel:hover { color:#d6453d; background:rgba(214,69,61,.1); }
.zs-mempty { margin:6px 6px 4px; font-size:13.5px; color:var(--ink2); }
.zs-mhint { margin:8px 6px 2px; font-size:12px; line-height:1.45; color:var(--ink2); }
.zf-ico { width:30px; height:30px; border-radius:8px; flex-shrink:0; display:grid; place-items:center; color:var(--fc); background:color-mix(in srgb, var(--fc) 13%, transparent); }
.zf-ico-t { font-size:8.5px; font-weight:800; letter-spacing:.02em; }

/* --- panel so súborom (split) --- */
.zs-filepane { flex-direction:column; min-width:0; min-height:0; border-radius:16px; overflow:hidden; position:relative;
  background:var(--zs-glass); border:1px solid var(--zs-glass-bd); box-shadow:0 12px 32px -18px rgba(20,30,60,.25); }
.zs-filepane.drag { outline:2px dashed var(--accent); outline-offset:-6px; }
.zs-fhead { display:flex; align-items:center; gap:4px; padding:7px 7px 7px 8px; border-bottom:1px solid var(--line); }
.zs-ftabs { flex:1; min-width:0; display:flex; gap:4px; overflow-x:auto; scrollbar-width:none; }
.zs-ftabs::-webkit-scrollbar { display:none; }
.zs-ftab { display:flex; align-items:center; gap:7px; height:32px; padding:0 10px 0 5px; border-radius:9px; border:none; background:transparent; font:inherit; font-size:12.5px; color:var(--ink2); white-space:nowrap; cursor:pointer; max-width:220px; flex-shrink:0; }
.zs-ftab span:last-child { overflow:hidden; text-overflow:ellipsis; }
.zs-ftab .zf-ico { width:22px; height:22px; border-radius:6px; } .zs-ftab .zf-ico-t { font-size:7px; }
.zs-ftab:hover { background:color-mix(in srgb, var(--ink) 6%, transparent); }
.zs-ftab.on { background:var(--surface); color:var(--ink); font-weight:600; box-shadow:0 1px 3px rgba(0,0,0,.08); }
.zs-fadd { padding:0; width:32px; justify-content:center; color:var(--accent); }
.zs-fbody { flex:1; min-height:0; overflow:auto; position:relative; }
.zs-ftools { display:flex; align-items:center; justify-content:center; gap:2px; padding:6px; border-top:1px solid var(--line); flex-wrap:wrap; }
.zs-ftools[hidden] { display:none; }
.zv-tb { min-width:32px; height:32px; border:none; background:transparent; border-radius:8px; display:grid; place-items:center; color:var(--ink); cursor:pointer; padding:0 6px; text-decoration:none; }
.zv-tb:hover { background:color-mix(in srgb, var(--ink) 8%, transparent); }
.zv-tb.on { color:var(--accent); background:color-mix(in srgb, var(--accent) 12%, transparent); }
.zv-pct, .zv-pageno { font-size:12.5px; color:var(--ink); font-variant-numeric:tabular-nums; min-width:48px; text-align:center; }
.zv-pageno { color:var(--ink2); min-width:auto; padding:0 6px; }
.zv-tsep { width:1px; height:18px; background:var(--line); margin:0 4px; }
.zs-fempty { display:flex; }
.zs-drop { margin:auto; display:flex; flex-direction:column; align-items:center; gap:6px; text-align:center; padding:28px; color:var(--ink2); font-size:13.5px; max-width:320px; }
.zs-drop > svg { width:28px; height:28px; color:var(--accent); }
.zs-drop p { margin:0; line-height:1.5; } .zs-drop .zs-drop-t { color:var(--ink); font-weight:650; font-size:15px; }
.zs-drop .btn { margin-top:10px; }

/* --- prehliadač súborov --- */
.zv-host { background:color-mix(in srgb, var(--ink) 5%, transparent); }
.zv-loading { display:flex; align-items:center; justify-content:center; gap:10px; height:100%; min-height:200px; color:var(--ink2); font-size:13.5px; }
.zv-spin { width:18px; height:18px; border-radius:50%; border:2px solid color-mix(in srgb, var(--accent) 25%, transparent); border-top-color:var(--accent); animation:zvSpin .8s linear infinite; }
@keyframes zvSpin { to { transform:rotate(360deg); } }
.zv-msg { display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center; padding:48px 28px; max-width:360px; margin:0 auto; color:var(--ink2); font-size:13.5px; }
.zv-msg p { margin:0; line-height:1.5; } .zv-msg .zv-msg-t { color:var(--ink); font-weight:650; font-size:15px; }
.zv-msg .btn { margin-top:8px; display:inline-flex; align-items:center; gap:6px; text-decoration:none; }
.zv-img { padding:18px; display:flex; justify-content:center; }
.zv-img img { display:block; max-width:none; height:auto; border-radius:6px; box-shadow:0 6px 20px -8px rgba(20,30,60,.35); background:#fff; }
.zv-text { margin:0; padding:22px 24px; font:13.5px/1.6 ui-monospace,SFMono-Regular,Menlo,monospace; white-space:pre-wrap; word-break:break-word; color:var(--ink); }
.zv-pages { display:flex; flex-direction:column; align-items:center; gap:14px; padding:18px; }
.zv-page { background:#fff; box-shadow:0 6px 20px -8px rgba(20,30,60,.35); border-radius:3px; flex-shrink:0; overflow:hidden; }
.zv-page canvas { display:block; width:100%; height:100%; }
.zv-docx { padding:0; }
.zv-docx .docx-wrapper { background:transparent !important; padding:18px 0 !important; display:flex; flex-direction:column; align-items:center; }
.zv-docx .docx-wrapper > section.docx { box-shadow:0 6px 20px -8px rgba(20,30,60,.35) !important; margin-bottom:14px !important; }
.zv-sheetwrap { overflow:auto; height:calc(100% - 38px); min-height:200px; background:#fff; }
.zv-sheetwrap:last-child { height:100%; }
.zv-sheet table { border-collapse:collapse; font:12.5px/1.35 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; color:#1d1d1f; background:#fff; }
.zv-sheet td, .zv-sheet th { border:1px solid #dcdfe6; padding:4px 8px; white-space:nowrap; max-width:320px; overflow:hidden; text-overflow:ellipsis; }
.zv-sheet td.num { text-align:right; font-variant-numeric:tabular-nums; }
.zv-sheet thead th { position:sticky; top:0; z-index:2; background:#f1f3f7; color:#5a5f6b; font-weight:600; font-size:11.5px; text-align:center; }
.zv-sheet th.zv-rn { position:sticky; left:0; z-index:1; background:#f1f3f7; color:#5a5f6b; font-weight:500; font-size:11.5px; text-align:right; min-width:32px; }
.zv-sheet th.zv-corner { left:0; z-index:3; }
.zv-sheet tbody tr:first-child td { font-weight:600; background:#fafbfd; }
.zv-tabs { display:flex; gap:2px; padding:5px 6px; border-top:1px solid var(--line); overflow-x:auto; background:var(--surface); height:38px; box-sizing:border-box; }
.zv-tab { border:none; background:transparent; font:inherit; font-size:12.5px; color:var(--ink2); padding:4px 12px; border-radius:7px; cursor:pointer; white-space:nowrap; }
.zv-tab.on { background:color-mix(in srgb, #1e8e4e 14%, transparent); color:#1e7a44; font-weight:650; }
.zv-note, .zv-empty { font-size:12px; color:#6e6e73; padding:8px 12px; margin:0; }
.zv-pptx { padding:18px; display:flex; justify-content:center; }
.zv-pptx .pptx-preview-wrapper { background:transparent !important; overflow:visible !important; height:auto !important; }
.zv-pptx .pptx-preview-slide-wrapper { margin:0 auto 14px !important; box-shadow:0 6px 20px -8px rgba(20,30,60,.35) !important; }

/* --- responzívne --- */
@media (max-width: 900px) {
  .zs-lib { flex-direction:column; }
  .zs-side { position:static; width:100%; flex-direction:row; overflow-x:auto; overflow-y:hidden; padding:6px; gap:4px; max-height:none; scrollbar-width:none; }
  .zs-side::-webkit-scrollbar { display:none; }
  .zs-side-item { width:auto; flex-shrink:0; white-space:nowrap; }
  .zs-side-label, .zs-side-div { display:none; }
  .zs-search { width:auto; flex:1; min-width:160px; }
}
@media (max-width: 760px) {
  .zs-h2 { font-size:19px; flex-basis:100%; }
  .zs-new span { display:none; } .zs-new { width:38px; padding:0; justify-content:center; }
  .zs-top { gap:8px; }
  .zs-back { order:0; } .zs-flex { order:1; } .zs-pill { order:2; }
  .zs-title { order:5; width:100% !important; max-width:none; font-size:19px; padding:4px 6px; }
  .zs-chip { order:6; max-width:100%; }
  .zs-pill span:not(.zs-num) { display:none; } .zs-pill { min-width:36px; padding:0 10px; justify-content:center; gap:5px; }
  .zs-pill.zs-ico { width:36px; min-width:36px; padding:0; }
  .zs-card { min-height:0; }
  .zs-work.split, .zs-work.split.swap { grid-template-columns:minmax(0, 1fr); grid-template-rows:minmax(0, 46%) minmax(0, 1fr); gap:10px; }
  .zs-work.split .zs-divider { display:none; }
  .zs-work.split.swap .zs-filepane { order:0; }
  .zs-toolbar { flex-wrap:nowrap; overflow-x:auto; align-self:stretch; scrollbar-width:none; }
  .zs-toolbar::-webkit-scrollbar { display:none; }
  .zs-work .zs-toolbar .zs-tb.x, .zs-work.split .zs-toolbar:not(.showall) .zs-tb.x { display:grid; }
  .zs-work .zs-toolbar .zs-dd.x, .zs-work.split .zs-toolbar:not(.showall) .zs-dd.x { display:flex; }
  .zs-work .zs-toolbar .zs-tsep.x, .zs-work.split .zs-toolbar:not(.showall) .zs-tsep.x { display:block; }
  .zs-more-tools, .zs-work.split .zs-more-tools { display:none; }
  .zs-paper, .zs-work.split .zs-paper { padding:32px 22px 40px; }
  .zs-status { right:12px; bottom:10px; }
}

/* --- tlač: len obsah zošita --- */
@media print {
  body.zs-editing header.app, body.zs-editing .viewswitch, body.zs-editing .zs-top, body.zs-editing .zs-toolbar, body.zs-editing .zs-filepane,
  body.zs-editing .zs-divider, body.zs-editing .zs-status, body.zs-editing .toast, body.zs-editing .movebar, body.zs-editing .modal, body.zs-editing .scrim { display:none !important; }
  body.zs-editing { background:#fff !important; }
  body.zs-editing .wrap { padding:0 !important; max-width:none !important; }
  body.zs-editing .zs-work { display:block !important; height:auto !important; }
  body.zs-editing .zs-scroll { overflow:visible !important; padding:0 !important; display:block !important; }
  body.zs-editing .zs-paper { box-shadow:none !important; max-width:none !important; padding:0 !important; border-radius:0 !important; min-height:0 !important; --paper:#fff; --paper-ink:#000; }
  body.zs-editing .zs-sheets { display:none !important; } body.zs-editing .zs-pages { max-width:none !important; }
  body.zs-editing [data-zspush] { margin-top:0 !important; break-before:page; }
  body.zs-editing hr.zs-pb { break-after:page; height:0 !important; } body.zs-editing hr.zs-pb::after { display:none; }
}
.nb-link-row .zs-lr-main { display:flex; flex-direction:column; gap:2px; min-width:0; }
.nb-link-row .zs-lr-t { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-weight:600; }
.nb-link-row .zs-lr-m { font-size:12px; color:var(--ink2); font-weight:400; }

/* otvorený zošit: celá plocha pre zošit, hore ostane len lišta so „Späť“ */
body.zs-editing header.app, body.zs-editing #viewswitch { display:none !important; }
body.zs-editing .wrap { padding-top:18px; }
@media (max-width: 760px) { body.zs-editing .wrap { padding-top:10px; } }

/* čiara aktuálneho času: len v stĺpci dnešného dňa, čas v ľavom stĺpci */
.daycol > .nowline { left:0; right:0; z-index:6; }
.daycol > .nowline .nowdot { left:-5px; }
.gutter .nowlabel { position:absolute; right:8px; transform:translateY(-50%); font-size:11px; font-weight:650; color:var(--accent);
  font-variant-numeric:tabular-nums; z-index:6; padding:1px 0; background:var(--panel-bg, transparent); }
/* dlhý deň: stránka sa posúva, riadok s dňami ostáva hore */
.cal-panel { overflow:clip; }
@supports not (overflow:clip) { .cal-panel { overflow:visible; } }
.cal-head { position:sticky; top:0; z-index:9; background:color-mix(in srgb, var(--accent) 5%, #fbfbfd); border-radius:20px 20px 0 0; }
:root[data-theme="dark"] .cal-head { background:color-mix(in srgb, var(--accent) 6%, #2a2d33); }

/* =========================================================================
   POZNÁMKY K HODINE (karta, platnosť) + POZNÁMKY NA TÝŽDEŇ
   ========================================================================= */
#notesList { display:flex; flex-direction:column; gap:10px; }
.nt-card { border-radius:14px; padding:4px 4px 6px; background:color-mix(in srgb, var(--ink) 4%, transparent);
  border:1px solid color-mix(in srgb, var(--ink) 7%, transparent); transition:border-color .15s, box-shadow .15s, background .15s; }
.nt-card:focus-within { background:var(--surface); border-color:color-mix(in srgb, var(--accent) 45%, transparent); box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 14%, transparent); }
.nt-card.nt-this { border-color:color-mix(in srgb, var(--accent) 30%, transparent); background:color-mix(in srgb, var(--accent) 6%, transparent); }
.nt-text { display:block; width:100%; box-sizing:border-box; border:none; background:transparent; resize:none; overflow:hidden; font:inherit; font-size:14px; line-height:1.5;
  color:var(--ink); padding:9px 10px 4px; min-height:46px; outline:none; }
.nt-text::placeholder { color:var(--faint, var(--ink3)); }
.nt-foot { display:flex; align-items:center; gap:6px; padding:0 4px; }
.nt-flex { flex:1; }
.nt-scope { display:inline-flex; align-items:center; gap:6px; height:28px; padding:0 10px; border-radius:999px; font:inherit; font-size:12px; font-weight:600; cursor:pointer;
  border:1px solid transparent; background:color-mix(in srgb, var(--ink) 7%, transparent); color:var(--ink2, var(--muted)); max-width:100%; }
.nt-scope span { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.nt-scope:hover, .nt-scope.open { border-color:color-mix(in srgb, var(--accent) 40%, transparent); }
.nt-this .nt-scope { background:color-mix(in srgb, var(--accent) 14%, transparent); color:color-mix(in srgb, var(--accent) 85%, var(--ink)); }
.nt-other .nt-scope { background:color-mix(in srgb, #c99a06 16%, transparent); color:color-mix(in srgb, #9a7300 90%, var(--ink)); }
:root[data-theme="dark"] .nt-other .nt-scope { color:#f0c955; }
:root[data-theme="dark"] .nt-this .nt-scope { color:color-mix(in srgb, var(--accent) 60%, #fff); }
.nt-del { width:30px; height:30px; border:none; background:transparent; border-radius:8px; color:var(--ink3, var(--faint)); display:grid; place-items:center; cursor:pointer; }
.nt-del:hover { color:#d6453d; background:rgba(214,69,61,.1); }
.nt-scope:focus-visible, .nt-del:focus-visible, .nt-others-t:focus-visible { outline:2px solid var(--accent); outline-offset:1px; }
.nt-others-t { display:flex; align-items:center; gap:6px; align-self:flex-start; border:none; background:transparent; font:inherit; font-size:12.5px; font-weight:600;
  color:var(--ink2, var(--muted)); padding:6px 4px; cursor:pointer; border-radius:8px; }
.nt-others-t:hover { color:var(--ink); }
.nt-others-t.open svg { transform:rotate(180deg); }
.nt-cnt { font-size:11px; background:color-mix(in srgb, var(--ink) 9%, transparent); padding:1px 7px; border-radius:999px; }
.nt-others { display:flex; flex-direction:column; gap:10px; }
.nt-others[hidden] { display:none; }
#notesList .notes-empty { font-size:13px; color:var(--ink2, var(--muted)); padding:12px 14px; border-radius:14px; border:1px dashed color-mix(in srgb, var(--ink) 14%, transparent); margin:0; }
/* výber platnosti */
.nt-pop { width:300px; padding:8px; z-index:130; }
.nt-opt { display:flex; align-items:center; gap:10px; width:100%; border:none; background:transparent; font:inherit; color:var(--ink); text-align:left; padding:8px 8px; border-radius:10px; cursor:pointer; }
.nt-opt:hover { background:color-mix(in srgb, var(--ink) 6%, transparent); }
.nt-opt.on { background:color-mix(in srgb, var(--accent) 12%, transparent); }
.nt-opt-i { width:30px; height:30px; border-radius:9px; display:grid; place-items:center; flex-shrink:0; background:color-mix(in srgb, var(--accent) 13%, transparent); color:var(--accent); }
.nt-opt-t { display:flex; flex-direction:column; min-width:0; flex:1; } .nt-opt-t b { font-size:13.5px; font-weight:600; } .nt-opt-t small { font-size:12px; color:var(--ink2, var(--muted)); }
.nt-opt-c { color:var(--accent); visibility:hidden; } .nt-opt.on .nt-opt-c { visibility:visible; }
.nt-pop-l { font-size:11.5px; font-weight:650; color:var(--ink2, var(--muted)); padding:10px 8px 6px; }
.nt-chips { display:flex; flex-wrap:wrap; gap:6px; padding:0 6px; }
.nt-chip { border:1px solid var(--line); background:var(--surface); font:inherit; font-size:12.5px; color:var(--ink); padding:5px 10px; border-radius:999px; cursor:pointer; }
.nt-chip:hover { border-color:color-mix(in srgb, var(--accent) 45%, var(--line)); }
.nt-chip.on { background:var(--accent); border-color:var(--accent); color:var(--accent-ink, #fff); }
.nt-custom { display:flex; gap:6px; padding:0 6px 4px; }
.nt-custom input { flex:1; min-width:0; font:inherit; font-size:13px; padding:6px 8px; border-radius:9px; border:1px solid var(--line); background:var(--surface); color:var(--ink); }

/* tlačidlo „Poznámky“ v navigácii týždňa */
.wn-btn { display:inline-flex; align-items:center; gap:7px; }
.wn-btn .wn-cnt { font-size:11.5px; font-weight:700; min-width:20px; height:20px; padding:0 6px; box-sizing:border-box; border-radius:999px; display:inline-grid; place-items:center;
  background:var(--accent); color:var(--accent-ink, #fff); }
@media (max-width: 760px) { .wn-btn .wn-lbl { display:none; } }

/* okno poznámok na týždeň */
.wn-modal { width:560px; }
.wn-head { align-items:flex-start; }
.wn-htxt { display:flex; flex-direction:column; gap:6px; min-width:0; }
.wn-nav { display:flex; align-items:center; gap:4px; margin-left:-6px; }
.wn-arrow { width:28px; height:28px; border:none; background:transparent; border-radius:8px; display:grid; place-items:center; color:var(--ink); cursor:pointer; }
.wn-arrow:hover:not(:disabled) { background:color-mix(in srgb, var(--ink) 7%, transparent); }
.wn-arrow:disabled { opacity:.3; cursor:default; }
.wn-range { font-size:13.5px; font-weight:600; color:var(--ink); font-variant-numeric:tabular-nums; }
.wn-range em { font-style:normal; font-weight:500; color:var(--accent); margin-left:4px; }
.wn-body { display:flex; flex-direction:column; gap:14px; }
.wn-day { display:flex; flex-direction:column; gap:6px; }
.wn-dh { display:flex; align-items:baseline; gap:8px; padding:0 2px; }
.wn-dn { font-size:13.5px; font-weight:650; color:var(--ink); } .wn-dd { font-size:12.5px; color:var(--ink2, var(--muted)); font-variant-numeric:tabular-nums; }
.wn-today { font-size:10.5px; font-weight:700; color:var(--accent-ink, #fff); background:var(--accent); padding:1px 7px; border-radius:999px; }
.wn-day.empty .wn-dn { color:var(--ink2, var(--muted)); font-weight:600; }
.wn-none { margin:0; font-size:12.5px; color:var(--faint, var(--ink3)); padding:0 2px; }
.wn-item { display:flex; gap:12px; width:100%; text-align:left; font:inherit; color:var(--ink); cursor:pointer; padding:11px 12px; border-radius:13px;
  background:color-mix(in srgb, var(--ink) 4%, transparent); border:1px solid color-mix(in srgb, var(--ink) 6%, transparent); transition:background .15s, border-color .15s; }
.wn-item:hover { background:color-mix(in srgb, var(--c) 8%, transparent); border-color:color-mix(in srgb, var(--c) 30%, transparent); }
.wn-item:focus-visible { outline:2px solid var(--accent); outline-offset:1px; }
.wn-bar { width:4px; border-radius:4px; background:var(--c); flex-shrink:0; }
.wn-main { display:flex; flex-direction:column; gap:4px; min-width:0; flex:1; }
.wn-top { display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; }
.wn-name { font-size:13.5px; font-weight:650; }
.wn-meta { font-size:12px; color:var(--ink2, var(--muted)); font-variant-numeric:tabular-nums; }
.wn-text { font-size:13.5px; line-height:1.45; white-space:pre-wrap; word-break:break-word; display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden; }
.wn-sec { display:flex; flex-direction:column; gap:6px; padding-top:12px; border-top:1px solid var(--line); }
.wn-sec-t { display:flex; align-items:center; gap:7px; font-size:13.5px; font-weight:650; color:var(--ink); padding:0 2px; }
.wn-sec-t svg { color:var(--accent); }
.wn-empty { display:flex; flex-direction:column; align-items:center; gap:6px; text-align:center; padding:28px 16px; color:var(--ink2, var(--muted)); font-size:13.5px; }
.wn-empty > svg { width:24px; height:24px; color:var(--accent); } .wn-empty p { margin:0; max-width:340px; line-height:1.5; }
.wn-empty .wn-empty-t { color:var(--ink); font-weight:650; font-size:15px; }
.wn-foot-hint { margin:0; font-size:12px; color:var(--ink2, var(--muted)); }
@media (max-width: 760px) { .wn-foot-hint { display:none; } }
.wn-btn { height:38px; }
@media (max-width: 760px) {
  .week-center { gap:6px; }
  .week-label { padding:0 10px; gap:6px; min-width:0; }
  .week-range { white-space:nowrap; font-size:13px; }
  .week-rel { display:none; }
  .wn-btn, .today-btn { padding:0 11px; }
}
@media (max-width: 360px) { .today-btn { display:none; } }

/* =========================================================================
   VYLEPŠENIA UX – pohyb, živé prvky, kontrast, kompaktná hlavička, mobil
   ========================================================================= */
:root { --ease-out: cubic-bezier(.22,1,.36,1); --ease-io: cubic-bezier(.45,0,.3,1);
  --accent-fill: var(--accent); --accent-fill-ink: var(--accent-ink); --accent-text: var(--accent); }
:root[data-accent="blue"]   { --accent-fill:#0071ea; --accent-text:#0071ea; }
:root[data-accent="pink"]   { --accent-fill:#e7b5ce; --accent-fill-ink:#4a1631; --accent-text:#a8487a; }
:root[data-accent="red"]    { --accent-fill:#d43f3d; --accent-text:#d43f3d; }
:root[data-accent="lime"]   { --accent-fill:#6cae14; --accent-fill-ink:#16210a; --accent-text:#448400; }
:root[data-accent="yellow"] { --accent-fill:#dd9a0b; --accent-fill-ink:#241800; --accent-text:#a76700; }
:root[data-accent="silver"] { --accent-fill:#c7cdd8; --accent-fill-ink:#22252b; --accent-text:#c7cdd8; }

/* --- kontrast: čitateľné popisky --- */
:root { --ink3:#737378; --faint:#7a7973; }
:root[data-theme="dark"] { --ink3:#8f939c; --faint:#8a8a94; }
.gutter .hl { color: var(--ink2); }
.dayrow .time, .daytab .d-num { color: var(--ink2); }
.week-rel.now, .dh.today .dnm { color: var(--accent-text); }
.btn.add, .btn.primary, .cta, .btn.primary:hover { background: var(--accent-fill); color: var(--accent-fill-ink); }
.daytab.active { background: var(--accent-fill); color: var(--accent-fill-ink); }
.daytab.active .d-num { color: color-mix(in srgb, var(--accent-fill-ink) 78%, transparent); }
.dh.today .dnum, .dd-tag, .wn-btn .wn-cnt, .wn-today, .zs-pill.on, .nt-chip.on { background: var(--accent-fill); color: var(--accent-fill-ink); }
.zs-pill.on, .nt-chip.on { border-color: var(--accent-fill); }

/* --- zjednotenie: jedna hrúbka ikon, jednotné zaoblenia --- */
button svg[stroke="currentColor"], a svg[stroke="currentColor"], .gc-icn svg { stroke-width: 1.9px; }
.mini-arrow, .week-label, .today-btn, .wn-btn { border-radius: 12px; }
.modal { border-radius: 20px; }

/* --- kompaktná hlavička v jednom riadku --- */
header.app { flex-wrap: nowrap; align-items: center; gap: 14px; margin-bottom: 22px; }
header.app .title-block { display: flex; align-items: baseline; gap: 12px; min-width: 0; flex-shrink: 1; }
.title-block h1 { font-size: 28px; line-height: 1.1; letter-spacing: -0.03em; }
.title-block .sub { margin-top: 0; font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
header.app .viewswitch { margin: 0 auto 0 6px; flex-shrink: 0; }
header.app .head-actions { flex-wrap: nowrap; flex-shrink: 0; }
@media (max-width: 1100px) { .title-block .sub { display: none; } }

/* --- čip Teraz / Ďalej --- */
.nowchip { display: flex; align-items: center; gap: 12px; height: 46px; box-sizing: border-box; padding: 0 14px; flex-shrink: 1; min-width: 0;
  border-radius: 12px; border: 1px solid var(--chip-bd); background: var(--chip-bg); color: var(--ink); font: inherit; text-align: left; cursor: pointer;
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  transition: border-color .25s var(--ease-out), box-shadow .25s var(--ease-out), transform .15s var(--ease-out); animation: ncIn .5s var(--ease-out) both; }
.nowchip:hover { border-color: color-mix(in srgb, var(--accent) 40%, var(--chip-bd)); box-shadow: 0 10px 24px -16px rgba(30,40,90,.35); }
.nowchip:active { transform: scale(.98); }
.nowchip:focus-visible, .m-now:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.nowchip[hidden], .m-now[hidden] { display: none !important; }
@keyframes ncIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.nc-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; background: var(--c); }
:root[data-theme="dark"] .nc-dot { background: var(--cl); }
.nc-dot.live { animation: ncPulse 2.2s var(--ease-out) infinite; }
@keyframes ncPulse { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--c) 50%, transparent); } 70%, 100% { box-shadow: 0 0 0 7px color-mix(in srgb, var(--c) 0%, transparent); } }
.nc-main, .nc-next { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.nc-lbl { font-size: 11.5px; font-weight: 600; color: var(--accent-text); white-space: nowrap; }
.nc-lbl2 { font-size: 11.5px; color: var(--ink2); white-space: nowrap; }
.nc-name { font-size: 13.5px; font-weight: 650; letter-spacing: -0.01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 210px; }
.nc-name2 { font-size: 12.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 170px; }
.nc-prog { display: flex; flex-direction: column; gap: 5px; width: 92px; flex-shrink: 0; }
.nc-bar { height: 4px; border-radius: 4px; background: color-mix(in srgb, var(--ink) 10%, transparent); overflow: hidden; }
.nc-bar i { display: block; height: 100%; border-radius: 4px; background: var(--accent-fill); transform-origin: left center; transition: transform 1s linear; }
.nc-left { font-size: 11.5px; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.nc-sep { width: 1px; height: 26px; background: var(--line); flex-shrink: 0; }
.nc-in { font-size: 12px; font-weight: 600; color: var(--accent-text); background: color-mix(in srgb, var(--accent) 12%, transparent); padding: 3px 9px; border-radius: 999px; white-space: nowrap; }
@media (max-width: 1360px) { .nowchip .nc-sep, .nowchip .nc-next { display: none; } }
.nowchip .nc-main { flex: 1 1 auto; min-width: 140px; overflow: hidden; }
.nowchip .nc-lbl, .nowchip .nc-lbl2 { overflow: hidden; text-overflow: ellipsis; }
.nowchip .nc-name { max-width: 190px; }
@media (max-width: 960px) { .nowchip .nc-prog, .nowchip .nc-in { display: none; } .nc-name { max-width: 150px; } }

/* --- minulé a prebiehajúce hodiny --- */
.gcard, .card { transition: transform .28s var(--ease-out), box-shadow .28s var(--ease-out), opacity .35s var(--ease-out), filter .35s var(--ease-out); }
.gcard.is-past, .card.is-past { opacity: .5; filter: saturate(.75); }
.gcard.is-past:hover, .card.is-past:hover { opacity: .85; filter: none; }
.gcard.is-live { box-shadow: 0 0 0 2px var(--show), 0 12px 26px -14px color-mix(in srgb, var(--show) 70%, transparent); }
.card { position: relative; }
.card.is-live { box-shadow: 0 0 0 2px var(--c), var(--shadow-soft, 0 1px 2px rgba(0,0,0,.05)); }
:root[data-theme="dark"] .card.is-live { box-shadow: 0 0 0 2px var(--cl); }
.live-badge { display: inline-flex; align-items: center; margin-left: auto; font-size: 9.5px; font-weight: 700; padding: 2px 7px; border-radius: 999px; white-space: nowrap;
  background: var(--show, var(--c)); color: #fff; animation: ncIn .4s var(--ease-out) both; }
.gc-top .live-badge + .gbadge { margin-left: 4px; font-size: 0; gap: 0; padding: 3px 4px; }
.gc-top .live-badge + .gbadge svg { width: 10px; height: 10px; }
.live-badge.abs { position: absolute; top: 10px; right: 10px; font-size: 10.5px; background: var(--c); }
:root[data-theme="dark"] .live-badge { background: var(--cl); color: #17181c; }

/* --- pohyb: kartičky --- */
.gcard:hover { transform: translateY(-2px); }
.gcard:active { transform: translateY(0) scale(.985); transition-duration: .12s; }

/* --- pohyb: týždeň sa posunie v smere šípky, stĺpce jemne za sebou --- */
@keyframes wkR { from { opacity: 0; transform: translateX(30px); } to { opacity: 1; transform: none; } }
@keyframes wkL { from { opacity: 0; transform: translateX(-30px); } to { opacity: 1; transform: none; } }
#grid.slide-r .cal-panel, #grid.slide-l .cal-panel { animation: none; }
#grid.slide-r .cal-head .dh, #grid.slide-r .cal-body .daycol { animation: wkR .44s var(--ease-out) both; }
#grid.slide-l .cal-head .dh, #grid.slide-l .cal-body .daycol { animation: wkL .44s var(--ease-out) both; }
#grid.slide-r .cal-head .dh:nth-child(3), #grid.slide-r .cal-body .daycol:nth-child(3) { animation-delay: .03s; }
#grid.slide-r .cal-head .dh:nth-child(4), #grid.slide-r .cal-body .daycol:nth-child(4) { animation-delay: .06s; }
#grid.slide-r .cal-head .dh:nth-child(5), #grid.slide-r .cal-body .daycol:nth-child(5) { animation-delay: .09s; }
#grid.slide-r .cal-head .dh:nth-child(6), #grid.slide-r .cal-body .daycol:nth-child(6) { animation-delay: .12s; }
#grid.slide-l .cal-head .dh:nth-child(5), #grid.slide-l .cal-body .daycol:nth-child(5) { animation-delay: .03s; }
#grid.slide-l .cal-head .dh:nth-child(4), #grid.slide-l .cal-body .daycol:nth-child(4) { animation-delay: .06s; }
#grid.slide-l .cal-head .dh:nth-child(3), #grid.slide-l .cal-body .daycol:nth-child(3) { animation-delay: .09s; }
#grid.slide-l .cal-head .dh:nth-child(2), #grid.slide-l .cal-body .daycol:nth-child(2) { animation-delay: .12s; }
@keyframes wlR { from { opacity: 0; transform: translateX(10px); } to { opacity: 1; transform: none; } }
@keyframes wlL { from { opacity: 0; transform: translateX(-10px); } to { opacity: 1; transform: none; } }
.week-label.wl-r { animation: wlR .34s var(--ease-out) both; }
.week-label.wl-l { animation: wlL .34s var(--ease-out) both; }

/* --- pohyb: čiara času sa posúva plynulo --- */
.daycol > .nowline, .gutter .nowlabel { transition: top 1s var(--ease-out); }
.gutter .nowlabel { color: var(--accent-text); }

/* --- pohyb: detail hodiny sa otvára z kartičky a zatvára späť --- */
.drawer { transform: translate(calc(-50% + var(--ox, 0px)), calc(-50% + var(--oy, 16px))) scale(var(--os, .94)); opacity: 0;
  transition: transform .3s var(--ease-io), opacity .22s ease; }
.drawer.show { transform: translate(-50%, -50%) scale(1); opacity: 1; transition: transform .5s var(--ease-out), opacity .18s ease; }

/* --- pohyb: okná sa otvárajú mäkko, bez odskoku --- */
.modal { transform: translate(-50%, -48%) scale(.97); transition: opacity .18s ease, transform .24s var(--ease-io); }
.modal.show { transform: translate(-50%, -50%) scale(1); transition: opacity .22s ease, transform .44s var(--ease-out); }
.scrim, #mscrim { transition: opacity .32s var(--ease-out); }

/* --- pohyb: prepínač Rozvrh/Zošity s posuvným podkladom --- */
.viewswitch.has-thumb { position: relative; }
.vs-thumb { position: absolute; top: 3px; bottom: 3px; left: 0; width: 0; border-radius: 8px; background: var(--seg-on, #fff); z-index: 0; pointer-events: none;
  box-shadow: 0 1px 3px rgba(30,40,90,.16); transition: transform .42s var(--ease-out), width .42s var(--ease-out); }
:root[data-theme="dark"] .vs-thumb { box-shadow: none; }
.viewswitch.has-thumb button { position: relative; z-index: 1; transition: color .3s var(--ease-out); }
.viewswitch.has-thumb button.active { background: transparent !important; box-shadow: none !important; }
@keyframes vIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
#timetableView:not([hidden]), #notebooksView:not([hidden]) { animation: vIn .4s var(--ease-out) both; }

/* --- doladenie tmavej témy (Silver): hĺbka plochami, nie tieňmi --- */
:root[data-theme="dark"] .gcard { background: rgba(58,62,72,.72); border-color: rgba(255,255,255,.07); box-shadow: inset 0 1px 0 rgba(255,255,255,.05); }
:root[data-theme="dark"] .gcard:hover { background: rgba(68,72,82,.8); box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 12px 26px -18px rgba(0,0,0,.7); }
:root[data-theme="dark"] .gcard.is-live { box-shadow: 0 0 0 2px var(--show), inset 0 1px 0 rgba(255,255,255,.06); }
:root[data-theme="dark"] .cal-panel { box-shadow: none; border-color: rgba(255,255,255,.06); }
:root[data-theme="dark"] .btn, :root[data-theme="dark"] .icon-btn, :root[data-theme="dark"] .mini-arrow, :root[data-theme="dark"] .week-label,
:root[data-theme="dark"] .today-btn, :root[data-theme="dark"] .nowchip { box-shadow: none; border-color: rgba(255,255,255,.08); }
:root[data-theme="dark"] .modal, :root[data-theme="dark"] .drawer { background: rgba(38,41,48,.9); border-color: rgba(255,255,255,.08);
  box-shadow: 0 40px 90px -30px rgba(0,0,0,.75), inset 0 1px 0 rgba(255,255,255,.06); }

/* --- mobil: karta Teraz, bodky, voľné okná, spodná lišta, „+“ --- */
.m-now, .tabbar, .fab { display: none; }
@media (max-width: 760px) {
  header.app { margin-bottom: 14px; }
  .title-block h1 { font-size: 26px; }
  #viewswitch, #addBtn, #weekNotesBtn, .nowchip { display: none !important; }
  .m-now { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; column-gap: 10px; row-gap: 10px; width: 100%; box-sizing: border-box;
    margin: 0 0 14px; padding: 14px 16px; border-radius: 18px; border: 1px solid var(--chip-bd); background: var(--chip-bg); color: var(--ink); font: inherit; text-align: left; cursor: pointer;
    -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); animation: ncIn .5s var(--ease-out) both; transition: transform .15s var(--ease-out); }
  .m-now:active { transform: scale(.985); }
  .m-now .nc-name { font-size: 16px; max-width: none; }
  .m-now .nc-lbl, .m-now .nc-lbl2 { font-size: 12.5px; }
  .m-now .nc-prog { grid-column: 1 / -1; width: auto; flex-direction: row; align-items: center; gap: 10px; }
  .m-now .nc-bar { flex: 1; height: 5px; }
  .m-now .nc-sep { display: none; }
  .m-now .nc-next { grid-column: 1 / -1; flex-direction: row; justify-content: space-between; gap: 10px; padding-top: 10px; border-top: 1px solid var(--line); }
  .m-now .nc-name2 { max-width: 60%; text-align: right; }
  .daytab { transition: background .25s var(--ease-out), color .25s var(--ease-out), transform .15s var(--ease-out); }
  .daytab:active { transform: scale(.95); }
  .daytab .d-dots { display: flex; justify-content: center; gap: 3px; height: 5px; margin-top: 5px; }
  .daytab .d-dots i { width: 5px; height: 5px; border-radius: 50%; }
  .daytab .d-dots i.none { background: transparent; }
  .daytab.active .d-dots i:not(.none) { background: var(--accent-fill-ink) !important; opacity: .8; }
  .dayrow.gaprow .time { padding: 0; }
  .gapbox { display: flex; align-items: center; justify-content: center; height: 34px; border: 1px dashed var(--line-strong, var(--line)); border-radius: 12px; font-size: 12px; color: var(--ink2); }
  #timetableView { touch-action: pan-y; }
  #daylist { will-change: transform; }
  .wrap { padding-bottom: calc(112px + env(safe-area-inset-bottom, 0px)); }
  .tabbar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); position: fixed; left: 0; right: 0; bottom: 0; z-index: 50;
    padding: 6px 10px calc(6px + env(safe-area-inset-bottom, 0px)); border-top: 1px solid var(--line);
    background: color-mix(in srgb, var(--surface, #fff) 84%, transparent); -webkit-backdrop-filter: blur(20px) saturate(1.6); backdrop-filter: blur(20px) saturate(1.6); }
  :root[data-theme="dark"] .tabbar { background: rgba(30,32,38,.86); }
  .tabbar button { position: relative; min-height: 52px; border: none; background: transparent; font: inherit; font-size: 11px; font-weight: 600; color: var(--ink2);
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; cursor: pointer; transition: color .3s var(--ease-out); }
  .tabbar button svg { transition: transform .4s var(--ease-out); }
  .tabbar button.active { color: var(--accent-text); }
  .tabbar button.active svg { transform: translateY(-1px) scale(1.08); }
  .tabbar button:active svg { transform: scale(.9); transition-duration: .12s; }
  .tabbar button:focus-visible { outline: 2px solid var(--accent); outline-offset: -4px; border-radius: 12px; }
  .tb-badge { position: absolute; top: 3px; left: calc(50% + 6px); min-width: 18px; height: 18px; padding: 0 5px; box-sizing: border-box; border-radius: 999px;
    background: var(--accent-fill); color: var(--accent-fill-ink); font-size: 10.5px; font-weight: 700; display: grid; place-items: center; }
  .tb-badge[hidden] { display: none; }
  .fab { display: grid; place-items: center; position: fixed; right: 16px; bottom: calc(78px + env(safe-area-inset-bottom, 0px)); z-index: 51;
    width: 56px; height: 56px; border: none; border-radius: 18px; background: var(--accent-fill); color: var(--accent-fill-ink); cursor: pointer;
    box-shadow: 0 14px 28px -12px color-mix(in srgb, var(--accent) 80%, transparent); transition: transform .3s var(--ease-out), opacity .25s; animation: fabIn .45s var(--ease-out) both; }
  .fab[hidden] { display: none; }
  .fab:active { transform: scale(.92); }
  @keyframes fabIn { from { opacity: 0; transform: scale(.7); } to { opacity: 1; transform: none; } }
  body.zs-editing .tabbar, body.zs-editing .fab { display: none !important; }
  .toast, .movebar { bottom: calc(86px + env(safe-area-inset-bottom, 0px)); }
  .toast:not(.show), .movebar:not(.show) { transform: translateX(-50%) translateY(calc(100% + 170px)); }
}

/* --- menej pohybu, ak to systém žiada --- */
@media (prefers-reduced-motion: reduce) {
  #grid.slide-r .cal-head .dh, #grid.slide-r .cal-body .daycol, #grid.slide-l .cal-head .dh, #grid.slide-l .cal-body .daycol,
  .week-label.wl-r, .week-label.wl-l, #timetableView:not([hidden]), #notebooksView:not([hidden]), .nowchip, .m-now, .fab, .live-badge, .nc-dot.live { animation: none !important; }
  .vs-thumb, .drawer, .modal, .gcard, .card, .daycol > .nowline, .gutter .nowlabel, .nc-bar i, .tabbar button, .tabbar button svg { transition: none !important; }
}
/* plynulosť: počas posunu týždňa bez drahého rozostrenia pod kartičkami */
#grid.slide-r .gcard, #grid.slide-l .gcard, #grid.anim .gcard { -webkit-backdrop-filter: none; backdrop-filter: none; }

/* =========================================================================
   CELOOBRAZOVKOVÝ SPRIEVODCA (onboarding, nový semester)
   ========================================================================= */
.fs { position: fixed; inset: 0; z-index: 75; display: none; flex-direction: column; background: var(--amb); background-color: var(--bg, #fbfbf9); color: var(--ink);
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Inter", system-ui, sans-serif; overflow: hidden; }
:root[data-theme="dark"] .fs { background-color: #202329; }
.fs.fs-show, .fs.fs-out { display: flex; }
.fs.fs-show { animation: fsIn .45s var(--ease-out) both; }
.fs.fs-out { animation: fsOut .36s var(--ease-io) both; pointer-events: none; }
@keyframes fsIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes fsOut { from { opacity: 1; transform: none; } to { opacity: 0; transform: scale(1.02); } }
body.fs-open { overflow: hidden; }
body.fs-open .wrap, body.fs-open .tabbar, body.fs-open .fab { visibility: hidden; }
body.fs-open #mscrim { z-index: 76; }
.fs-top { flex: 0 0 auto; height: 76px; box-sizing: border-box; padding: 0 clamp(20px, 3.4vw, 48px); padding-top: env(safe-area-inset-top, 0px);
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 16px; }
.fs-brand { display: flex; align-items: center; gap: 10px; font-size: 17px; font-weight: 700; letter-spacing: -0.02em; }
.fs-logo { width: 34px; height: 34px; border-radius: 10px; background: var(--accent-fill); color: var(--accent-fill-ink); display: grid; place-items: center; flex-shrink: 0; }
.fs-logo.big { width: 88px; height: 88px; border-radius: 26px; box-shadow: 0 24px 50px -22px color-mix(in srgb, var(--accent) 90%, transparent); margin-bottom: 8px; }
.fs-logo.big svg { width: 42px; height: 42px; }
.fs-steps { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 10px; }
.fs-steps[hidden] { display: flex; visibility: hidden; }
.fs-steps li { display: flex; align-items: center; gap: 9px; }
.fs-dot { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-size: 12.5px; font-weight: 700; flex-shrink: 0;
  background: color-mix(in srgb, var(--ink) 9%, transparent); color: var(--ink2); transition: background .35s var(--ease-out), color .35s, box-shadow .35s; }
.fs-steps li.on .fs-dot { background: var(--surface, #fff); color: var(--accent-text); box-shadow: 0 0 0 2px var(--accent); }
:root[data-theme="dark"] .fs-steps li.on .fs-dot { background: #33363e; }
.fs-steps li.done .fs-dot { background: var(--accent-fill); color: var(--accent-fill-ink); }
.fs-lbl { font-size: 13.5px; color: var(--ink2); white-space: nowrap; }
.fs-steps li.on .fs-lbl { color: var(--ink); font-weight: 650; }
.fs-steps li.done .fs-lbl { color: var(--ink); }
.fs-line { width: 32px; height: 2px; border-radius: 2px; background: color-mix(in srgb, var(--ink) 12%, transparent); transition: background .35s; }
.fs-steps li.done .fs-line { background: var(--accent); }
.fs-right { justify-self: end; display: flex; align-items: center; gap: 10px; }
.fs-count { font-size: 13px; color: var(--ink2); font-variant-numeric: tabular-nums; }
.fs-x { width: 40px; height: 40px; border-radius: 12px; border: 1px solid var(--chip-bd); background: var(--chip-bg); color: var(--ink); display: grid; place-items: center; cursor: pointer; }
.fs-x:hover { border-color: color-mix(in srgb, var(--accent) 40%, var(--chip-bd)); }
.fs-stage { flex: 1 1 auto; min-height: 0; overflow-y: auto; display: flex; padding: 12px clamp(20px, 3.4vw, 48px) 24px; box-sizing: border-box; }
.fs-cols { margin: auto; width: 100%; max-width: 1240px; display: grid; grid-template-columns: minmax(0, 600px) minmax(0, 540px); justify-content: center; gap: clamp(32px, 6vw, 88px); align-items: center; }
.fs-cols.single { grid-template-columns: minmax(0, 640px); }
.fs-main { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.fs-hero { margin: auto; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 16px; max-width: 620px; padding: 20px 0; }
.fs-title { margin: 0; font-size: clamp(28px, 3vw, 36px); font-weight: 700; letter-spacing: -0.03em; line-height: 1.12; }
.fs-title.xl { font-size: clamp(34px, 4vw, 46px); letter-spacing: -0.035em; }
.fs-sub { margin: -6px 0 6px; font-size: 16px; line-height: 1.5; color: var(--ink2); max-width: 560px; }
.fs-sub.lg { font-size: 18px; margin: 0 0 10px; }
.fs-in-r { animation: fsR .52s var(--ease-out) both; } .fs-in-l { animation: fsL .52s var(--ease-out) both; } .fs-in-up { animation: fsUp .6s var(--ease-out) both; }
.fs-fade { animation: fsFade .5s var(--ease-out) .06s both; }
@keyframes fsR { from { opacity: 0; transform: translateX(36px); } to { opacity: 1; transform: none; } }
@keyframes fsL { from { opacity: 0; transform: translateX(-36px); } to { opacity: 1; transform: none; } }
@keyframes fsUp { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@keyframes fsFade { from { opacity: 0; transform: scale(.985); } to { opacity: 1; transform: none; } }
/* pole formulára */
.fs-field { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.fs-flabel { font-size: 13px; font-weight: 600; color: var(--ink); opacity: .85; }
.fs-field input, .fs-field select, .fs-main textarea { height: 50px; box-sizing: border-box; padding: 0 16px; border-radius: 13px; border: 1px solid color-mix(in srgb, var(--ink) 16%, transparent);
  background: var(--surface, #fff); color: var(--ink); font: inherit; font-size: 16px; transition: border-color .2s, box-shadow .2s; min-width: 0; }
:root[data-theme="dark"] .fs-field input, :root[data-theme="dark"] .fs-field select { background: #2c2f36; }
.fs-field input:focus, .fs-field select:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 18%, transparent); }
.fs-grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.fs-seg { display: flex; gap: 3px; padding: 4px; border-radius: 13px; background: var(--seg-bg); height: 50px; box-sizing: border-box; }
.fs-seg.sm { height: auto; padding: 3px; border-radius: 11px; }
.fs-seg.lg { height: auto; margin: 6px 0 12px; border-radius: 14px; }
.fs-seg button { flex: 1; border: none; border-radius: 10px; background: transparent; font: inherit; font-size: 15px; color: var(--ink2); cursor: pointer; padding: 0 16px; min-height: 36px;
  transition: background .3s var(--ease-out), color .3s, box-shadow .3s; }
.fs-seg.lg button { padding: 10px 20px; font-size: 15px; }
.fs-seg.sm button { padding: 6px 14px; font-size: 14px; white-space: nowrap; }
.fs-seg button.on { background: var(--seg-on); color: var(--ink); font-weight: 600; box-shadow: 0 1px 3px rgba(0,0,0,.1); }
.fs-seg button:focus-visible, .fs-choice:focus-visible, .fs-btn:focus-visible, .fs-link:focus-visible, .fs-x:focus-visible, .fs-choice-h:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.fs-note { margin: -4px 0 0; font-size: 13.5px; color: var(--ink2); min-height: 18px; }
.fs-note.err { color: #c0392b; font-weight: 600; }
:root[data-theme="dark"] .fs-note.err { color: #ff8a80; }
.fs-note-i { display: flex; gap: 10px; align-items: flex-start; line-height: 1.5; margin: 4px 0 0; }
.fs-note-i svg { flex-shrink: 0; color: var(--accent-text); margin-top: 1px; }
.fs-inline { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; font-size: 14px; color: var(--ink); }
/* výberové karty */
.fs-choices2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.fs-choices1 { display: flex; flex-direction: column; gap: 12px; }
.fs-choice { display: flex; gap: 12px; align-items: flex-start; padding: 16px; border-radius: 16px; font: inherit; color: var(--ink); text-align: left; cursor: pointer;
  background: color-mix(in srgb, var(--surface, #fff) 62%, transparent); border: 2px solid transparent; transition: border-color .3s var(--ease-out), background .3s, box-shadow .3s; }
.fs-choice:hover { border-color: color-mix(in srgb, var(--accent) 30%, transparent); }
.fs-choice.on { background: var(--surface, #fff); border-color: var(--accent); box-shadow: 0 12px 28px -18px color-mix(in srgb, var(--accent) 70%, transparent); }
:root[data-theme="dark"] .fs-choice { background: rgba(255,255,255,.04); } :root[data-theme="dark"] .fs-choice.on { background: rgba(255,255,255,.08); }
.fs-choice.big { flex-direction: column; gap: 14px; cursor: default; }
.fs-choice-h { display: flex; gap: 12px; align-items: center; border: none; background: transparent; font: inherit; color: inherit; padding: 0; cursor: pointer; text-align: left; font-size: 16px; }
.fs-choice-h b { font-weight: 650; }
.fs-radio { width: 20px; height: 20px; border-radius: 50%; flex-shrink: 0; box-sizing: border-box; border: 2px solid color-mix(in srgb, var(--ink) 28%, transparent); display: grid; place-items: center; margin-top: 1px; transition: border-color .25s; }
.fs-radio::after { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--accent-fill); transform: scale(0); transition: transform .3s var(--ease-out); }
.fs-choice.on .fs-radio, .fs-choice.big.on .fs-radio { border-color: var(--accent-fill); }
.fs-choice.on .fs-radio::after { transform: scale(1); }
.fs-ct { display: flex; flex-direction: column; gap: 3px; } .fs-ct b { font-size: 15px; font-weight: 650; } .fs-ct small { font-size: 13px; line-height: 1.4; color: var(--ink2); }
.fs-checks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 16px; padding-left: 32px; transition: opacity .3s; }
.fs-checks.off { opacity: .45; }
.fs-check { display: flex; align-items: center; gap: 10px; padding: 7px 0; cursor: pointer; font-size: 14.5px; }
.fs-check input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.fs-cbox { width: 20px; height: 20px; border-radius: 6px; box-sizing: border-box; border: 2px solid color-mix(in srgb, var(--ink) 28%, transparent); display: grid; place-items: center; color: transparent; flex-shrink: 0; transition: background .2s, border-color .2s, color .2s; }
.fs-check input:checked + .fs-cbox { background: var(--accent-fill); border-color: var(--accent-fill); color: var(--accent-fill-ink); }
.fs-check input:focus-visible + .fs-cbox { outline: 2px solid var(--accent); outline-offset: 2px; }
.fs-check input:not(:checked) ~ .fs-cname { color: var(--ink2); text-decoration: line-through; }
.fs-cdot { width: 9px; height: 9px; border-radius: 50%; flex-shrink: 0; }
/* tlačidlá */
.fs-foot { flex: 0 0 auto; height: 88px; box-sizing: border-box; padding: 0 clamp(20px, 3.4vw, 48px); padding-bottom: env(safe-area-inset-bottom, 0px);
  display: flex; align-items: center; justify-content: space-between; border-top: 1px solid var(--line); background: color-mix(in srgb, var(--surface, #fff) 40%, transparent);
  -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); }
.fs-foot[hidden] { display: none; }
.fs-foot-r { display: flex; align-items: center; gap: 12px; }
.fs-btn { height: 50px; padding: 0 22px; border-radius: 13px; font: inherit; font-size: 15px; font-weight: 600; display: inline-flex; align-items: center; justify-content: center; gap: 8px; cursor: pointer;
  transition: transform .15s var(--ease-out), filter .2s, opacity .2s, box-shadow .2s; }
.fs-btn:active { transform: scale(.97); }
.fs-btn.primary { border: none; background: var(--accent-fill); color: var(--accent-fill-ink); box-shadow: 0 12px 26px -14px color-mix(in srgb, var(--accent) 90%, transparent); padding: 0 26px; }
.fs-btn.primary:hover { filter: brightness(1.06); }
.fs-btn.primary:disabled { opacity: .45; cursor: not-allowed; box-shadow: none; filter: none; }
.fs-btn.ghost { border: 1px solid var(--chip-bd); background: var(--chip-bg); color: var(--ink); }
.fs-btn.lg { height: 54px; min-width: 260px; font-size: 16px; border-radius: 14px; margin-top: 8px; }
.fs-link { border: none; background: transparent; font: inherit; font-size: 14px; font-weight: 600; color: var(--ink2); padding: 10px; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; border-radius: 10px; }
.fs-link:hover { color: var(--ink); }
.fs-link.accent { color: var(--accent-text); }
/* hotovo */
.fs-done-ic { width: 80px; height: 80px; border-radius: 50%; background: #1e8e4e; color: #fff; display: grid; place-items: center; box-shadow: 0 20px 44px -18px rgba(30,142,78,.8); margin-bottom: 6px; }
.fs-done-ic svg { width: 38px; height: 38px; stroke-width: 2.2px; }
.fs-done { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 14px; }
.fs-summary { margin: 8px 0 8px; width: min(540px, 100%); box-sizing: border-box; border-radius: 20px; padding: 6px 22px; text-align: left;
  background: color-mix(in srgb, var(--surface, #fff) 78%, transparent); border: 1px solid var(--chip-bd); box-shadow: 0 30px 70px -40px rgba(30,40,90,.4); }
.fs-summary div { display: flex; justify-content: space-between; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.fs-summary div:last-child { border-bottom: none; }
.fs-summary dt { font-size: 14px; color: var(--ink2); } .fs-summary dd { margin: 0; font-size: 14.5px; font-weight: 600; text-align: right; }
/* náhľad vpravo */
.fs-preview { align-self: stretch; min-height: 480px; max-height: 620px; border-radius: 26px; background: color-mix(in srgb, var(--surface, #fff) 55%, transparent);
  border: 1px solid var(--panel-bd, rgba(255,255,255,.8)); box-shadow: 0 40px 90px -40px rgba(30,40,90,.35); padding: 28px; box-sizing: border-box; display: flex; flex-direction: column; gap: 16px; overflow: hidden; }
:root[data-theme="dark"] .fs-preview { background: rgba(255,255,255,.04); box-shadow: none; }
.fs-plabel { font-size: 12px; font-weight: 700; letter-spacing: .06em; color: var(--ink2); text-transform: uppercase; }
.fs-pbody { display: flex; flex-direction: column; gap: 16px; min-height: 0; }
.pv-hdr { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; } .pv-hdr b { font-size: 26px; letter-spacing: -0.03em; } .pv-hdr span { font-size: 14px; color: var(--ink2); } .pv-hdr span.ph { opacity: .6; font-style: italic; }
.pv-ghost { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.pv-ghost div { display: flex; flex-direction: column; gap: 8px; } .pv-ghost span { font-size: 12px; font-weight: 600; color: var(--ink2); text-align: center; }
.pv-ghost i { display: block; border-radius: 10px; background: color-mix(in srgb, var(--surface, #fff) 70%, transparent); height: 70px; }
.pv-ghost i:nth-of-type(2) { height: 44px; opacity: .7; } .pv-ghost i:nth-of-type(3) { height: 90px; opacity: .5; }
:root[data-theme="dark"] .pv-ghost i { background: rgba(255,255,255,.06); }
.tl-head { display: flex; flex-direction: column; gap: 4px; } .tl-head b { font-size: 22px; letter-spacing: -0.02em; } .tl-head span { font-size: 14px; color: var(--ink2); }
.tl-weeks { display: grid; gap: 5px; }
.tl-w { display: flex; flex-direction: column; align-items: center; gap: 6px; min-width: 0; }
.tl-w i { display: block; width: 100%; height: 56px; border-radius: 8px; background: color-mix(in srgb, var(--accent) 40%, transparent); transition: background .3s; }
.tl-w.alt i { background: color-mix(in srgb, var(--accent) 20%, transparent); }
.tl-w.cur i { background: var(--accent-fill); }
.tl-w span { font-size: 11px; color: var(--ink2); font-variant-numeric: tabular-nums; } .tl-w.cur span { color: var(--accent-text); font-weight: 700; }
.tl-months { display: flex; justify-content: space-between; font-size: 12.5px; color: var(--ink2); }
.tl-note { margin-top: 6px; display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; border-radius: 14px; background: color-mix(in srgb, var(--surface, #fff) 75%, transparent); font-size: 13.5px; line-height: 1.5; }
.tl-note svg { flex-shrink: 0; width: 30px; height: 30px; padding: 7px; box-sizing: border-box; border-radius: 10px; color: var(--accent-text); background: color-mix(in srgb, var(--accent) 15%, transparent); }
:root[data-theme="dark"] .tl-note { background: rgba(255,255,255,.05); }
.pv-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.pv-col { display: flex; flex-direction: column; gap: 8px; min-width: 0; } .pv-dn { font-size: 12px; font-weight: 600; color: var(--ink2); text-align: center; }
.pv-track { position: relative; border-radius: 12px; background: color-mix(in srgb, var(--surface, #fff) 45%, transparent); }
:root[data-theme="dark"] .pv-track { background: rgba(255,255,255,.04); }
.pv-blk { position: absolute; left: 4px; right: 4px; box-sizing: border-box; padding: 5px 7px; border-radius: 8px; background: var(--surface, #fff); border-top: 3px solid var(--c);
  box-shadow: 0 6px 14px -10px rgba(30,40,90,.4); display: flex; flex-direction: column; gap: 2px; overflow: hidden; animation: fsFade .4s var(--ease-out) both; }
:root[data-theme="dark"] .pv-blk { background: #33363e; }
.pv-blk b { font-size: 10px; color: var(--c); } .pv-blk span { font-size: 11px; font-weight: 600; line-height: 1.2; }
.pv-empty { margin: 0; font-size: 14px; color: var(--ink2); text-align: center; padding: 20px; }
.pv-list { display: flex; flex-direction: column; gap: 8px; }
.pv-row { display: flex; align-items: center; gap: 12px; padding: 11px 14px; border-radius: 13px; background: color-mix(in srgb, var(--surface, #fff) 85%, transparent); animation: fsFade .35s var(--ease-out) both; }
:root[data-theme="dark"] .pv-row { background: rgba(255,255,255,.06); }
.pv-row b { flex: 1; font-size: 14.5px; font-weight: 600; } .pv-row small { font-size: 12.5px; color: var(--ink2); }
.pv-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.pv-foot { margin: auto 0 0; font-size: 13px; color: var(--ink2); }
.pv-app { display: flex; flex-direction: column; gap: 18px; padding: 22px; border-radius: 20px; background: var(--amb); transition: background .4s; }
.pv-app-h { display: flex; align-items: center; justify-content: space-between; } .pv-app-h b { font-size: 24px; letter-spacing: -0.03em; }
.pv-app-btn { font-size: 13px; font-weight: 600; padding: 8px 14px; border-radius: 11px; background: var(--accent-fill); color: var(--accent-fill-ink); transition: background .4s; }
.pv-app-days { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); text-align: center; }
.pv-app-days div { display: flex; flex-direction: column; align-items: center; gap: 4px; } .pv-app-days b { font-size: 17px; width: 30px; height: 30px; display: grid; place-items: center; }
.pv-app-days span { font-size: 11px; letter-spacing: .08em; color: var(--ink2); text-transform: uppercase; }
.pv-app-days .t b { border-radius: 50%; background: var(--accent-fill); color: var(--accent-fill-ink); } .pv-app-days .t span { color: var(--accent-text); }
.pv-app-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.pv-app-card { display: flex; flex-direction: column; gap: 6px; padding: 12px; border-radius: 13px; min-height: 118px; box-sizing: border-box; background: var(--card-bg, rgba(255,255,255,.9));
  border: 1px solid var(--card-bd, transparent); box-shadow: 0 10px 22px -14px rgba(30,40,90,.35); }
.pv-app-card small { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--c); }
:root[data-theme="dark"] .pv-app-card small { color: var(--cl); } :root[data-theme="dark"] .pv-app-card { box-shadow: none; }
.pv-app-card b { font-size: 13.5px; } .pv-app-card span { margin-top: auto; font-size: 11px; color: var(--ink2); }
/* krok Rozvrh */
.ob-list { display: flex; flex-direction: column; gap: 8px; max-height: 44vh; overflow-y: auto; padding: 2px; }
.ob-row { display: flex; align-items: center; gap: 12px; padding: 10px 10px 10px 14px; border-radius: 14px; background: color-mix(in srgb, var(--surface, #fff) 85%, transparent);
  border: 1px solid var(--chip-bd); animation: fsFade .35s var(--ease-out) both; }
:root[data-theme="dark"] .ob-row { background: rgba(255,255,255,.05); }
.ob-dot { width: 12px; height: 12px; border-radius: 50%; flex-shrink: 0; }
.ob-rt { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; } .ob-rt b { font-size: 15px; font-weight: 600; } .ob-rt small { font-size: 13px; color: var(--ink2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.icon-mini { width: 36px; height: 36px; border: none; border-radius: 10px; background: transparent; color: var(--ink2); display: grid; place-items: center; cursor: pointer; flex-shrink: 0; transition: background .2s, color .2s; }
.icon-mini:hover { background: color-mix(in srgb, var(--ink) 7%, transparent); color: var(--ink); }
.icon-mini.danger:hover { color: #d6453d; background: rgba(214,69,61,.1); }
.icon-mini:disabled { opacity: .35; cursor: not-allowed; background: transparent !important; color: var(--ink2) !important; }
.icon-mini:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.ob-add { height: 52px; border-radius: 14px; border: 1.5px dashed color-mix(in srgb, var(--accent) 55%, transparent); background: color-mix(in srgb, var(--accent) 6%, transparent);
  color: var(--accent-text); font: inherit; font-size: 15px; font-weight: 600; display: flex; align-items: center; justify-content: center; gap: 8px; cursor: pointer; transition: background .2s; }
.ob-add:hover { background: color-mix(in srgb, var(--accent) 11%, transparent); }
.ob-add:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.ob-main .fs-link, .fs-main > .fs-link { align-self: flex-start; }
.ob-themes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.fs-choice.theme { align-items: center; } .fs-choice.theme b { font-size: 14.5px; font-weight: 600; }
.ob-sw { width: 30px; height: 30px; border-radius: 50%; flex-shrink: 0; box-shadow: inset 0 0 0 1px rgba(0,0,0,.1); }
@media (max-width: 1000px) {
  .fs-cols { grid-template-columns: minmax(0, 640px); } .fs-preview { display: none; }
  .fs-lbl { display: none; } .fs-line { width: 18px; }
}
@media (max-width: 760px) {
  .fs-top { grid-template-columns: auto 1fr auto; height: 64px; } .fs-brand span:last-child { display: none; }
  .fs-steps { justify-content: center; gap: 6px; } .fs-line { width: 10px; } .fs-dot { width: 24px; height: 24px; }
  .fs-grid2, .fs-choices2, .fs-checks { grid-template-columns: minmax(0, 1fr); } .fs-checks { padding-left: 0; }
  .ob-themes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fs-foot { height: auto; padding-top: 12px; padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px)); }
  .fs-btn { padding: 0 16px; } .fs-btn.primary { padding: 0 20px; } .fs-foot-r .fs-btn.ghost { display: none; }
  .fs-btn.lg { min-width: 0; width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .fs.fs-show, .fs.fs-out, .fs-in-r, .fs-in-l, .fs-in-up, .fs-fade, .pv-blk, .pv-row, .ob-row { animation: none !important; }
  .fs-radio::after, .fs-seg button, .fs-choice, .fs-dot { transition: none !important; }
}

/* =========================================================================
   SEMESTRE – prepínač v hlavičke, pás nad rozvrhom, správa
   ========================================================================= */
.title-block .sub { display: none; }
.sem-btn { display: inline-flex; align-items: center; gap: 7px; height: 32px; padding: 0 10px 0 12px; border-radius: 10px; border: 1px solid var(--chip-bd); background: var(--chip-bg);
  font: inherit; font-size: 13.5px; font-weight: 600; color: var(--ink); cursor: pointer; white-space: nowrap; max-width: 320px; align-self: center;
  transition: border-color .2s, box-shadow .2s; }
.sem-btn:hover, .sem-btn.open { border-color: color-mix(in srgb, var(--accent) 40%, var(--chip-bd)); }
.sem-btn.open { box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 16%, transparent); }
.sem-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.sem-btn .sem-name { overflow: hidden; text-overflow: ellipsis; }
.sem-btn svg { flex-shrink: 0; color: var(--ink2); }
.sem-tag { font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 999px; white-space: nowrap; flex-shrink: 0; }
.sem-tag.cur { background: var(--accent-fill); color: var(--accent-fill-ink); }
.sem-tag.draft { background: rgba(201,154,6,.18); color: #7a5c00; }
.sem-tag.arch { background: color-mix(in srgb, var(--ink) 10%, transparent); color: var(--ink2); }
:root[data-theme="dark"] .sem-tag.draft { color: #f0c955; }
.sem-dot { width: 9px; height: 9px; border-radius: 50%; flex-shrink: 0; }
.sem-dot.cur { background: var(--accent-fill); } .sem-dot.draft { background: #c99a06; } .sem-dot.arch { background: color-mix(in srgb, var(--ink) 30%, transparent); }
.sem-pop { width: 350px; padding: 8px; }
.sem-pop-h { font-size: 12.5px; color: var(--ink2); padding: 6px 10px 2px; }
.sem-pop-l { font-size: 11.5px; font-weight: 650; color: var(--ink2); padding: 8px 10px 4px; }
.sem-item { display: flex; align-items: center; gap: 12px; width: 100%; border: none; background: transparent; font: inherit; color: var(--ink); padding: 10px; border-radius: 11px; cursor: pointer; text-align: left; }
.sem-item:hover { background: color-mix(in srgb, var(--ink) 6%, transparent); }
.sem-item.on { background: color-mix(in srgb, var(--accent) 12%, transparent); }
.sem-it { display: flex; flex-direction: column; gap: 1px; flex: 1; min-width: 0; } .sem-it b { font-size: 14px; font-weight: 600; } .sem-it small { font-size: 12px; color: var(--ink2); }
.sem-pop-sep { height: 1px; background: var(--line); margin: 6px 4px; }
.sem-act { display: flex; align-items: center; gap: 10px; width: 100%; border: none; background: transparent; font: inherit; font-size: 14px; color: var(--ink); padding: 10px; border-radius: 10px; cursor: pointer; text-align: left; }
.sem-act:hover { background: color-mix(in srgb, var(--ink) 6%, transparent); }
.sem-act.accent { color: var(--accent-text); font-weight: 600; }
.sem-item:focus-visible, .sem-act:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
/* pás nad rozvrhom */
.sem-bar { display: flex; align-items: center; gap: 14px; margin: 0 0 16px; padding: 12px 14px 12px 18px; border-radius: 16px; font-size: 14px; animation: fsUp .45s var(--ease-out) both; }
.sem-bar[hidden] { display: none; }
.sem-bar > svg { flex-shrink: 0; }
.sem-bar .sb-text { flex: 1; min-width: 0; line-height: 1.45; } .sem-bar .sb-text b { font-weight: 650; }
.sem-bar .sb-sub { display: block; font-size: 13.5px; color: var(--ink2); }
.sem-bar .sb-ico { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; flex-shrink: 0; background: color-mix(in srgb, var(--accent) 16%, transparent); color: var(--accent-text); }
.sb-btn { height: 38px; padding: 0 16px; border-radius: 11px; font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; white-space: nowrap; border: 1px solid transparent; transition: filter .2s, transform .15s; }
.sb-btn:active { transform: scale(.97); }
.sb-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.sem-bar.remind { background: var(--chip-bg); border: 1px solid var(--chip-bd); box-shadow: 0 12px 30px -22px rgba(30,40,90,.35); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
.sem-bar.remind .sb-btn.primary { background: var(--accent-fill); color: var(--accent-fill-ink); }
.sem-bar.remind .sb-btn.primary:hover { filter: brightness(1.06); }
.sem-bar.remind .sb-btn.ghost { background: transparent; color: var(--ink2); }
.sem-bar.draft { background: rgba(253,246,223,.95); border: 1px solid rgba(201,154,6,.3); color: #4d3b00; }
.sem-bar.draft > svg { color: #8a6700; }
.sem-bar.draft .sb-btn { background: rgba(255,255,255,.8); border-color: rgba(138,103,0,.25); color: #4d3b00; }
:root[data-theme="dark"] .sem-bar.draft { background: rgba(201,154,6,.14); border-color: rgba(240,201,85,.25); color: #f3dd9a; }
:root[data-theme="dark"] .sem-bar.draft > svg { color: #f0c955; }
:root[data-theme="dark"] .sem-bar.draft .sb-btn { background: rgba(255,255,255,.08); border-color: rgba(240,201,85,.25); color: #f3dd9a; }
.sem-bar.arch { background: color-mix(in srgb, var(--ink) 6%, transparent); border: 1px solid var(--line); color: var(--ink); }
.sem-bar.arch > svg { color: var(--ink2); }
.sem-bar.arch .sb-btn { background: var(--chip-bg); border-color: var(--chip-bd); color: var(--ink); }
@media (max-width: 760px) {
  .sem-bar { flex-wrap: wrap; gap: 10px; padding: 12px 14px; } .sem-bar .sb-text { flex-basis: calc(100% - 60px); } .sem-bar .sb-btn { flex: 1; }
  .sem-btn { max-width: 190px; font-size: 12.5px; height: 30px; }
  header.app .title-block { align-items: center; }
}
/* správa semestrov */
.sm-modal { width: 600px; }
.sm-list { display: flex; flex-direction: column; gap: 8px; }
.sm-row { display: flex; align-items: center; gap: 12px; padding: 12px 10px 12px 14px; border-radius: 14px; border: 1px solid var(--line); background: color-mix(in srgb, var(--surface, #fff) 60%, transparent); }
.sm-row.active { border-color: color-mix(in srgb, var(--accent) 45%, var(--line)); }
.sm-row.editing { flex-direction: column; align-items: stretch; gap: 14px; padding: 16px; }
.sm-main { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; } .sm-main b { font-size: 14.5px; font-weight: 600; } .sm-main small { font-size: 12.5px; color: var(--ink2); }
.sm-edit { display: flex; flex-direction: column; gap: 14px; }
.sm-edit .fs-field input, .sm-edit .fs-field select { height: 42px; font-size: 15px; border-radius: 11px; }
.sm-edit .fs-seg { height: 42px; } .sm-edit .fs-seg button { font-size: 14px; }
.sm-edit .fs-choice { padding: 12px; } .sm-edit .fs-ct b { font-size: 14px; }
.sm-edit-foot { display: flex; justify-content: flex-end; gap: 10px; }
.set-btns { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
/* formulár: popis predmetu */
#formModal textarea { width: 100%; box-sizing: border-box; min-height: 76px; resize: vertical; font: inherit; font-size: 14px; line-height: 1.45; padding: 10px 12px; border-radius: 10px;
  border: 1px solid var(--line-strong, var(--line)); background: var(--surface); color: var(--ink); }
#formModal textarea:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 16%, transparent); }
#formModal .f-hint { margin: 6px 0 0; }
@media (max-width: 760px) { .fs-count { display: none; } }

/* =========================================================================
   UPRATANÁ HLAVIČKA – tichý semester, menu „⋯“, kompaktný čip, riadok týždňa
   ========================================================================= */
.sem-btn { border-color: transparent; background: transparent; color: var(--ink2); font-weight: 500; font-size: 15px; height: 34px; padding: 0 8px; gap: 5px;
  -webkit-backdrop-filter: none; backdrop-filter: none; }
.sem-btn:hover, .sem-btn.open { background: color-mix(in srgb, var(--ink) 8%, transparent); border-color: transparent; color: var(--ink); box-shadow: none; }
.sem-btn .sem-tag { margin-left: 2px; }
#menuBtn.open { box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 20%, transparent); }
/* menu */
.app-menu { width: 336px; padding: 8px; display: flex; flex-direction: column; max-height: calc(100vh - 100px); overflow-y: auto; }
.am-head { font-size: 12.5px; color: var(--ink2); padding: 6px 10px 2px; }
.am-label { font-size: 11.5px; font-weight: 650; color: var(--ink2); padding: 8px 10px 4px; }
.am-row2 { display: flex; gap: 2px; padding: 2px 2px 0; }
.am-link { display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 10px; border: none; border-radius: 9px; background: transparent; font: inherit; font-size: 13.5px; color: var(--ink); cursor: pointer; }
.am-link.accent { color: var(--accent-text); font-weight: 600; }
.am-link:hover, .am-item:hover { background: color-mix(in srgb, var(--ink) 7%, transparent); }
.am-sep { height: 1px; background: var(--line); margin: 6px 4px; }
.am-sws { display: flex; gap: 10px; padding: 4px 10px 8px; }
.am-sw { width: 34px; height: 34px; border-radius: 50%; border: none; padding: 0; cursor: pointer; background: linear-gradient(135deg, var(--bg) 0 50%, var(--sw) 50% 100%);
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.1); transition: transform .15s var(--ease-out), box-shadow .25s var(--ease-out); }
.am-sw:hover { transform: scale(1.08); }
.am-sw.on { box-shadow: inset 0 0 0 1px rgba(0,0,0,.1), 0 0 0 2px var(--surface, #fff), 0 0 0 4px var(--sw); }
:root[data-theme="dark"] .am-sw.on { box-shadow: inset 0 0 0 1px rgba(0,0,0,.1), 0 0 0 2px #2c2f36, 0 0 0 4px var(--sw); }
.am-item { display: flex; align-items: center; gap: 12px; width: 100%; height: 42px; padding: 0 10px; border: none; border-radius: 10px; background: transparent; font: inherit; font-size: 14px; color: var(--ink); cursor: pointer; text-align: left; }
.am-item svg { color: var(--ink2); flex-shrink: 0; }
.am-link:focus-visible, .am-item:focus-visible, .am-sw:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
/* riadok týždňa */
#todayBtn[hidden], #weekRel[hidden], .week-par[hidden] { display: none !important; }
.week-par { font-size: 11.5px; font-weight: 600; padding: 2px 8px; border-radius: 999px; background: var(--seg-bg, rgba(118,118,128,.12)); color: var(--ink2); white-space: nowrap; }
/* kompaktný čip + bublinka „Ďalej“ */
.nowchip { position: relative; overflow: visible; }
.nowchip .nc-main { min-width: 0; flex: 0 1 auto; }
.nowchip .nc-name { max-width: 200px; }
.nowchip .nc-prog { width: 64px; align-items: flex-end; }
.nc-tip { position: absolute; right: 0; top: calc(100% + 8px); min-width: 100%; box-sizing: border-box; padding: 10px 14px; border-radius: 12px; z-index: 20; text-align: left;
  background: var(--zs-pop, rgba(250,251,254,.98)); border: 1px solid var(--line); box-shadow: 0 18px 40px -18px rgba(20,30,60,.4);
  display: flex; flex-direction: column; gap: 2px; opacity: 0; transform: translateY(-4px); pointer-events: none; transition: opacity .2s, transform .25s var(--ease-out); }
.nowchip:hover .nc-tip, .nowchip:focus-visible .nc-tip { opacity: 1; transform: none; }
.nc-tip .nc-name2 { max-width: none; font-size: 13.5px; }
@media (max-width: 960px) { .nowchip .nc-prog { display: none; } }
@media (prefers-reduced-motion: reduce) { .nc-tip, .am-sw { transition: none; } }
.nowchip .nc-bar { width: 100%; align-self: stretch; }
.app-menu { width: 360px; }
.app-menu .sem-it b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nc-tip { background: var(--surface, #fff); }
:root[data-theme="dark"] .nc-tip { background: #2c2f36; }
header.app { position: relative; z-index: 30; }

/* =========================================================================
   TESTOVACIA VERZIA – spätná väzba, aktualizácia, o appke
   ========================================================================= */
.am-foot { font-size: 11.5px; color: var(--ink2); padding: 8px 10px 4px; font-variant-numeric: tabular-nums; }
.fb-body { display: flex; flex-direction: column; gap: 10px; }
.fb-intro { margin: 0; font-size: 14px; line-height: 1.5; color: var(--ink2); }
.fb-seg { height: auto; align-self: flex-start; }
.fb-label { font-size: 13px; font-weight: 600; color: var(--ink); margin-top: 4px; }
#fbText { width: 100%; box-sizing: border-box; min-height: 110px; resize: vertical; font: inherit; font-size: 14px; line-height: 1.5; padding: 10px 12px; border-radius: 10px;
  border: 1px solid var(--line-strong, var(--line)); background: var(--surface); color: var(--ink); }
#fbText:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 16%, transparent); }
.fb-check { display: flex; gap: 10px; align-items: flex-start; font-size: 13px; line-height: 1.45; color: var(--ink); cursor: pointer; }
.fb-check input { margin-top: 2px; accent-color: var(--accent-fill); width: 16px; height: 16px; flex-shrink: 0; }
.fb-body .fs-link { align-self: flex-start; padding: 4px 0; font-size: 13px; }
.fb-pre { margin: 0; max-height: 180px; overflow: auto; font: 11.5px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; white-space: pre-wrap; word-break: break-word;
  padding: 10px 12px; border-radius: 10px; background: color-mix(in srgb, var(--ink) 5%, transparent); color: var(--ink2); }
.fb-pre[hidden] { display: none; }
.inst-steps { margin: 0 0 12px; padding-left: 22px; display: flex; flex-direction: column; gap: 8px; font-size: 14.5px; line-height: 1.45; }
.fs-privacy { display: flex; align-items: center; gap: 7px; margin: 18px 0 0; font-size: 13px; color: var(--ink2); }
.about-v { margin: 6px 0 2px; font-size: 14px; font-weight: 600; font-variant-numeric: tabular-nums; }
.about-box a.btn { text-decoration: none; display: inline-flex; align-items: center; }
.upd-card { position: fixed; right: 20px; bottom: 20px; z-index: 96; display: flex; align-items: center; gap: 14px; padding: 12px 12px 12px 16px; border-radius: 16px;
  background: var(--zs-pop, rgba(250,251,254,.98)); border: 1px solid var(--line); box-shadow: 0 24px 50px -18px rgba(20,30,60,.45); color: var(--ink);
  transform: translateY(calc(100% + 40px)); opacity: 0; transition: transform .45s var(--ease-out), opacity .3s; max-width: calc(100vw - 40px); box-sizing: border-box; }
.upd-card.show { transform: none; opacity: 1; }
.upd-t { display: flex; flex-direction: column; gap: 2px; font-size: 13px; color: var(--ink2); } .upd-t b { font-size: 14px; color: var(--ink); }
@media (max-width: 760px) { .upd-card { left: 12px; right: 12px; bottom: calc(92px + env(safe-area-inset-bottom, 0px)); } }
@media (prefers-reduced-motion: reduce) { .upd-card { transition: none; } }
/* kartičky podľa výšky: kompaktná (50 min) a jednoriadková (krátke hodiny) */
.gcard.compact .gc-name { font-size: 13.5px; }
.gcard.compact .gc-meta { font-size: 11px; }
.gcard.mini { padding: 5px 10px; justify-content: center; gap: 0; }
.gcard.mini .gc-top { gap: 7px; min-width: 0; }
.gcard.mini .gc-icn { width: 16px; height: 16px; border-radius: 5px; flex-shrink: 0; }
.gcard.mini .gc-icn svg { width: 10px; height: 10px; }
.gcard.mini .gc-name { font-size: 12.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; flex: 1; min-width: 0; }
.gcard.mini .gc-time { font-size: 11px; color: var(--ink2); white-space: nowrap; font-variant-numeric: tabular-nums; flex-shrink: 0; }
.gcard.mini .gbadge { display: none; }
.app-menu.sem-only { width: 340px; }

/* =========================================================================
   PÍSANIE PEROM V ZOŠITE
   ========================================================================= */
.zs-pages { position: relative; }
.zs-ink { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 2; pointer-events: none; overflow: visible; }
.zs-ink .hl { mix-blend-mode: multiply; }
:root[data-theme="dark"] .zs-ink .hl { mix-blend-mode: normal; }
.zs-pages.ink-on .zs-ink { pointer-events: auto; touch-action: none; cursor: crosshair; }
.zs-pages.ink-on .zs-paper { -webkit-user-select: none; user-select: none; }
.zs-pages.ink-on .zs-sheet { box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 30%, transparent), 0 18px 44px -22px rgba(20,30,60,.32); }
#zsPenBtn.on { background: var(--accent-fill); border-color: var(--accent-fill); color: var(--accent-fill-ink); }
/* panel pera */
.zs-pentb { flex-wrap: nowrap; gap: 2px; padding: 5px 8px; border-radius: 16px; overflow-x: auto; scrollbar-width: none; }
.zs-pentb::-webkit-scrollbar { display: none; }
.zs-pentb[hidden] { display: none !important; }
.zs-pentb.pt-in { animation: fsUp .32s var(--ease-out) both; }
.pt-group { display: flex; align-items: center; gap: 2px; }
.pt-sep { width: 1px; height: 28px; background: var(--line); margin: 0 5px; flex-shrink: 0; }
.pt-tool { width: 48px; height: 48px; border: none; border-radius: 12px; background: transparent; color: var(--ink); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; cursor: pointer; flex-shrink: 0;
  transition: background .2s, transform .15s var(--ease-out); }
.pt-tool:hover { background: color-mix(in srgb, var(--ink) 7%, transparent); }
.pt-tool.on { background: color-mix(in srgb, var(--accent) 16%, transparent); }
.pt-tool:active, .pt-sw:active, .pt-ic:active { transform: scale(.93); }
.pt-bar { width: 20px; height: 4px; border-radius: 2px; }
.pt-sw { width: 30px; height: 30px; margin: 0 3px; border-radius: 50%; border: none; padding: 0; cursor: pointer; flex-shrink: 0; background: var(--c);
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.14); transition: transform .15s var(--ease-out), box-shadow .2s; }
.pt-sw.on { box-shadow: inset 0 0 0 1px rgba(0,0,0,.14), 0 0 0 2px var(--surface, #fff), 0 0 0 4px var(--c); }
:root[data-theme="dark"] .pt-sw.on { box-shadow: inset 0 0 0 1px rgba(0,0,0,.14), 0 0 0 2px #2c2f36, 0 0 0 4px var(--c); }
.pt-colbtn { display: none; width: 34px; height: 34px; border-radius: 50%; border: 3px solid var(--surface, #fff); background: var(--c); box-shadow: 0 0 0 1px var(--line); cursor: pointer; flex-shrink: 0; }
.pt-size { height: 44px; padding: 0 10px; border: none; border-radius: 11px; background: transparent; display: flex; align-items: center; gap: 8px; cursor: pointer; color: var(--ink); flex-shrink: 0; min-width: 64px; }
.pt-size:hover, .pt-size.open { background: color-mix(in srgb, var(--ink) 7%, transparent); }
.pt-dot { border-radius: 50%; display: block; flex-shrink: 0; }
.pt-num { font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums; }
.pt-ic { width: 44px; height: 44px; border: none; border-radius: 11px; background: transparent; color: var(--ink); display: grid; place-items: center; cursor: pointer; flex-shrink: 0; }
.pt-ic:hover { background: color-mix(in srgb, var(--ink) 7%, transparent); }
.pt-ic:disabled { opacity: .3; cursor: default; background: transparent; }
.pt-done { height: 44px; padding: 0 16px; margin-left: 4px; border: none; border-radius: 11px; background: var(--accent-fill); color: var(--accent-fill-ink); font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; flex-shrink: 0; }
.pt-tool:focus-visible, .pt-sw:focus-visible, .pt-size:focus-visible, .pt-ic:focus-visible, .pt-done:focus-visible, .pt-colbtn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
/* úzky panel (split, mobil): farby v okienku */
.zs-work.split .zs-pentb .pt-cols { display: none; } .zs-work.split .zs-pentb .pt-colbtn { display: block; }
@media (max-width: 760px) { .zs-pentb .pt-cols { display: none; } .zs-pentb .pt-colbtn { display: block; } .pt-tool { width: 44px; } }
/* okienka */
.pt-pop { padding: 12px; }
.pt-popcols { display: grid; grid-template-columns: repeat(3, 38px); gap: 10px; padding: 4px; }
.pt-sizepop { width: 300px; display: flex; flex-direction: column; gap: 12px; padding: 16px; }
.pt-ph { display: flex; justify-content: space-between; align-items: baseline; font-size: 13.5px; } .pt-ph span { color: var(--ink2); font-variant-numeric: tabular-nums; }
.pt-prev { width: 100%; height: 44px; }
.pt-sizepop input[type=range] { width: 100%; accent-color: var(--accent-fill); height: 28px; }
.pt-presets { display: flex; gap: 8px; }
.pt-presets button { flex: 1; height: 44px; border-radius: 11px; border: 1px solid var(--line); background: var(--surface, #fff); display: grid; place-items: center; cursor: pointer; }
.pt-presets button.on { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, transparent); }
.pt-presets span { display: block; border-radius: 50%; }
.pt-psep { height: 1px; background: var(--line); }
.pt-opt { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 40px; border: none; background: transparent; font: inherit; font-size: 13.5px; color: var(--ink); cursor: pointer; text-align: left; padding: 0; }
.pt-switch { width: 44px; height: 26px; border-radius: 999px; background: color-mix(in srgb, var(--ink) 18%, transparent); position: relative; flex-shrink: 0; transition: background .25s; }
.pt-switch i { position: absolute; left: 2px; top: 2px; width: 22px; height: 22px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.25); transition: transform .3s var(--ease-out); }
.pt-switch.on { background: #34c759; } .pt-switch.on i { transform: translateX(18px); }
.pt-opt:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 8px; }
.pt-hint { margin: 0; font-size: 12px; line-height: 1.45; color: var(--ink2); }
@media (prefers-reduced-motion: reduce) { .zs-pentb.pt-in { animation: none; } .pt-switch, .pt-switch i, .pt-tool, .pt-sw { transition: none; } }
@media print { .zs-ink { position: absolute; } }
.zs-toolbar[hidden] { display: none !important; }
/* pero: prst posúva natívne (pan-y), inak dotyk patrí kresleniu; žiadne menu ani výber pri dlhom ťahu */
.zs-pages.ink-on .zs-ink { touch-action: none; -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; -webkit-tap-highlight-color: transparent; }
.zs-pages.ink-on.ink-finger .zs-ink { touch-action: pan-y; }
.zs-pages.ink-on { -webkit-touch-callout: none; }

/* =========================================================================
   HOURLEAF – značka (tokeny z brand balíka zjednotené s premennými appky)
   Logo a ikona sú vždy v Hour Blue, témy menia len akcent rozhrania.
   ========================================================================= */
:root {
  --hl-blue:#0A84FF; --hl-blue-deep:#0071EA; --hl-blue-ink:#0062CC;
  --hl-icon-from:#2B95FF; --hl-icon-to:#006CE0;
  --hl-font-serif:"EB Garamond", Garamond, Georgia, "Times New Roman", serif;
  --hl-radius-icon:22.5%;
  /* slovné logo: „hour“ = farba textu appky, „leaf“ = Ink Blue (na tmavom svetlejšia modrá kvôli kontrastu) */
  --hl-word-ink:var(--ink); --hl-word-em:var(--hl-blue-ink);
}

.hl-wordmark { font-family:inherit; font-weight:700; letter-spacing:-0.05em; line-height:1; color:var(--hl-word-ink); white-space:nowrap; }
.hl-wordmark em { font-family:var(--hl-font-serif); font-style:italic; font-weight:500; font-size:1.12em; letter-spacing:-0.02em; color:var(--hl-word-em); }
.hl-icon { display:block; flex-shrink:0; }
/* akcentová kurzíva (nadpisy typu „Vitaj! *Toto je Hourleaf.*“) */
.hl-em { font-family:var(--hl-font-serif); font-style:italic; font-weight:500; font-size:1.12em; letter-spacing:-0.02em; color:var(--hl-word-em); }

/* hlavička appky: ikona + slovné logo, vedľa tichý prepínač semestra */
.title-block h1.brand { display:flex; align-items:center; gap:10px; font-size:24px; line-height:1; letter-spacing:0; color:var(--ink); margin:0; }
.title-block h1.brand .brand-ic { width:32px; height:32px; display:block; flex-shrink:0; border-radius:var(--hl-radius-icon); }
.title-block h1.brand .hl-wordmark { padding-bottom:1px; }
header.app .title-block { align-items:center; }
@media (max-width: 760px) {
  .title-block h1.brand { font-size:21px; gap:9px; }
  .title-block h1.brand .brand-ic, .title-block h1.brand .brand-ic svg { width:30px; height:30px; }
}
@media (max-width: 380px) { .title-block h1.brand .hl-wordmark { display:none; } }

/* celoobrazovkové okná (sprievodca, nový semester): malé logo vľavo hore */
.fs-logo.hl { background:none; border-radius:var(--hl-radius-icon); width:32px; height:32px; box-shadow:none; }
.fs-logo.hl svg { width:32px; height:32px; }
.fs-brand .hl-wordmark { font-size:20px; }
.fs-logo.hl.big { width:104px; height:104px; margin-bottom:10px; box-shadow:0 18px 40px -16px color-mix(in srgb, var(--hl-icon-to) 60%, transparent); }
.fs-logo.hl.big svg { width:104px; height:104px; }
.fs-title .hl-em { display:inline-block; }
@media (max-width: 760px) { .fs-logo.hl.big, .fs-logo.hl.big svg { width:84px; height:84px; } }

/* menu „⋯“ – pätička s logom a verziou */
.am-foot { display:flex; align-items:center; gap:8px; }
.am-foot .hl-icon { width:18px; height:18px; }
.am-foot b { font-weight:600; color:var(--ink); }

/* nastavenia – O appke */
.about-card { display:flex; gap:16px; align-items:center; padding:16px 18px; margin:8px 0 10px; border-radius:16px;
  background:color-mix(in srgb, var(--hl-icon-to) 7%, transparent); border:1px solid color-mix(in srgb, var(--hl-icon-to) 18%, transparent); }
.about-card .hl-icon { width:60px; height:60px; }
.about-card .ac-txt { display:flex; flex-direction:column; gap:6px; min-width:0; }
.about-card .hl-wordmark { font-size:26px; }
.about-card .ac-slogan { font-family:var(--hl-font-serif); font-style:italic; font-weight:500; font-size:19px; line-height:1.15; color:var(--ink2); }
.about-card .ac-ver { font-size:12.5px; color:var(--ink2); font-variant-numeric:tabular-nums; }
/* náhľady v sprievodcovi – mini logo */
.pv-brand { display:inline-flex; align-items:center; gap:8px; }
.pv-hdr .pv-brand .hl-wordmark { font-size:24px; }
.pv-app-h .pv-brand { gap:6px; } .pv-app-h .pv-brand .hl-wordmark { font-size:inherit; }

/* =========================================================================
   CELÁ ŠÍRKA – hlavička, rozvrh aj zošity siahajú až k okrajom obrazovky
   ========================================================================= */
.wrap { max-width: none; padding-left: clamp(16px, 2.4vw, 44px); padding-right: clamp(16px, 2.4vw, 44px); }

/* =========================================================================
   ÚLOHY (to-do) – panel vedľa rozvrhu, vysúvací panel, sekcia na telefóne
   ========================================================================= */
:root { --td-w: 340px; --td-field: rgba(255,255,255,.92); --td-hover: rgba(118,118,128,.08); --td-warn: #9a5a00; --td-warn-bg: rgba(255,170,40,.10); --td-warn-bd: rgba(220,140,20,.24); }
:root[data-theme="dark"] { --td-field: rgba(255,255,255,.07); --td-hover: rgba(255,255,255,.06); --td-warn: #f0b45a; --td-warn-bg: rgba(240,160,40,.10); --td-warn-bd: rgba(240,160,40,.22); }
.td-side { display: none; }
#todosView[hidden] { display: none; }

@media (min-width: 761px) {
  body.td-pinned .week-main, body.td-rail .week-main { display: grid; grid-template-areas: ". c" "s g"; align-items: stretch; }
  body.td-pinned .week-main { grid-template-columns: var(--td-w) minmax(0, 1fr); column-gap: 20px; }
  body.td-rail .week-main { grid-template-columns: 46px minmax(0, 1fr); column-gap: 14px; }
  body.td-pinned .week-center, body.td-rail .week-center { grid-area: c; }
  body.td-pinned #grid, body.td-rail #grid { grid-area: g; min-width: 0; }
  body.td-pinned .td-side, body.td-rail .td-side { display: block; grid-area: s; position: relative; min-height: 0; }
  /* panel má presne výšku rozvrhu: vlastný obsah neťahá riadok, roluje sa vo vnútri */
  body.td-pinned .td-side > .td-panel { position: absolute; inset: 0; }
}
@media (min-width: 761px) and (max-width: 1599px) { :root { --td-w: 300px; } }

.td-panel { box-sizing: border-box; display: flex; flex-direction: column; gap: 12px; padding: 16px 12px 12px; border-radius: 20px; color: var(--ink);
  background: var(--panel-bg); border: 1px solid var(--panel-bd); -webkit-backdrop-filter: blur(30px) saturate(1.5); backdrop-filter: blur(30px) saturate(1.5);
  box-shadow: 0 1px 2px rgba(30,40,90,.04), 0 30px 70px -34px rgba(30,40,90,.4), inset 0 1px 0 rgba(255,255,255,.5); overflow: hidden; }
.td-head { display: flex; align-items: center; gap: 8px; padding: 0 4px; }
.td-title { margin: 0; flex: 1; font-size: 20px; font-weight: 700; letter-spacing: -0.02em; }
.td-ib { width: 32px; height: 32px; flex-shrink: 0; border: none; border-radius: 9px; background: color-mix(in srgb, var(--ink) 7%, transparent); color: var(--ink); display: grid; place-items: center; cursor: pointer; font: inherit; transition: background .2s; }
.td-ib:hover { background: color-mix(in srgb, var(--ink) 12%, transparent); }
.td-ib.wide { width: auto; padding: 0 10px; display: flex; gap: 6px; font-size: 12.5px; font-weight: 600; }
.td-ib.round { border-radius: 50%; }
.td-ib:focus-visible, .td-seg button:focus-visible, .td-pick:focus-visible, .td-box:focus-visible, .td-txt:focus-visible, .td-railbtn:focus-visible, .td-sum:focus-visible, .dh-td:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.td-seg { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 3px; gap: 3px; border-radius: 11px; background: var(--seg-bg); }
.td-seg button { height: 30px; border: none; border-radius: 8px; background: transparent; font: inherit; font-size: 13px; font-weight: 500; color: var(--ink2); cursor: pointer; transition: background .25s, color .25s, box-shadow .25s; }
.td-seg button.on { background: var(--seg-on); color: var(--ink); font-weight: 600; box-shadow: 0 1px 3px rgba(30,40,90,.14); }
.td-nav { display: flex; align-items: center; gap: 6px; }
.td-nav .td-ib { background: transparent; }
.td-nav .td-ib:hover { background: color-mix(in srgb, var(--ink) 7%, transparent); }
.td-navl { flex: 1; min-width: 0; text-align: center; font-size: 14px; font-weight: 650; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-variant-numeric: tabular-nums; }
.td-navl em { font-style: normal; font-weight: 500; color: var(--accent-text); }
.td-today { height: 26px; padding: 0 9px; border-radius: 8px; border: 1px solid var(--chip-bd); background: var(--chip-bg); font: inherit; font-size: 12px; font-weight: 600; color: var(--accent-text); cursor: pointer; }

.td-add { padding: 10px; border-radius: 14px; background: var(--td-field); border: 1px solid var(--line); display: flex; flex-direction: column; gap: 9px; transition: border-color .2s, box-shadow .2s; }
.td-add:focus-within { border-color: color-mix(in srgb, var(--accent) 45%, transparent); box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 12%, transparent); }
.td-add-row { display: flex; align-items: center; gap: 6px; }
.td-add-l { flex: 1; min-width: 0; display: flex; align-items: center; gap: 9px; color: var(--accent-text); cursor: text; }
.td-calbtn { width: 30px; height: 30px; border-radius: 8px; border: none; background: transparent; color: var(--ink2); display: grid; place-items: center; cursor: pointer; }
.td-calbtn:hover, .td-calbtn.on { background: color-mix(in srgb, var(--accent) 12%, transparent); color: var(--accent-text); }
.td-calbtn:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.td-input { flex: 1; min-width: 0; border: none; outline: none; background: transparent; font: inherit; font-size: 14px; color: var(--ink); }
.td-input::placeholder { color: var(--ink3); }
.td-picks { display: flex; flex-wrap: wrap; gap: 5px; }
.td-pick { height: 28px; padding: 0 9px; border-radius: 8px; border: 1px solid var(--chip-bd); background: var(--chip-bg); font: inherit; font-size: 12.5px; color: var(--ink); cursor: pointer; display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; transition: background .2s, color .2s, border-color .2s; }
.td-pick:hover { border-color: color-mix(in srgb, var(--accent) 40%, var(--chip-bd)); }
.td-pick.on { background: var(--accent-fill); color: var(--accent-fill-ink); border-color: transparent; font-weight: 600; }
.td-datewrap { position: relative; display: inline-flex; }
.td-date { position: absolute; left: 0; bottom: 0; width: 1px; height: 1px; opacity: 0; pointer-events: none; border: 0; padding: 0; }

.td-scroll { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; display: flex; flex-direction: column; gap: 12px; margin: 0 -4px; padding: 2px 4px 6px; scrollbar-width: thin; }
.td-scroll > * { flex-shrink: 0; }
.td-sec { display: flex; flex-direction: column; gap: 2px; }
.td-lbl { margin: 0 0 2px; padding: 0 8px; font-size: 11.5px; font-weight: 650; color: var(--ink2); letter-spacing: .01em; }
.td-over .td-lbl { color: var(--td-warn); }
.td-list { display: flex; flex-direction: column; border-radius: 12px; transition: box-shadow .15s; }
.td-list.drop-end { box-shadow: inset 0 -2px 0 var(--accent); }
.td-empty p, .td-empty-w { margin: 0; padding: 10px 8px; font-size: 13px; color: var(--ink3); line-height: 1.45; }
.td-item { display: flex; align-items: flex-start; gap: 10px; padding: 8px 8px; border-radius: 11px; position: relative; transition: background .15s; }
.td-item:hover { background: var(--td-hover); }
.td-item[draggable="true"] { cursor: grab; }
.td-item.dragging { opacity: .4; }
.td-item.drop-before { box-shadow: inset 0 2px 0 var(--accent); }
.td-item.drop-after { box-shadow: inset 0 -2px 0 var(--accent); }
.td-box { width: 20px; height: 20px; margin-top: 0; flex-shrink: 0; border-radius: 50%; border: 1.8px solid color-mix(in srgb, var(--ink) 35%, transparent); background: var(--td-field); color: transparent; padding: 0; display: grid; place-items: center; cursor: pointer; transition: background .2s, border-color .2s, color .2s, transform .2s; }
.td-box:hover { border-color: var(--accent); }
.td-box svg { transform: scale(.4); opacity: 0; transition: transform .25s var(--ease-spring, ease), opacity .15s; }
.td-item.done .td-box, .td-item.checking .td-box { background: var(--accent-fill); border-color: var(--accent-fill); color: var(--accent-fill-ink); }
.td-item.done .td-box svg, .td-item.checking .td-box svg { transform: none; opacity: 1; }
.td-item.unchecking .td-box { background: var(--td-field); border-color: color-mix(in srgb, var(--ink) 35%, transparent); color: transparent; }
.td-item.checking .td-box, .td-item.tick .td-box { animation: tdTick .34s var(--ease-spring, ease); }
.td-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; align-items: flex-start; }
.td-txt { border: none; background: transparent; padding: 0; margin: 0; font: inherit; font-size: 14px; line-height: 1.35; color: var(--ink); text-align: left; cursor: pointer; overflow-wrap: anywhere; position: relative; }
.td-txt::after { content: ""; position: absolute; left: 0; top: 55%; height: 1.5px; width: 0; background: currentColor; transition: width .28s ease; }
.td-item.done .td-txt, .td-item.checking .td-txt { color: var(--ink3); }
.td-item.done .td-txt::after, .td-item.checking .td-txt::after { width: 100%; }
.td-item.unchecking .td-txt::after { width: 0; }
.td-note { font-size: 12px; color: var(--ink2); line-height: 1.35; overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.td-sub { font-size: 12px; color: var(--ink2); }
.td-sub.over { color: var(--td-warn); }
.td-item.over:not(.done) .td-box { border-color: color-mix(in srgb, var(--td-warn) 60%, transparent); }
.td-move { margin-top: 4px; height: 26px; padding: 0 10px; border-radius: 8px; border: 1px solid var(--td-warn-bd); background: var(--td-field); font: inherit; font-size: 12px; font-weight: 600; color: var(--td-warn); cursor: pointer; }
.td-card { border-radius: 14px; background: var(--td-field); border: 1px solid var(--line); padding: 8px 2px 4px; overflow: hidden; transition: height .45s var(--ease-soft, ease), opacity .35s, margin .45s, padding .45s; }
.td-card.warn { background: var(--td-warn-bg); border-color: var(--td-warn-bd); padding: 2px; }
.td-card.td-collapse { height: 0 !important; opacity: 0; padding-top: 0; padding-bottom: 0; margin-top: -12px; border-width: 0; }
.td-card-h { display: flex; align-items: center; gap: 7px; width: 100%; box-sizing: border-box; padding: 4px 10px 8px; border: none; background: transparent; font: inherit; font-size: 13.5px; font-weight: 700; color: var(--ink); text-align: left; }
.td-card-h > span:first-of-type { flex: 1; }
.td-card-h.fold { cursor: pointer; }
.td-card-h.fold svg { transition: transform .25s; transform: rotate(-90deg); color: var(--ink2); }
.td-card-h.fold.open svg { transform: none; }
.td-cnt { font-size: 12.5px; font-weight: 500; color: var(--ink2); font-variant-numeric: tabular-nums; white-space: nowrap; }
.td-bar { display: block; height: 5px; margin: 0 10px 6px; border-radius: 5px; background: color-mix(in srgb, var(--ink) 10%, transparent); overflow: hidden; }
.td-bar > span { display: block; height: 100%; border-radius: 5px; background: var(--accent-fill); transition: width .4s var(--ease-soft, ease); }
.td-fold { display: flex; align-items: center; gap: 6px; width: 100%; border: none; background: transparent; padding: 4px 8px; font: inherit; font-size: 11.5px; font-weight: 650; color: var(--ink2); cursor: pointer; text-align: left; }
.td-fold svg { transition: transform .25s; transform: rotate(-90deg); } .td-fold.open svg { transform: none; }
.td-fold small { margin-left: auto; font-size: 11.5px; font-weight: 500; color: var(--ink3); }
.td-dayh { padding: 8px 8px 0; font-size: 12.5px; font-weight: 650; }
.td-dayh span { font-weight: 500; color: var(--ink3); }
.td-sums { margin-top: auto; display: flex; flex-direction: column; gap: 8px; padding-top: 6px; }
.td-sum { display: flex; align-items: center; gap: 10px; padding: 11px 12px; border-radius: 14px; border: 1px solid var(--chip-bd); background: var(--chip-bg); font: inherit; color: var(--ink); text-align: left; cursor: pointer; transition: transform .15s, border-color .2s; }
.td-sum:hover { border-color: color-mix(in srgb, var(--accent) 35%, var(--chip-bd)); }
.td-sum:active { transform: scale(.985); }
.td-sum-t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.td-sum-t b { font-size: 13px; font-weight: 650; }
.td-sum .td-bar { margin: 0; }
.td-sum > svg { color: var(--ink3); }
.td-item.fresh { animation: tdIn .38s var(--ease-soft, ease) both; }
@keyframes tdIn { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
@keyframes tdTick { 0% { transform: scale(.7); } 60% { transform: scale(1.15); } 100% { transform: scale(1); } }

/* oslava – zoznam je vybavený */
.td-cel { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px; padding: 20px 12px 16px; }
.td-ring { width: 62px; height: 62px; border-radius: 50%; background: linear-gradient(160deg, var(--hl-icon-from, #2B95FF), var(--hl-icon-to, #006CE0)); color: #fff; display: grid; place-items: center; box-shadow: 0 14px 30px -12px rgba(0,108,224,.7); animation: tdPop .6s cubic-bezier(.34,1.5,.5,1) both; }
.td-cel b { margin-top: 8px; font-size: 15.5px; font-weight: 700; letter-spacing: -.01em; animation: tdRise .45s .22s both; }
.td-cel em { font-family: var(--hl-font-serif); font-style: italic; font-weight: 500; font-size: 24px; line-height: 1; color: var(--hl-word-em); animation: tdRise .45s .36s both; }
.td-cel small { font-size: 12px; color: var(--ink2); animation: tdRise .45s .5s both; }
.td-spark { position: absolute; left: 50%; top: 50px; width: 7px; height: 7px; margin-left: -3.5px; border-radius: 2px; animation: tdBurst 1s .12s ease-out both; }
@keyframes tdPop { 0% { transform: scale(.3); opacity: 0; } 60% { transform: scale(1.12); opacity: 1; } 100% { transform: scale(1); } }
@keyframes tdRise { from { transform: translateY(10px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes tdBurst { 0% { transform: translate(0,0) scale(.4) rotate(0); opacity: 0; } 20% { opacity: 1; } 100% { transform: translate(var(--dx), var(--dy)) scale(1) rotate(160deg); opacity: 0; } }

/* pásik (zbalený panel) */
.td-railbtn { position: sticky; top: 16px; width: 46px; height: 176px; box-sizing: border-box; border-radius: 16px; border: 1px solid var(--panel-bd); background: var(--panel-bg);
  -webkit-backdrop-filter: blur(20px) saturate(1.5); backdrop-filter: blur(20px) saturate(1.5); box-shadow: 0 20px 40px -24px rgba(30,40,90,.45);
  display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 14px 0; font: inherit; color: var(--ink); cursor: pointer; transition: transform .2s var(--ease-soft, ease), border-color .2s; }
.td-railbtn:hover { border-color: color-mix(in srgb, var(--accent) 35%, var(--panel-bd)); transform: translateX(2px); }
.td-rail-ic { position: relative; width: 30px; height: 30px; border-radius: 9px; background: color-mix(in srgb, var(--accent) 14%, transparent); color: var(--accent-text); display: grid; place-items: center; }
.td-rail-ic b { position: absolute; right: -8px; top: -8px; min-width: 18px; height: 18px; padding: 0 5px; box-sizing: border-box; border-radius: 9px; background: var(--accent-fill); color: var(--accent-fill-ink); font-size: 11px; font-weight: 700; line-height: 18px; text-align: center; }
.td-rail-l { writing-mode: vertical-rl; transform: rotate(180deg); font-size: 12.5px; font-weight: 650; letter-spacing: .02em; }
.td-railbtn > svg { color: var(--ink3); }

/* vysúvací panel zľava */
.td-scrim { position: fixed; inset: 0; z-index: 70; background: rgba(18,24,45,.26); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); opacity: 0; transition: opacity .3s var(--ease-soft, ease); }
.td-scrim.show { opacity: 1; }
.td-scrim[hidden], .td-drawer[hidden] { display: none; }
.td-drawer { position: fixed; left: 12px; top: 12px; bottom: 12px; width: min(380px, calc(100vw - 24px)); z-index: 75; display: flex;
  transform: translateX(calc(-100% - 24px)); transition: transform .38s var(--ease-soft, cubic-bezier(.22,.9,.28,1)); }
.td-drawer.show { transform: none; }
.td-drawer > .td-panel { flex: 1; background: var(--zs-pop); box-shadow: 30px 0 80px -30px rgba(20,30,70,.5); }

/* čísla úloh v hlavičke rozvrhu */
#grid .dh { position: relative; }
.dh-td { position: absolute; top: 6px; right: 6px; display: inline-flex; align-items: center; gap: 4px; height: 20px; padding: 0 7px; border-radius: 999px; border: none;
  background: color-mix(in srgb, var(--ink) 8%, transparent); color: var(--ink2); font: inherit; font-size: 10.5px; font-weight: 600; cursor: pointer; transition: background .2s, color .2s; }
.dh-td:hover { background: color-mix(in srgb, var(--accent) 16%, transparent); color: var(--accent-text); }
.dh-td.late { background: var(--td-warn-bg); color: var(--td-warn); }
body.td-dragging #grid .dh { outline: 1.5px dashed color-mix(in srgb, var(--accent) 45%, transparent); outline-offset: -4px; border-radius: 10px; }
#grid .dh.td-drop { background: color-mix(in srgb, var(--accent) 14%, transparent); outline-style: solid; }
/* úzke stĺpce: len číslo (s panelom vedľa rozvrhu sú stĺpce užšie) */
@media (max-width: 1499px) { .dh-td span, .dh-td svg { display: none; } .dh-td { padding: 0 6px; } .dh-td::after { content: attr(data-n); } }
@media (max-width: 1799px) { body.td-pinned .dh-td span, body.td-pinned .dh-td svg { display: none; } body.td-pinned .dh-td { padding: 0 6px; } body.td-pinned .dh-td::after { content: attr(data-n); } }
/* tablet: v hlavičke len ikona Hourleaf, aby sa zmestil prepínač semestra aj Rozvrh/Zošity */
@media (min-width: 761px) and (max-width: 1023px) { .title-block h1.brand .hl-wordmark { display: none; } }

/* úprava úlohy */
.zs-pop.td-popw { width: 320px; padding: 12px; }
.td-pop { display: flex; flex-direction: column; gap: 12px; }
.td-pl { display: flex; flex-direction: column; gap: 6px; }
.td-pl > span { font-size: 12px; font-weight: 600; color: var(--ink2); }
.td-pt, .td-pn { width: 100%; box-sizing: border-box; font: inherit; font-size: 14px; color: var(--ink); background: var(--td-field); border: 1px solid var(--line); border-radius: 10px; padding: 8px 10px; resize: vertical; }
.td-pt:focus, .td-pn:focus { outline: 2px solid var(--accent); outline-offset: 0; border-color: transparent; }
.td-pfoot { display: flex; align-items: center; gap: 8px; }
.td-sp { flex: 1; }
.td-pdel { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 10px; border-radius: 9px; border: none; background: transparent; font: inherit; font-size: 13px; font-weight: 600; color: #c0392b; cursor: pointer; }
.td-pdel:hover { background: rgba(192,57,43,.1); }
:root[data-theme="dark"] .td-pdel { color: #ff8a80; }

/* telefón: vlastná sekcia Úlohy */
@media (max-width: 760px) {
  #todosView .td-panel { background: transparent; border: none; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; padding: 0; overflow: visible; gap: 14px; }
  #todosView .td-title { font-size: 28px; letter-spacing: -0.03em; }
  #todosView .td-seg button { height: 34px; font-size: 14px; }
  #todosView .td-scroll { overflow: visible; margin: 0; padding: 0; }
  #todosView .td-item { padding: 11px 10px; }
  #todosView .td-box { width: 22px; height: 22px; }
  #todosView .td-txt { font-size: 15px; }
  #todosView .td-list:not(.td-empty) { background: var(--td-field); border: 1px solid var(--line); }
  #todosView .td-card .td-list { background: transparent; border: none; }
  #todosView .td-pick { height: 32px; padding: 0 12px; font-size: 13px; }
  .td-strip { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 5px; }
  .td-sday { display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 7px 0 6px; border-radius: 12px; border: 1px solid var(--chip-bd); background: var(--chip-bg); font: inherit; color: var(--ink); cursor: pointer; }
  .td-sday span { font-size: 11px; color: var(--ink2); }
  .td-sday b { font-size: 15px; font-weight: 650; }
  .td-sday i { height: 14px; font-style: normal; font-size: 10.5px; font-weight: 700; color: var(--ink2); }
  .td-sday i.late { color: var(--td-warn); }
  .td-sday.today span { color: var(--accent-text); font-weight: 600; }
  .td-sday.on { background: var(--accent-fill); border-color: transparent; color: var(--accent-fill-ink); }
  .td-sday.on span, .td-sday.on i { color: inherit; opacity: .9; }
  .tabbar { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) {
  .td-drawer, .td-scrim, .td-card, .td-bar > span { transition: none !important; }
  .td-item.fresh, .td-item.checking .td-box, .td-item.tick .td-box, .td-ring, .td-cel b, .td-cel em, .td-cel small, .td-spark { animation: none !important; }
  .td-spark { display: none; }
}

/* =========================================================================
   TELEFÓN – hlavička pri posúvaní, celý týždeň, spodné okná, gestá, detaily
   ========================================================================= */
:root { --hdr-bg: rgba(243,246,252,.84); }
:root[data-theme="dark"] { --hdr-bg: rgba(34,37,43,.86); }
.mweek, .m-weekbtn, .zs-mtabs { display: none; }
#notesView[hidden] { display: none; }
@keyframes sheetUp { from { transform: translateY(100%); } to { transform: none; } }

@media (max-width: 760px) {
  /* polia s písmom 16 px – iPhone potom pri ťuknutí nepribližuje stránku */
  input, select, textarea, .td-input, .td-pt, .td-pn, .field input, .field select { font-size: 16px !important; }

  /* hlavička: prilepená hore, pri posúvaní sa zmenší a dostane sklenené pozadie */
  .wrap { padding-top: 0; }
  header.app { position: sticky; top: 0; z-index: 45; margin: 0 -16px 12px; padding: calc(14px + env(safe-area-inset-top, 0px)) 16px 10px;
    transition: background .25s, box-shadow .25s, padding .25s; }
  body.scrolled header.app { background: var(--hdr-bg); -webkit-backdrop-filter: blur(20px) saturate(1.6); backdrop-filter: blur(20px) saturate(1.6);
    box-shadow: 0 1px 0 var(--line); padding-top: calc(8px + env(safe-area-inset-top, 0px)); padding-bottom: 8px; }
  .title-block h1.brand, .title-block h1.brand .brand-ic, .title-block h1.brand .brand-ic svg { transition: font-size .25s, width .25s, height .25s; }
  body.scrolled .title-block h1.brand { font-size: 18px; }
  body.scrolled .title-block h1.brand .brand-ic, body.scrolled .title-block h1.brand .brand-ic svg { width: 26px; height: 26px; }

  /* riadok s týždňom: tlačidlo celý týždeň, Dnes */
  .m-weekbtn { display: grid; }
  .m-weekbtn[aria-pressed="true"] { background: var(--accent-fill); color: var(--accent-fill-ink); border-color: transparent; }
  #todayBtn.m-show { display: inline-flex !important; }
  .mini-arrow { width: 42px !important; height: 42px !important; }
  .week-label { height: 42px; }

  /* celý týždeň na telefóne */
  body.m-week #daytabs, body.m-week #daylist { display: none !important; }
  body.m-week .mweek { display: block; }
  .mweek { border-radius: 18px; background: var(--panel-bg); border: 1px solid var(--panel-bd); overflow: hidden; margin-bottom: 8px; touch-action: pan-y;
    -webkit-backdrop-filter: blur(20px) saturate(1.4); backdrop-filter: blur(20px) saturate(1.4); box-shadow: 0 20px 40px -30px rgba(30,40,90,.4); }
  .mw-head { display: grid; grid-template-columns: 28px repeat(5, minmax(0, 1fr)); border-bottom: 1px solid var(--line); }
  .mw-dh { border: none; background: transparent; padding: 8px 0 7px; display: flex; flex-direction: column; align-items: center; gap: 2px; font: inherit; color: var(--ink); cursor: pointer; min-height: 52px; }
  .mw-dh span { font-size: 11px; color: var(--ink2); }
  .mw-dh b { font-size: 15px; font-weight: 650; width: 28px; height: 28px; line-height: 28px; border-radius: 50%; text-align: center; font-variant-numeric: tabular-nums; }
  .mw-dh.today span { color: var(--accent-text); font-weight: 600; }
  .mw-dh.today b { background: var(--accent-fill); color: var(--accent-fill-ink); }
  .mw-dh:active b { transform: scale(.9); }
  .mw-body { display: grid; grid-template-columns: 28px minmax(0, 1fr); padding: 10px 0 12px; }
  .mw-gut { position: relative; }
  .mw-gut span { position: absolute; right: 6px; transform: translateY(-50%); font-size: 10.5px; color: var(--ink3); font-variant-numeric: tabular-nums; }
  .mw-cols { position: relative; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); transition: transform .25s var(--ease-soft, ease), opacity .25s; }
  .mw-col { position: relative; border-left: 1px solid var(--line-soft); background-image: linear-gradient(to bottom, var(--hourline) 0, var(--hourline) 1px, transparent 1px); }
  .mw-col.today { background-color: var(--today-tint); }
  .mw-b { position: absolute; box-sizing: border-box; border: none; border-radius: 8px; padding: 4px 4px 3px 7px; margin: 0; text-align: left; font: inherit; overflow: hidden;
    display: flex; flex-direction: column; gap: 1px; cursor: pointer; background: color-mix(in srgb, var(--c) 16%, var(--card-bg)); box-shadow: inset 3px 0 0 var(--c);
    color: var(--ink); transition: transform .15s var(--ease-soft, ease); -webkit-tap-highlight-color: transparent; }
  .mw-b b { font-size: 12px; font-weight: 700; letter-spacing: -.01em; color: color-mix(in srgb, var(--c) 72%, var(--ink)); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .mw-b span { font-size: 10px; color: var(--ink2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .mw-b.sm { justify-content: center; padding-top: 0; padding-bottom: 0; }
  .mw-b:active, .mw-b.lp-on { transform: scale(.95); }
  .mw-now { position: absolute; left: calc(var(--di) * 20%); width: 20%; height: 2px; margin-top: -1px; background: var(--accent); z-index: 3; pointer-events: none; }
  .mw-now::before { content: ""; position: absolute; left: -4px; top: -3px; width: 8px; height: 8px; border-radius: 50%; background: var(--accent); }
  .mw-empty { margin: 0; padding: 0 16px 16px; text-align: center; font-size: 13px; color: var(--ink2); }
  .m-empty { display: flex; flex-direction: column; align-items: center; gap: 4px; text-align: center; padding: 34px 20px; border: 1px dashed var(--line-strong, var(--line)); border-radius: 18px; }
  .m-empty b { font-size: 15px; } .m-empty span { font-size: 13px; color: var(--ink2); }
  .card.lp-on { transform: scale(.97); transition: transform .2s; }

  /* pás dní: počet úloh */
  .daytab { position: relative; min-height: 56px; }
  .daytab .d-td { position: absolute; top: 4px; right: 4px; min-width: 16px; height: 16px; padding: 0 4px; box-sizing: border-box; border-radius: 8px;
    background: color-mix(in srgb, var(--accent) 16%, transparent); color: var(--accent-text); font-size: 10px; font-weight: 700; line-height: 16px; text-align: center; }
  .daytab.active .d-td { background: color-mix(in srgb, var(--accent-fill-ink) 25%, transparent); color: inherit; }

  /* spodné okná (detail hodiny, formuláre, nastavenia, menu, úprava úlohy) */
  body .modal, body .drawer { left: 0 !important; right: 0 !important; top: auto !important; bottom: var(--kb, 0px) !important; width: 100% !important; max-width: none !important;
    height: auto !important; max-height: min(92vh, calc(var(--vvh, 100vh) - 12px)) !important; border-radius: 24px 24px 0 0 !important; box-sizing: border-box; padding-top: 12px;
    transform: translateY(105%) !important; opacity: 1 !important; visibility: hidden;
    transition: transform .4s cubic-bezier(.22,1,.36,1), visibility 0s linear .4s !important; }
  body .modal.show, body .drawer.show { transform: none !important; visibility: visible; transition: transform .4s cubic-bezier(.22,1,.36,1), visibility 0s !important; }
  body .modal::before, body .drawer::before { content: ""; position: absolute; top: 6px; left: 50%; width: 40px; height: 5px; margin-left: -20px; border-radius: 3px;
    background: color-mix(in srgb, var(--ink) 22%, transparent); z-index: 3; }
  body .modal .modal-foot, body .drawer .drawer-foot { padding-bottom: calc(14px + env(safe-area-inset-bottom, 0px)); }
  body .modal .modal-foot .btn, body .drawer .drawer-foot .btn { min-height: 44px; }
  body .zs-pop { position: fixed !important; left: 0 !important; right: 0 !important; top: auto !important; bottom: var(--kb, 0px) !important; width: auto !important; max-width: none !important;
    min-width: 0 !important; max-height: min(82vh, calc(var(--vvh, 100vh) - 24px)); overflow-y: auto; overscroll-behavior: contain; box-sizing: border-box;
    border-radius: 24px 24px 0 0 !important; padding: 20px 14px calc(14px + env(safe-area-inset-bottom, 0px)) !important;
    box-shadow: 0 -10px 40px -12px rgba(0,0,0,.3), 0 0 0 100vmax rgba(12,16,30,.34) !important; animation: sheetUp .36s cubic-bezier(.22,1,.36,1) both; }
  body .zs-pop::before { content: ""; position: absolute; top: 7px; left: 50%; width: 40px; height: 5px; margin-left: -20px; border-radius: 3px; background: color-mix(in srgb, var(--ink) 22%, transparent); }
  body .zs-pop .am-item { min-height: 48px; font-size: 15px; }
  body .zs-pop .td-pick { height: 36px; padding: 0 12px; font-size: 14px; }
  body.kb-open .tabbar, body.kb-open .fab { display: none !important; }

  /* záloha: namiesto veľkej karty bodka na ⋯ a riadok v menu */
  #bkBar { display: none !important; }
  #menuBtn { position: relative; width: 44px; height: 44px; }
  #menuBtn.has-dot::after { content: ""; position: absolute; top: 7px; right: 7px; width: 9px; height: 9px; border-radius: 50%; background: #ff9f0a; box-shadow: 0 0 0 2px var(--chip-bg); }
  .app-menu .am-item.due::after { content: ""; width: 9px; height: 9px; border-radius: 50%; background: #ff9f0a; margin-left: auto; }

  /* dotyk: väčšie ciele a jemná odozva */
  .td-box { position: relative; }
  .td-box::after { content: ""; position: absolute; inset: -11px; }
  #todosView .td-ib { width: 40px; height: 40px; }
  .btn:active, .td-pick:active, .td-sum:active, .zs-card:active, .wn-item:active, .sem-btn:active { transform: scale(.97); }

  /* úlohy: potiahnutie doprava = hotovo, doľava = zmazať */
  .td-item { overflow: hidden; touch-action: pan-y; }
  .td-item.swiping > * { transform: translateX(var(--sx)); }
  .td-item.sw-back > *, .td-item.sw-out > * { transition: transform .22s ease; }
  .td-item.sw-r { background: color-mix(in srgb, var(--accent) 14%, transparent); }
  .td-item.sw-l { background: rgba(215,58,50,.12); }
  .td-item.sw-arm.sw-r { background: color-mix(in srgb, var(--accent) 28%, transparent); }
  .td-item.sw-arm.sw-l { background: rgba(215,58,50,.24); }
  .td-item.sw-r::before, .td-item.sw-l::before { position: absolute; top: 50%; transform: translateY(-50%); font-size: 12.5px; font-weight: 700; pointer-events: none; }
  .td-item.sw-r::before { content: attr(data-swr); left: 14px; color: var(--accent-text); }
  .td-item.sw-l::before { content: attr(data-swl); right: 14px; color: #c0392b; }
  :root[data-theme="dark"] .td-item.sw-l::before { color: #ff8a80; }

  /* zošit a súbor v záložkách namiesto dvoch polovíc */
  .zs-mtabs { display: grid; grid-template-columns: 1fr 1fr; padding: 3px; gap: 3px; border-radius: 12px; background: var(--seg-bg); margin: 0 0 10px; }
  .zs-mtabs button { height: 36px; border: none; border-radius: 9px; background: transparent; font: inherit; font-size: 14px; font-weight: 500; color: var(--ink2); cursor: pointer; }
  .zs-mtabs button.on { background: var(--seg-on); color: var(--ink); font-weight: 600; box-shadow: 0 1px 3px rgba(30,40,90,.14); }
  .zs-work.split, .zs-work.split.swap { grid-template-columns: minmax(0, 1fr) !important; grid-template-rows: auto !important; }
  .zs-work.split .zs-filepane { display: none !important; }
  .zs-work.split.m-file .zs-filepane { display: flex !important; order: 0; min-height: calc(var(--vvh, 100vh) - 190px); }
  .zs-work.split.m-file .zs-docpane { display: none !important; }
  .zs-top .zs-new { display: none; }
  /* panel nástrojov zošita nad klávesnicou */
  body.kb-open.zs-editing .zs-toolbar { position: fixed; left: 0; right: 0; bottom: var(--kb, 0px); z-index: 70; margin: 0; border-radius: 0; padding: 6px 8px;
    background: var(--zs-pop); box-shadow: 0 -1px 0 var(--line), 0 -8px 20px -12px rgba(0,0,0,.25); }
  body.kb-open.zs-editing .zs-paper { padding-bottom: 90px; }

  /* sekcia Poznámky */
  #notesView .nv-head { display: flex; flex-direction: column; gap: 12px; margin-bottom: 14px; }
  #notesView .nv-title { margin: 0; font-size: 28px; font-weight: 700; letter-spacing: -0.03em; }
  #notesView .nv-nav { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
  #notesView .wn-arrow { width: 42px; height: 42px; }
  .nv-hint { margin: 14px 4px 0; font-size: 12.5px; color: var(--ink2); line-height: 1.45; }

  /* rýchle voľby po dlhom podržaní hodiny */
  .qa-head { display: flex; align-items: center; gap: 10px; padding: 2px 10px 10px; font-size: 15px; }
  .qa-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--c); flex-shrink: 0; }

  /* „Teraz“ a obsah: jednotný 16 px okraj, plynulé prechody medzi sekciami */
  #todosView:not([hidden]), #notesView:not([hidden]), #notebooksView:not([hidden]) { animation: fadeUp .3s var(--ease-soft, ease) both; }
  .undo-safe, .td-undo { bottom: calc(92px + env(safe-area-inset-bottom, 0px)); }
}
@media (max-width: 760px) and (prefers-reduced-motion: reduce) {
  body .modal, body .drawer, body .modal.show, body .drawer.show { transition: none !important; }
  body .zs-pop { animation: none; }
}

/* vrátenie zmazanej úlohy */
.td-undo { position: fixed; left: 50%; bottom: 24px; z-index: 96; display: flex; align-items: center; gap: 14px; padding: 8px 8px 8px 18px; border-radius: 999px;
  background: var(--ink); color: var(--bg, #fff); font-size: 13.5px; font-weight: 500; box-shadow: 0 12px 34px -10px rgba(0,0,0,.45);
  transform: translate(-50%, calc(100% + 120px)); transition: transform .34s var(--ease-spring, ease); }
.td-undo.show { transform: translate(-50%, 0); }
.td-undo button { border: none; border-radius: 999px; padding: 7px 14px; font: inherit; font-weight: 700; font-size: 13px; cursor: pointer;
  background: color-mix(in srgb, var(--bg, #fff) 20%, transparent); color: inherit; }
:root[data-theme="dark"] .td-undo { background: #e9ebef; color: #202328; }
@media (max-width: 760px) {
  /* hlášky nad tlačidlom „+“, aby ho neprekrývali */
  .toast, .movebar, .td-undo { bottom: calc(150px + env(safe-area-inset-bottom, 0px)); }
  body[data-view="notes"] .toast, body[data-view="notes"] .td-undo { bottom: calc(92px + env(safe-area-inset-bottom, 0px)); }
}
@media (min-width: 761px) { #mWeekBtn { display: none !important; } }

/* =========================================================================
   ŠTÁTNE SVIATKY (voľno) + krajina školy
   ========================================================================= */
:root { --hol: #b0621a; --hol-bg: rgba(240,150,40,.07); --hol-line: rgba(220,130,30,.14); }
:root[data-theme="dark"] { --hol: #f0b45a; --hol-bg: rgba(240,160,40,.06); --hol-line: rgba(240,160,40,.12); }
.daycol.hol { background-image: repeating-linear-gradient(135deg, var(--hol-line) 0 1px, transparent 1px 11px) !important; background-color: var(--hol-bg) !important; background-size: auto !important; }
.hol-band { position: sticky; top: 8px; margin: 8px 6px 0; padding: 10px 12px; border-radius: 12px; background: var(--card-bg); border: 1px solid var(--hol-line);
  display: flex; flex-direction: column; gap: 3px; z-index: 2; pointer-events: none; }
.hol-band .hol-t, .m-hol .hol-t { font-size: 10px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--hol); }
.hol-band .hol-n { font-size: 12.5px; font-weight: 600; color: var(--ink); line-height: 1.3; }
.dh.hol .dnm { color: var(--hol); }
.dh.hol .dnum { color: var(--hol); }
.dh.today.hol .dnum { color: var(--accent-fill-ink); }
.m-hol { display: flex; flex-direction: column; gap: 4px; padding: 18px 18px; border-radius: 18px; background: var(--hol-bg); border: 1px solid var(--hol-line); }
.m-hol b { font-size: 16px; font-weight: 650; color: var(--ink); }
.m-hol .hol-s { font-size: 13px; color: var(--ink2); }
.daytab.hol:not(.active) { color: var(--hol); }
.mw-col.hol { background-color: var(--hol-bg); background-image: repeating-linear-gradient(135deg, var(--hol-line) 0 1px, transparent 1px 9px) !important; background-size: auto !important; }
.mw-hol { position: absolute; left: 50%; top: 14px; transform: translateX(-50%); writing-mode: vertical-rl; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--hol); white-space: nowrap; }
.mw-dh.hol span, .mw-dh.hol:not(.today) b { color: var(--hol); }
.fs-hint { display: block; margin-top: 7px; font-size: 12.5px; line-height: 1.45; color: var(--ink2); }
.ob-ctry { max-width: 320px; }
.fs-seg button.on { background: var(--seg-on); color: var(--ink); font-weight: 600; box-shadow: 0 1px 3px rgba(30,40,90,.14); }
.am-changes .am-cnt { margin-left: auto; min-width: 20px; height: 20px; padding: 0 6px; box-sizing: border-box; border-radius: 10px; background: var(--accent-fill); color: var(--accent-fill-ink); font-size: 11.5px; font-weight: 700; display: grid; place-items: center; }
@media (max-width: 760px) {
  /* „Zmeny (n)“ sa na telefóne presúvajú do menu ⋯ – v hlavičke by prekryli semester */
  #changesBtn { display: none !important; }
  header.app .title-block { min-width: 0; overflow: hidden; }
  .sem-btn { min-width: 0; }
  .sem-btn .sem-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
}
@media (max-width: 760px) {
  /* animácie posunu dňa/týždňa nesmú rozšíriť stránku do strán */
  .wrap, #timetableView, #todosView, #notesView { overflow-x: clip; }
  html { overflow-x: hidden; }
}
/* štátne sviatky: počas presúvania sa na deň voľna nedá pustiť hodinu */
.cal-body.dd-active .daycol.hol, .daycol.hol.dropcol { cursor: not-allowed; }
.cal-body.dd-active .daycol.hol .hol-band { border-color: var(--hol); }
/* telefón: ikona „Zmeny“ v hlavičke */
.m-chbtn { display: none; }
@media (max-width: 760px) {
  .m-chbtn:not([hidden]) { display: grid; position: relative; width: 44px; height: 44px; }
  .m-chbtn b { position: absolute; top: 3px; right: 3px; min-width: 17px; height: 17px; padding: 0 4px; box-sizing: border-box; border-radius: 9px;
    background: var(--accent-fill); color: var(--accent-fill-ink); font-size: 10.5px; font-weight: 700; line-height: 17px; text-align: center; }
  header.app .head-actions { gap: 8px; }
}
.ctry-bar[hidden] { display: none !important; }
@media (max-width: 760px) {
  header.app .sem-btn { font-size: 14px; padding: 0 4px; gap: 3px; margin-left: 0; }
  header.app .sem-btn svg { width: 10px; height: 10px; }
  header.app .title-block { gap: 8px; }
}
@media (max-width: 370px) { header.app .title-block h1.brand .hl-wordmark { display: none; } }
@media (max-width: 760px) {
  header.app .head-actions { gap: 6px; }
  .m-chbtn:not([hidden]) { width: 40px; height: 40px; }
  .m-chbtn:not([hidden]) + #menuBtn { width: 40px; height: 40px; }
  .title-block h1.brand { font-size: 20px; }
}
/* režim presunu: po chvíli ostane len „Zrušiť“ */
.movebar .mb-text { transition: max-width .35s var(--ease-soft, ease), opacity .25s; max-width: 70vw; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.movebar.mini { gap: 0; padding-left: 6px; }
.movebar.mini .mb-text { max-width: 0; opacity: 0; }
@media (max-width: 760px) {
  /* menej šumu: malé, jednoriadkové hlášky */
  .toast { font-size: 13px; padding: 8px 14px; border-radius: 12px; max-width: calc(100vw - 64px); width: max-content; line-height: 1.35;
    box-shadow: 0 8px 24px -10px rgba(0,0,0,.35); }
  .movebar { font-size: 13px; padding: 5px 5px 5px 14px; gap: 10px; border-radius: 14px; max-width: calc(100vw - 32px); white-space: nowrap; }
  .movebar button { padding: 6px 12px; font-size: 13px; border-radius: 10px; }
  .movebar .mb-text { max-width: calc(100vw - 150px); }
  .movebar.mini { padding-left: 5px; }
}
@media (max-width: 760px) {
  /* v režime presunu netreba „+“; lišta presunu je nižšie, hlášky nad ňou */
  body:has(.movebar.show) .fab { display: none !important; }
  .movebar { bottom: calc(92px + env(safe-area-inset-bottom, 0px)); }
}

/* =========================================================================
   Jednorazová hodina („len raz“) a zrušená hodina
   ========================================================================= */
.gbadge.once, .tag.once { color: var(--accent-text); background: color-mix(in srgb, var(--accent) 14%, transparent); }
.tag.once, .tag.cancel { padding: 1px 7px; border-radius: 999px; font-size: 10.5px; }
.gbadge.cancel, .tag.cancel { color: #b3261e; background: rgba(215,58,50,.12); }
:root[data-theme="dark"] .gbadge.cancel, :root[data-theme="dark"] .tag.cancel { color: #ff9b91; background: rgba(255,120,110,.14); }
.gcard.cancelled, .card.cancelled, .mw-b.cancelled { opacity: .62; box-shadow: none; border-style: dashed; filter: saturate(.5); }
.gcard.cancelled .gc-name, .card.cancelled .cname, .mw-b.cancelled b { text-decoration: line-through; text-decoration-thickness: 1.5px; }
#grid .gcard.cancelled { cursor: pointer; }
.gcard.cancelled:hover { opacity: .85; }
.mw-b.cancelled { background: repeating-linear-gradient(135deg, color-mix(in srgb, var(--c) 10%, transparent) 0 6px, transparent 6px 12px); }
.move-note.cancel-note { color: #b3261e; background: rgba(215,58,50,.10); }
:root[data-theme="dark"] .move-note.cancel-note { color: #ff9b91; background: rgba(255,120,110,.12); }
.btn.ghost.danger { color: #b3261e; }
:root[data-theme="dark"] .btn.ghost.danger { color: #ff9b91; }
.qa-danger { color: #b3261e; }
:root[data-theme="dark"] .qa-danger { color: #ff9b91; }
.f-kind { margin-bottom: 16px; }
.f-kind .seg { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
.f-kind .seg button { justify-content: center; text-align: center; }
[hidden].field { display: none !important; }
