/* ==========================================================================
   SANIQ — system wizualny (Figma: „Saniq Alpha")
   Tokeny, układ aplikacji (panel boczny / pasek mobilny) i komponenty.
   Ikony: pliki SVG z projektu w /assets/icons, kolorowane przez currentColor (maska CSS).
   ========================================================================== */

:root {
    --c-canvas: #f5f7fb;
    --c-surface: #ffffff;
    --c-line: #e2e7f0;
    --c-line-strong: #c9d1e0;
    --c-track: #cfd5e1;
    --c-ink: #19243b;
    --c-muted: #657086;
    --c-subtle: #8590a3;

    --c-brand: #4055c8;
    --c-brand-hover: #3446b2;
    --c-brand-active: #2c3c9c;
    --c-brand-50: #eef1ff;
    --c-brand-100: #dfe4fb;

    --c-navy: #202f59;
    --c-navy-ink: #d5ddf6;
    --c-navy-line: #3b496d;

    --c-san: #8a354d;
    --c-san-50: #f8eff2;
    --c-admin: #7352b8;
    --c-admin-50: #f2eefa;
    --c-warn: #895318;
    --c-warn-50: #fff6e7;
    --c-danger: #b43f51;
    --c-danger-50: #fcf0f2;
    --c-success: #28745d;
    --c-success-50: #e9f5f0;
    --c-gold: #d4aa59;
    --c-role-lecturer: #7483d4;
    --c-role-master: #c89c53;

    --r-xs: 4px;
    --r-sm: 6px;
    --r-md: 8px;
    --r-lg: 12px;
    --r-xl: 16px;

    --sidebar-w: 236px;
    --topbar-h: 76px;
    --mobilebar-h: 68px;
    --tabbar-h: 82px;

    --shadow-pop: 0 18px 40px -18px rgba(25, 36, 59, 0.35);
    --focus-ring: 0 0 0 3px rgba(64, 85, 200, 0.28);
}

/* ---------- Reset bazowy (zamiast preflight Tailwinda) ---------- */
*, ::before, ::after { box-sizing: border-box; border-width: 0; border-style: solid; border-color: var(--c-line); }
h1, h2, h3, h4, h5, h6, p, blockquote, figure, dl, dd, pre, hr { margin: 0; }
h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; }
ol, ul, menu { list-style: none; margin: 0; padding: 0; }
img, svg, video, canvas { display: block; vertical-align: middle; max-width: 100%; }
img, video { height: auto; }
button, input, optgroup, select, textarea { font-family: inherit; font-size: 100%; font-weight: inherit; line-height: inherit; color: inherit; margin: 0; padding: 0; }
button, select { text-transform: none; }
button, [role="button"] { cursor: pointer; }
button { background-color: transparent; background-image: none; }
table { border-collapse: collapse; border-color: inherit; text-indent: 0; }
a { color: inherit; text-decoration: inherit; }
b, strong { font-weight: 700; }
summary { display: list-item; }
input::placeholder, textarea::placeholder { opacity: 1; color: var(--c-subtle); }
[type="search"] { -webkit-appearance: textfield; outline-offset: -2px; }
::-webkit-search-decoration { -webkit-appearance: none; }
code, kbd, samp, pre { font-size: 1em; }

/* ---------- Podstawy ---------- */
html { -webkit-text-size-adjust: 100%; }
body {
    margin: 0;
    font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
    font-size: 14px;
    line-height: 1.5;
    color: var(--c-ink);
    background: var(--c-canvas);
    -webkit-font-smoothing: antialiased;
    -webkit-tap-highlight-color: transparent;
}
.hidden, [hidden] { display: none !important; }
.sr-only {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; }
:focus-visible { outline: none; box-shadow: var(--focus-ring); }
code, .mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.break-anywhere { overflow-wrap: anywhere; }

/* ---------- Ikony (maska z pliku SVG projektu) ---------- */
.ico {
    display: inline-block;
    flex: none;
    width: var(--ico-w, 20px);
    height: var(--ico-h, var(--ico-w, 20px));
    background-color: currentColor;
    -webkit-mask: var(--ico) center / 100% 100% no-repeat;
    mask: var(--ico) center / 100% 100% no-repeat;
    vertical-align: middle;
}

