/* MEDICI Tím v0.4: "Liquid Glass web" design system.
   Glass lives only on the navigation/control layer (sidebar, tab bar, toolbar controls,
   toast, auth card). Content sits on solid surfaces. Loaded after legacy.css on purpose:
   it maps the legacy tokens onto the new ones so the Neruda views under "Viac" match. */

:root {
  --mx-bg: #F2F2F7;
  --mx-surface: #FFFFFF;
  --mx-surface-2: #F7F7FA;
  --mx-fill: rgba(118, 118, 128, .14);
  --mx-fill-2: rgba(118, 118, 128, .08);
  --mx-label: #1C1C1E;
  --mx-label-2: #5B5B60;
  --mx-label-3: #8A8A8F;
  --mx-sep: rgba(60, 60, 67, .16);
  --mx-accent: #1A7353;
  --mx-accent-ink: #FFFFFF;
  --mx-accent-tint: rgba(26, 115, 83, .12);
  --mx-blue: #0062CC;
  --mx-orange: #B35300;
  --mx-green: #1C7A33;
  --mx-red: #C8001E;
  --mx-purple: #8233A8;
  --mx-gray: #8E8E93;
  --mx-dot-blue: #0A84FF;
  --mx-dot-orange: #FF9F0A;
  --mx-dot-green: #30C759;
  --mx-dot-red: #FF3B30;
  --mx-glass: rgba(255, 255, 255, .72);
  --mx-glass-strong: rgba(255, 255, 255, .84);
  --mx-glass-border: rgba(255, 255, 255, .75);
  --mx-glass-edge: rgba(0, 0, 0, .07);
  --mx-shadow-glass: 0 10px 30px rgba(0, 0, 0, .10), 0 1px 3px rgba(0, 0, 0, .06);
  --mx-shadow-card: 0 1px 2px rgba(0, 0, 0, .05), 0 0 0 .5px rgba(0, 0, 0, .03);
  --mx-shadow-sheet: 0 24px 60px rgba(0, 0, 0, .28);
  --mx-blur: blur(24px) saturate(180%);
  --mx-r-sheet: 28px;
  --mx-r-card: 20px;
  --mx-r-inner: 14px;
  --mx-ease: cubic-bezier(.2, .8, .2, 1);
  --mx-tabbar-h: 64px;
  --mx-side-w: 248px;
  --mx-font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display", system-ui, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color-scheme: light;
}

html[data-theme="dark"] {
  --mx-bg: #000000;
  --mx-surface: #1C1C1E;
  --mx-surface-2: #2C2C2E;
  --mx-fill: rgba(118, 118, 128, .28);
  --mx-fill-2: rgba(118, 118, 128, .18);
  --mx-label: #FFFFFF;
  --mx-label-2: #AEAEB5;
  --mx-label-3: #8D8D93;
  --mx-sep: rgba(84, 84, 88, .62);
  --mx-accent: #3CCB8E;
  --mx-accent-ink: #00261B;
  --mx-accent-tint: rgba(60, 203, 142, .17);
  --mx-blue: #5AA9FF;
  --mx-orange: #FFB340;
  --mx-green: #4CD964;
  --mx-red: #FF6B6B;
  --mx-purple: #DA8FFF;
  --mx-glass: rgba(36, 36, 38, .68);
  --mx-glass-strong: rgba(36, 36, 38, .86);
  --mx-glass-border: rgba(255, 255, 255, .12);
  --mx-glass-edge: rgba(255, 255, 255, .06);
  --mx-shadow-glass: 0 10px 30px rgba(0, 0, 0, .55), 0 1px 3px rgba(0, 0, 0, .4);
  --mx-shadow-card: 0 0 0 .5px rgba(255, 255, 255, .06);
  --mx-shadow-sheet: 0 24px 60px rgba(0, 0, 0, .7);
  color-scheme: dark;
}

/* Legacy tokens → new tokens (keeps Neruda views under "Viac" consistent). */
:root, html[data-theme] {
  --ink: var(--mx-label);
  --muted: var(--mx-label-2);
  --line: var(--mx-sep);
  --paper: var(--mx-surface);
  --mint: var(--mx-bg);
  --surface-app: var(--mx-bg);
  --surface-content: var(--mx-surface);
  --surface-raised: var(--mx-surface);
  --surface-subtle: var(--mx-surface-2);
  --surface-detail: var(--mx-surface);
  --surface-overlay: var(--mx-glass-strong);
  --accent: var(--mx-accent);
  --forest: var(--mx-accent);
  --forest-2: var(--mx-accent);
  --sage: var(--mx-accent-tint);
  --sage-2: var(--mx-fill-2);
  --on-accent: var(--mx-accent-ink);
  --danger: var(--mx-red);
  --warn: var(--mx-orange);
  --radius: var(--mx-r-card);
  --radius-control: 12px;
  --border-subtle: var(--mx-sep);
  --border-control: var(--mx-sep);
  --glass: var(--mx-glass);
  --glass-strong: var(--mx-glass-strong);
  --glass-border: var(--mx-glass-border);
  --sidebar-glass: var(--mx-glass);
  --shadow: var(--mx-shadow-card);
  --shadow-soft: var(--mx-shadow-card);
  --shadow-control: none;
}