/* ---------- Typografia stron ---------- */
.page { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.page-head { display: flex; flex-direction: column; gap: 6px; }
.page-eyebrow { font-size: 11px; line-height: 1.5; color: var(--c-muted); margin: 0; }
.page-title { font-size: 28px; font-weight: 700; line-height: 1.3; color: var(--c-ink); margin: 0; overflow-wrap: anywhere; }
.page-sub { font-size: 13px; line-height: 1.5; color: var(--c-muted); margin: 0; }
.section-title { font-size: 20px; font-weight: 700; line-height: 1.3; color: var(--c-ink); margin: 0; }
.day-title { font-size: 18px; font-weight: 700; line-height: 1.3; color: var(--c-ink); margin: 0; }
.subhead { font-size: 15px; font-weight: 600; line-height: 1.5; color: var(--c-ink); margin: 0; }
.label-strong { font-size: 14px; font-weight: 600; line-height: 1.5; color: var(--c-ink); margin: 0; }
.text-body { font-size: 14px; line-height: 1.5; color: var(--c-muted); margin: 0; }
.text-sm { font-size: 13px; line-height: 1.5; }
.text-xs { font-size: 12px; line-height: 1.5; }
.text-2xs { font-size: 11px; line-height: 1.5; }
.hint { font-size: 12px; line-height: 1.5; color: var(--c-muted); margin: 0; }

@media (min-width: 1024px) {
    body:not(.view-mode-mobile) .page { gap: 28px; }
    body:not(.view-mode-mobile) .page-head { gap: 8px; }
    body:not(.view-mode-mobile) .page-eyebrow { display: none; }
    body:not(.view-mode-mobile) .page-title { font-size: 32px; }
    body:not(.view-mode-mobile) .page-sub { font-size: 14px; }
    body:not(.view-mode-mobile) .day-title { font-size: 20px; }
}

/* ---------- Karty i panele ---------- */
.card {
    background: var(--c-surface);
    border: 1px solid var(--c-line);
    border-radius: var(--r-lg);
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    min-width: 0;
}
.card-tight { gap: 12px; }
.card-title { font-size: 20px; font-weight: 700; line-height: 1.3; color: var(--c-ink); margin: 0; }
.card-title-sm { font-size: 17px; font-weight: 700; line-height: 1.3; color: var(--c-ink); margin: 0; }
.card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.card-head-icon { display: flex; align-items: center; gap: 12px; }
.card.is-selected { border: 1.5px solid var(--c-brand); }
.card.is-danger-selected { border: 1.5px solid var(--c-danger); }
.card-dashed { border-style: dashed; background: var(--c-canvas); }
@media (min-width: 1024px) {
    body:not(.view-mode-mobile) .card { padding: 24px; }
    body:not(.view-mode-mobile) .card.card-pad-lg { padding: 28px; }
    body:not(.view-mode-mobile) .card.card-pad-sm { padding: 20px; }
}
.divider { height: 1px; background: var(--c-line); border: 0; margin: 0; width: 100%; flex: none; }

/* Granatowy baner */
.hero {
    background: var(--c-navy);
    color: #fff;
    border-radius: var(--r-xl);
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 0;
}
.hero-eyebrow { display: flex; align-items: center; gap: 12px; color: var(--c-navy-ink); font-size: 13px; font-weight: 500; text-transform: uppercase; }
.hero-title { font-size: 25px; font-weight: 700; line-height: 1.2; color: #fff; margin: 0; }
.hero-text { font-size: 14px; line-height: 1.6; color: var(--c-navy-ink); margin: 0; }
@media (min-width: 1024px) {
    body:not(.view-mode-mobile) .hero { padding: 28px; }
    body:not(.view-mode-mobile) .hero-title { font-size: 30px; }
}

/* ---------- Przyciski ---------- */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 46px;
    padding: 12px 16px;
    border-radius: var(--r-md);
    border: 1px solid var(--c-line);
    background: var(--c-surface);
    color: var(--c-brand);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
    user-select: none;
    touch-action: manipulation;
}
.btn:hover { background: var(--c-brand-50); border-color: var(--c-brand-100); }
.btn:active { background: var(--c-brand-100); }
.btn-primary { background: var(--c-brand); border-color: var(--c-brand); color: #fff; }
.btn-primary:hover { background: var(--c-brand-hover); border-color: var(--c-brand-hover); }
.btn-primary:active { background: var(--c-brand-active); border-color: var(--c-brand-active); }
.btn-danger { background: var(--c-danger-50); color: var(--c-danger); border-color: var(--c-line); }
.btn-danger:hover { background: #f8e1e5; border-color: #efc7ce; }
.btn-danger:active { background: #f3d2d8; }
.btn-danger-solid { background: var(--c-danger); border-color: var(--c-danger); color: #fff; }
.btn-danger-solid:hover { background: #9d3445; border-color: #9d3445; }
.btn-warn { background: var(--c-warn-50); color: var(--c-warn); border-color: #f1dfbf; }
.btn-warn:hover { background: #fdeccd; }
.btn-ghost { background: transparent; border-color: transparent; color: var(--c-brand); }
.btn-ghost:hover { background: var(--c-brand-50); border-color: transparent; }
.btn-muted { background: var(--c-canvas); color: var(--c-muted); border-color: var(--c-line); }
.btn-muted:hover { background: #ebeff6; }
.btn-sm { min-height: 38px; padding: 8px 12px; font-size: 13px; }
.btn-xs { min-height: 32px; padding: 6px 10px; font-size: 12px; gap: 6px; border-radius: var(--r-sm); }
.btn-13 { font-size: 13px; }
.btn-block { display: flex; width: 100%; }
.btn-icon { width: 44px; min-width: 44px; height: 44px; min-height: 44px; padding: 0; }
.btn:disabled, .btn[aria-disabled="true"] {
    background: var(--c-canvas);
    border-color: var(--c-line);
    color: var(--c-subtle);
    box-shadow: none;
}
.btn-primary:disabled { background: #b8c1ea; border-color: #b8c1ea; color: #fff; }
.btn-wrap { white-space: normal; }

/* Link tekstowy */
.link {
    background: none;
    border: 0;
    padding: 0;
    color: var(--c-brand);
    font-weight: 600;
    font-size: 13px;
    line-height: 1.5;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.link:hover { text-decoration: underline; text-underline-offset: 3px; }
.link-danger { color: var(--c-danger); }
.link-muted { color: var(--c-muted); font-weight: 500; }
.link-row { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; font-size: 13px; }
.link-row .sep { color: var(--c-brand); font-weight: 600; }

/* ---------- Etykiety statusu (chip) ---------- */
.chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 9px;
    border-radius: var(--r-sm);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.25;
    white-space: nowrap;
    background: var(--c-canvas);
    color: var(--c-muted);
    max-width: 100%;
}
.chip-wrap { white-space: normal; }
.chip-brand { background: var(--c-brand-50); color: var(--c-brand); }
.chip-neutral { background: var(--c-canvas); color: var(--c-muted); }
.chip-white { background: #fff; color: var(--c-muted); }
.chip-warn { background: var(--c-warn-50); color: var(--c-warn); }
.chip-san { background: var(--c-san-50); color: var(--c-san); }
.chip-admin { background: var(--c-admin-50); color: var(--c-admin); }
.chip-danger { background: var(--c-danger-50); color: var(--c-danger); }
.chip-success { background: var(--c-success-50); color: var(--c-success); }
.chip-count {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px;
    background: var(--c-danger); color: #fff; font-size: 10px; font-weight: 700; line-height: 18px;
}
.chip-count.is-warn { background: #c9821c; }

/* ---------- Komunikaty ---------- */
.callout {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px;
    border-radius: var(--r-md);
    background: var(--c-brand-50);
    color: var(--c-muted);
    min-width: 0;
}
.callout > .ico { color: var(--c-brand); margin-top: 1px; }
.callout-body { display: flex; flex-direction: column; gap: 4px; min-width: 0; flex: 1; font-size: 13px; line-height: 1.5; }
.callout-title { font-size: 14px; font-weight: 600; line-height: 1.5; color: var(--c-brand); margin: 0; }
.callout-warn { background: var(--c-warn-50); color: var(--c-warn); }
.callout-warn > .ico, .callout-warn .callout-title { color: var(--c-warn); }
.callout-warn.is-soft { color: var(--c-muted); }
.callout-danger { background: var(--c-danger-50); color: var(--c-danger); }
.callout-danger > .ico, .callout-danger .callout-title { color: var(--c-danger); }
.callout-success { background: var(--c-success-50); color: var(--c-success); }
.callout-success > .ico, .callout-success .callout-title { color: var(--c-success); }
.callout-link { cursor: pointer; border: 0; text-align: left; width: 100%; align-items: center; border-radius: var(--r-lg); }
.callout-link:hover { background: var(--c-brand-100); }

/* Komunikat zwrotny formularza */
.feedback { font-size: 13px; line-height: 1.5; padding: 10px 12px; border-radius: var(--r-md); }
.feedback-ok { background: var(--c-success-50); color: var(--c-success); }
.feedback-error { background: var(--c-danger-50); color: var(--c-danger); }
.feedback-warn { background: var(--c-warn-50); color: var(--c-warn); }
.feedback-info { background: var(--c-brand-50); color: var(--c-brand); }

/* ---------- Formularze ---------- */
.field { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.field-label { font-size: 13px; font-weight: 600; line-height: 1.5; color: var(--c-ink); margin: 0; }
.input, .select, .textarea {
    width: 100%;
    min-height: 48px;
    padding: 12px;
    border-radius: var(--r-md);
    border: 1px solid var(--c-line);
    background: var(--c-surface);
    color: var(--c-ink);
    font-size: 14px;
    line-height: 1.5;
    outline: none;
    transition: border-color .15s ease, box-shadow .15s ease;
    box-sizing: border-box;
}
.input::placeholder, .textarea::placeholder { color: var(--c-subtle); }
.input:focus, .select:focus, .textarea:focus { border-color: var(--c-brand); box-shadow: var(--focus-ring); }
.input:disabled, .select:disabled, .textarea:disabled, .input[readonly] { background: var(--c-canvas); color: var(--c-muted); }
.textarea { min-height: 130px; resize: vertical; }
.input.is-error, .select.is-error, .textarea.is-error, .fbox.is-error { border-color: var(--c-danger); }
.input.is-error:focus, .textarea.is-error:focus { box-shadow: 0 0 0 3px rgba(182, 62, 82, .18); }
.select-wrap { position: relative; display: block; min-width: 0; }
.select-wrap > .select { appearance: none; -webkit-appearance: none; padding-right: 40px; cursor: pointer; }
.select-wrap > .ico { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); color: var(--c-muted); pointer-events: none; }
.input-lg { height: 52px; min-height: 52px; padding: 0 14px; font-size: 16px; border-color: var(--c-line-strong); }
.input-affix { position: relative; display: flex; align-items: center; }
.input-affix > .input { padding-right: 52px; }
.input-affix > .affix-btn {
    position: absolute; right: 4px; top: 50%; transform: translateY(-50%);
    width: 44px; height: 44px; display: flex; align-items: center; justify-content: center;
    border: 0; background: transparent; color: var(--c-muted); border-radius: var(--r-md);
}
.input-affix > .affix-btn:hover { color: var(--c-brand); background: var(--c-brand-50); }

/* Pole „w ramce" (filtry administratora): etykieta w środku */
.fbox {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-height: 76px;
    padding: 12px;
    border: 1px solid var(--c-line);
    border-radius: var(--r-md);
    background: var(--c-surface);
    min-width: 0;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.fbox:focus-within { border-color: var(--c-brand); box-shadow: var(--focus-ring); }
.fbox-label { font-size: 12px; font-weight: 600; line-height: 1.25; color: var(--c-muted); margin: 0; }
.fbox-control {
    width: 100%;
    border: 0;
    padding: 0;
    background: transparent;
    font-size: 14px;
    line-height: 1.5;
    color: var(--c-ink);
    outline: none;
    min-height: 21px;
}
.fbox-control::placeholder { color: var(--c-subtle); }
select.fbox-control { appearance: none; -webkit-appearance: none; padding-right: 26px; cursor: pointer; }
.fbox .fbox-chevron { position: absolute; right: 12px; bottom: 14px; color: var(--c-muted); pointer-events: none; }
textarea.fbox-control { resize: vertical; min-height: 64px; }
.fbox-hint { font-size: 11px; line-height: 1.4; color: var(--c-muted); margin: 0; }
.fbox.is-readonly { background: var(--c-canvas); }
.fbox.is-disabled { background: var(--c-canvas); }
.fbox.is-disabled .fbox-label, .fbox.is-disabled .fbox-hint { opacity: .7; }
.fbox-control:disabled, .fbox-control[readonly] { cursor: not-allowed; }
.fbox-control:disabled { color: var(--c-muted); -webkit-text-fill-color: var(--c-muted); opacity: 1; }
/* Zajęcia online (Teams) w formularzu wpisu */
.online-box { display: flex; flex-direction: column; gap: 12px; padding: 12px; border: 1px dashed var(--c-line); border-radius: var(--r-md); }
.online-box.is-on { border-style: solid; border-color: var(--c-brand); background: var(--c-brand-50); }
.online-box.is-on .fbox { background: var(--c-surface); }
.fbox-compact { min-height: 0; }

/* Pole wyboru (checkbox) */
.check { display: flex; align-items: flex-start; gap: 12px; cursor: pointer; }
.check input[type="checkbox"] {
    appearance: none; -webkit-appearance: none;
    width: 20px; height: 20px; flex: none; margin: 1px 0 0;
    border: 1.5px solid var(--c-line-strong); border-radius: var(--r-xs);
    background: #fff; display: grid; place-content: center; cursor: pointer;
    transition: background-color .15s ease, border-color .15s ease;
}
.check input[type="checkbox"]::after {
    content: ""; width: 10px; height: 6px; margin-top: -2px;
    border-left: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(-45deg) scale(0);
    transition: transform .12s ease;
}
.check input[type="checkbox"]:checked { background: var(--c-brand); border-color: var(--c-brand); }
.check input[type="checkbox"]:checked::after { transform: rotate(-45deg) scale(1); }
.check input[type="checkbox"]:focus-visible { box-shadow: var(--focus-ring); }
.check-title { font-size: 14px; font-weight: 600; color: var(--c-ink); line-height: 1.4; }
.check-desc { font-size: 12px; color: var(--c-muted); line-height: 1.5; }

/* Przełącznik (stan wyłączony = toggle-off.svg z projektu) */
.switch {
    position: relative; flex: none; width: 48px; height: 28px; border-radius: 14px;
    background: var(--c-track); border: 0; padding: 0; transition: background-color .2s ease;
}
.switch::after {
    content: ""; position: absolute; top: 3px; left: 3px; width: 22px; height: 22px;
    border-radius: 50%; background: #fff; transition: transform .2s ease;
    box-shadow: 0 1px 2px rgba(25, 36, 59, 0.15);
}
.switch[aria-checked="true"] { background: var(--c-brand); }
.switch[aria-checked="true"]::after { transform: translateX(20px); }
.switch:disabled { opacity: .6; }

/* ---------- Przełącznik widoku (segmenty) ---------- */
.seg { display: inline-flex; align-items: stretch; gap: 0; padding: 4px; border-radius: 10px; background: var(--c-line); max-width: 100%; }
.seg-btn {
    border: 0; background: transparent; color: var(--c-muted);
    padding: 10px 18px; border-radius: 7px; font-size: 13px; font-weight: 600; line-height: 1.2;
    white-space: nowrap; transition: background-color .15s ease, color .15s ease;
}
.seg-btn:hover { color: var(--c-ink); }
.seg-btn.is-active, .seg-btn.active { background: #fff; color: var(--c-brand); box-shadow: 0 1px 2px rgba(25, 36, 59, .06); }
@media (min-width: 1024px) { body:not(.view-mode-mobile) .seg-lg .seg-btn { padding: 10px 24px; } }

/* Zakładki-pigułki (Ustawienia · Kontakt · Pomoc, Studenci · Grupy · …) */
.tabs-pill { display: flex; gap: 8px; flex-wrap: wrap; }
.tab-pill {
    flex: 1 1 0; min-width: 0; min-height: 42px; padding: 10px 12px;
    border-radius: var(--r-md); border: 0; background: #fff; color: var(--c-brand);
    font-size: 13px; font-weight: 600; text-align: center; white-space: nowrap;
}
.tab-pill:hover { background: var(--c-brand-50); }
.tab-pill.is-active { background: var(--c-brand-50); }
.tabs-text { display: flex; gap: 4px; flex-wrap: wrap; }
.tab-text {
    border: 0; background: transparent; color: var(--c-muted);
    padding: 4px 9px; border-radius: var(--r-sm); font-size: 12px; font-weight: 600; white-space: nowrap;
}
.tab-text:hover { color: var(--c-ink); background: #fff; }
.tab-text.is-active { background: var(--c-brand-50); color: var(--c-brand); }

/* ---------- Nawigacja w planie ---------- */
.period-nav { display: flex; align-items: center; gap: 12px; }
.period-label { flex: 1; min-width: 0; text-align: center; display: flex; flex-direction: column; gap: 2px; }
.period-title { font-size: 17px; font-weight: 600; color: var(--c-ink); margin: 0; line-height: 1.3; }
.period-sub { font-size: 12px; color: var(--c-muted); margin: 0; }
@media (min-width: 1024px) { body:not(.view-mode-mobile) .period-title { font-size: 20px; } }
.icon-btn {
    width: 44px; height: 44px; flex: none; border-radius: var(--r-md);
    border: 1px solid var(--c-line); background: #fff; color: var(--c-muted);
    display: inline-flex; align-items: center; justify-content: center;
}
.icon-btn:hover { background: var(--c-brand-50); color: var(--c-brand); }
.icon-btn:disabled { opacity: .45; }

.daystrip { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.daychip {
    display: flex; flex-direction: column; align-items: center; gap: 6px;
    padding: 10px 0; border-radius: var(--r-md); border: 1px solid var(--c-line); background: #fff;
    color: var(--c-ink); min-width: 0;
}
.daychip:hover { border-color: var(--c-brand-100); background: var(--c-brand-50); }
.daychip-dow { font-size: 11px; color: var(--c-muted); line-height: 1.2; }
.daychip-num { font-size: 18px; font-weight: 600; line-height: 1.2; }
.daychip.is-today { background: var(--c-brand); border-color: var(--c-brand); color: #fff; }
.daychip.is-today .daychip-dow { color: #fff; }
@media (min-width: 640px) { .daystrip { gap: 8px; } .daychip { padding: 12px 0; } }

/* ---------- Karty zajęć ---------- */
.day-block { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.day-head { display: flex; align-items: center; gap: 12px; }
.day-head > .day-title { flex: 1; min-width: 0; }
.class-list { display: flex; flex-direction: column; gap: 12px; }

.lesson {
    background: #fff; border: 1px solid var(--c-line); border-radius: var(--r-lg);
    padding: 16px; display: flex; gap: 14px; align-items: stretch; min-width: 0;
}
.lesson-time { flex: none; width: 60px; display: flex; flex-direction: column; gap: 3px; }
.lesson-start { font-size: 18px; font-weight: 600; color: var(--c-brand); line-height: 1.2; white-space: nowrap; }
.lesson-end { font-size: 12px; color: var(--c-muted); line-height: 1.5; }
.lesson-bar { flex: none; width: 3px; border-radius: 2px; background: var(--c-brand); align-self: stretch; }
.lesson-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.lesson-subject { font-size: 17px; font-weight: 700; line-height: 1.3; color: var(--c-ink); margin: 0; overflow-wrap: anywhere; }
.lesson-place { font-size: 13px; font-weight: 600; line-height: 1.5; color: var(--c-ink); margin: 0; overflow-wrap: anywhere; }
.lesson-meta { font-size: 12px; line-height: 1.5; color: var(--c-muted); margin: 0; overflow-wrap: anywhere; }
.lesson-extra { display: flex; flex-direction: column; gap: 6px; width: 100%; }
.lesson.is-past { background: #fbfcfe; }
.lesson.is-changed .lesson-start { color: var(--c-warn); }
.lesson-old-time { font-size: 11px; color: var(--c-danger); text-decoration: line-through; line-height: 1.3; }
.note-row {
    display: flex; align-items: center; gap: 8px; padding: 6px 10px; border-radius: var(--r-md);
    background: var(--c-brand-50); color: var(--c-brand); font-size: 12px; font-weight: 600; line-height: 1.4; width: 100%;
}
.teams-row {
    display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap;
    padding: 8px 10px; border-radius: var(--r-md); background: var(--c-brand-50); color: var(--c-ink);
    font-size: 12px; width: 100%;
}
.teams-row code { background: #fff; padding: 2px 8px; border-radius: var(--r-sm); color: var(--c-brand); font-weight: 700; user-select: all; }
.exception-row {
    display: flex; align-items: flex-start; gap: 8px; padding: 8px 10px; border-radius: var(--r-md);
    background: var(--c-warn-50); color: var(--c-warn); font-size: 12px; font-weight: 600; line-height: 1.45; width: 100%;
}

/* Wiersz zajęć w widoku listy (desktop): godziny | pasek | przedmiot | sala | prowadzący */
@media (min-width: 1024px) {
    body:not(.view-mode-mobile) .lesson.lesson-row { padding: 20px; gap: 24px; align-items: center; }
    body:not(.view-mode-mobile) .lesson-row .lesson-time { width: 136px; gap: 4px; }
    body:not(.view-mode-mobile) .lesson-row .lesson-bar { height: 56px; align-self: center; }
    body:not(.view-mode-mobile) .lesson-row .lesson-body {
        display: grid;
        grid-template-columns: minmax(180px, 1.25fr) minmax(140px, 1fr) minmax(160px, 1.15fr);
        column-gap: 24px; row-gap: 8px; align-items: center;
    }
    body:not(.view-mode-mobile) .lesson-row .lesson-col-subject { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; min-width: 0; }
    body:not(.view-mode-mobile) .lesson-row .lesson-col-subject .chip { order: 2; }
    body:not(.view-mode-mobile) .lesson-row .lesson-subject { font-size: 19px; }
    body:not(.view-mode-mobile) .lesson-row .lesson-extra { grid-column: 1 / -1; }
    body:not(.view-mode-mobile) .lesson-row .lesson-col-place .lesson-place { font-size: 14px; }
    body:not(.view-mode-mobile) .lesson-row .lesson-col-lecturer .lesson-meta-label { display: block; }
    /* Karta zajęć na pulpicie (desktop) */
    body:not(.view-mode-mobile) .lesson.lesson-agenda { padding: 20px; gap: 24px; }
    body:not(.view-mode-mobile) .lesson-agenda .lesson-time { width: 94px; }
    body:not(.view-mode-mobile) .lesson-agenda .lesson-start { font-size: 22px; }
    body:not(.view-mode-mobile) .lesson-agenda .lesson-subject { font-size: 19px; }
}
.lesson-col-subject, .lesson-col-lecturer { display: contents; }
.lesson-col-place { display: none; }
@media (min-width: 1024px) {
    body:not(.view-mode-mobile) .lesson-row .lesson-place-line { display: none; }
    body:not(.view-mode-mobile) .lesson-row .lesson-col-place,
    body:not(.view-mode-mobile) .lesson-row .lesson-col-lecturer { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
}
.lesson-meta-label { display: none; font-size: 11px; color: var(--c-muted); line-height: 1.5; }
.lesson-time-range { display: none; }
.lesson-time-caption { display: none; font-size: 12px; color: var(--c-muted); line-height: 1.5; }
@media (min-width: 1024px) {
    body:not(.view-mode-mobile) .lesson-row .lesson-start,
    body:not(.view-mode-mobile) .lesson-row .lesson-end { display: none; }
    body:not(.view-mode-mobile) .lesson-row .lesson-time-range { display: block; font-size: 18px; font-weight: 600; color: var(--c-brand); white-space: nowrap; line-height: 1.2; }
    body:not(.view-mode-mobile) .lesson-row .lesson-time-caption { display: block; }
    body:not(.view-mode-mobile) .lesson-row.is-changed .lesson-time-range { color: var(--c-warn); }
}


/* Karta zajęć prowadzącego / administratora */
.slot {
    background: #fff; border: 1px solid var(--c-line); border-radius: var(--r-lg);
    padding: 20px; display: flex; flex-direction: column; gap: 12px; min-width: 0;
}
.slot-time { font-size: 20px; font-weight: 600; color: var(--c-brand); line-height: 1.2; margin: 0; white-space: nowrap; }
.slot-subject { font-size: 18px; font-weight: 700; color: var(--c-ink); line-height: 1.4; margin: 0; overflow-wrap: anywhere; }
.slot-lines { display: flex; flex-direction: column; gap: 0; font-size: 13px; line-height: 1.7; color: var(--c-muted); }
.slot-lines .strong { color: var(--c-ink); font-weight: 600; }
.slot-actions { display: flex; gap: 8px; flex-wrap: nowrap; }
.slot-actions > .btn { min-width: 0; }
@media (max-width: 400px) {
    .slot-actions > .btn { padding-left: 10px; padding-right: 10px; font-size: 14px; gap: 6px; }
}
@media (max-width: 359.98px) { .slot-actions { flex-wrap: wrap; } }
.slot.is-selected { border: 1.5px solid var(--c-brand); }
.slot.is-manual { box-shadow: inset 3px 0 0 var(--c-warn); }
.slot.is-past { background: #fbfcfe; }
.slot.is-past .slot-time { color: var(--c-muted); }
.slot .btn:disabled { opacity: .55; cursor: not-allowed; }

/* ---------- Tabele ---------- */
.table-wrap { background: #fff; border: 1px solid var(--c-line); border-radius: var(--r-lg); overflow: hidden; }
.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.table { width: 100%; border-collapse: collapse; font-size: 13px; }
.table th {
    background: var(--c-canvas); color: var(--c-muted); font-size: 11px; font-weight: 600;
    text-align: left; padding: 14px 16px; white-space: nowrap; border-bottom: 1px solid var(--c-line);
}
.table td { padding: 14px 16px; border-bottom: 1px solid var(--c-line); color: var(--c-muted); vertical-align: middle; }
.table tr:last-child td { border-bottom: 0; }
.table td.td-strong { color: var(--c-ink); font-weight: 600; }
.table tr.is-selected td { background: var(--c-brand-50); }
.table .td-actions { white-space: nowrap; }
.table-empty { padding: 28px 16px; text-align: center; color: var(--c-muted); font-size: 13px; }
.list-meta { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.list-meta-title { font-size: 15px; font-weight: 600; color: var(--c-ink); margin: 0; }
.list-meta-count { font-size: 12px; font-weight: 600; color: var(--c-muted); }

/* Lista „kartowa" (mobile zamiast tabeli) */
.rows { display: flex; flex-direction: column; }
.row-item { display: flex; flex-direction: column; gap: 6px; padding: 14px 16px; border-bottom: 1px solid var(--c-line); }
.row-item:last-child { border-bottom: 0; }
.row-item.is-selected { background: var(--c-brand-50); }
.row-title { font-size: 14px; font-weight: 600; color: var(--c-ink); margin: 0; overflow-wrap: anywhere; }
.row-meta { font-size: 12px; color: var(--c-muted); margin: 0; overflow-wrap: anywhere; }
.row-actions { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: center; }
.only-mobile { display: block; }
.only-desktop { display: none !important; }
@media (min-width: 768px) {
    .only-mobile { display: none !important; }
    .only-desktop { display: block !important; }
    table.only-desktop { display: table !important; }
}

/* ---------- Wskaźniki (statystyki) ---------- */
.kpi-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
@media (min-width: 1024px) { .kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; } }
.kpi { background: #fff; border: 1px solid var(--c-line); border-radius: var(--r-lg); padding: 16px; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.kpi-label { font-size: 13px; color: var(--c-muted); line-height: 1.4; margin: 0; }
.kpi-value { font-size: 28px; font-weight: 700; color: var(--c-ink); line-height: 1.1; margin: 0; overflow-wrap: anywhere; }
.kpi-sub { font-size: 12px; color: var(--c-muted); margin: 0; }
@media (min-width: 1024px) { .kpi { padding: 20px; gap: 12px; } .kpi-value { font-size: 34px; } }

.rolebar { display: flex; gap: 2px; height: 16px; border-radius: var(--r-xs); overflow: hidden; background: var(--c-canvas); }
.rolebar > span { display: block; height: 100%; min-width: 2px; }
.activity-chart { display: flex; align-items: flex-end; gap: 5px; height: 160px; }
.activity-bar { flex: 1 1 0; min-width: 4px; background: var(--c-gold); border-radius: 2px 2px 0 0; position: relative; }
.activity-bar:hover { background: #c4963f; }
.activity-bar .activity-tip {
    display: none; position: absolute; bottom: calc(100% + 6px); left: 50%; transform: translateX(-50%);
    background: var(--c-ink); color: #fff; font-size: 11px; padding: 4px 8px; border-radius: var(--r-sm); white-space: nowrap; z-index: 5;
}
.activity-bar:hover .activity-tip { display: block; }
.activity-axis { display: flex; justify-content: space-between; font-size: 12px; color: var(--c-muted); }

/* ---------- Statystyki: raport analityczny (frontend/master_stats.js) ---------- */
.stats-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; }
.stats-toolbar .seg { flex: none; }
.stats-toolbar .seg-btn { padding: 8px 14px; }
.stats-live { display: inline-flex; align-items: center; gap: 10px; color: var(--c-ink); }
.stats-toolbar-actions { display: flex; gap: 8px; margin-left: auto; }
.stats-toolbar-actions .btn { min-height: 40px; padding: 8px 14px; }
@media (max-width: 640px) { .stats-toolbar-actions { margin-left: 0; width: 100%; } .stats-toolbar-actions .btn { flex: 1 1 0; } }
.stats-block { display: flex; flex-direction: column; gap: 12px; }
.stats-page.is-loading .lc, .stats-page.is-loading .kpi-value, .stats-page.is-loading .mini-value,
.stats-page.is-loading .hbars, .stats-page.is-loading .cols, .stats-page.is-loading .heatmap { opacity: .55; transition: opacity .2s ease; }
.stats-card-head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 12px 24px; }
.stats-card-head > .stack-8 { flex: 1 1 280px; }
.stats-split { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; }
@media (min-width: 900px) {
    .stats-split { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }
    .stats-split.stats-split-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.kpi-spark { height: 28px; margin-top: -2px; }
.kpi-sub .delta { font-weight: 600; font-variant-numeric: tabular-nums; }
.delta.is-good { color: var(--c-success); }
.delta.is-bad { color: var(--c-danger); }
.delta.is-flat { color: var(--c-muted); }

/* Zestawienie liczb przy wykresie */
.stats-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(92px, 1fr)); gap: 8px 20px; margin: 0; flex: 1 1 320px; min-width: 0; max-width: 560px; }
.stats-facts-row { max-width: none; }
.stats-facts .fact { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.stats-facts dt { font-size: 12px; color: var(--c-muted); }
.stats-facts dd { margin: 0; font-size: 16px; font-weight: 600; color: var(--c-ink); }

/* Małe wskaźniki w kartach */
.stats-minis { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
@media (min-width: 640px) { .stats-minis { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .stats-minis { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
.mini { background: var(--c-canvas); border-radius: var(--r-md); padding: 12px 14px; display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.mini-label { font-size: 12px; color: var(--c-muted); margin: 0; }
.mini-value { font-size: 20px; font-weight: 700; color: var(--c-ink); margin: 0; line-height: 1.2; overflow-wrap: anywhere; }

/* Wykres liniowy */
.lc { position: relative; min-height: 240px; border-radius: var(--r-md); outline: none; }
.lc.lc-sm { min-height: 170px; }
.lc:focus-visible { box-shadow: var(--focus-ring); }
.lc-svg { display: block; width: 100%; height: auto; overflow: visible; touch-action: pan-y; }
.lc-grid { stroke: var(--c-line); stroke-width: 1; }
.lc-base { stroke: var(--c-line-strong); stroke-width: 1; }
.lc-ytick, .lc-xtick { font-size: 11px; fill: var(--c-muted); font-variant-numeric: tabular-nums; }
.lc-cross { stroke: var(--c-ink); stroke-opacity: .35; stroke-width: 1; }
.lc-hit { cursor: crosshair; }
.lc-empty { position: absolute; inset: 0 0 28px 46px; display: flex; align-items: center; justify-content: center; text-align: center; padding: 12px; pointer-events: none; }
.lc-empty p { font-size: 13px; color: var(--c-muted); background: var(--c-surface); padding: 6px 10px; border-radius: var(--r-sm); margin: 0; }
.lc-legend { display: flex; flex-wrap: wrap; gap: 8px 18px; font-size: 13px; color: var(--c-muted); }
.lc-legend-item { display: inline-flex; align-items: center; gap: 8px; }
.lc-legend-item strong { color: var(--c-ink); font-weight: 600; }
.lc-legend-key { width: 16px; height: 2px; border-radius: 1px; flex: none; }
.lc-tip {
    position: fixed; left: 0; top: 0; z-index: 90; pointer-events: none; opacity: 0; transition: opacity .1s ease;
    background: var(--c-ink); color: #fff; border-radius: var(--r-md); padding: 8px 10px; box-shadow: var(--shadow-pop);
    font-size: 12px; line-height: 1.45; max-width: 280px;
}
.lc-tip.is-visible { opacity: 1; }
.lc-tip-title { margin: 0 0 4px; color: #c9d1e0; font-size: 11px; }
.lc-tip-row { margin: 0; display: flex; align-items: center; gap: 6px; white-space: nowrap; }
.lc-tip-row strong { font-weight: 700; font-variant-numeric: tabular-nums; }
.lc-tip-row span:last-child { color: #c9d1e0; }
.lc-tip-key { width: 12px; height: 2px; border-radius: 1px; flex: none; }

/* Słupki poziome */
.hbars { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.hbar { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; gap: 4px 12px; font-size: 13px; min-width: 0; }
.hbar-label { color: var(--c-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hbar-track { grid-column: 1 / -1; height: 8px; background: var(--c-canvas); border-radius: 0 4px 4px 0; overflow: hidden; }
.hbar-fill { display: block; height: 100%; background: var(--c-brand); border-radius: 0 4px 4px 0; }
.hbar-value { color: var(--c-muted); font-variant-numeric: tabular-nums; white-space: nowrap; text-align: right; }

/* Kolumny (histogram) */
.cols { display: flex; align-items: stretch; gap: 6px; height: 170px; }
.cols > p { margin: auto 0; }
.col { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 4px; outline: none; border-radius: var(--r-sm); }
.col:focus-visible { box-shadow: var(--focus-ring); }
.col-value { font-size: 12px; color: var(--c-ink); font-weight: 600; font-variant-numeric: tabular-nums; }
.col-plot { flex: 1 1 auto; width: 100%; display: flex; align-items: flex-end; justify-content: center; border-bottom: 1px solid var(--c-line-strong); }
.col-bar { width: min(24px, 80%); background: var(--c-brand); border-radius: 4px 4px 0 0; }
.col:hover .col-bar, .col:focus-visible .col-bar { background: var(--c-brand-hover); }
.col-label { font-size: 11px; color: var(--c-muted); text-align: center; line-height: 1.3; overflow-wrap: anywhere; }

/* Mapa cieplna: dzień tygodnia × godzina */
.heatmap { display: grid; grid-template-columns: 30px repeat(24, minmax(0, 1fr)); gap: 2px; }
.heat-corner { display: block; }
.heat-hour { font-size: 10px; color: var(--c-muted); text-align: left; font-variant-numeric: tabular-nums; }
.heat-day { font-size: 11px; color: var(--c-muted); align-self: center; }
.heat-cell { display: block; aspect-ratio: 1 / 1; min-height: 10px; border-radius: 3px; }
.heat-cell:hover { outline: 2px solid var(--c-ink); outline-offset: -1px; }
@media (min-width: 900px) { .heat-cell { aspect-ratio: auto; height: 26px; } }
.heat-legend { display: inline-flex; align-items: center; gap: 4px; }
.heat-swatch { width: 14px; height: 14px; border-radius: 3px; display: inline-block; }

/* Tabele raportu */
.stats-card .table td.td-num, .stats-card .table th.th-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.stats-card .table td { padding: 10px 14px; }
.stats-table-toggle summary { cursor: pointer; font-size: 13px; font-weight: 600; color: var(--c-brand); }
.stats-table-toggle[open] summary { margin-bottom: 12px; }
.stats-table-toggle .table-scroll { max-height: 320px; overflow-y: auto; border: 1px solid var(--c-line); border-radius: var(--r-md); }

/* ---------- Kafelki skrótów ---------- */
.tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.tile {
    background: #fff; border: 1px solid var(--c-line); border-radius: var(--r-lg);
    padding: 16px; display: flex; flex-direction: column; gap: 14px; text-align: left; min-width: 0;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.tile:hover { border-color: var(--c-brand-100); box-shadow: 0 6px 18px -12px rgba(64, 85, 200, .45); }
.tile-top { display: flex; justify-content: space-between; align-items: flex-start; color: var(--c-brand); }
.tile-top .tile-arrow { color: var(--c-muted); }
.tile-title { font-size: 14px; font-weight: 600; color: var(--c-ink); line-height: 1.5; margin: 0; }
.tile-desc { font-size: 12px; color: var(--c-muted); line-height: 1.5; margin: 0; }
@media (min-width: 1024px) { body:not(.view-mode-mobile) .tile { padding: 20px; } }

/* Karta obszaru pracy administratora (rozciągnięty link) */
.ws-card {
    position: relative; background: #fff; border: 1px solid var(--c-line); border-radius: var(--r-lg);
    padding: 20px; display: flex; flex-direction: column; gap: 14px; min-width: 0;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.ws-card:hover { border-color: var(--c-brand-100); box-shadow: 0 8px 22px -14px rgba(64, 85, 200, .5); }
.ws-card-link { position: absolute; inset: 0; z-index: 1; border-radius: var(--r-lg); border: 0; background: transparent; }
.ws-card .ws-inner-links { position: relative; z-index: 2; }
.ws-card-top { display: flex; justify-content: space-between; align-items: flex-start; }
.ws-icon { width: 42px; height: 42px; border-radius: 10px; background: var(--c-admin-50); color: var(--c-admin); display: flex; align-items: center; justify-content: center; flex: none; }
.ws-title { font-size: 20px; font-weight: 700; line-height: 1.3; color: var(--c-ink); margin: 0; display: flex; align-items: center; gap: 8px; }
.ws-desc { font-size: 14px; line-height: 1.5; color: var(--c-muted); margin: 0; }
@media (min-width: 1024px) { body:not(.view-mode-mobile) .ws-card { padding: 24px; gap: 18px; min-height: 245px; } }

/* Ikona w kwadracie (kontakt, wskazówki) */
.icon-tile { width: 40px; height: 40px; border-radius: 10px; background: var(--c-canvas); color: var(--c-brand); display: flex; align-items: center; justify-content: center; flex: none; }
.avatar { width: 44px; height: 44px; border-radius: 12px; background: var(--c-brand-50); color: var(--c-brand); display: flex; align-items: center; justify-content: center; font-size: 15px; font-weight: 600; flex: none; }
.san-mark { width: 64px; height: 64px; border-radius: 10px; background: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; flex: none; }
.san-mark-text { color: var(--c-san); font-size: 21px; font-weight: 700; line-height: 1.2; }
.san-mark-line { width: 32px; height: 3px; background: var(--c-san); }
@media (min-width: 1024px) {
    body:not(.view-mode-mobile) .san-mark { width: 72px; height: 72px; }
    body:not(.view-mode-mobile) .san-mark-text { font-size: 23px; }
    body:not(.view-mode-mobile) .san-mark-line { width: 34px; }
}
.san-accent { display: block; width: 24px; height: 3px; background: var(--c-san); flex: none; }

/* Wybór rodzaju (np. Usterka / Opinia) */
.choice-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.choice {
    display: flex; align-items: center; gap: 8px; min-height: 52px; padding: 12px; border-radius: var(--r-md);
    border: 1px solid var(--c-line); background: #fff; color: var(--c-muted); font-size: 13px; text-align: left; min-width: 0;
}
.choice:hover { border-color: var(--c-brand-100); }
.choice.is-active { background: var(--c-brand-50); border-color: var(--c-brand); color: var(--c-brand); font-weight: 600; }

/* ---------- Układ aplikacji ---------- */
#app-shell.app-shell { min-height: 100vh; min-height: 100dvh; display: flex; }
.app-main { flex: 1; min-width: 0; display: flex; flex-direction: column; min-height: 100vh; min-height: 100dvh; }
.app-content { flex: 1; width: 100%; box-sizing: border-box; padding: 24px 20px 28px; }
.app-content-inner { width: 100%; max-width: 720px; margin: 0 auto; }

/* Panel boczny: kolumna na desktopie, wysuwana szuflada na telefonie */
.app-sidebar {
    position: fixed; z-index: 60; top: 0; bottom: 0; left: 0;
    width: min(300px, 86vw); box-sizing: border-box;
    background: #fff; border-right: 1px solid var(--c-line);
    display: flex; flex-direction: column; gap: 28px;
    padding: 24px 18px 24px; overflow-y: auto; overscroll-behavior: contain;
    transform: translateX(-102%); transition: transform .22s ease;
}
body.drawer-open .app-sidebar { transform: translateX(0); box-shadow: var(--shadow-pop); }
.app-drawer-backdrop { position: fixed; inset: 0; z-index: 55; background: rgba(25, 36, 59, .45); }
.sb-brand { display: flex; align-items: center; justify-content: space-between; padding-left: 8px; gap: 12px; }
.sb-brand img { height: 42px; width: auto; display: block; }
.sb-close { display: inline-flex; }
.sb-menu { display: flex; flex-direction: column; gap: 6px; }
.sb-section { font-size: 10px; font-weight: 600; color: var(--c-subtle); letter-spacing: .02em; text-transform: uppercase; margin: 0 0 2px; }
.sb-item {
    display: flex; align-items: center; gap: 12px; width: 100%; min-height: 48px; padding: 12px;
    border-radius: var(--r-md); border: 0; background: #fff; color: var(--c-muted);
    font-size: 13px; font-weight: 500; text-align: left; line-height: 1.25;
    transition: background-color .15s ease, color .15s ease;
}
.sb-item:hover { background: var(--c-canvas); color: var(--c-ink); }
.sb-item.is-active { background: var(--c-brand-50); color: var(--c-brand); font-weight: 600; }
.sb-item .sb-label { flex: 1; min-width: 0; }
.sb-menu.is-compact .sb-item { min-height: 44px; font-weight: 400; }
.sb-menu.is-compact .sb-item.is-active { font-weight: 600; }
.sb-account { background: var(--c-canvas); border-radius: 10px; padding: 14px; display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.sb-account-name { font-size: 13px; font-weight: 600; line-height: 1.5; color: var(--c-ink); margin: 0; overflow-wrap: anywhere; }
.sb-account-meta { font-size: 12px; line-height: 1.5; color: var(--c-muted); margin: 0; overflow-wrap: anywhere; }
.sb-logout { display: inline-flex; align-items: center; gap: 10px; padding: 12px; border: 0; background: transparent; color: var(--c-muted); font-size: 13px; border-radius: var(--r-md); }
.sb-logout:hover { color: var(--c-danger); background: var(--c-danger-50); }
.sb-sign { display: flex; flex-direction: column; gap: 6px; padding: 0 12px; }
.sb-sign p { font-size: 11px; line-height: 1.5; color: var(--c-muted); margin: 0; }

/* Pasek górny (desktop) */
.app-topbar {
    display: none; height: var(--topbar-h); box-sizing: border-box; padding: 0 40px;
    background: #fff; border-bottom: 1px solid var(--c-line);
    align-items: center; justify-content: space-between; gap: 24px; position: sticky; top: 0; z-index: 40;
}
.crumbs { display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--c-muted); min-width: 0; }
.crumbs .crumb-home { border: 0; background: transparent; padding: 0; color: var(--c-muted); font-size: 13px; }
.crumbs .crumb-home:hover { color: var(--c-brand); }
.crumbs .crumb-current { color: var(--c-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.session { display: flex; align-items: center; gap: 20px; flex: none; }
.session-date { font-size: 13px; color: var(--c-muted); white-space: nowrap; }
.bell-btn {
    position: relative; width: 36px; height: 36px; border: 0; background: transparent; color: var(--c-muted);
    border-radius: var(--r-md); display: inline-flex; align-items: center; justify-content: center;
}
.bell-btn:hover { background: var(--c-canvas); color: var(--c-brand); }
.bell-btn [data-notif-count] { position: absolute; top: 0; right: 0; }

/* Nagłówek mobilny */
.app-mobilebar {
    display: flex; height: var(--mobilebar-h); box-sizing: border-box; padding: 0 20px; gap: 16px;
    background: #fff; border-bottom: 1px solid var(--c-line); align-items: center;
    position: sticky; top: 0; z-index: 40;
}
.app-mobilebar .mb-logo { flex: 1; min-width: 0; display: flex; align-items: center; }
.app-mobilebar .mb-logo img { height: 36px; width: auto; display: block; }
.mb-menu { width: 40px; height: 40px; margin-right: -8px; border: 0; background: transparent; color: var(--c-ink); border-radius: var(--r-md); display: inline-flex; align-items: center; justify-content: center; }
.mb-menu:hover { background: var(--c-canvas); }

/* Dolna nawigacja (telefon) */
.app-tabbar {
    position: fixed; z-index: 45; left: 0; right: 0; bottom: 0;
    background: #fff; border-top: 1px solid var(--c-line);
    padding: 8px 12px calc(12px + env(safe-area-inset-bottom, 0px));
    display: flex; gap: 0;
}
.tab-item {
    flex: 1 1 0; min-width: 0; height: 62px; border: 0; background: #fff; border-radius: 10px;
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px;
    color: var(--c-muted); font-size: 11px; font-weight: 500; line-height: 1.2;
}
.tab-item.is-active { background: var(--c-brand-50); color: var(--c-brand); font-weight: 600; }
.tab-item span:last-child { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
body.has-tabbar .app-main { padding-bottom: calc(var(--tabbar-h) + env(safe-area-inset-bottom, 0px)); }

/* Stopka (desktop) */
.app-footer { display: none; justify-content: space-between; gap: 16px; padding: 20px 40px; font-size: 11px; color: var(--c-subtle); }
.app-footer .footer-help { border: 0; background: transparent; padding: 0; color: var(--c-muted); font-size: 11px; }
.app-footer .footer-help:hover { color: var(--c-brand); text-decoration: underline; }

/* Widok gościa (logowanie): bez panelu aplikacji */
body.is-guest .app-sidebar,
body.is-guest .app-topbar,
body.is-guest .app-mobilebar,
body.is-guest .app-tabbar,
body.is-guest .app-footer,
body.is-guest .app-drawer-backdrop { display: none !important; }
body.is-guest .app-content { padding: 0; }
body.is-guest .app-content-inner { max-width: none; }
body.is-guest .app-main { padding-bottom: 0; }

/* Desktop (≥1024 px, o ile nie wymuszono widoku mobilnego) */
@media (min-width: 1024px) {
    body:not(.view-mode-mobile) .app-sidebar {
        position: sticky; top: 0; height: 100vh; height: 100dvh; transform: none; box-shadow: none;
        width: var(--sidebar-w); flex: none; padding: 30px 18px 24px; gap: 30px; z-index: 30;
    }
    body:not(.view-mode-mobile) .sb-close,
    body:not(.view-mode-mobile) .app-drawer-backdrop,
    body:not(.view-mode-mobile) .app-mobilebar,
    body:not(.view-mode-mobile) .app-tabbar { display: none !important; }
    body:not(.view-mode-mobile) .app-topbar { display: flex; }
    body:not(.view-mode-mobile) .app-footer { display: flex; }
    body:not(.view-mode-mobile).has-tabbar .app-main { padding-bottom: 0; }
    body:not(.view-mode-mobile) .app-content { padding: 40px; }
    body:not(.view-mode-mobile) .app-content-inner { max-width: 1240px; }
    body:not(.view-mode-mobile) .app-footer > * { max-width: 1240px; }
}
/* Wymuszony widok mobilny na szerokim ekranie: wąska kolumna jak na telefonie */
@media (min-width: 640px) {
    body.view-mode-mobile .app-content-inner { max-width: 480px; }
}

/* ---------- Układy dwukolumnowe (≥1280 px) ---------- */
.split { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.split > * { min-width: 0; }
.stack { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.stack-16 { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.stack-12 { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.stack-8 { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.grid-2 { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.grid-3 { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
@media (min-width: 640px) {
    .grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .grid-3.sm-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
    .grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 1280px) {
    body:not(.view-mode-mobile) .split { display: grid; gap: 24px; align-items: start; grid-template-columns: minmax(0, 1fr) var(--aside, 360px); }
}

/* ---------- Okna dialogowe ---------- */
.modal {
    position: fixed; inset: 0; z-index: 70; background: rgba(25, 36, 59, .5);
    display: flex; align-items: center; justify-content: center; padding: 16px;
    overflow-y: auto;
}
.modal-panel {
    background: #fff; border-radius: var(--r-xl); border: 1px solid var(--c-line); box-shadow: var(--shadow-pop);
    width: 100%; max-width: 480px; max-height: calc(100vh - 32px); max-height: calc(100dvh - 32px); overflow-y: auto;
    padding: 24px; display: flex; flex-direction: column; gap: 20px; box-sizing: border-box; margin: auto;
}
.modal-panel.is-wide { max-width: 640px; }
.modal-panel.is-xwide { max-width: 960px; }
.modal-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.modal-title { font-size: 20px; font-weight: 700; line-height: 1.3; color: var(--c-ink); margin: 0; }
.modal-sub { font-size: 13px; color: var(--c-muted); margin: 4px 0 0; line-height: 1.5; }
.modal-close {
    width: 40px; height: 40px; flex: none; border: 0; border-radius: var(--r-md); background: transparent; color: var(--c-muted);
    display: inline-flex; align-items: center; justify-content: center; font-size: 22px; line-height: 1; margin: -8px -8px 0 0;
}
.modal-close:hover { background: var(--c-canvas); color: var(--c-ink); }
.modal-actions { display: flex; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
@media (max-width: 639.98px) {
    .modal { padding: 0; align-items: flex-end; }
    .modal-panel { border-radius: var(--r-xl) var(--r-xl) 0 0; max-height: 92vh; max-height: 92dvh; padding: 20px; margin: 0; }
    .modal-actions > .btn { flex: 1 1 auto; }
}

/* Powiadomienie (toast) */
.toast {
    position: fixed; left: 50%; bottom: calc(var(--tabbar-h) + 16px); transform: translateX(-50%); z-index: 90;
    max-width: min(92vw, 520px); padding: 12px 16px; border-radius: var(--r-md); font-size: 13px; font-weight: 600;
    color: #fff; background: var(--c-ink); box-shadow: var(--shadow-pop);
}
@media (min-width: 1024px) { body:not(.view-mode-mobile) .toast { bottom: 32px; } }
.toast-ok { background: var(--c-success); }
.toast-error { background: var(--c-danger); }
.toast-warn { background: var(--c-warn); }

/* Podpowiedzi autouzupełniania */
.suggest {
    position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 80; background: #fff;
    border: 1px solid var(--c-line); border-radius: var(--r-md); box-shadow: var(--shadow-pop);
    max-height: 220px; overflow-y: auto; font-size: 13px;
}
.suggest-item { padding: 10px 12px; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 8px; border-bottom: 1px solid var(--c-line); color: var(--c-ink); }
.suggest-item:last-child { border-bottom: 0; }
.suggest-item:hover { background: var(--c-brand-50); }
.suggest-item.is-new { color: var(--c-warn); font-weight: 600; font-size: 12px; }

/* Stan ładowania / pusty */
.empty { text-align: center; color: var(--c-muted); font-size: 13px; padding: 28px 16px; background: #fff; border: 1px dashed var(--c-line); border-radius: var(--r-lg); }
.loading { text-align: center; color: var(--c-subtle); font-size: 13px; padding: 28px 16px; }

/* Szczegóły (audyt, traceback) */
details.disclosure > summary { list-style: none; cursor: pointer; }
details.disclosure > summary::-webkit-details-marker { display: none; }
.diff-row { display: grid; grid-template-columns: minmax(0, 1fr); gap: 4px; padding: 8px 0; border-bottom: 1px solid var(--c-line); font-size: 12px; }
.diff-row:last-child { border-bottom: 0; }
@media (min-width: 640px) { .diff-row { grid-template-columns: 160px minmax(0, 1fr) minmax(0, 1fr); gap: 8px; align-items: center; } }
.diff-old { color: var(--c-danger); background: var(--c-danger-50); padding: 2px 6px; border-radius: var(--r-xs); text-decoration: line-through; overflow-wrap: anywhere; }
.diff-new { color: var(--c-success); background: var(--c-success-50); padding: 2px 6px; border-radius: var(--r-xs); font-weight: 600; overflow-wrap: anywhere; }
.diff-same { color: var(--c-muted); padding: 2px 6px; overflow-wrap: anywhere; }
.code-block { background: var(--c-canvas); border-radius: var(--r-md); padding: 16px; font-size: 13px; line-height: 1.6; color: var(--c-ink); overflow-x: auto; white-space: pre-wrap; overflow-wrap: anywhere; }
.code-block-label { font-size: 11px; font-weight: 600; color: var(--c-muted); text-transform: uppercase; margin: 0 0 6px; }
pre.trace { margin: 8px 0 0; padding: 12px; border-radius: var(--r-md); background: var(--c-ink); color: #d7e2ff; font-size: 11px; line-height: 1.5; max-height: 240px; overflow: auto; white-space: pre-wrap; }

/* ---------- Ekran logowania ---------- */
.login { min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; background: var(--c-canvas); }
.login-header {
    height: 68px; box-sizing: border-box; padding: 0 20px; background: #fff; border-bottom: 1px solid var(--c-line);
    display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
.login-header img { height: 42px; width: auto; display: block; }
.login-header-side { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; text-align: right; }
.login-header-side .l1 { font-size: 12px; color: var(--c-muted); }
.login-header-side .l2 { font-size: 11px; color: var(--c-muted); opacity: .7; }
.login-header-uni { display: none; align-items: center; gap: 12px; font-size: 13px; color: var(--c-muted); }
.login-main { flex: 1; padding: 24px 20px; box-sizing: border-box; display: flex; flex-direction: column; gap: 32px; }
.login-zone { width: 100%; max-width: 480px; margin: 0 auto; }
.login-card { padding: 24px; gap: 24px; }
.login-title { font-size: 28px; font-weight: 700; line-height: 1.3; margin: 0; color: var(--c-ink); }
.login-intro { font-size: 14px; color: var(--c-muted); margin: 0; line-height: 1.5; }
.login-field-label { font-size: 14px; font-weight: 600; color: var(--c-ink); margin: 0; }
.login-forgot { display: flex; justify-content: flex-end; min-height: 44px; align-items: center; }
.login-forgot .link { font-size: 14px; }
.login-submit { min-height: 52px; font-size: 16px; gap: 10px; }
.login-mobile-info { width: 100%; max-width: 480px; margin: 0 auto; display: flex; flex-direction: column; gap: 12px; padding: 0 4px; }
.login-mobile-info .t1 { font-size: 13px; font-weight: 600; color: var(--c-ink); margin: 0; }
.login-mobile-info .t2 { font-size: 12px; color: var(--c-muted); margin: 0; line-height: 1.5; }
.login-mobile-info .uni { display: flex; align-items: center; gap: 12px; font-size: 12px; color: var(--c-muted); margin-top: 12px; }
.login-footer { display: none; height: 60px; padding: 0 64px; align-items: center; justify-content: space-between; font-size: 12px; color: var(--c-muted); }
.login-footer .author { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }
.login-footer .author .l2 { opacity: .7; }
.login-hero-panel { background: var(--c-navy); color: #fff; border-radius: var(--r-xl); padding: 40px; display: none; flex-direction: column; gap: 36px; }
.login-hero-eyebrow { font-size: 12px; font-weight: 600; color: var(--c-navy-ink); margin: 0; }
.login-hero-title { font-size: 40px; font-weight: 700; line-height: 1.2; margin: 0; }
.login-hero-text { font-size: 15px; line-height: 1.6; color: var(--c-navy-ink); margin: 0; }
.login-module { display: flex; align-items: center; gap: 16px; }
.login-module img { width: 44px; height: 44px; flex: none; display: block; }
.login-module-title { font-size: 15px; font-weight: 600; color: #fff; margin: 0; }
.login-module-text { font-size: 13px; line-height: 1.5; color: var(--c-navy-ink); margin: 4px 0 0; }
.login-hero-sep { height: 1px; background: var(--c-navy-line); }
@media (min-width: 640px) {
    .login-card { padding: 32px; }
}
@media (min-width: 1024px) {
    body:not(.view-mode-mobile) .login-header { height: 76px; padding: 0 64px; }
    body:not(.view-mode-mobile) .login-header img { height: 48px; }
    body:not(.view-mode-mobile) .login-header-side { display: none; }
    body:not(.view-mode-mobile) .login-header-uni { display: flex; }
    body:not(.view-mode-mobile) .login-mobile-info { display: none; }
    body:not(.view-mode-mobile) .login-footer { display: flex; }
    body:not(.view-mode-mobile) .login-card { padding: 40px; }
    body:not(.view-mode-mobile) .login-title { font-size: 32px; }
}

/* Drobne narzędzia */
.row { display: flex; align-items: center; gap: 12px; min-width: 0; }
.row-wrap { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; min-width: 0; }
.row-between { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; min-width: 0; }
.grow { flex: 1 1 auto; min-width: 0; }
.nowrap { white-space: nowrap; }
.w-full { width: 100%; }
.mt-0 { margin-top: 0; }
.status-line { font-size: 12px; color: var(--c-muted); margin: 0; line-height: 1.5; }
.status-line.is-ok { color: var(--c-success); font-weight: 600; }
.status-line.is-error { color: var(--c-danger); font-weight: 600; }
.badge-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: currentColor; }

/* ==========================================================================
   Układy poszczególnych ekranów
   ========================================================================== */

/* Start studenta: kolejność sekcji na telefonie (zajęcia → skróty → studia → powiadomienia),
   na szerokim ekranie dwie kolumny jak w projekcie */
.dash-layout { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.dash-col-main, .dash-col-aside { display: contents; }
.dash-upcoming { order: 1; }
.dash-shortcuts { order: 2; }
.dash-profile { order: 3; }
.dash-notify { order: 4; }
.dash-desktop-only { display: none; }
@media (min-width: 1024px) {
    body:not(.view-mode-mobile) .dash-desktop-only { display: inline-flex; }
    body:not(.view-mode-mobile) .dash-mobile-only { display: none; }
}
@media (min-width: 1280px) {
    body:not(.view-mode-mobile) .dash-layout { display: grid; grid-template-columns: minmax(0, 1fr) 352px; gap: 24px; align-items: start; }
    body:not(.view-mode-mobile) .dash-col-main,
    body:not(.view-mode-mobile) .dash-col-aside { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
    body:not(.view-mode-mobile) .dash-col-main { gap: 18px; }
    body:not(.view-mode-mobile) .dash-col-main > .dash-profile { margin-top: 2px; }
}
@media (min-width: 1024px) and (max-width: 1279.98px) {
    body:not(.view-mode-mobile) .tiles { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* Karta parkingowa */
.parking-card { align-items: center; text-align: center; gap: 16px; border-radius: var(--r-xl); padding: 24px; }
.parking-icon { width: 64px; height: 64px; border-radius: var(--r-xl); background: var(--c-brand-50); color: var(--c-brand); display: flex; align-items: center; justify-content: center; flex: none; }
.parking-title { font-size: 20px; font-weight: 600; line-height: 1.5; color: var(--c-brand); margin: 0; }
@media (min-width: 1024px) {
    body:not(.view-mode-mobile) .parking-card { align-items: flex-start; text-align: left; padding: 32px; border-radius: var(--r-xl); }
    body:not(.view-mode-mobile) .parking-card .parking-icon { display: none; }
    body:not(.view-mode-mobile) .parking-title { font-size: 26px; font-weight: 700; line-height: 1.3; color: var(--c-ink); }
}

/* Ustawienia: telefon — konto, powiadomienia, kierunek, wsparcie; desktop — dwie kolumny */
.settings-layout { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.settings-col-main, .settings-col-aside { display: contents; }
.s-account { order: 1; }
.s-push { order: 2; }
.s-groups, .s-role { order: 3; }
.s-support { order: 4; }
@media (min-width: 1280px) {
    body:not(.view-mode-mobile) .settings-layout { display: grid; grid-template-columns: minmax(0, 1fr) 388px; gap: 24px; align-items: start; }
    body:not(.view-mode-mobile) .settings-col-main,
    body:not(.view-mode-mobile) .settings-col-aside { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
}

/* Zakładki „Więcej” (Ustawienia · Kontakt · Pomoc) — tylko telefon, student i wykładowca */
.more-tabs { display: flex; }
body[data-role="admin"] .more-tabs,
body[data-role="master"] .more-tabs { display: none; }
@media (min-width: 1024px) {
    body:not(.view-mode-mobile) .more-tabs { display: none; }
}

/* Kontakt */
.contact-hero { gap: 24px; }
.contact-uni-name { font-size: 21px; font-weight: 600; line-height: 1.3; color: #fff; margin: 0; overflow-wrap: anywhere; }
.contact-value { font-size: 16px; font-weight: 600; line-height: 1.5; color: var(--c-ink); margin: 0; overflow-wrap: anywhere; }
@media (min-width: 1024px) {
    body:not(.view-mode-mobile) .contact-hero { padding: 32px; }
    body:not(.view-mode-mobile) .contact-uni-name { font-size: 25px; }
}

/* Obszary pracy administratora */
.ws-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
@media (min-width: 768px) {
    .ws-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 24px; row-gap: 16px; }
    .ws-grid .ws-wide { grid-column: 1 / -1; }
}
@media (min-width: 1024px) {
    body:not(.view-mode-mobile) .ws-grid .ws-wide { min-height: 0; }
}

/* Wyszukiwarka */
.search-box {
    display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 0 12px;
    background: #fff; border: 1px solid var(--c-line); border-radius: var(--r-md); color: var(--c-muted);
    transition: border-color .15s ease, box-shadow .15s ease;
}
.search-box:focus-within { border-color: var(--c-brand); box-shadow: var(--focus-ring); }
.search-input { flex: 1; min-width: 0; border: 0; outline: none; background: transparent; font-size: 14px; color: var(--c-ink); padding: 12px 0; }

/* Filtry kont, audytu */
.users-filters { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; align-items: stretch; }
@media (min-width: 768px) { .users-filters { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.audit-filter-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
@media (min-width: 640px) { .audit-filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1280px) { .audit-filter-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* Podział ról */
.role-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
@media (min-width: 768px) { .role-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.role-stats p { margin: 0; display: flex; align-items: center; gap: 6px; }
.role-stat-value { font-size: 24px; font-weight: 700; line-height: 1.3; color: var(--c-ink); margin: 4px 0 0; }

/* Przypisania (administrator) */
.assign-current { background: var(--c-canvas); border-radius: var(--r-md); padding: 14px 12px; display: flex; flex-direction: column; gap: 6px; }
.assign-row { display: flex; gap: 12px; align-items: stretch; flex-wrap: wrap; }
.assign-row > .fbox { flex: 1 1 260px; }
.assign-row > .btn { align-self: center; }

/* Dolna nawigacja: zestaw kart dla roli */
.tabbar-set { display: flex; width: 100%; }

/* Filtry planu administratora */
.admin-filter-card { padding: 20px; }
@media (min-width: 1024px) { body:not(.view-mode-mobile) .admin-filter-card { padding: 24px; } }

/* Karta zgłoszenia (Technik) */
.ticket-card { text-align: left; width: 100%; cursor: pointer; }
.ticket-card:hover { border-color: var(--c-brand-100); }
.ticket-card.is-selected { background: var(--c-brand-50); border: 1px solid var(--c-brand); }
.ticket-title { font-size: 17px; font-weight: 700; color: var(--c-ink); line-height: 1.3; margin: 0; overflow-wrap: anywhere; }
.ticket-text { font-size: 14px; color: var(--c-ink); line-height: 1.5; margin: 0; overflow-wrap: anywhere; white-space: pre-line; }
.detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.detail-grid p { margin: 0; }

/* Karta parametru (Technik) */
.config-key { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 17px; font-weight: 600; color: var(--c-ink); margin: 0; overflow-wrap: anywhere; }
.config-cat-raw { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12px; color: var(--c-muted); }

/* Pusty stan z ikoną */
.empty-state { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 12px; padding: 48px 20px; }
.empty-state .parking-icon { width: 64px; height: 64px; }
.empty-state-title { font-size: 20px; font-weight: 700; color: var(--c-ink); margin: 0; }
@media (min-width: 1024px) { body:not(.view-mode-mobile) .empty-state { padding: 80px 24px; } body:not(.view-mode-mobile) .empty-state-title { font-size: 24px; } }

/* Wiersz miesiąca w planowaniu wsadowym */
.batch-month-row { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; align-items: stretch; }
@media (min-width: 640px) { .batch-month-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; } }
.batch-month-row .btn-icon { align-self: center; }
.batch-date { background: #fff; border: 1px solid var(--c-line); border-radius: var(--r-md); padding: 12px; display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.batch-date.is-past { border-color: #f1dfbf; }
.batch-date.is-conflict { border-color: var(--c-danger); background: var(--c-danger-50); }
.batch-date.is-conflict .fbox-label { color: var(--c-danger); }

/* Pomocnicze */
.inline-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; }
.inline-actions .sep { color: var(--c-subtle); }
.td-sub { display: block; font-size: 12px; color: var(--c-muted); margin-top: 2px; font-weight: 400; }
.td-wrap { white-space: normal; }

/* Kolory tekstu (na końcu arkusza: klasa narzędziowa wygrywa z kolorem komponentu) */
.text-ink { color: var(--c-ink); }
.text-muted { color: var(--c-muted); }
.text-subtle { color: var(--c-subtle); }
.text-brand { color: var(--c-brand); }
.text-san { color: var(--c-san); }
.text-admin { color: var(--c-admin); }
.text-warn { color: var(--c-warn); }
.text-danger { color: var(--c-danger); }
.text-success { color: var(--c-success); }

/* Lektorat bez przypisanej grupy językowej */
.lesson-place.lesson-language-notice { color: var(--c-warn); font-weight: 600; }

/* Odwołania: zajęcia odwołane w planie (decyzja administratora) i lista w panelu administratora */
.lesson.is-cancelled .lesson-start, .lesson.is-cancelled .lesson-subject { color: var(--c-muted); text-decoration: line-through; }
.lesson.is-cancelled .lesson-bar { background: var(--c-danger); }
.lesson.is-cancelled .lesson-time-caption { color: var(--c-danger); font-weight: 600; }
.chip-cancelled { background: var(--c-danger-50); color: var(--c-danger); font-weight: 700; }
.cancel-source { font-style: italic; overflow-wrap: anywhere; }
.cancel-status.is-pending { background: #fdf3e3; color: var(--c-warn); }
.cancel-status.is-approved { background: var(--c-danger-50); color: var(--c-danger); }
.cancel-status.is-rejected { background: var(--c-brand-50); color: var(--c-brand); }
.cancel-status.is-expired { background: var(--c-line); color: var(--c-muted); }
.cancel-list { display: flex; flex-direction: column; gap: 10px; }
.cancel-item {
    display: grid; grid-template-columns: 24px 96px minmax(0, 1fr) auto; gap: 12px; align-items: start;
    padding: 14px 16px; border: 1px solid var(--c-line); border-radius: var(--r-md); background: #fff;
}
.cancel-item.is-selected { border-color: var(--c-brand); background: var(--c-brand-50); }
.cancel-when { display: flex; flex-direction: column; gap: 2px; font-size: 13px; }
.cancel-main { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.cancel-main p { margin: 0; }
.cancel-subject { font-size: 15px; font-weight: 700; color: var(--c-ink); overflow-wrap: anywhere; }
.cancel-actions { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
@media (max-width: 720px) {
    .cancel-item { grid-template-columns: 24px minmax(0, 1fr); }
    .cancel-main, .cancel-actions { grid-column: 2; }
    .cancel-actions { justify-content: flex-start; }
}

/* ---------- E-Kolokwia (exams.js) ---------- */
.chip-exam { font-weight: 700; }
.chip-exam.is-kolokwium { background: var(--c-warn-50); color: var(--c-warn); }
.chip-exam.is-egzamin { background: var(--c-admin-50); color: var(--c-admin); }
.exam-list { display: flex; flex-direction: column; gap: 12px; }
.exam-card {
    border: 1px solid var(--c-line); border-left: 4px solid #d79a3c; border-radius: var(--r-lg);
    padding: 14px 16px; display: flex; flex-direction: column; gap: 6px; background: var(--c-surface); min-width: 0;
}
.exam-card.is-egzamin { border-left-color: var(--c-admin); }
.exam-card.is-past { opacity: .72; }
.exam-card-head { display: flex; justify-content: space-between; gap: 8px; }
.exam-title { font-size: 16px; font-weight: 700; line-height: 1.35; margin: 0; color: var(--c-ink); overflow-wrap: anywhere; }
.exam-when { display: flex; align-items: flex-start; gap: 6px; font-size: 13px; line-height: 18px; margin: 0; color: var(--c-ink); }
.exam-when .ico { --ico-w: 16px; margin-top: 1px; }
.exam-when .ico { color: var(--c-muted); }
.exam-scope { font-size: 13px; }
.exam-scope summary { cursor: pointer; color: var(--c-brand); font-weight: 600; width: fit-content; }
.exam-scope p { margin: 6px 0 0; white-space: pre-wrap; overflow-wrap: anywhere; color: var(--c-ink); line-height: 1.5; }
.exam-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 4px; }
.exam-day-group { display: flex; flex-direction: column; gap: 10px; }
.exam-day-label { font-size: 13px; font-weight: 700; color: var(--c-muted); margin: 0; text-transform: capitalize; }
.exam-past summary { cursor: pointer; }
.exam-past[open] summary { margin-bottom: 12px; }
.exam-kind .seg-btn { min-width: 120px; }
.exam-choices { border: 0; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.exam-choices[hidden], [data-ex-room-text][hidden], .exam-pills[hidden] { display: none; }
.exam-check { display: flex; align-items: flex-start; gap: 10px; font-size: 13px; line-height: 1.45; cursor: pointer; }
.exam-check input { margin-top: 3px; flex: none; }
.exam-pills { display: flex; flex-wrap: wrap; gap: 8px; }
.exam-pill { display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border: 1px solid var(--c-line-strong); border-radius: 999px; font-size: 13px; cursor: pointer; }
.exam-pill:has(input:checked) { background: var(--c-brand-50); border-color: var(--c-brand); color: var(--c-brand); }
.exam-scope-box .fbox-control { min-height: 96px; resize: vertical; }
.exam-mini-list { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; }
.exam-mini { display: grid; grid-template-columns: auto 1fr; gap: 2px 10px; align-items: center; text-align: left; border: 1px solid var(--c-line); border-radius: var(--r-md); padding: 10px 12px; background: var(--c-surface); }
.exam-mini .chip { grid-row: span 2; }
.exam-mini-title { font-weight: 600; font-size: 14px; overflow-wrap: anywhere; }
.exam-mini:hover { border-color: var(--c-brand); }

/* Kalendarz administratora */
.exam-filters { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
@media (min-width: 768px) { .exam-filters { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.exam-cal-layout { display: grid; gap: 20px; grid-template-columns: minmax(0, 1fr); align-items: start; }
@media (min-width: 1100px) { body:not(.view-mode-mobile) .exam-cal-layout { grid-template-columns: minmax(0, 1fr) 380px; } }
.exam-cal-head { display: flex; align-items: center; gap: 8px; }
.exam-cal-title { flex: 1; text-align: center; }
.exam-cal-legend { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin: 12px 0; }
.exam-cal-legend .exam-dot:not(:first-child) { margin-left: 10px; }
.exam-cal { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.exam-cal-wd { font-size: 11px; font-weight: 700; color: var(--c-muted); text-align: center; padding: 4px 0; text-transform: uppercase; }
.exam-cal-day {
    position: relative; min-height: 76px; border: 1px solid var(--c-line); border-radius: var(--r-md); background: var(--c-surface);
    display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; padding: 6px 8px; text-align: left; color: var(--c-ink);
}
.exam-cal-day:hover { border-color: var(--c-brand); }
.exam-cal-day.is-out { background: var(--c-canvas); color: var(--c-subtle); }
.exam-cal-day.is-today .exam-cal-num { background: var(--c-brand); color: #fff; border-radius: 999px; padding: 0 7px; }
.exam-cal-day.has-events { background: var(--c-brand-50); }
.exam-cal-day.is-selected { border-color: var(--c-brand); box-shadow: var(--focus-ring); }
.exam-cal-num { font-size: 13px; font-weight: 600; line-height: 22px; }
.exam-cal-count { position: absolute; top: 6px; right: 8px; font-size: 12px; font-weight: 700; color: var(--c-brand); }
.exam-dots { display: inline-flex; gap: 4px; }
.exam-dot { display: inline-block; width: 8px; height: 8px; border-radius: 999px; background: #d79a3c; flex: none; }
.exam-dot.is-egzamin { background: var(--c-admin); }
.exam-cal-list { display: none; flex-direction: column; gap: 8px; }
.exam-cal-list-day { display: flex; justify-content: space-between; align-items: center; gap: 10px; border: 1px solid var(--c-line); border-radius: var(--r-md); padding: 12px; background: var(--c-surface); text-align: left; text-transform: capitalize; }
.exam-cal-list-day.is-selected { border-color: var(--c-brand); background: var(--c-brand-50); }
@media (max-width: 767.98px) {
    .exam-cal { display: none; }
    .exam-cal-list { display: flex; }
}
body.view-mode-mobile .exam-cal { display: none; }
body.view-mode-mobile .exam-cal-list { display: flex; }
.exam-day-panel { display: flex; flex-direction: column; gap: 14px; }
.exam-day-panel .card-head h2 { text-transform: capitalize; }
@media (min-width: 1100px) { body:not(.view-mode-mobile) .exam-day-panel { position: sticky; top: calc(var(--topbar-h) + 16px); max-height: calc(100vh - var(--topbar-h) - 32px); overflow-y: auto; } }
[data-ex-dynamic] { display: flex; flex-direction: column; gap: 14px; }
[data-ex-dynamic]:empty { display: none; }