/* ---------- Base ---------- */
html {
  background: var(--mx-bg);
  color: var(--mx-label);
  font-family: var(--mx-font);
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
body {
  margin: 0;
  background: var(--mx-bg);
  color: var(--mx-label);
  font-family: var(--mx-font);
  font-size: 17px;
  line-height: 1.35;
  letter-spacing: -.01em;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
body::before, body::after { content: none !important; display: none !important; }
*, *::before, *::after { box-sizing: border-box; }
button, input, select, textarea { font-family: inherit; letter-spacing: inherit; }
button { color: inherit; -webkit-tap-highlight-color: transparent; }
[hidden] { display: none !important; }
.ui-icon {
  width: 22px; height: 22px; flex: none;
  fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
}
:root :is(button, input, select, textarea, a, [tabindex]):focus-visible {
  outline: 3px solid color-mix(in srgb, var(--mx-accent) 45%, transparent);
  outline-offset: 2px;
  box-shadow: none;
}
:root #content.mx-content:focus, :root #content.mx-content:focus-visible { outline: none; }
.skip-link {
  position: fixed; left: 12px; top: -80px; z-index: 200;
  padding: 10px 16px; border-radius: 999px; background: var(--mx-accent); color: var(--mx-accent-ink); font-weight: 600;
}
.skip-link:focus { top: 12px; }

/* ---------- Glass material ---------- */
.mx-sidebar, .mx-tabbar, .mx-search-btn, .mx-glass-btn, div.mx-toast, .mx-auth-card {
  background: var(--mx-glass);
  -webkit-backdrop-filter: var(--mx-blur);
  backdrop-filter: var(--mx-blur);
  border: .5px solid var(--mx-glass-border);
  box-shadow: var(--mx-shadow-glass), inset 0 1px 0 rgba(255, 255, 255, .28);
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .mx-mobile-header { background: var(--mx-bg); }
  .mx-sidebar, .mx-tabbar, .mx-search-btn, .mx-glass-btn, div.mx-toast, .mx-auth-card { background: var(--mx-glass-strong); }
}
html[data-glass="reduced"] .mx-mobile-header { -webkit-backdrop-filter: none; backdrop-filter: none; background: var(--mx-bg); }
html[data-glass="reduced"] .mx-sidebar, html[data-glass="reduced"] .mx-tabbar, html[data-glass="reduced"] .mx-search-btn,
html[data-glass="reduced"] .mx-glass-btn, html[data-glass="reduced"] div.mx-toast, html[data-glass="reduced"] .mx-auth-card {
  -webkit-backdrop-filter: none; backdrop-filter: none; background: var(--mx-surface); border-color: var(--mx-sep);
}
@media (prefers-reduced-transparency: reduce) {
  .mx-mobile-header { -webkit-backdrop-filter: none; backdrop-filter: none; background: var(--mx-bg); }
  .mx-sidebar, .mx-tabbar, .mx-search-btn, .mx-glass-btn, div.mx-toast, .mx-auth-card {
    -webkit-backdrop-filter: none; backdrop-filter: none; background: var(--mx-surface); border-color: var(--mx-sep);
  }
}

/* ---------- Buttons ---------- */
.mx-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 44px; padding: 0 18px; border: 0; border-radius: 999px;
  font-size: 16px; font-weight: 600; line-height: 1.1; cursor: pointer; text-decoration: none; white-space: nowrap;
  transition: transform .18s var(--mx-ease), background-color .18s var(--mx-ease), opacity .18s;
}
.mx-btn .ui-icon { width: 20px; height: 20px; stroke-width: 2.2; }
.mx-btn:active:not(:disabled) { transform: scale(.97); }
.mx-btn:disabled { opacity: .45; cursor: default; }
.mx-btn-primary { background: var(--mx-accent); color: var(--mx-accent-ink); box-shadow: 0 6px 16px color-mix(in srgb, var(--mx-accent) 30%, transparent); }
.mx-btn-primary:hover:not(:disabled) { background: color-mix(in srgb, var(--mx-accent) 88%, #000); }
.mx-btn-tinted { background: var(--mx-accent-tint); color: var(--mx-accent); }
.mx-btn-tinted:hover:not(:disabled) { background: color-mix(in srgb, var(--mx-accent) 20%, transparent); }
.mx-btn-plain { background: var(--mx-fill-2); color: var(--mx-label); }
.mx-btn-plain:hover:not(:disabled) { background: var(--mx-fill); }
.mx-btn-danger { background: color-mix(in srgb, var(--mx-red) 12%, transparent); color: var(--mx-red); }
.mx-btn-danger:hover:not(:disabled) { background: color-mix(in srgb, var(--mx-red) 18%, transparent); }
.mx-btn-small { padding: 0 14px; font-size: 15px; }
.mx-btn-wide { width: 100%; }
.mx-icon-btn {
  display: inline-grid; place-items: center; width: 44px; height: 44px; flex: none;
  border: 0; border-radius: 999px; background: transparent; color: var(--mx-label); cursor: pointer;
  transition: background-color .18s var(--mx-ease), transform .18s var(--mx-ease);
}
.mx-icon-btn:hover { background: var(--mx-fill-2); }
.mx-icon-btn:active { transform: scale(.94); }

/* ---------- Brand ---------- */
.mx-brand { display: flex; align-items: center; gap: 10px; padding: 4px 6px; min-width: 0; }
.mx-brand-mark {
  display: grid; place-items: center; width: 36px; height: 36px; flex: none; border-radius: 10px;
  background: linear-gradient(145deg, color-mix(in srgb, var(--mx-accent) 80%, #fff), var(--mx-accent));
  color: var(--mx-accent-ink); font-weight: 800; font-size: 18px; letter-spacing: 0;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35), 0 2px 6px color-mix(in srgb, var(--mx-accent) 35%, transparent);
}
.mx-brand-text { display: flex; flex-direction: column; min-width: 0; }
.mx-brand-text strong { font-size: 17px; letter-spacing: .02em; }
.mx-brand-text small { font-size: 12px; color: var(--mx-label-2); }
.mx-brand-compact strong { font-size: 17px; letter-spacing: .02em; }

/* ---------- Shell: desktop ---------- */
.mx-shell { min-height: 100vh; min-height: 100dvh; }
.mx-sidebar {
  position: fixed; top: 12px; bottom: 12px; left: 12px; z-index: 30;
  width: var(--mx-side-w); display: flex; flex-direction: column; gap: 14px;
  padding: 14px 10px; border-radius: 26px; overflow-y: auto;
}
.mx-side-nav { display: flex; flex-direction: column; gap: 2px; }
.mx-nav-item {
  position: relative; display: flex; align-items: center; gap: 12px; width: 100%;
  min-height: 44px; padding: 0 12px; border: 0; border-radius: 13px; background: transparent;
  color: var(--mx-label); font-size: 16px; font-weight: 500; text-align: left; cursor: pointer;
  transition: background-color .18s var(--mx-ease), color .18s var(--mx-ease);
}
.mx-nav-item:hover { background: var(--mx-fill-2); }
.mx-nav-item.active { background: var(--mx-accent-tint); color: var(--mx-accent); font-weight: 650; }
.mx-nav-icon { position: relative; display: grid; place-items: center; width: 24px; height: 24px; flex: none; }
.mx-nav-sub { font-size: 15px; min-height: 44px; color: var(--mx-label-2); }
.mx-nav-sub .ui-icon { width: 20px; height: 20px; }
.mx-nav-group { margin: 14px 12px 4px; font-size: 12px; font-weight: 600; color: var(--mx-label-3); }
.mx-badge {
  position: absolute; top: -6px; right: -10px; min-width: 18px; height: 18px; padding: 0 5px;
  display: grid; place-items: center; border-radius: 9px; background: var(--mx-dot-red); color: #fff;
  font-size: 11px; font-weight: 700; line-height: 1; box-shadow: 0 0 0 2px var(--mx-surface);
}
.mx-sidebar-foot { margin-top: auto; display: flex; flex-direction: column; gap: 8px; padding-top: 8px; border-top: .5px solid var(--mx-sep); }
.mx-user { display: flex; align-items: center; gap: 10px; padding: 6px 6px 0; min-width: 0; }
.mx-user-text { display: flex; flex-direction: column; min-width: 0; }
.mx-user-text strong { font-size: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mx-user-text small { font-size: 12px; color: var(--mx-label-2); }
.mx-sidebar-actions { display: flex; align-items: center; justify-content: space-between; gap: 8px; }

.mx-toolbar {
  position: sticky; top: 0; z-index: 20;
  margin-left: calc(var(--mx-side-w) + 24px);
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 14px 32px 10px;
  background: linear-gradient(var(--mx-bg) 55%, color-mix(in srgb, var(--mx-bg) 0%, transparent));
}
.mx-toolbar-title { font-size: 17px; font-weight: 650; opacity: 0; }
.mx-toolbar-actions { display: flex; align-items: center; gap: 10px; }
.mx-search-btn {
  display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px 0 14px;
  border-radius: 999px; color: var(--mx-label-2); font-size: 15px; cursor: pointer;
}
.mx-search-btn kbd { font: 600 12px var(--mx-font); padding: 2px 6px; border-radius: 6px; background: var(--mx-fill-2); color: var(--mx-label-2); }
.mx-content {
  margin-left: calc(var(--mx-side-w) + 24px);
  padding: 0 32px 64px;
  max-width: calc(1180px + var(--mx-side-w) + 24px);
  outline: none;
}
.mx-mobile-header, .mx-tabbar, .mx-fab { display: none; }

/* ---------- Shell: mobile ---------- */
@media (max-width: 899px) {
  .mx-sidebar, .mx-toolbar { display: none; }
  /* Liquid Glass navigation bar: blurred material, content scrolls UNDER it (never shows through crisp). */
  .mx-mobile-header {
    display: flex; position: sticky; top: 0; z-index: 25; align-items: center; justify-content: space-between;
    padding: calc(env(safe-area-inset-top) + 8px) 16px 8px;
    background: color-mix(in srgb, var(--mx-bg) 94%, transparent);
    -webkit-backdrop-filter: var(--mx-blur); backdrop-filter: var(--mx-blur);
    border-bottom: .5px solid transparent;
    transition: border-color .2s var(--mx-ease), background-color .2s var(--mx-ease);
  }
  body.mx-scrolled .mx-mobile-header { border-bottom-color: var(--mx-sep); }
  /* Scroll-edge fade above the floating tab bar: content fades out instead of being cut by the bar. */
  .mx-shell::after {
    content: ""; position: fixed; left: 0; right: 0; bottom: 0; z-index: 39; pointer-events: none;
    height: calc(var(--mx-tabbar-h) + env(safe-area-inset-bottom) + 30px);
    background: linear-gradient(to bottom, color-mix(in srgb, var(--mx-bg) 0%, transparent), color-mix(in srgb, var(--mx-bg) 92%, transparent) 55%, var(--mx-bg));
  }
  .mx-mobile-actions { display: flex; gap: 8px; }
  .mx-content { margin: 0; padding: 4px 16px calc(var(--mx-tabbar-h) + env(safe-area-inset-bottom) + 56px); max-width: none; }
  .mx-tabbar {
    display: flex; position: fixed; z-index: 40; left: 12px; right: 12px; margin: 0 auto; max-width: 520px;
    bottom: calc(env(safe-area-inset-bottom) + 10px); height: var(--mx-tabbar-h);
    padding: 6px; gap: 2px; border-radius: 999px; justify-content: space-around;
  }
  .mx-tabbar .mx-nav-item {
    flex: 1 1 0; min-width: 0; flex-direction: column; justify-content: center; gap: 2px;
    min-height: 52px; padding: 0 2px; border-radius: 999px; font-size: 11px; font-weight: 600; color: var(--mx-label-2);
  }
  .mx-tabbar .mx-nav-item.active { color: var(--mx-accent); background: var(--mx-accent-tint); }
  .mx-tabbar .mx-nav-label { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
  /* F13d-2: + is a round button in the tab bar row (iOS 26 style accessory), so it never covers list text. */
  body.is-vedenie .mx-tabbar { right: calc(var(--mx-tabbar-h) + 20px); margin: 0; max-width: none; }
  .mx-fab {
    display: grid; place-items: center; position: fixed; z-index: 41; right: 12px;
    bottom: calc(env(safe-area-inset-bottom) + 10px);
    width: var(--mx-tabbar-h); height: var(--mx-tabbar-h); border: 0; border-radius: 50%; cursor: pointer;
    background: var(--mx-accent); color: var(--mx-accent-ink);
    box-shadow: 0 10px 24px color-mix(in srgb, var(--mx-accent) 40%, transparent), inset 0 1px 0 rgba(255, 255, 255, .3);
    transition: transform .18s var(--mx-ease);
  }
  .mx-fab[hidden] { display: none !important; }
  .mx-fab .ui-icon { width: 26px; height: 26px; stroke-width: 2.4; }
  .mx-fab:active { transform: scale(.94); }
}

/* ---------- Page header ---------- */
.mx-page { display: flex; flex-direction: column; gap: 0; min-width: 0; }
.mx-page-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px 16px; flex-wrap: wrap; margin: 4px 0 20px; }
.mx-page-titles { min-width: 0; }
.mx-large-title, .mx-page-head .mx-large-title { margin: 0; font-size: 34px; line-height: 41px; font-weight: 700; letter-spacing: -.022em; color: var(--mx-label); }
.mx-subtitle { margin: 4px 0 0; font-size: 15px; line-height: 20px; color: var(--mx-label-2); }
.mx-page-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.mx-space-picker {
  min-height: 44px; padding: 0 36px 0 14px; border: 0; border-radius: 999px; background-color: var(--mx-fill-2);
  color: var(--mx-label); font-size: 15px; font-weight: 600; max-width: 260px;
}
@media (max-width: 899px) {
  .mx-large-title { font-size: 30px; line-height: 36px; }
  .mx-page-head { margin-bottom: 16px; }
  .mx-page-actions { width: 100%; }
  .mx-page-actions .mx-segmented { width: 100%; }
}

/* ---------- Sections, grouped lists, rows ---------- */
.mx-section { margin: 0 0 28px; min-width: 0; }
.mx-col .mx-section { margin-bottom: 0; }
.mx-section-head { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; padding: 0 4px 10px; min-height: 28px; }
.mx-section-title { min-width: 0; overflow-wrap: anywhere; }
.mx-section-title { margin: 0; font-size: 20px; line-height: 25px; font-weight: 650; letter-spacing: -.01em; text-transform: none; }
.mx-section-note { font-size: 13px; color: var(--mx-label-2); margin-left: 4px; }
@media (max-width: 599px) { .mx-section-note { order: 3; flex-basis: 100%; margin-left: 0; } }
.mx-section-head .mx-btn { margin-left: auto; }
.mx-count { display: inline-grid; place-items: center; min-width: 24px; height: 22px; padding: 0 7px; border-radius: 11px; background: var(--mx-fill); color: var(--mx-label-2); font-size: 13px; font-weight: 650; }
.mx-group { background: var(--mx-surface); border-radius: var(--mx-r-card); overflow: hidden; box-shadow: var(--mx-shadow-card); }
.mx-row { position: relative; display: flex; align-items: center; min-height: 56px; }
.mx-row + .mx-row::before { content: ""; position: absolute; top: 0; left: 52px; right: 0; height: .5px; background: var(--mx-sep); }
.mx-row-main {
  flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 12px; width: 100%;
  min-height: 56px; padding: 10px 14px 10px 16px; border: 0; background: transparent; color: inherit;
  font: inherit; text-align: left; cursor: pointer; transition: background-color .15s var(--mx-ease);
}
.mx-row-main:hover:not(:disabled) { background: var(--mx-fill-2); }
.mx-row-main:active:not(:disabled) { background: var(--mx-fill); }
.mx-row-main:disabled { cursor: default; opacity: .6; }
.mx-row-static { cursor: default; }
.mx-row-static:hover { background: transparent !important; }
.mx-row-text { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.mx-row-title {
  font-size: 17px; line-height: 22px; font-weight: 500; overflow-wrap: anywhere;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.mx-row-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; font-size: 13px; line-height: 18px; color: var(--mx-label-2); }
.mx-row-chevron { width: 16px; height: 16px; color: var(--mx-label-3); stroke-width: 2.4; }
.mx-row-empty { padding: 14px 16px; color: var(--mx-label-2); font-size: 15px; }
.mx-row-icon { display: grid; place-items: center; width: 32px; height: 32px; flex: none; border-radius: 9px; background: var(--mx-gray); color: #fff; }
.mx-row-icon .ui-icon { width: 19px; height: 19px; stroke-width: 2; }
.mx-tint-orange, .mx-tint-meetings, .mx-tint-meeting-prep { background: #F28C00; }
.mx-tint-purple, .mx-tint-decisions, .mx-tint-coaching { background: #A550D6; }
.mx-tint-people, .mx-tint-team, .mx-tint-search { background: #0A7AF0; }
.mx-tint-projects, .mx-tint-knowledge { background: #5856D6; }
.mx-tint-commitments, .mx-tint-today { background: #1E9E63; }
.mx-tint-agents { background: #E0457B; }
.mx-tint-private, .mx-tint-settings { background: #7C7C82; }
.mx-meta-owner { display: inline-flex; align-items: center; gap: 6px; }
.mx-meta-due.is-overdue, .mx-mini-due.is-overdue, .is-overdue { color: var(--mx-red); font-weight: 600; }
.mx-meta-q { color: var(--mx-orange); font-weight: 600; }
.mx-prio { color: var(--mx-red); font-weight: 800; margin-right: 5px; }
.mx-task-row.is-done .mx-row-title { color: var(--mx-label-2); }
.mx-row-actions { display: flex; align-items: center; gap: 6px; padding: 0 12px 0 0; flex: none; }
.mx-quick {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-width: 44px; height: 44px; padding: 0 12px;
  border: 0; border-radius: 999px; background: var(--mx-fill-2); color: var(--mx-label); font-size: 14px; font-weight: 600; cursor: pointer;
  transition: background-color .15s var(--mx-ease), transform .15s var(--mx-ease);
}
.mx-quick .ui-icon { width: 18px; height: 18px; stroke-width: 2.2; }
.mx-quick:hover { background: var(--mx-fill); }
.mx-quick:active { transform: scale(.95); }
.mx-quick-done { color: var(--mx-green); background: color-mix(in srgb, var(--mx-dot-green) 14%, transparent); }
@media (max-width: 599px) {
  .mx-quick span { display: none; }
  .mx-quick { padding: 0; width: 44px; }
  .mx-row-actions { padding-right: 8px; gap: 4px; }
}

/* ---------- Status ---------- */
.mx-status-dot { width: 14px; height: 14px; flex: none; border-radius: 50%; border: 2px solid var(--mx-label-3); background: transparent; }
.mx-status-dot.mx-st-doing { border-color: var(--mx-dot-blue); background: radial-gradient(circle, var(--mx-dot-blue) 45%, transparent 50%); }
.mx-status-dot.mx-st-blocked { border-color: var(--mx-dot-orange); background: var(--mx-dot-orange); }
.mx-status-dot.mx-st-done { border-color: var(--mx-dot-green); background: var(--mx-dot-green); }
.mx-chip { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 11px; border-radius: 999px; font-size: 13px; font-weight: 650; background: var(--mx-fill-2); color: var(--mx-label-2); }
.mx-chip .mx-dot { width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.mx-chip.mx-st-doing { background: color-mix(in srgb, var(--mx-dot-blue) 14%, transparent); color: var(--mx-blue); }
.mx-chip.mx-st-blocked { background: color-mix(in srgb, var(--mx-dot-orange) 16%, transparent); color: var(--mx-orange); }
.mx-chip.mx-st-done { background: color-mix(in srgb, var(--mx-dot-green) 16%, transparent); color: var(--mx-green); }
.mx-badge-soft { display: inline-flex; align-items: center; height: 22px; padding: 0 9px; border-radius: 999px; font-size: 12px; font-weight: 650; white-space: nowrap; flex: none; }
.mx-badge-orange { background: color-mix(in srgb, var(--mx-dot-orange) 18%, transparent); color: var(--mx-orange); }
.mx-badge-green { background: color-mix(in srgb, var(--mx-dot-green) 16%, transparent); color: var(--mx-green); }
.mx-badge-gray { background: var(--mx-fill); color: var(--mx-label-2); }

/* ---------- Avatars ---------- */
.mx-av {
  display: inline-grid; place-items: center; flex: none; width: 32px; height: 32px; border-radius: 50%;
  font-size: 13px; font-weight: 700; letter-spacing: 0; color: #fff; background: var(--mx-gray);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25);
}
.mx-av-xs { width: 20px; height: 20px; font-size: 9px; }
.mx-av-sm { width: 34px; height: 34px; font-size: 13px; }
.mx-av-md { width: 42px; height: 42px; font-size: 15px; }
.mx-av-lg { width: 64px; height: 64px; font-size: 22px; }
.mx-av-c0 { background: #1E8E5A; } .mx-av-c1 { background: #0A6FD6; } .mx-av-c2 { background: #B5651D; } .mx-av-c3 { background: #8E44AD; }
.mx-av-c4 { background: #C0392B; } .mx-av-c5 { background: #16808C; } .mx-av-c6 { background: #5856D6; } .mx-av-c7 { background: #B03A75; }
.mx-av-cnone { background: var(--mx-fill); color: var(--mx-label-2); }

/* ---------- Segmented control ---------- */
.mx-segmented { display: inline-flex; align-items: stretch; gap: 2px; padding: 2px; border-radius: 999px; background: var(--mx-fill); max-width: 100%; overflow-x: auto; scrollbar-width: none; }
.mx-segmented::-webkit-scrollbar { display: none; }
.mx-segmented > button {
  flex: 1 0 auto; min-height: 44px; padding: 0 16px; border: 0; border-radius: 999px; background: transparent;
  color: var(--mx-label); font-size: 15px; font-weight: 550; cursor: pointer; white-space: nowrap;
  transition: background-color .2s var(--mx-ease), box-shadow .2s var(--mx-ease);
}
.mx-segmented > button.is-on { background: var(--mx-surface); box-shadow: 0 2px 6px rgba(0, 0, 0, .12), 0 0 0 .5px rgba(0, 0, 0, .04); font-weight: 650; }
html[data-theme="dark"] .mx-segmented > button.is-on { background: #5A5A5F; }
.mx-segmented > button:disabled { opacity: .5; cursor: default; }

/* ---------- Today ---------- */
.mx-today-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 24px; align-items: start; }
.mx-col { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
@media (max-width: 1099px) { .mx-today-grid { grid-template-columns: minmax(0, 1fr); } }
.mx-hero {
  position: relative; display: flex; flex-direction: column; gap: 16px; padding: 20px;
  border-radius: 24px; background: var(--mx-surface); box-shadow: var(--mx-shadow-card); overflow: hidden;
}
.mx-hero::before {
  content: ""; position: absolute; inset: 0 0 auto 0; height: 4px;
  background: linear-gradient(90deg, var(--mx-accent), color-mix(in srgb, var(--mx-accent) 30%, var(--mx-dot-blue)));
}
.mx-hero-main { display: flex; flex-direction: column; gap: 10px; padding: 0; border: 0; background: transparent; text-align: left; cursor: pointer; color: inherit; font: inherit; }
.mx-hero-kicker { font-size: 15px; font-weight: 650; color: var(--mx-accent); }
.mx-hero-title { font-size: 24px; line-height: 30px; font-weight: 700; letter-spacing: -.015em; overflow-wrap: anywhere; }
.mx-hero-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; font-size: 15px; }
.mx-hero-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.mx-hero-actions .mx-btn { flex: 1 1 140px; }
.mx-strip { display: flex; gap: 10px; overflow-x: auto; padding: 2px 2px 6px; scroll-snap-type: x proximity; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.mx-strip::-webkit-scrollbar { display: none; }
.mx-strip-item {
  position: relative; flex: none; display: flex; align-items: center; gap: 10px; width: 228px; min-height: 64px;
  padding: 10px 14px 10px 10px; border: 0; border-radius: 18px; background: var(--mx-surface); box-shadow: var(--mx-shadow-card);
  text-align: left; cursor: pointer; scroll-snap-align: start; transition: transform .15s var(--mx-ease);
}
.mx-strip-item:active { transform: scale(.98); }
.mx-strip-text { display: flex; flex-direction: column; min-width: 0; }
.mx-strip-text strong { font-size: 15px; }
.mx-strip-text small { font-size: 13px; color: var(--mx-label-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx-strip-alert { position: absolute; top: 6px; right: 8px; min-width: 20px; height: 20px; padding: 0 6px; display: grid; place-items: center; border-radius: 10px; background: var(--mx-dot-red); color: #fff; font-size: 12px; font-weight: 700; }

/* ---------- Team board ---------- */
.mx-team-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 16px; margin-bottom: 28px; }
.mx-person-card {
  display: flex; flex-direction: column; gap: 14px; min-width: 0; padding: 16px;
  border-radius: var(--mx-r-card); background: var(--mx-surface); box-shadow: var(--mx-shadow-card);
}
.mx-pc-head { display: flex; align-items: center; gap: 12px; min-width: 0; }
.mx-pc-name { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.mx-pc-name strong { font-size: 17px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mx-pc-name small { font-size: 13px; color: var(--mx-label-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mx-pc-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.mx-stat { display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 8px 2px; border-radius: 12px; background: var(--mx-fill-2); color: var(--mx-label-2); font-size: 12px; text-align: center; }
.mx-stat b { font-size: 20px; line-height: 24px; color: var(--mx-label); font-weight: 700; }
.mx-stat.is-warn b { color: var(--mx-orange); }
.mx-stat.is-bad b { color: var(--mx-red); }
.mx-pc-body { display: flex; flex-direction: column; gap: 10px; }
.mx-mini { display: flex; flex-direction: column; gap: 2px; }
.mx-mini-title { margin: 0 0 4px; padding: 0 4px; font-size: 13px; font-weight: 650; color: var(--mx-label-2); text-transform: none; letter-spacing: 0; }
.mx-mini-item {
  display: flex; align-items: center; gap: 10px; width: 100%; min-height: 44px; padding: 8px 10px;
  border: 0; border-radius: 12px; background: transparent; color: var(--mx-label); font-size: 15px; line-height: 20px; text-align: left; cursor: pointer;
}
.mx-mini-item:hover { background: var(--mx-fill-2); }
.mx-mini-item:active { background: var(--mx-fill); }
.mx-mini-text { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.mx-mini-due { flex: none; font-size: 12px; color: var(--mx-label-2); }
.mx-mini-empty { margin: 0; padding: 4px 10px 6px; font-size: 14px; color: var(--mx-label-3); }
.mx-pc-foot { padding-top: 12px; border-top: .5px solid var(--mx-sep); }
.mx-pc-foot .mx-btn { width: 100%; }
.mx-add-card {
  align-items: center; justify-content: center; gap: 8px; min-height: 180px; text-align: center; cursor: pointer;
  border: 1.5px dashed var(--mx-sep); background: transparent; box-shadow: none; color: var(--mx-label-2); font: inherit;
  transition: background-color .15s var(--mx-ease);
}
.mx-add-card:hover { background: var(--mx-fill-2); }
.mx-add-card strong { color: var(--mx-label); font-size: 17px; }
.mx-add-card small { font-size: 13px; max-width: 26ch; }
.mx-add-icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: var(--mx-accent-tint); color: var(--mx-accent); }

/* ---------- Empty ---------- */
.mx-empty {
  display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 36px 20px; text-align: center;
  border-radius: var(--mx-r-card); background: var(--mx-surface); box-shadow: var(--mx-shadow-card);
}
.mx-empty-mark { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: var(--mx-accent-tint); color: var(--mx-accent); }
.mx-empty-mark .ui-icon { width: 28px; height: 28px; stroke-width: 2.2; }
.mx-empty h2 { margin: 6px 0 0; font-size: 20px; }
.mx-empty p { margin: 0 0 8px; color: var(--mx-label-2); max-width: 40ch; font-size: 15px; }

/* ---------- Sheets (dialogs) ---------- */
dialog.mx-sheet {
  width: min(600px, calc(100vw - 32px)); max-width: none; max-height: min(88vh, 940px);
  margin: auto; padding: 0; border: 0; border-radius: var(--mx-r-sheet); overflow: auto; overscroll-behavior: contain;
  background: var(--mx-surface); color: var(--mx-label); box-shadow: var(--mx-shadow-sheet);
}
dialog.mx-sheet[open] { animation: mx-sheet-in .28s var(--mx-ease); }
dialog.mx-sheet::backdrop { background: rgba(0, 0, 0, .34); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
@keyframes mx-sheet-in { from { opacity: 0; transform: translateY(14px) scale(.985); } to { opacity: 1; transform: none; } }
.mx-sheet-grabber { display: none; }
.mx-sheet-head {
  position: sticky; top: 0; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 14px 12px 10px 22px; background: color-mix(in srgb, var(--mx-surface) 92%, transparent);
  -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
}
dialog.mx-sheet .mx-sheet-head h2 { margin: 0; font-size: 21px; line-height: 26px; font-weight: 700; color: var(--mx-label); letter-spacing: -.01em; overflow-wrap: anywhere; }
.mx-sheet-head .mx-icon-btn { background: var(--mx-fill-2); }
.mx-sheet-body { padding: 4px 22px 24px; }
@media (max-width: 899px) {
  dialog.mx-sheet {
    width: 100%; max-width: 100%; margin: auto 0 0; border-radius: var(--mx-r-sheet) var(--mx-r-sheet) 0 0;
    max-height: calc(100dvh - env(safe-area-inset-top) - 10px); padding-bottom: env(safe-area-inset-bottom);
  }
  dialog.mx-sheet[open] { animation: mx-sheet-up .32s var(--mx-ease); }
  dialog.mx-sheet.mx-sheet-tall { height: calc(100dvh - env(safe-area-inset-top) - 10px); }
  .mx-sheet-grabber { display: block; width: 38px; height: 5px; margin: 8px auto 0; border-radius: 3px; background: var(--mx-fill); }
  .mx-sheet-head { padding: 8px 10px 8px 18px; }
  .mx-sheet-body { padding: 4px 16px 24px; }
}
@keyframes mx-sheet-up { from { transform: translateY(40%); opacity: .4; } to { transform: none; opacity: 1; } }
.mx-sheet-lead { margin: 0; font-size: 15px; line-height: 20px; color: var(--mx-label-2); }
.mx-sheet-actions { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 10px; margin-top: 4px; }
@media (max-width: 599px) { .mx-sheet-actions .mx-btn { flex: 1 1 auto; } }

/* ---------- Forms ---------- */
.mx-form { display: flex; flex-direction: column; gap: 14px; }
.mx-field { display: flex; flex-direction: column; gap: 6px; }
.mx-field > span { font-size: 13px; font-weight: 650; color: var(--mx-label-2); }
.mx-hint { font-style: normal; font-weight: 400; color: var(--mx-label-3); margin-left: 4px; }
:where(.mx-auth) :where(input, select, textarea),
:where(dialog.mx-sheet) :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea),
:where(.mx-content) :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
  width: 100%; min-height: 44px; padding: 10px 14px; border: 1px solid var(--mx-sep); border-radius: 12px;
  background: var(--mx-surface-2); color: var(--mx-label); font-size: 17px; line-height: 22px; box-shadow: none;
  transition: border-color .15s var(--mx-ease), background-color .15s var(--mx-ease);
}
dialog.mx-sheet textarea, .mx-content textarea { min-height: 88px; resize: vertical; }
.mx-auth input:focus, dialog.mx-sheet :is(input, select, textarea):focus, .mx-content :is(input, select, textarea):focus { border-color: var(--mx-accent); background: var(--mx-surface); }
.mx-auth input[readonly], dialog.mx-sheet input[readonly] { color: var(--mx-label-2); }
.mx-content select, dialog.mx-sheet select, .mx-space-picker {
  -webkit-appearance: none; appearance: none; padding-right: 36px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A8A8F' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center; background-size: 16px;
}
.mx-password { position: relative; display: block; }
.mx-password input { padding-right: 52px; }
.mx-password .password-toggle { position: absolute; top: 0; right: 0; }

/* ---------- Auth ---------- */
.mx-auth {
  min-height: 100vh; min-height: 100dvh; display: grid; place-items: center; padding: 24px 16px;
  background:
    radial-gradient(900px 520px at 8% -8%, color-mix(in srgb, var(--mx-accent) 24%, transparent), transparent 65%),
    radial-gradient(700px 480px at 108% 108%, color-mix(in srgb, var(--mx-dot-blue) 18%, transparent), transparent 65%),
    var(--mx-bg);
}
.mx-auth-card { width: min(420px, 100%); display: flex; flex-direction: column; gap: 18px; padding: 28px 24px; border-radius: 30px; }
.mx-auth-title { margin: 0; font-size: 28px; line-height: 34px; font-weight: 700; letter-spacing: -.02em; }
.mx-auth-help { margin: 0; font-size: 14px; line-height: 19px; color: var(--mx-label-2); }
.mx-notice { padding: 10px 14px; border-radius: 12px; background: color-mix(in srgb, var(--mx-red) 12%, transparent); color: var(--mx-red); font-size: 15px; }

/* ---------- Intake (Zadať → Rozdeliť → Potvrdiť) ---------- */
.mx-intake textarea { min-height: 200px; font-size: 17px; line-height: 24px; }
.mx-hints { display: flex; flex-wrap: wrap; gap: 6px; }
.mx-hint-chip { padding: 4px 10px; border-radius: 999px; background: var(--mx-fill-2); color: var(--mx-label-2); font-size: 13px; }
.mx-intake-summary { display: flex; flex-wrap: wrap; gap: 8px; }
.mx-sum-chip { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px 0 6px; border-radius: 999px; background: var(--mx-fill-2); font-size: 14px; font-weight: 650; }
.mx-sum-chip.is-warn { padding-left: 8px; background: color-mix(in srgb, var(--mx-dot-orange) 16%, transparent); color: var(--mx-orange); }
.mx-sum-chip .ui-icon { width: 18px; height: 18px; }
.mx-proposals { display: flex; flex-direction: column; }
.mx-proposal { display: flex; flex-direction: column; gap: 6px; padding: 10px 12px 12px 14px; border-bottom: .5px solid var(--mx-sep); }
.mx-proposal:last-child { border-bottom: 0; }
.mx-proposal.is-unassigned { box-shadow: inset 3px 0 0 var(--mx-dot-orange); }
.mx-proposal.is-removed { opacity: .45; }
.mx-proposal.is-removed .mx-proposal-title { text-decoration: line-through; }
.mx-proposal-top { display: flex; align-items: center; gap: 6px; }
dialog.mx-sheet .mx-proposal-title { flex: 1 1 auto; min-width: 0; min-height: 44px; padding: 10px 4px; border: 0; background: transparent; font-size: 17px; font-weight: 600; line-height: 1.3; resize: none; overflow: hidden; white-space: pre-wrap; overflow-wrap: anywhere; }
dialog.mx-sheet .mx-proposal-title:focus { background: var(--mx-fill-2); }
.mx-proposal-top { align-items: flex-start; }
.mx-proposal-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
dialog.mx-sheet select.mx-chip-select, dialog.mx-sheet input.mx-chip-date {
  width: auto; min-height: 44px; padding: 0 34px 0 14px; border: 0; border-radius: 999px; background-color: var(--mx-fill-2);
  font-size: 15px; font-weight: 600;
}
dialog.mx-sheet input.mx-chip-date { padding: 0 12px; max-width: 170px; }
.mx-chip-toggle {
  display: grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 50%; cursor: pointer;
  background: var(--mx-fill-2); color: var(--mx-label-3); font-size: 19px; font-weight: 800;
}
.mx-chip-toggle.is-on { background: color-mix(in srgb, var(--mx-dot-red) 16%, transparent); color: var(--mx-red); }
.mx-reason { font-size: 13px; color: var(--mx-label-2); }
.mx-remove { margin-left: auto; color: var(--mx-label-3); }

/* ---------- Task detail ---------- */
.mx-detail { display: flex; flex-direction: column; gap: 16px; }
.mx-segmented-status { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); width: 100%; }
.mx-segmented-status > button { padding: 0 6px; font-size: 14px; }
.mx-segmented-status > .mx-seg-doing.is-on { color: var(--mx-blue); }
.mx-segmented-status > .mx-seg-blocked.is-on { color: var(--mx-orange); }
.mx-segmented-status > .mx-seg-done.is-on { color: var(--mx-green); }
.mx-evidence { padding: 12px; border-radius: 16px; background: color-mix(in srgb, var(--mx-dot-green) 10%, transparent); }
.mx-detail-meta { background: var(--mx-surface-2); box-shadow: none; }
.mx-detail-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 52px; padding: 6px 14px 6px 16px; }
.mx-detail-row + .mx-detail-row { border-top: .5px solid var(--mx-sep); }
.mx-detail-label { font-size: 15px; color: var(--mx-label-2); flex: none; }
.mx-detail-value { display: inline-flex; align-items: center; gap: 8px; min-width: 0; font-size: 15px; font-weight: 600; text-align: right; }
dialog.mx-sheet select.mx-select { width: auto; max-width: 240px; min-height: 44px; border-radius: 12px; font-size: 15px; font-weight: 600; background-color: var(--mx-surface); }
.mx-detail-block { display: flex; flex-direction: column; gap: 6px; }
.mx-detail-text { margin: 0; font-size: 16px; line-height: 22px; white-space: pre-wrap; overflow-wrap: anywhere; }
.mx-result { padding: 12px 14px; border-radius: 16px; background: color-mix(in srgb, var(--mx-dot-green) 10%, transparent); }
.mx-thread { display: flex; flex-direction: column; gap: 10px; }
.mx-msg { padding: 10px 12px; border-radius: 16px; background: var(--mx-surface-2); }
.mx-msg.is-mine { background: var(--mx-accent-tint); }
.mx-msg.is-open { box-shadow: inset 3px 0 0 var(--mx-dot-orange); }
.mx-msg p { margin: 6px 0 0; font-size: 15px; line-height: 21px; white-space: pre-wrap; overflow-wrap: anywhere; }
.mx-msg-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 14px; }
.mx-msg-head time { margin-left: auto; font-size: 12px; color: var(--mx-label-3); }
.mx-answer { display: flex; gap: 8px; margin-top: 8px; }
.mx-answer input { flex: 1 1 auto; }
.mx-composer { position: sticky; bottom: 0; display: flex; flex-direction: column; gap: 8px; padding: 10px 0 2px; background: var(--mx-surface); }
.mx-composer-actions { display: flex; justify-content: flex-end; gap: 8px; }
.mx-history { margin: 0; font-size: 12px; color: var(--mx-label-3); }

/* ---------- Questions ---------- */
.mx-question-list { display: flex; flex-direction: column; gap: 12px; }
.mx-question { display: flex; flex-direction: column; gap: 10px; padding: 16px; border-radius: var(--mx-r-card); background: var(--mx-surface); box-shadow: var(--mx-shadow-card); }
.mx-question.is-open { box-shadow: var(--mx-shadow-card), inset 3px 0 0 var(--mx-dot-orange); }
.mx-question-body { margin: 0; font-size: 17px; line-height: 23px; white-space: pre-wrap; overflow-wrap: anywhere; }
.mx-question-task {
  display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 12px; border: 0; border-radius: 12px;
  background: var(--mx-fill-2); color: var(--mx-label); font-size: 15px; text-align: left; cursor: pointer;
}
.mx-question-task span { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mx-question-task .ui-icon:first-child { width: 18px; height: 18px; color: var(--mx-label-2); }
.mx-answer-bubble { padding: 8px 12px; border-radius: 14px; background: var(--mx-accent-tint); font-size: 14px; }
.mx-answer-bubble p { margin: 3px 0 0; font-size: 15px; white-space: pre-wrap; }

/* ---------- People ---------- */
.mx-person-sheet { display: flex; flex-direction: column; gap: 18px; }
.mx-person-hero { display: flex; align-items: center; gap: 14px; }
.mx-person-hero h3 { margin: 0; font-size: 22px; }
.mx-person-hero .mx-subtitle { margin: 2px 0 6px; }
.mx-you { color: var(--mx-label-3); font-weight: 400; }
.mx-invite-box { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 14px; border-radius: 16px; background: var(--mx-surface-2); }
.mx-invite-box .mx-mini-title { padding: 0; }
.mx-link-row { display: flex; gap: 8px; width: 100%; }
dialog.mx-sheet input.mx-link-field { flex: 1 1 auto; min-width: 0; font-size: 13px; font-family: ui-monospace, "SF Mono", Menlo, monospace; }
.mx-danger-zone { padding-top: 14px; border-top: .5px solid var(--mx-sep); }
.mx-footnote { margin: 4px 4px 0; font-size: 13px; line-height: 18px; color: var(--mx-label-2); }
.mx-settings-foot { margin-top: 8px; }

/* ---------- Theme sheet ---------- */
.mx-theme-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; padding: 4px 22px 14px; }
.mx-theme-option {
  display: flex; flex-direction: column; align-items: center; gap: 8px; min-height: 88px; padding: 14px 8px;
  border: 2px solid transparent; border-radius: 18px; background: var(--mx-fill-2); font-size: 14px; font-weight: 600; cursor: pointer;
}
.mx-theme-option[aria-checked="true"] { border-color: var(--mx-accent); background: var(--mx-accent-tint); color: var(--mx-accent); }
.mx-toggle-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 22px 22px; padding: 12px 14px; min-height: 56px; border-radius: 16px; background: var(--mx-fill-2); cursor: pointer; }
.mx-toggle-row span { display: flex; flex-direction: column; }
.mx-toggle-row small { font-size: 13px; color: var(--mx-label-2); }
.mx-toggle-row input { width: 24px; height: 24px; accent-color: var(--mx-accent); }

/* ---------- Toast ---------- */
div.mx-toast {
  position: fixed; left: 50%; bottom: 28px; z-index: 120; transform: translateX(-50%);
  max-width: calc(100vw - 32px); padding: 12px 20px; border-radius: 999px;
  color: var(--mx-label); font-size: 15px; font-weight: 600; text-align: center; animation: mx-toast-in .25s var(--mx-ease);
}
div.mx-toast.error { color: var(--mx-red); }
@keyframes mx-toast-in { from { opacity: 0; transform: translate(-50%, 10px); } to { opacity: 1; transform: translate(-50%, 0); } }
@media (max-width: 899px) { div.mx-toast { bottom: calc(env(safe-area-inset-bottom) + var(--mx-tabbar-h) + 24px); } }

/* ---------- Legacy compatibility (Neruda views under "Viac") ---------- */
.mx-content .card, dialog.mx-sheet .card { background: var(--mx-surface); border: 0; border-radius: var(--mx-r-card); box-shadow: var(--mx-shadow-card); }
.mx-content .btn, dialog.mx-sheet .btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 18px;
  border: 0; border-radius: 999px; font-size: 16px; font-weight: 600; background: var(--mx-fill-2); color: var(--mx-label); box-shadow: none; cursor: pointer;
}
.mx-content .btn.primary, dialog.mx-sheet .btn.primary { background: var(--mx-accent); color: var(--mx-accent-ink); }
.mx-content .btn.danger, dialog.mx-sheet .btn.danger { background: color-mix(in srgb, var(--mx-red) 12%, transparent); color: var(--mx-red); }
.mx-content .btn:active, dialog.mx-sheet .btn:active { transform: scale(.97); }
.mx-content .pill, dialog.mx-sheet .pill { border-radius: 999px; background: var(--mx-fill-2); color: var(--mx-label-2); font-size: 13px; font-weight: 600; }
.mx-content :is(.eyebrow, .section-title, .scope-label, .nav-group-label, .row-meta, .today-group-head, .today-section-head),
dialog.mx-sheet :is(.eyebrow, .section-title, .scope-label) { text-transform: none; letter-spacing: 0; }
.mx-content .section-title { font-size: 20px; font-weight: 650; color: var(--mx-label); }
.mx-content .muted, dialog.mx-sheet .muted { color: var(--mx-label-2); }
dialog.mx-sheet .modal-head { border: 0; }
dialog.mx-sheet #modal-body > form, dialog.mx-sheet #modal-body > div { max-width: 100%; }
dialog.mx-sheet label { font-size: 13px; font-weight: 650; color: var(--mx-label-2); }
.mx-content .loading { display: flex; align-items: center; justify-content: center; gap: 12px; padding: 48px 0; color: var(--mx-label-2); }

/* ---------- Motion, contrast ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
html[data-glass="reduced"] *, html[data-glass="reduced"] *::before { animation-duration: .01ms !important; transition-duration: .01ms !important; }
@media (prefers-contrast: more) {
  :root { --mx-sep: rgba(0, 0, 0, .45); --mx-label-2: #3A3A3C; --mx-label-3: #555559; }
  html[data-theme="dark"] { --mx-sep: rgba(255, 255, 255, .5); --mx-label-2: #D1D1D6; --mx-label-3: #B8B8BD; }
  .mx-sidebar, .mx-tabbar, .mx-search-btn, .mx-glass-btn, div.mx-toast, .mx-auth-card { border: 1px solid var(--mx-label-3); }
}

/* ---------- Hlasovka (voice memo → tasks) ---------- */
.mx-voice { display: grid; gap: 8px; justify-items: stretch; }
.mx-voice-btn {
  display: flex; align-items: center; justify-content: center; gap: 12px;
  min-height: 60px; padding: 12px 20px; border: 0; border-radius: 999px;
  background: var(--mx-accent-tint); color: var(--mx-accent);
  font: inherit; font-size: 17px; font-weight: 600; cursor: pointer;
  transition: transform .2s cubic-bezier(.2,.8,.2,1), background-color .2s ease, box-shadow .2s ease;
}
.mx-voice-btn:hover:not(:disabled) { background: color-mix(in srgb, var(--mx-accent) 18%, transparent); }
.mx-voice-btn:active:not(:disabled) { transform: scale(.97); }
.mx-voice-btn:focus-visible { outline: 3px solid color-mix(in srgb, var(--mx-accent) 40%, transparent); outline-offset: 2px; }
.mx-voice-btn:disabled { opacity: .7; cursor: progress; }
.mx-voice-glyph { display: inline-grid; place-items: center; width: 36px; height: 36px; border-radius: 999px; background: var(--mx-accent); color: var(--mx-accent-ink); }
.mx-voice-glyph svg { width: 20px; height: 20px; }
.mx-voice-timer { min-height: 18px; font-size: 13px; line-height: 18px; color: var(--mx-label-2); text-align: center; font-variant-numeric: tabular-nums; }
.mx-voice[data-state="recording"] .mx-voice-btn { background: color-mix(in srgb, var(--mx-red) 12%, transparent); color: var(--mx-red); }
.mx-voice[data-state="recording"] .mx-voice-glyph { background: var(--mx-red); animation: mx-voice-pulse 1.4s ease-in-out infinite; }
.mx-voice[data-state="recording"] .mx-voice-timer { color: var(--mx-red); font-weight: 600; }
.mx-voice[data-state="busy"] .mx-voice-glyph { animation: mx-voice-pulse 1s ease-in-out infinite; }
@keyframes mx-voice-pulse {
  0%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, currentColor 35%, transparent); }
  50% { box-shadow: 0 0 0 8px color-mix(in srgb, currentColor 0%, transparent); }
}
@media (prefers-reduced-motion: reduce) {
  .mx-voice-btn { transition: none; }
  .mx-voice[data-state] .mx-voice-glyph { animation: none; }
}
.mx-badge-shared { background: var(--mx-accent-tint); color: var(--mx-accent); }
.mx-proposal.is-shared { box-shadow: inset 3px 0 0 var(--mx-accent); }

/* Upozornenia do telefónu */
.mx-push-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
.mx-push-actions[hidden] { display: none; }
.mx-push-banner { display: flex; align-items: center; gap: 12px; margin: 0 0 20px; padding: 12px 8px 12px 14px; border-radius: 20px; background: var(--mx-surface); box-shadow: 0 1px 2px rgba(0,0,0,.06); }
.mx-push-banner-text { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.mx-push-banner-text small { color: var(--mx-label-2); font-size: 13px; }
.mx-push-banner .mx-btn { flex: 0 0 auto; }
.mx-push-banner-close { flex: 0 0 auto; min-width: 44px; min-height: 44px; }

/* ---------- F5b: compact review, team rows, onboarding ---------- */
.mx-intake-preview .mx-proposal { gap: 4px; padding: 8px 10px 10px 14px; }
dialog.mx-sheet .mx-intake-preview .mx-proposal-title { min-height: 44px; padding: 10px 4px; font-size: 16px; }
.mx-intake-preview .mx-proposal-chips { gap: 6px; flex-wrap: wrap; }
dialog.mx-sheet .mx-intake-preview select.mx-chip-select { flex: 1 1 7.5em; min-width: 0; max-width: none; padding: 0 28px 0 12px; font-size: 15px; text-overflow: ellipsis; }
dialog.mx-sheet .mx-intake-preview input.mx-chip-date { flex: 0 0 auto; width: 10.2em; max-width: none; padding: 0 8px; font-size: 15px; }
.mx-intake-preview .mx-chip-toggle { flex: none; }
.mx-intake-preview .mx-badge-shared { flex: none; }
.mx-intake-preview .mx-reason { display: none; }
.mx-intake-preview .mx-proposal.is-unassigned .mx-reason { display: block; flex-basis: 100%; color: var(--mx-orange); }
.mx-intake-preview .mx-sheet-actions {
  position: sticky; bottom: 0; z-index: 3; margin: 0 -22px; padding: 12px 22px calc(12px + env(safe-area-inset-bottom));
  background: color-mix(in srgb, var(--mx-surface) 94%, transparent); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
  box-shadow: 0 -.5px 0 var(--mx-sep);
}
@media (max-width: 899px) { .mx-intake-preview .mx-sheet-actions { margin: 0 -16px; padding-left: 16px; padding-right: 16px; } }
@media (max-width: 599px) { .mx-intake-preview .mx-sheet-actions .mx-btn-plain { flex: 0 0 auto; } }

.mx-team-list { margin-bottom: 24px; }
.mx-person-row { position: relative; }
.mx-person-row + .mx-person-row::before, .mx-person-row + .mx-row::before { content: ""; position: absolute; top: 0; left: 64px; right: 0; height: .5px; background: var(--mx-sep); }
.mx-pr-head {
  display: flex; align-items: center; gap: 12px; width: 100%; min-height: 64px; padding: 10px 14px 10px 16px;
  border: 0; background: transparent; color: inherit; font: inherit; text-align: left; cursor: pointer;
  transition: background-color .15s var(--mx-ease);
}
.mx-pr-head:hover { background: var(--mx-fill-2); }
.mx-pr-head:active { background: var(--mx-fill); }
.mx-pr-chevron { transition: transform .2s var(--mx-ease); }
.mx-person-row.is-open .mx-pr-chevron { transform: rotate(90deg); }
.mx-pr-details { padding: 0 14px 14px 64px; display: flex; flex-direction: column; gap: 10px; }
.mx-pr-details[hidden] { display: none; }
.mx-pr-badge { flex: none; padding: 3px 9px; border-radius: 999px; font-size: 12px; font-weight: 700; white-space: nowrap; }
.mx-pr-badge.is-bad { background: color-mix(in srgb, var(--mx-dot-red) 15%, transparent); color: var(--mx-red); }
.mx-pr-badge.is-warn { background: color-mix(in srgb, var(--mx-dot-orange) 18%, transparent); color: var(--mx-orange); }
.mx-pr-pending { font-weight: 400; color: var(--mx-label-2); font-size: 15px; }
.mx-person-row .mx-row-meta, .mx-team-now .mx-row-meta { display: block; overflow-wrap: anywhere; }
.mx-now-label { font-weight: 650; color: var(--mx-label); }
@media (max-width: 599px) {
  .mx-pr-details { padding-left: 16px; }
  .mx-pr-head .mx-pr-badge { padding: 3px 7px; }
}

.mx-onboarding {
  position: relative; display: flex; gap: 12px; margin: 0 0 18px; padding: 14px 52px 14px 16px;
  border-radius: var(--mx-r-card); background: var(--mx-accent-tint); color: var(--mx-label);
}
.mx-onboarding strong { display: block; margin-bottom: 6px; font-size: 16px; }
.mx-onboarding ol { margin: 0; padding-left: 20px; font-size: 15px; line-height: 21px; color: var(--mx-label-2); }
.mx-onboarding-close { position: absolute; top: 6px; right: 6px; }
/* F13d-2: one compact row (max ~15 % of the screen); the steps open in a sheet. */
.mx-onboarding.is-compact { align-items: center; gap: 10px; margin: 0 0 14px; padding: 6px 48px 6px 10px; min-height: 56px; }
.mx-onboarding.is-compact .mx-row-icon { flex: none; }
.mx-onboarding-link {
  flex: 1 1 auto; min-width: 0; min-height: 44px; display: flex; flex-direction: column; justify-content: center; align-items: flex-start;
  padding: 0; border: 0; background: none; color: inherit; text-align: left; cursor: pointer; font: inherit;
}
.mx-onboarding.is-compact strong { margin: 0; font-size: 15px; line-height: 20px; }
.mx-onboarding-link span { color: var(--mx-accent); font-size: 14px; line-height: 18px; font-weight: 600; }
.mx-onboarding.is-compact .mx-onboarding-close { top: 50%; transform: translateY(-50%); }
.mx-onboarding-steps { margin: 0; padding-left: 22px; font-size: 16px; line-height: 24px; }
.mx-onboarding-steps li { margin: 4px 0; }

.mx-more-tools { margin-top: 20px; }
.mx-more-summary {
  display: flex; align-items: center; min-height: 48px; padding: 0 4px; cursor: pointer; list-style: none;
  font-size: 15px; font-weight: 600; color: var(--mx-label-2);
}
.mx-more-summary::-webkit-details-marker { display: none; }
.mx-more-summary::before { content: "›"; display: inline-block; width: 18px; font-size: 20px; transition: transform .2s var(--mx-ease); }
.mx-more-tools[open] .mx-more-summary::before { transform: rotate(90deg); }


@media (prefers-reduced-motion: reduce) { .mx-fab, .mx-pr-chevron, .mx-more-summary::before { transition: none !important; } }

/* F6: subtle note about who split the tasks (Cosimo vs rules) */
.mx-engine-note { margin: -4px 0 12px; font-size: 13px; line-height: 18px; color: var(--muted); }

/* ---------- Hlasovka: „Rozumel som“ (upraviteľný prepis nad náhľadom) ---------- */
.mx-heard { display: flex; flex-direction: column; gap: 8px; margin: 0 0 14px; padding: 12px 14px; border-radius: 16px; background: var(--mx-fill-2); }
.mx-heard-label { font-size: 13px; font-weight: 650; color: var(--mx-label-2); }
.mx-heard-text {
  width: 100%; min-height: 64px; max-height: 220px; resize: none; padding: 10px 12px; border-radius: 12px;
  border: .5px solid var(--mx-sep); background: var(--mx-surface); color: var(--mx-label); font: 400 16px/1.4 var(--mx-font);
}
.mx-heard-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.mx-heard-actions .mx-btn { min-height: 44px; }
.mx-heard-actions .mx-btn.is-dirty { background: var(--mx-accent); color: var(--mx-accent-ink); }


/* ---------- F8a: Späť, akcie pri otázkach ---------- */
.mx-back-btn {
  display: inline-flex; align-items: center; gap: 2px; min-height: 44px; min-width: 44px; padding: 0 12px 0 6px;
  border: 0; border-radius: 999px; background: transparent; color: var(--mx-accent);
  font: 600 17px var(--mx-font); cursor: pointer;
}
.mx-back-btn[hidden] { display: none; }
.mx-back-btn .ui-icon { width: 22px; height: 22px; stroke-width: 2.4; }
.mx-back-btn:hover { background: var(--mx-accent-tint); }
.mx-back-btn:active { transform: scale(.97); }
.mx-back-btn:focus-visible { outline: 3px solid color-mix(in srgb, var(--mx-accent) 40%, transparent); outline-offset: 2px; }
@media (max-width: 899px) {
  /* Na podstránke nahradí Späť značku MEDICI vľavo, aby hlavička ostala jednoduchá. */
  body.has-back .mx-mobile-header .mx-brand-compact { display: none; }
}
.mx-toolbar .mx-back-btn:not([hidden]) + .mx-toolbar-title { opacity: 1; }
.mx-q-actions { margin-top: 8px; display: grid; gap: 8px; }
.mx-q-buttons { display: flex; flex-wrap: wrap; gap: 8px; }
.mx-q-buttons .mx-btn { min-height: 44px; }
.mx-resolve-offer {
  margin-top: 10px; padding: 12px 14px; border-radius: 16px;
  background: var(--mx-accent-tint); color: var(--mx-label);
}
.mx-resolve-offer p { margin: 0 0 8px; font-size: 15px; line-height: 21px; }

/* ---------- F9b: Asistent / Pomocník (chat nad mozgom) ---------- */
.mx-tint-assistant { background: linear-gradient(135deg, #1A7353, #0A84FF); color: #fff; }
.mx-assistant { display: flex; flex-direction: column; gap: 12px; }
.mx-qchips { display: flex; flex-wrap: wrap; gap: 8px; }
.mx-qchip {
  min-height: 44px; padding: 0 16px; border-radius: 999px; border: .5px solid var(--mx-sep);
  background: var(--mx-surface); color: var(--mx-label); font: 600 15px/20px var(--mx-font);
  box-shadow: var(--mx-shadow-card); cursor: pointer; transition: transform .15s var(--mx-ease), background .15s;
}
.mx-qchip:hover { background: var(--mx-surface-2); }
.mx-qchip:active { transform: scale(.97); }
.mx-qchip:focus-visible { outline: 3px solid color-mix(in srgb, var(--mx-accent) 45%, transparent); outline-offset: 2px; }
.mx-chat-log { display: flex; flex-direction: column; gap: 10px; padding: 4px 0 8px; }
.mx-chat-row { display: flex; justify-content: flex-start; }
.mx-chat-row.is-user { justify-content: flex-end; }
.mx-chat-bubble {
  max-width: min(680px, 92%); padding: 12px 14px; border-radius: 20px; border-bottom-left-radius: 8px;
  background: var(--mx-surface); color: var(--mx-label); box-shadow: var(--mx-shadow-card);
  font: 400 16px/22px var(--mx-font); overflow-wrap: anywhere;
}
.mx-chat-bubble.is-user {
  background: var(--mx-accent); color: var(--mx-accent-ink); border-bottom-left-radius: 20px; border-bottom-right-radius: 8px;
  white-space: pre-wrap;
}
.mx-chat-bubble.is-note { background: var(--mx-surface-2); color: var(--mx-label-2); }
.mx-chat-bubble.is-pending { display: flex; flex-direction: column; align-items: stretch; gap: 10px; color: var(--mx-label-2); font-size: 15px; min-width: min(300px, 100%); }
/* F13d-2: real progress steps, elapsed time and Stop */
.mx-steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.mx-step { display: flex; align-items: center; gap: 10px; color: var(--mx-label-3); font: 500 15px/20px var(--mx-font); }
.mx-step.is-done { color: var(--mx-label-2); }
.mx-step.is-active { color: var(--mx-label); font-weight: 600; }
.mx-step-dot { flex: none; width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; border: 2px solid var(--mx-sep); }
.mx-step.is-done .mx-step-dot { border: 0; background: var(--mx-accent); color: var(--mx-accent-ink); }
.mx-step.is-done .mx-step-dot svg { width: 13px; height: 13px; stroke-width: 3; }
.mx-step.is-active .mx-step-dot { border-color: var(--mx-accent); border-top-color: transparent; animation: mx-spin .9s linear infinite; }
@keyframes mx-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .mx-step.is-active .mx-step-dot { animation: none; border-top-color: var(--mx-accent); } }
.mx-pending-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.mx-chat-bubble.is-streaming .mx-pending-foot { margin-top: 10px; padding-top: 8px; border-top: .5px solid var(--mx-sep); }
.mx-pending-time { color: var(--mx-label-3); font: 400 13px/18px var(--mx-font); font-variant-numeric: tabular-nums; }
.mx-stop-btn { min-height: 44px; }
.mx-stop-btn svg { width: 16px; height: 16px; }
.mx-chat-empty-wrap { display: flex; flex-direction: column; gap: 12px; }
.mx-suggest { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.mx-suggest-item {
  display: flex; align-items: center; gap: 10px; min-height: 56px; padding: 10px 12px; border-radius: 16px;
  border: .5px solid var(--mx-sep); background: var(--mx-surface); color: var(--mx-label); box-shadow: var(--mx-shadow-card);
  text-align: left; font: 600 15px/20px var(--mx-font); cursor: pointer; transition: transform .15s var(--mx-ease), background .15s;
}
.mx-suggest-item:hover { background: var(--mx-surface-2); }
.mx-suggest-item:active { transform: scale(.98); }
.mx-suggest-item:focus-visible { outline: 3px solid color-mix(in srgb, var(--mx-accent) 45%, transparent); outline-offset: 2px; }
.mx-suggest-icon { flex: none; width: 32px; height: 32px; border-radius: 10px; display: grid; place-items: center; background: var(--mx-accent-tint); color: var(--mx-accent); }
.mx-suggest-icon svg { width: 18px; height: 18px; }
.mx-suggest-label { min-width: 0; overflow-wrap: anywhere; }
.mx-followups { display: flex; flex-wrap: wrap; gap: 8px; padding-left: 2px; }
.mx-followup { font-weight: 500; font-size: 14px; min-height: 44px; }
/* F13d-2: Cosimo's improvement is only offered, Potvrdiť never waits for it */
.mx-refine { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 0 0 10px; padding: 8px 12px; border-radius: 14px; background: var(--mx-fill-2); color: var(--mx-label-2); font: 400 14px/19px var(--mx-font); }
.mx-refine[hidden] { display: none; }
.mx-refine.is-ready { background: var(--mx-accent-tint); color: var(--mx-label); }
.mx-refine-text { flex: 1 1 180px; font-weight: 600; }
.mx-refine svg { width: 16px; height: 16px; color: var(--mx-accent); }
.mx-chip-time { width: auto; min-width: 92px; }
.mx-badge-repeat { white-space: nowrap; }
.mx-chat-text p { margin: 0 0 8px; }
.mx-chat-text p:last-child { margin-bottom: 0; }
.mx-chat-list { margin: 0 0 8px; padding-left: 20px; }
.mx-chat-list li { margin: 2px 0; }
.mx-cite {
  display: inline-flex; align-items: center; justify-content: center; vertical-align: 2px;
  min-width: 24px; height: 24px; margin: 0 2px; padding: 0 6px; border-radius: 999px; border: 0;
  background: var(--mx-accent-tint); color: var(--mx-accent); font: 700 12px/1 var(--mx-font); cursor: pointer;
}
.mx-cite-static { cursor: default; }
.mx-chat-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
/* F13d-1: document card in the assistant chat */
.mx-doc-card { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 10px 12px; align-items: center; margin-top: 12px; padding: 12px; border: 1px solid var(--mx-sep); border-radius: 14px; background: var(--mx-surface-2); }
.mx-doc-icon { display: grid; place-items: center; width: 44px; height: 52px; border-radius: 8px; background: var(--mx-red); color: #fff; font-weight: 700; font-size: 13px; letter-spacing: .04em; }
.mx-doc-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.mx-doc-text strong { overflow-wrap: anywhere; }
.mx-doc-meta { color: var(--mx-label-2); font-size: 13px; }
.mx-doc-actions { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 8px; }
.mx-doc-actions .mx-btn { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; text-decoration: none; flex: 1 1 120px; }
.mx-chat-sources { margin-top: 10px; border-top: .5px solid var(--mx-sep); padding-top: 6px; }
.mx-chat-sources summary {
  min-height: 44px; display: flex; align-items: center; cursor: pointer; color: var(--mx-label-2);
  font: 600 14px/18px var(--mx-font); list-style: none;
}
.mx-chat-sources summary::-webkit-details-marker { display: none; }
.mx-chat-sources summary::before { content: '›'; display: inline-block; margin-right: 8px; transition: transform .2s var(--mx-ease); }
.mx-chat-sources[open] summary::before { transform: rotate(90deg); }
.mx-chat-source-list { display: flex; flex-direction: column; gap: 4px; }
.mx-chat-source {
  display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 8px; min-height: 44px; width: 100%;
  padding: 6px 8px; border: 0; border-radius: 12px; background: var(--mx-fill-2); color: var(--mx-label);
  text-align: left; font: 400 14px/18px var(--mx-font); cursor: pointer;
}
.mx-chat-source-title { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.mx-chat-source-date { color: var(--mx-label-3); font-size: 13px; white-space: nowrap; }
.mx-quick-card { width: min(680px, 92%); }
.mx-quick-lead { margin: 0 0 6px; font-weight: 600; }
.mx-quick-section { margin-top: 10px; }
.mx-quick-section h3 { margin: 0 0 6px; font: 600 13px/18px var(--mx-font); color: var(--mx-label-2); }
.mx-quick-row {
  display: flex; flex-direction: column; align-items: flex-start; gap: 2px; width: 100%; min-height: 44px;
  padding: 8px 10px; margin-bottom: 4px; border: 0; border-radius: 12px; background: var(--mx-fill-2);
  color: var(--mx-label); text-align: left; cursor: pointer; font: 500 15px/20px var(--mx-font);
}
.mx-quick-sub { color: var(--mx-label-2); font: 400 13px/18px var(--mx-font); overflow-wrap: anywhere; }
.mx-quick-person { display: flex; align-items: center; gap: 10px; padding: 6px 0; }
.mx-quick-person > div { display: flex; flex-direction: column; }
.mx-chat-empty { margin: 4px 2px 0; color: var(--mx-label-2); font: 400 15px/20px var(--mx-font); }
.mx-chat-empty-icon { width: 52px; height: 52px; border-radius: 16px; display: grid; place-items: center; background: linear-gradient(135deg, #1A7353, #0A84FF); color: #fff; }
.mx-chat-empty-icon svg { width: 28px; height: 28px; }
.mx-chat-warning { margin: 0; padding: 10px 12px; border-radius: 12px; background: var(--mx-fill-2); color: var(--mx-label-2); font-size: 14px; }
.mx-chat-composer {
  position: sticky; bottom: 16px; z-index: 5; display: flex; align-items: flex-end; gap: 8px;
  padding: 8px; border-radius: 26px; background: var(--mx-glass-strong); border: .5px solid var(--mx-glass-edge);
  box-shadow: var(--mx-shadow-glass); -webkit-backdrop-filter: var(--mx-blur); backdrop-filter: var(--mx-blur);
}
.mx-chat-composer.is-busy .mx-chat-send { opacity: .45; pointer-events: none; }
.mx-chat-input {
  flex: 1; min-height: 44px; max-height: 160px; resize: none; border: 0; outline: 0; background: transparent;
  padding: 11px 6px; color: var(--mx-label); font: 400 16px/22px var(--mx-font);
}
.mx-chat-send {
  flex: none; width: 44px; height: 44px; border-radius: 999px; border: 0; display: grid; place-items: center;
  background: var(--mx-accent); color: var(--mx-accent-ink); cursor: pointer;
}
.mx-chat-send svg { width: 20px; height: 20px; }
.mx-voice-compact { flex: none; display: flex; align-items: center; position: relative; }
.mx-voice-compact .mx-voice-btn { min-height: 44px; min-width: 44px; padding: 0 12px; border-radius: 999px; }
.mx-voice-compact .mx-voice-label { font-size: 14px; }
.mx-voice-compact .mx-voice-timer:empty { display: none; }
.mx-voice-compact .mx-voice-timer { position: absolute; bottom: calc(100% + 6px); left: 8px; font-size: 13px; color: var(--mx-label-2); }
.mx-typing { display: inline-flex; gap: 4px; }
.mx-chat-bubble.is-streaming .mx-chat-text p:last-of-type { display: inline; }
.mx-stream-caret { display: inline-block; width: 7px; height: 1.05em; margin-left: 2px; vertical-align: -2px; border-radius: 2px; background: var(--mx-label-3); animation: mx-caret 1s steps(2, start) infinite; }
@keyframes mx-caret { to { visibility: hidden; } }
@media (prefers-reduced-motion: reduce) { .mx-stream-caret { animation: none; } }
.mx-typing i { width: 7px; height: 7px; border-radius: 50%; background: var(--mx-label-3); animation: mx-typing 1.2s infinite ease-in-out; }
.mx-typing i:nth-child(2) { animation-delay: .15s; }
.mx-typing i:nth-child(3) { animation-delay: .3s; }
@keyframes mx-typing { 0%, 80%, 100% { opacity: .3; transform: translateY(0); } 40% { opacity: 1; transform: translateY(-3px); } }
@media (prefers-reduced-motion: reduce) { .mx-typing i { animation: none; opacity: .7; } }
.mx-source-sheet .mx-source-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.mx-source-path { color: var(--mx-label-3); font-size: 13px; overflow-wrap: anywhere; }
.mx-source-text { max-height: 55vh; overflow: auto; padding: 12px; border-radius: 14px; background: var(--mx-surface-2); font-size: 15px; line-height: 21px; }
@media (max-width: 899px) {
  .mx-chat-composer { bottom: calc(var(--mx-tabbar-h) + env(safe-area-inset-bottom) + 18px); }
  body.mx-view-assistant .mx-content { padding-bottom: calc(var(--mx-tabbar-h) + env(safe-area-inset-bottom) + 28px); }
  .mx-chat-bubble, .mx-quick-card { max-width: 100%; }
  .mx-suggest { grid-template-columns: 1fr 1fr; gap: 8px; }
  .mx-suggest-item { min-height: 56px; padding: 8px 10px; gap: 8px; font-size: 14px; line-height: 18px; }
  .mx-suggest-icon { width: 28px; height: 28px; border-radius: 9px; }
  .mx-chat-empty-wrap { gap: 8px; }
  .mx-voice-compact .mx-voice-label { display: none; }
}
html[data-glass="reduced"] .mx-chat-composer { background: var(--mx-surface); -webkit-backdrop-filter: none; backdrop-filter: none; }
@media (prefers-reduced-transparency: reduce) { .mx-chat-composer { background: var(--mx-surface); -webkit-backdrop-filter: none; backdrop-filter: none; } }

/* ---------- F12: Znalosti (mozog) ---------- */
.mx-knowledge-search { display: flex; gap: 10px; align-items: stretch; margin: 4px 0 18px; }
.mx-knowledge-search input { flex: 1 1 auto; min-width: 0; }
.mx-knowledge-search .mx-btn { flex: none; }
.mx-row-snippet {
  font-size: 14px; line-height: 19px; color: var(--mx-label-2); overflow-wrap: anywhere;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.mx-row-pre { white-space: pre-line; }

/* F12: legacy quick links in the private overview keep the 44 px touch target. */
#content .today-quick-link, #content .today-shortcuts .today-quick-link { min-height: 44px; }

/* F13d-3: opakovanie a upozornenie na podobnú otvorenú úlohu v náhľade Rozdeliť */
.mx-chip-repeat.is-on { color: var(--mx-accent, #0a84ff); font-weight: 650; }
.mx-similar { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 8px; margin-top: 8px; padding: 8px 10px; border-radius: 10px;
  background: color-mix(in srgb, #ff9f0a 14%, transparent); color: inherit; font-size: 13px; line-height: 1.35; }
.mx-similar[hidden] { display: none; }
.mx-similar svg { width: 16px; height: 16px; flex: none; color: #c77700; }
.mx-similar-text { flex: 1 1 180px; min-width: 0; }
.mx-similar .mx-btn-small { min-height: 44px; }
.mx-meta-repeat { white-space: nowrap; }
/* F13d-3: karta „Od včera“ */
.mx-tint-blue { background: #0A7AF0; }
.mx-tint-green { background: #1E9E63; }
.mx-tint-red { background: #E5484D; }
.mx-tint-gray { background: #7C7C82; }
.mx-count-inline { margin-left: 4px; vertical-align: 1px; }
.mx-recap .mx-row-meta.mx-row-pre { display: block; }
ol.mx-chat-list { padding-left: 24px; }

/* F14 (Adamovo video 6. 10.): klávesnica a písanie na telefóne.
   - Počas písania sa skryje spodná lišta, zelené + aj prechod nad lištou, nič nevisí nad klávesnicou.
   - Otvorené okno (sheet) sedí v časti nad klávesnicou (visualViewport -> --mx-vvh, --mx-kb), pole je vidieť.
   - Composer Asistenta je pri písaní pripnutý tesne nad klávesnicou. */
@media (max-width: 899px) {
  html.ui-editing .mx-tabbar, html.ui-editing .mx-fab { display: none !important; }
  html.ui-editing .mx-shell::after { display: none; }
  html.ui-editing body.mx-view-assistant .mx-content { padding-bottom: 104px; }
  html.ui-editing .mx-chat-composer {
    position: fixed; left: 10px; right: 10px; z-index: 45; margin: 0 auto; max-width: 760px;
    bottom: calc(var(--mx-kb, 0px) + 8px);
  }
  html.mx-kb-open dialog.mx-sheet {
    top: auto; bottom: var(--mx-kb, 0px); margin: 0;
    max-height: calc(var(--mx-vvh, 100dvh) - 8px); border-radius: var(--mx-r-sheet) var(--mx-r-sheet) 0 0;
  }
  html.mx-kb-open dialog.mx-sheet.mx-sheet-tall { height: calc(var(--mx-vvh, 100dvh) - 8px); }
  html.mx-kb-open dialog.mx-sheet[open] { animation: none; }
}
@media (max-width: 47.999rem) {
  html.ui-editing .mx-chat-composer { bottom: calc(var(--mx-kb, 0px) + 8px); }
}

/* F14: PDF priamo v appke so Zavrieť (žiadny surový PDF bez cesty späť). */
dialog.mx-sheet.mx-pdf-sheet { width: min(900px, calc(100vw - 32px)); }
.mx-pdf-viewer { gap: 12px; }
.mx-pdf-pages { display: grid; gap: 10px; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.mx-pdf-page {
  display: block; width: 100%; height: auto; border-radius: 10px; background: #fff;
  box-shadow: 0 1px 0 var(--mx-sep), 0 6px 18px rgba(0, 0, 0, .08); cursor: zoom-in;
}
.mx-pdf-page.is-zoomed { width: 200%; max-width: none; cursor: zoom-out; }
.mx-pdf-actions { position: sticky; bottom: 0; padding-top: 10px; background: var(--mx-surface); }
@media (max-width: 899px) { dialog.mx-sheet.mx-pdf-sheet { width: 100%; } }

/* F14: Môj súkromný prehľad – skratky sa zalomia, nič nie je odrezané. */
#content .today-shortcuts { flex-wrap: wrap; overflow: visible; }
#content .today-shortcuts .today-quick-link { flex: 1 1 auto; }
.form-more { margin: 4px 0 10px; }
.form-more > summary { cursor: pointer; min-height: 44px; display: flex; align-items: center; font-weight: 600; color: var(--mx-accent); }

/* ---------- F15: one task for several people ---------- */
.mx-pick { display: flex; flex-wrap: wrap; gap: 8px; padding: 6px 0 2px; }
.mx-pick-btn {
  display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 14px 0 10px;
  border: 1px solid color-mix(in srgb, var(--mx-label-3) 35%, transparent); border-radius: 999px;
  background: var(--mx-surface); color: inherit; font: inherit; font-size: 15px; font-weight: 600; cursor: pointer;
}
.mx-pick-btn.is-on { background: var(--mx-accent-tint); border-color: var(--mx-accent); color: var(--mx-accent); }
.mx-pick-check { display: inline-block; width: 16px; text-align: center; font-weight: 800; }
.mx-pick-load { color: var(--mx-label-3); font-weight: 500; font-size: 13px; }
.mx-pick-row { flex-basis: 100%; padding: 4px 0 2px; }
.mx-pick-done { display: flex; justify-content: flex-end; }
.mx-chip-people {
  display: inline-flex; align-items: center; gap: 6px; flex: 1 1 7.5em; min-width: 0; min-height: 44px; padding: 0 12px;
  border: 0; border-radius: 999px; background: var(--mx-fill-2); color: inherit; font: inherit; font-size: 15px; font-weight: 600;
  cursor: pointer; text-align: left;
}
.mx-chip-people-text { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mx-chip-people-caret { flex: none; color: var(--mx-label-3); font-size: 12px; }
.mx-proposal.is-unassigned .mx-chip-people { color: var(--mx-orange); }
.mx-assignees { flex-wrap: wrap; justify-content: flex-end; row-gap: 6px; }
.mx-assignee { display: inline-flex; align-items: center; gap: 6px; }
.mx-assign-panel { padding: 8px 16px 12px; }
.mx-assign-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 10px; }
.mx-share-note { margin: 0 0 4px; color: var(--mx-label-3); font-size: 13px; line-height: 1.35; }
.mx-meta-shared { color: var(--mx-accent); font-weight: 600; }
.mx-assign-actions { scroll-margin-bottom: 200px; }