:root {
    --ink: #0c1731;
    --muted: #687187;
    --subtle: #9199aa;
    --line: #dfe3eb;
    --line-strong: #cbd1dd;
    --surface: #ffffff;
    --surface-subtle: #f7f9fc;
    --accent: #df7418;
    --accent-hover: #c65f0d;
    --accent-soft: #fff3e8;
    --accent-border: #efb77f;
    --success: #169b68;
    --success-soft: #eaf8f2;
    --danger: #c43f4a;
    --danger-soft: #fff0f1;
    --warning: #9a6412;
    --warning-soft: #fff7e7;
    --sidebar-width: 240px;
    --rightbar-width: 380px;
    --radius: 10px;
    --font: Inter, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

* { box-sizing: border-box; }
html { color-scheme: light; background: var(--surface); }
body {
    margin: 0;
    background: var(--surface);
    color: var(--ink);
    font-family: var(--font);
    font-size: 15px;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
}
button, input, textarea { font: inherit; }
a { color: inherit; text-decoration: none; }
button, a, input, textarea { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid rgba(223, 116, 24, .24); outline-offset: 2px; }
.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;
}
.app-shell {
    min-height: 100vh;
    display: grid;
    grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
}
.has-rightbar .app-shell {
    grid-template-columns: var(--sidebar-width) minmax(620px, 1fr) var(--rightbar-width);
}
.sidebar {
    position: sticky;
    top: 0;
    height: 100vh;
    display: flex;
    flex-direction: column;
    border-right: 1px solid var(--line);
    background: var(--surface);
    z-index: 20;
}
.brand {
    min-height: 82px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 3px;
    padding: 0 26px;
    white-space: nowrap;
}
.brand-logo {
    width: 92px;
    height: 24px;
    display: block;
    overflow: hidden;
    flex: 0 0 auto;
}
.brand-logo img {
    display: block;
    width: 122px;
    max-width: none;
    height: auto;
    transform: translate(-15px, -18px);
}
.brand-title {
    color: var(--ink);
    font-size: 13px;
    font-weight: 720;
    letter-spacing: -.015em;
}

/* Přihlášení a jednorázové založení prvního administrátora. */
.auth-page {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 32px 16px;
    background:
        radial-gradient(circle at 50% 0, rgba(223, 116, 24, .10), transparent 38%),
        var(--surface-subtle);
}
.auth-shell { width: min(100%, 430px); }
.auth-brand { display: flex; flex-direction: column; align-items: center; gap: 4px; margin-bottom: 18px; }
.auth-brand .brand-logo { width: 92px; }
.auth-brand > strong { font-size: 14px; letter-spacing: -.02em; }
.auth-card {
    padding: 30px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 18px 55px rgba(12, 23, 49, .09);
}
.auth-card .flash { margin: 0 0 20px; }
.auth-card-heading > span {
    color: var(--accent);
    font-size: 10px;
    font-weight: 760;
    letter-spacing: .09em;
    text-transform: uppercase;
}
.auth-card-heading h1 { margin: 6px 0 0; font-size: 28px; letter-spacing: -.04em; }
.auth-card-heading p { margin: 7px 0 0; color: var(--muted); font-size: 13px; }
.auth-form { margin-top: 22px; }
.auth-form .field { margin-top: 13px; }
.auth-form .button { width: 100%; margin-top: 20px; }
.auth-remember { display: inline-flex; align-items: center; gap: 8px; margin-top: 15px; color: var(--muted); font-size: 12px; cursor: pointer; }
.auth-remember input { width: 16px; height: 16px; accent-color: var(--accent); }
.auth-local-note { margin: 14px 0 0; color: var(--subtle); font-size: 10px; text-align: center; }

@media (max-width: 480px) {
    .auth-page { align-items: start; padding-top: 24px; }
    .auth-card { padding: 24px 20px; }
}
.primary-nav {
    display: grid;
    gap: 7px;
    padding: 14px 10px;
}
.primary-nav a {
    position: relative;
    display: flex;
    align-items: center;
    gap: 15px;
    min-height: 50px;
    padding: 0 18px;
    border-radius: 8px;
    color: #26334e;
    font-weight: 560;
    transition: background .16s ease, color .16s ease;
}
.primary-nav a:hover { background: var(--surface-subtle); color: var(--ink); }
.primary-nav a.active { color: var(--accent); background: var(--accent-soft); }
.primary-nav a.active::before {
    content: "";
    position: absolute;
    left: -10px;
    top: 8px;
    bottom: 8px;
    width: 3px;
    background: var(--accent);
    border-radius: 0 3px 3px 0;
}
.local-environment {
    margin: auto 16px 22px;
    padding: 17px 7px 0;
    border-top: 1px solid var(--line);
    display: flex;
    align-items: center;
    gap: 12px;
    color: #39445d;
}
.local-icon {
    display: grid;
    place-items: center;
    width: 33px;
    height: 33px;
    border: 1px solid var(--line-strong);
    border-radius: 8px;
}
.local-environment strong { display: block; font-size: 13px; font-weight: 650; }
.local-environment small { display: flex; align-items: center; gap: 6px; color: var(--muted); }
.local-environment small i { width: 7px; height: 7px; border-radius: 50%; background: var(--success); }
.sidebar-account-meta { min-width: 0; flex: 1; }
.sidebar-account-meta > strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-account-meta form { margin-top: 4px; }
.sidebar-account-meta button {
    padding: 0;
    border: 0;
    color: var(--accent-hover);
    background: transparent;
    font-size: 10px;
    font-weight: 650;
    cursor: pointer;
}
.sidebar-account-meta button:hover { text-decoration: underline; text-underline-offset: 2px; }
.main-content {
    min-width: 0;
    padding: 34px 34px 48px;
}
.rightbar {
    position: sticky;
    top: 0;
    height: 100vh;
    min-width: 0;
    border-left: 1px solid var(--line);
    display: grid;
    grid-template-rows: auto 1fr auto;
    background: #fff;
    padding: 34px 24px 28px;
}
.mobile-menu {
    display: none;
    border: 0;
    background: transparent;
    color: var(--ink);
    padding: 6px;
}
.page-header {
    min-height: 92px;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 24px;
    border-bottom: 1px solid var(--line);
}
.page-header h1 {
    margin: 0;
    font-size: clamp(26px, 2.2vw, 34px);
    line-height: 1.15;
    letter-spacing: -.04em;
    font-weight: 760;
}
.page-header p {
    margin: 8px 0 0;
    color: var(--muted);
}
.header-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
}
.header-meta small { color: var(--muted); font-size: 12px; }
/* Zastaralá nebo padající synchronizace. Musí být vidět na první pohled: čísla
   pod tím jsou pak starší, než vypadají. */
.header-meta-warning {
    flex-wrap: wrap;
    margin-top: 7px;
    padding: 7px 11px;
    border: 1px solid #f0c4c8;
    border-radius: 7px;
    color: var(--danger);
    background: var(--danger-soft);
    font-size: 13px;
}
.header-meta-warning a { color: inherit; text-decoration: underline; }
.header-meta-muted { margin-top: 7px; color: var(--muted); font-size: 12px; }
.button {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 0 16px;
    border: 1px solid var(--line-strong);
    border-radius: 8px;
    background: #fff;
    color: #23304a;
    font-size: 14px;
    font-weight: 650;
    cursor: pointer;
    transition: transform .15s ease, background .15s ease, border-color .15s ease;
}
.button:hover { background: var(--surface-subtle); border-color: #aeb6c6; }
.button:active { transform: translateY(1px); }
.button-primary { color: #fff; background: var(--accent); border-color: var(--accent); }
.button-primary:hover { background: var(--accent-hover); border-color: var(--accent-hover); }
.button-secondary { color: var(--accent); border-color: var(--accent); }
.button-secondary:hover { background: var(--accent-soft); border-color: var(--accent); }
.button-quiet { min-height: 38px; padding-inline: 13px; background: #fff; }
.button-small { min-height: 34px; padding-inline: 13px; color: var(--accent); border-color: var(--accent-border); }
.text-link { color: var(--accent); font-size: 14px; font-weight: 650; }
.text-link:hover { text-decoration: underline; text-underline-offset: 3px; }
.flash {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin: 0 0 20px;
    padding: 12px 14px;
    border: 1px solid;
    border-radius: 8px;
    font-size: 14px;
}
.flash ul { margin: 4px 0 0; padding-left: 18px; }
.flash-success { color: #126345; background: var(--success-soft); border-color: #aee2cd; }
.flash-warning { color: #70470c; background: var(--warning-soft); border-color: #efd095; }
.flash-error { color: #8f2831; background: var(--danger-soft); border-color: #efb5bb; display: block; }
.dashboard-filters {
    margin-top: 18px;
    padding: 14px 16px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface-subtle);
}
.period-form {
    display: flex;
    align-items: flex-end;
    gap: 12px;
    flex-wrap: wrap;
}
.filter-field { display: grid; gap: 5px; }
.filter-field label {
    color: #354159;
    font-size: 11px;
    font-weight: 680;
}
.filter-field select,
.filter-field input {
    min-height: 38px;
    border: 1px solid var(--line-strong);
    border-radius: 7px;
    padding: 0 34px 0 11px;
    background: #fff;
    color: var(--ink);
    font-size: 13px;
}
.filter-field input { padding-right: 11px; }
.filter-field select:focus,
.filter-field input:focus {
    outline: 0;
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(223, 116, 24, .11);
}
.custom-date-range { display: flex; gap: 10px; }
.custom-date-range[hidden] { display: none; }
.active-range {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 38px;
    margin-left: auto;
    color: var(--muted);
    font-size: 12px;
}
.kpi-band {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    padding: 28px 0 26px;
}
.kpi {
    min-width: 0;
    padding: 0 28px;
    border-right: 1px solid var(--line);
}
.kpi:first-child { padding-left: 14px; }
.kpi:last-child { border-right: 0; }
.kpi h2 { margin: 0 0 12px; font-size: 14px; font-weight: 650; }
.kpi strong { display: block; font-size: 27px; letter-spacing: -.03em; line-height: 1.15; font-weight: 720; }
.kpi span { display: block; margin-top: 8px; color: var(--muted); font-size: 12px; white-space: normal; }
.kpi span.positive { color: var(--success); }
.kpi span.negative { color: var(--danger); }
.analytics-overview { padding-top: 28px; }
.dashboard-section-heading { margin-bottom: 17px; }
.period-chip {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 12px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--surface-subtle);
    color: var(--muted);
    font-size: 12px;
    font-weight: 650;
}
.metric-card-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}
.metric-card {
    min-width: 0;
    padding: 17px 18px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #fff;
}
.metric-card h3 {
    margin: 0 0 9px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 650;
}
.metric-card strong {
    display: block;
    font-size: 25px;
    line-height: 1.15;
    letter-spacing: -.03em;
}
.metric-card span {
    display: block;
    margin-top: 7px;
    color: var(--muted);
    font-size: 11px;
}
.metric-card span.positive { color: var(--success); }
.metric-card span.negative { color: var(--danger); }
.analytics-chart-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 14px;
}
.chart-builder-panel {
    margin-top: 14px;
    padding: 20px;
    border: 1px solid #b9cdf8;
    border-radius: var(--radius);
    background: linear-gradient(180deg, #fbfdff 0%, #fff 100%);
}
.chart-builder-form {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr) auto;
    align-items: end;
    gap: 12px;
    margin-top: 17px;
}
.chart-builder-form select { width: 100%; }
.generated-chart {
    margin-top: 18px;
    padding-top: 14px;
    border-top: 1px solid var(--line);
}
.chart-panel {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 24px;
}
.compact-chart-panel { padding: 19px 20px 14px; }
.commercial-overview { margin-top: 30px; padding-top: 26px; border-top: 1px solid var(--line); }
.compact-kpi-band { padding-top: 12px; }
.section-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
}
.section-heading h2 { margin: 0; font-size: 20px; letter-spacing: -.025em; }
.section-heading p { margin: 4px 0 0; color: var(--muted); font-size: 13px; }
.chart-controls { display: flex; gap: 10px; }
.chart-empty {
    min-height: 280px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: var(--muted);
    position: relative;
}
.chart-empty strong { margin-top: 14px; color: #4e5a70; font-size: 15px; font-weight: 560; }
.chart-empty p { margin: 5px 0 0; font-size: 13px; }
.empty-chart-icon {
    width: 52px; height: 52px; display: grid; place-items: center;
    border: 1px solid var(--line-strong); border-radius: 8px; color: #64708a;
}
.empty-baseline {
    position: absolute; left: 0; right: 0; bottom: 10px;
    border-bottom: 1px dashed #bdc5d4;
}
.chart { min-height: 290px; padding-top: 14px; }
.chart svg { width: 100%; height: 250px; overflow: visible; }
.chart-compact { min-height: 225px; padding-top: 10px; }
.chart-compact svg { height: 195px; }
.chart polyline {
    fill: none;
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.chart polyline[data-series="revenue"] { stroke: var(--accent); }
.chart polyline[data-series="cost"] { stroke: var(--success); }
.chart polyline.series-blue { stroke: #2968df; }
.chart polyline.series-green { stroke: #1a9b68; }
.chart polyline.series-orange { stroke: #e58a23; }
.chart polyline.series-violet { stroke: #7857d8; }
.chart polyline.series-rose { stroke: #cf4d6f; }
.chart polyline.series-teal { stroke: #168b91; }
.chart-grid-line { stroke: var(--line); stroke-width: 1; }
.chart-legend { display: flex; justify-content: flex-end; gap: 18px; color: var(--muted); font-size: 12px; }
.chart-legend span { display: flex; align-items: center; gap: 6px; }
.chart-legend i { width: 9px; height: 9px; border-radius: 50%; }
.legend-revenue { background: var(--accent); }
.legend-cost { background: var(--success); }
.legend-blue { background: #2968df; }
.legend-green { background: #1a9b68; }
.legend-orange { background: #e58a23; }
.legend-violet { background: #7857d8; }
.legend-rose { background: #cf4d6f; }
.legend-teal { background: #168b91; }
.sources-summary { margin-top: 28px; }
.source-list { margin-top: 14px; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.source-row {
    min-height: 61px;
    display: grid;
    grid-template-columns: 36px minmax(150px, 1.2fr) auto minmax(140px, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding: 0 17px;
    border-bottom: 1px solid var(--line);
}
.source-row:last-child { border-bottom: 0; }
.source-row > strong { font-size: 14px; }
.source-logo {
    width: 30px; height: 30px; display: grid; place-items: center;
    border-radius: 8px; color: #fff; font-size: 12px; font-weight: 800;
}
.source-analytics { background: #ed8b20; }
.source-search_console { background: #4b76c5; }
.source-ads { background: #2a9d64; }
.source-raynet { background: #e36f16; }
.status-dot { width: 8px; height: 8px; border-radius: 50%; background: #a0a8b7; }
.status-dot.is-connected { background: var(--success); box-shadow: 0 0 0 3px var(--success-soft); }
.status-dot.is-error { background: var(--danger); box-shadow: 0 0 0 3px var(--danger-soft); }
.source-status { color: var(--muted); font-size: 13px; }
.chat-header { padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.chat-header h2 { margin: 0; font-size: 20px; letter-spacing: -.03em; }
.chat-header p { margin: 7px 0 0; color: var(--muted); font-size: 13px; }
.chat-messages {
    overflow: auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 20px 0;
}
.example-question {
    align-self: flex-end;
    max-width: 86%;
    border: 1px solid #bdd0f8;
    border-radius: 9px;
    background: var(--accent-soft);
    color: #17499f;
    padding: 11px 13px;
    text-align: left;
    font-size: 14px;
    cursor: pointer;
}
.chat-empty {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fbfcfe;
}
.chat-empty > span, .assistant-icon {
    flex: 0 0 auto;
    width: 36px; height: 36px; display: grid; place-items: center;
    border: 1px solid var(--line); border-radius: 8px; color: #3f4c64; background: #fff;
}
.chat-empty strong { display: block; font-size: 14px; }
.chat-empty p { margin: 5px 0 0; color: var(--muted); font-size: 13px; }
.chat-message { max-width: 94%; font-size: 14px; }
.chat-message.is-user {
    align-self: flex-end;
    color: #17499f;
    background: var(--accent-soft);
    border: 1px solid #c8d8fa;
    border-radius: 10px 10px 2px 10px;
    padding: 11px 13px;
}
.chat-message.is-assistant {
    align-self: flex-start;
    display: grid;
    grid-template-columns: 36px 1fr;
    gap: 11px;
    border: 1px solid var(--line);
    border-radius: 10px;
    padding: 14px;
}
.chat-message time { display: block; color: var(--subtle); font-size: 11px; margin-top: 7px; }
.chat-message.is-assistant time { grid-column: 2; }
.chat-composer { border: 1px solid var(--line-strong); border-radius: 10px; padding: 12px; }
.chat-composer textarea {
    width: 100%;
    min-height: 88px;
    resize: vertical;
    border: 0;
    outline: 0;
    color: var(--ink);
    background: transparent;
    line-height: 1.5;
}
.chat-composer textarea::placeholder { color: #949cad; }
.chat-composer > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.chat-composer > div > span { color: var(--muted); font-size: 11px; }
.settings-header { min-height: 72px; }
.setup-steps {
    list-style: none;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    margin: 12px 0 0;
    padding: 0;
    border-bottom: 1px solid var(--line);
}
.setup-steps li {
    position: relative;
    min-height: 56px;
    color: #303c55;
    font-size: 14px;
}
.setup-steps button {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 11px;
    width: 100%;
    min-height: 56px;
    padding: 0 16px 0 0;
    border: 0;
    color: inherit;
    background: transparent;
    font: inherit;
    text-align: left;
    cursor: pointer;
}
.setup-steps button:hover strong { color: var(--accent); }
.setup-steps button:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: -3px;
    border-radius: 6px;
}
.setup-steps li:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 28px;
    left: calc(50% + 20px);
    right: 22px;
    border-top: 1px solid var(--line-strong);
}
.setup-steps button span {
    flex: 0 0 auto;
    width: 32px; height: 32px; display: grid; place-items: center;
    border: 1px solid var(--line-strong); border-radius: 50%; background: #fff; font-weight: 680;
}
.setup-steps button strong { font-weight: 520; white-space: nowrap; }
.setup-steps li.active { color: var(--ink); font-weight: 650; }
.setup-steps li.active::before {
    content: ""; position: absolute; left: 0; right: 45%; bottom: -1px; border-bottom: 2px solid var(--accent);
}
.setup-steps li.active button strong { font-weight: 700; }
.setup-steps li.active button span { background: var(--accent); border-color: var(--accent); color: #fff; }
.settings-layout { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 40px; padding-top: 20px; }
.settings-form { min-width: 0; padding-right: 10px; }
.setup-panel { min-height: 360px; }
.setup-panel[hidden] { display: none; }
.settings-section-heading h2, .settings-help h2 { margin: 0; font-size: 19px; letter-spacing: -.025em; }
.settings-section-heading h2:focus { outline: none; }
.settings-section-heading p { margin: 5px 0 0; color: var(--muted); font-size: 14px; }
.settings-section-heading .step-kicker {
    margin-bottom: 6px;
    color: var(--accent);
    font-size: 11px;
    font-weight: 750;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.field { display: grid; gap: 6px; margin-top: 14px; }
.field label { color: #17223a; font-size: 13px; font-weight: 650; }
.field label span { color: var(--muted); font-weight: 450; }
.field input:not([type="file"]) {
    width: 100%;
    min-height: 42px;
    border: 1px solid var(--line-strong);
    border-radius: 8px;
    padding: 0 13px;
    color: var(--ink);
    background: #fff;
    transition: border-color .15s, box-shadow .15s;
}
.field select {
    width: 100%;
    min-height: 42px;
    border: 1px solid var(--line-strong);
    border-radius: 8px;
    padding: 0 36px 0 13px;
    color: var(--ink);
    background: #fff;
}
.field input:hover { border-color: #a9b2c3; }
.field input:focus,
.field select:focus { outline: 0; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(223, 116, 24, .13); }
.field input::placeholder { color: #9aa2b1; }
.field small { color: var(--muted); font-size: 12px; }
.user-management {
    margin-top: 18px;
    padding: 24px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #fff;
}
.user-management-grid { display: grid; grid-template-columns: minmax(280px, .85fr) minmax(330px, 1.15fr); gap: 30px; margin-top: 20px; }
.user-create-form { padding-right: 30px; border-right: 1px solid var(--line); }
.user-create-form h3,
.user-list h3 { margin: 0; font-size: 15px; }
.user-create-form .button { width: 100%; margin-top: 18px; }
.user-list article {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr) auto;
    align-items: center;
    gap: 11px;
    padding: 12px 0;
    border-bottom: 1px solid var(--line);
}
.user-list article:last-child { border-bottom: 0; }
.user-avatar { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; color: var(--accent-hover); background: var(--accent-soft); font-size: 12px; font-weight: 760; }
.user-list article > span:nth-child(2) { min-width: 0; }
.user-list strong,
.user-list small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.user-list strong { font-size: 12px; }
.user-list small { margin-top: 2px; color: var(--muted); font-size: 10px; }
.user-role { padding: 4px 8px; border-radius: 999px; color: #4c596e; background: var(--surface-subtle); font-size: 9px; font-weight: 700; }
.user-role.is-admin { color: var(--accent-hover); background: var(--accent-soft); }

@media (max-width: 900px) {
    .user-management-grid { grid-template-columns: 1fr; }
    .user-create-form { padding: 0 0 24px; border-right: 0; border-bottom: 1px solid var(--line); }
}
.inline-link { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; }
.file-input {
    min-height: 46px;
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    border: 1px solid var(--line-strong);
    border-radius: 8px;
    overflow: hidden;
    cursor: pointer;
}
.file-input > span {
    align-self: stretch;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 15px;
    border-right: 1px solid var(--line);
    color: var(--accent);
    font-size: 14px;
    font-weight: 670;
}
.file-input > strong { padding: 0 15px; color: var(--muted); font-size: 13px; font-weight: 450; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 28px; }
.form-grid .full { grid-column: 1 / -1; }
.form-grid-three { grid-template-columns: 1.4fr .7fr 1fr; }
.ai-key-grid { grid-template-columns: minmax(0, 1.4fr) minmax(220px, .8fr); }
.password-input { position: relative; }
.password-input input { padding-right: 48px !important; }
.password-input button {
    position: absolute; top: 3px; right: 3px; width: 39px; height: 39px;
    border: 0; background: transparent; color: #5e687c; cursor: pointer;
}
.ai-heading { margin-top: 22px; padding-top: 20px; border-top: 1px solid var(--line); }
.vertex-fallback {
    margin-top: 17px;
    padding: 14px 16px 16px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-subtle);
}
.vertex-fallback summary {
    color: #344159;
    font-size: 13px;
    font-weight: 650;
    cursor: pointer;
}
.vertex-fallback > p { margin: 8px 0 0; color: var(--muted); font-size: 12px; }
.wizard-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 28px;
    padding-top: 20px;
    border-top: 1px solid var(--line);
}
.wizard-actions-end { justify-content: flex-end; }
.settings-review {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 20px;
}
.settings-review article {
    min-height: 128px;
    padding: 17px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fff;
}
.settings-review h3 { margin: 12px 0 5px; font-size: 15px; }
.settings-review p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.55; overflow-wrap: anywhere; }
.review-state {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 0 9px;
    border-radius: 999px;
    color: #6b7280;
    background: #f2f4f8;
    font-size: 10px;
    font-weight: 750;
    text-transform: uppercase;
    letter-spacing: .045em;
}
.review-state.is-ready { color: #137247; background: #e7f7ee; }
.form-actions { display: flex; gap: 12px; margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--line); }
.wizard-final-actions { flex-wrap: wrap; }
.settings-help { border-left: 1px solid var(--line); padding-left: 32px; }
.settings-help > ol { margin: 17px 0 26px; padding-left: 23px; }
.settings-help > ol li { margin: 11px 0; padding-left: 7px; font-size: 13px; }
.settings-help > ol li::marker { color: var(--accent); font-weight: 700; }
.security-note {
    display: flex; align-items: flex-start; gap: 13px; padding: 17px;
    border: 1px solid var(--accent-border); border-radius: 9px; color: var(--accent);
}
.security-note strong { display: block; color: var(--ink); font-size: 14px; }
.security-note p { margin: 4px 0 0; color: #536079; font-size: 12px; }
.connection-status { margin-top: 25px; padding-top: 24px; border-top: 1px solid var(--line); }
.connection-status > div {
    display: grid;
    grid-template-columns: 9px 1fr auto;
    align-items: center;
    gap: 11px;
    margin-top: 17px;
}
.connection-status > div strong { font-size: 13px; }
.connection-status > div span:last-child { color: var(--muted); font-size: 12px; }
.connection-status small { display: block; margin: 4px 0 0 20px; color: var(--danger); font-size: 11px; }
.sources-detail { display: grid; margin-top: 28px; border-top: 1px solid var(--line); }
.sources-detail article {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) minmax(170px, auto);
    align-items: center;
    gap: 18px;
    min-height: 112px;
    border-bottom: 1px solid var(--line);
}
.sources-detail article h2 { margin: 0; font-size: 17px; }
.sources-detail article p { margin: 5px 0 0; color: var(--muted); font-size: 13px; }
.source-detail-status { display: grid; grid-template-columns: 9px 1fr; gap: 2px 9px; align-items: center; }
.source-detail-status strong { font-size: 13px; }
.source-detail-status small { grid-column: 2; color: var(--muted); font-size: 11px; }
.analysis-empty {
    min-height: 430px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    max-width: 640px;
    margin: 0 auto;
}
.analysis-empty > span { width: 62px; height: 62px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 12px; color: var(--accent); }
.analysis-empty h2 { margin: 20px 0 0; font-size: 24px; letter-spacing: -.03em; }
.analysis-empty p { margin: 9px 0 0; color: var(--muted); }
.analysis-empty > div { display: flex; gap: 10px; margin-top: 24px; }

@media (max-width: 1250px) {
    :root { --sidebar-width: 210px; --rightbar-width: 340px; }
    .has-rightbar .app-shell { grid-template-columns: var(--sidebar-width) minmax(560px, 1fr) var(--rightbar-width); }
    .main-content { padding-inline: 25px; }
    .brand { padding-inline: 20px; font-size: 16px; }
    .kpi { padding-inline: 18px; }
    .analytics-chart-grid { grid-template-columns: 1fr; }
    .metric-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 1020px) {
    .has-rightbar .app-shell, .app-shell { grid-template-columns: 200px minmax(0, 1fr); }
    .rightbar { position: static; grid-column: 2; height: auto; min-height: 560px; border-top: 1px solid var(--line); border-left: 0; }
    .settings-layout { grid-template-columns: 1fr; }
    .settings-help { border-left: 0; border-top: 1px solid var(--line); padding: 28px 0 0; }
}

@media (max-width: 760px) {
    .app-shell, .has-rightbar .app-shell { display: block; }
    .sidebar {
        position: fixed;
        left: 0; top: 0; bottom: 0;
        width: min(82vw, 280px);
        transform: translateX(-103%);
        transition: transform .2s ease;
        box-shadow: 18px 0 50px rgba(15, 24, 45, .16);
    }
    .sidebar.open { transform: translateX(0); }
    .mobile-menu { display: inline-grid; place-items: center; margin: -4px 0 18px; }
    .main-content { padding: 22px 18px 40px; }
    .rightbar { padding: 26px 18px; min-height: 640px; }
    .page-header { min-height: auto; padding-bottom: 22px; align-items: center; }
    .page-header h1 { font-size: 27px; }
    .page-header .button { padding-inline: 12px; }
    .dashboard-filters { padding: 13px; }
    .period-form { align-items: stretch; }
    .period-form > .filter-field,
    .period-form > .button { width: 100%; }
    .custom-date-range { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; }
    .custom-date-range .filter-field input { width: 100%; min-width: 0; }
    .active-range { width: 100%; margin-left: 0; }
    .kpi-band { grid-template-columns: repeat(2, 1fr); gap: 0; }
    .kpi { padding: 18px; border-bottom: 1px solid var(--line); }
    .kpi:nth-child(2) { border-right: 0; }
    .kpi:nth-child(3), .kpi:nth-child(4) { border-bottom: 0; }
    .kpi:nth-child(3) { padding-left: 18px; }
    .chart-panel { padding: 17px; }
    .section-heading { align-items: flex-start; }
    .chart-controls { display: none; }
    .source-row { grid-template-columns: 34px 1fr auto; padding-block: 10px; }
    .source-row .status-dot { grid-column: 1; }
    .source-status { grid-column: 2; }
    .source-row .button { grid-column: 3; grid-row: 1 / span 2; }
    .setup-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .setup-steps li { min-width: 0; min-height: 50px; }
    .setup-steps li:not(:last-child)::after { display: none; }
    .setup-steps li.active::before { right: 0; }
    .setup-steps button { min-height: 50px; padding-right: 8px; gap: 8px; }
    .setup-steps button span { width: 28px; height: 28px; }
    .setup-steps button strong { overflow: hidden; text-overflow: ellipsis; }
    .form-grid, .form-grid-three { grid-template-columns: 1fr; }
    .ai-key-grid { grid-template-columns: 1fr; }
    .form-grid .full { grid-column: auto; }
    .chart-builder-panel { padding: 16px; }
    .chart-builder-form { grid-template-columns: 1fr; }
    .settings-layout { gap: 28px; }
    .settings-form { padding-right: 0; }
    .setup-panel { min-height: 0; }
    .settings-review { grid-template-columns: 1fr; }
    .wizard-actions { align-items: stretch; }
    .wizard-actions .button { flex: 1 1 auto; }
    .form-actions { flex-direction: column; align-items: stretch; }
    .sources-detail article { grid-template-columns: 40px 1fr; padding-block: 19px; }
    .source-detail-status { grid-column: 2; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}

/* BI reporting */
.reporting-header { min-height: 82px; }
.reporting-header-actions { display: flex; align-items: center; gap: 10px; }
.reporting-header-actions form { margin: 0; }
.full-sync-form { display: inline-flex; align-items: center; gap: 10px; }
.full-sync-form .button:disabled { opacity: .72; cursor: wait; }
.full-sync-status { max-width: 250px; color: var(--muted); font-size: 11px; line-height: 1.35; }
.report-filter-rail {
    margin-top: 18px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface-subtle);
}
.report-filter-form {
    display: flex;
    align-items: flex-end;
    gap: 11px;
}
.report-period-field select { min-width: 150px; }
.report-range {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 0 11px;
    border: 1px solid var(--line-strong);
    border-radius: 7px;
    color: #283650;
    background: #fff;
    font-size: 13px;
    white-space: nowrap;
}
/* Období nekončí dneškem, protože se čeká na nejpomalejší službu. Bez
   upozornění to vypadá jako chybějící data. */
.report-range-lag {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 0 11px;
    border: 1px solid #f0d08a;
    border-radius: 7px;
    color: #7a5312;
    background: #fdf6e6;
    font-size: 13px;
    white-space: nowrap;
    cursor: help;
}
.comparison-label {
    align-self: center;
    color: var(--muted);
    font-size: 12px;
    white-space: nowrap;
}
.report-source {
    min-width: 218px;
    min-height: 44px;
    display: flex;
    align-items: center;
    gap: 11px;
    margin-left: auto;
    padding: 5px 12px;
    border: 1px solid var(--line-strong);
    border-radius: 7px;
    background: #fff;
}
.report-source small,
.report-source strong { display: block; }
.report-source small { color: var(--muted); font-size: 10px; line-height: 1.25; }
.report-source strong { font-size: 13px; line-height: 1.35; }
.report-source-combined {
    min-width: 338px;
    gap: 10px;
}
.combined-source-mark {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: flex-end;
    gap: 3px;
    flex: 0 0 auto;
}
.combined-source-mark > i {
    width: 5px;
    border-radius: 3px 3px 1px 1px;
    background: var(--accent);
}
.combined-source-mark > i:nth-child(1) { height: 11px; background: #f3a548; }
.combined-source-mark > i:nth-child(2) { height: 20px; background: var(--accent); }
.combined-source-mark > i:nth-child(3) { height: 15px; background: #288a67; }
.combined-source-states {
    display: flex;
    gap: 4px;
    margin-left: auto;
}
.combined-source-states > span {
    min-height: 22px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 0 6px;
    border: 1px solid var(--line);
    border-radius: 5px;
    color: var(--muted);
    background: var(--surface-subtle);
    font-size: 8px;
    font-weight: 700;
}
.combined-source-states i {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--subtle);
}
.combined-source-states .has-data {
    color: #166044;
    border-color: #bee1d3;
    background: #f3fbf7;
}
.combined-source-states .has-data i { background: var(--success); }
.source-ga4-mark {
    width: 21px;
    height: 24px;
    display: flex;
    align-items: flex-end;
    gap: 2px;
}
.source-ga4-mark i { width: 5px; border-radius: 3px; background: #f39a1f; }
.source-ga4-mark i:nth-child(1) { height: 8px; }
.source-ga4-mark i:nth-child(2) { height: 15px; }
.source-ga4-mark i:nth-child(3) { height: 23px; }
.report-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 10px;
    margin-top: 16px;
}
.report-kpi {
    min-width: 0;
    padding: 15px 15px 14px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
}
.report-kpi h2 {
    margin: 0;
    color: #344159;
    font-size: 11px;
    font-weight: 620;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.report-kpi > strong {
    display: block;
    margin-top: 9px;
    font-size: clamp(21px, 1.9vw, 29px);
    line-height: 1;
    letter-spacing: -.035em;
}
.report-kpi > span {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-top: 10px;
    font-size: 11px;
    font-weight: 620;
}
.report-kpi > span b { font-size: 14px; line-height: 1; }
.report-kpi .is-positive { color: var(--success); }
.report-kpi .is-negative { color: #df3344; }
.report-kpi .is-neutral { color: var(--muted); font-weight: 500; }
.reporting-workspace {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 270px;
    gap: 14px;
    margin-top: 14px;
}
.report-chart-panel,
.report-insights,
.report-breakdown-panel,
.paid-performance {
    min-width: 0;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #fff;
}
.report-chart-panel { padding: 16px 17px 8px; }
.report-panel-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}
.report-panel-heading h2 {
    margin: 0;
    color: var(--ink);
    font-size: 16px;
    line-height: 1.25;
    letter-spacing: -.018em;
}
.report-panel-heading h2 svg { margin-right: 6px; vertical-align: -4px; color: var(--accent); }
.report-panel-heading p { margin: 3px 0 0; color: var(--muted); font-size: 11px; }
.report-panel-heading > span { color: var(--muted); font-size: 11px; white-space: nowrap; }
.report-series-legend { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.report-series-legend span {
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 0 10px;
    border: 1px solid var(--line);
    border-radius: 7px;
    color: #26334d;
    font-size: 11px;
}
.report-series-legend i {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--series-color);
}
.bi-line-chart { position: relative; min-height: 315px; margin-top: 5px; }
.bi-line-chart svg { display: block; width: 100%; height: 315px; overflow: visible; }
.bi-grid-line { stroke: #e7eaf0; stroke-width: 1; }
.bi-axis-label { fill: #7b8496; font: 10px var(--font); }
.bi-area { opacity: .07; }
.bi-line {
    fill: none;
    stroke-width: 2.6;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.bi-point { stroke: #fff; stroke-width: 1.5; opacity: 0; transition: opacity .12s ease; }
.bi-line-chart:hover .bi-point { opacity: 1; }
.bi-hover-line { stroke: #9ca5b6; stroke-width: 1; stroke-dasharray: 4 4; pointer-events: none; }
.bi-hover-target { fill: transparent; cursor: crosshair; }
.bi-chart-tooltip {
    position: absolute;
    z-index: 4;
    min-width: 145px;
    padding: 10px 11px;
    border: 1px solid var(--line-strong);
    border-radius: 7px;
    color: var(--ink);
    background: rgba(255, 255, 255, .97);
    box-shadow: 0 8px 24px rgba(17, 30, 55, .12);
    font-size: 11px;
    pointer-events: none;
}
.bi-chart-tooltip strong { display: block; margin-bottom: 5px; font-size: 11px; }
.bi-chart-tooltip span { display: flex; justify-content: space-between; gap: 18px; margin-top: 3px; }
.bi-chart-tooltip i { width: 7px; height: 7px; display: inline-block; margin-right: 5px; border-radius: 50%; }
.report-insights {
    display: flex;
    flex-direction: column;
    padding: 17px;
}
.insight-list { display: grid; gap: 7px; margin-top: 12px; }
.insight-item {
    display: grid;
    grid-template-columns: 22px 1fr;
    gap: 8px;
    padding: 12px 0;
    border-bottom: 1px solid var(--line);
}
.insight-item:last-child { border-bottom: 0; }
.insight-item > span { font-size: 20px; line-height: 1; }
.insight-positive > span { color: var(--success); }
.insight-negative > span { color: #df3344; }
.insight-neutral > span { color: var(--muted); }
.insight-item strong { display: block; font-size: 12px; }
.insight-item p { margin: 4px 0 0; color: #4e596e; font-size: 11px; line-height: 1.55; }
.insight-action { width: 100%; margin-top: auto; }
.report-inline-warning {
    display: grid;
    gap: 3px;
    margin-top: 14px;
    padding: 11px 13px;
    border: 1px solid #efd095;
    border-radius: 8px;
    color: #70470c;
    background: var(--warning-soft);
    font-size: 11px;
}
.report-breakdowns {
    display: grid;
    grid-template-columns: minmax(280px, .9fr) 240px minmax(480px, 1.6fr);
    gap: 14px;
    margin-top: 14px;
}
.report-breakdown-panel { padding: 16px; }
/* Graf zařízení má méně obsahu než tabulka stránek, takže by mu ve srovnaném
   rámečku zbývalo dole prázdno. Prstenec se proto rozprostře do volného místa
   a legenda zůstane u spodní hrany. */
.device-panel { display: flex; flex-direction: column; }
.device-panel .device-donut { margin-block: auto; }
.channel-list { display: grid; align-content: start; }
.channel-row {
    display: grid;
    grid-template-columns: 18px minmax(90px, 130px) minmax(70px, 1fr) 48px;
    align-items: center;
    gap: 7px;
    min-height: 32px;
    padding-inline: 5px;
    margin-inline: -5px;
    border-radius: 6px;
    font-size: 10px;
    transition: background .15s ease, opacity .15s ease;
}
.channel-rank { color: var(--muted); text-align: right; }
.channel-row strong { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-weight: 570; }
.channel-value { text-align: right; font-variant-numeric: tabular-nums; }
/* Podíl drží místo i když není vidět, aby řádek pod kurzorem neposkakoval. */
.channel-value small {
    display: block;
    color: var(--subtle);
    font-size: 9px;
    opacity: 0;
    transition: opacity .15s ease;
}
.channel-track { height: 10px; background: #f7eee6; }
.channel-track i { display: block; height: 100%; background: var(--accent); transition: background .15s ease; }
/* Pruh pod kurzorem se zvýrazní, ostatní zesvětlí. */
.channel-list.has-active .channel-row:not(.is-active) { opacity: .45; }
.channel-row.is-active { background: var(--accent-soft); outline: none; }
.channel-row.is-active .channel-track i { background: var(--accent-hover); }
.channel-row.is-active .channel-value small { opacity: 1; }
.device-donut {
    position: relative;
    width: 168px;
    height: 168px;
    display: grid;
    place-items: center;
    margin: 16px auto 14px;
}
.device-donut .donut-track,
.device-donut .donut-segment { --donut-stroke: 20px; }
.device-donut .donut-center { width: 96px; }
.device-donut .donut-center strong { font-size: 18px; }
.device-donut .donut-center small { margin-top: 3px; font-size: 10px; }
.device-legend { display: grid; gap: 4px; }
.device-legend-row {
    width: 100%;
    display: grid;
    grid-template-columns: 9px minmax(0, 1fr) auto;
    align-items: center;
    gap: 7px;
    padding: 5px 6px;
    border: 1px solid transparent;
    border-radius: 6px;
    color: #445068;
    background: transparent;
    font: 500 10px var(--font);
    text-align: left;
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease;
}
.device-legend-row > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.device-legend i { width: 8px; height: 8px; border-radius: 50%; background: var(--device-color); }
.device-legend strong { color: var(--ink); font-size: 10px; font-variant-numeric: tabular-nums; }
.device-legend-row:hover,
.device-legend-row:focus-visible,
.device-legend-row.is-active {
    border-color: var(--line);
    background: var(--surface-subtle);
    outline: none;
}
.page-table-panel { padding: 16px 0 0; overflow: hidden; }
.page-table-panel > .report-panel-heading { padding: 0 16px 12px; }
.report-table-wrap { overflow-x: auto; }
.report-table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 10px; }
.report-table th,
.report-table td {
    min-height: 31px;
    padding: 7px 11px;
    border-top: 1px solid var(--line);
    text-align: right;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
.report-table thead th { color: #4b566b; background: #fbfcfe; font-size: 9px; font-weight: 700; }
.report-table th:first-child,
.report-table td:first-child { width: 56%; text-align: left; }
.report-table tbody th { max-width: 330px; font-weight: 500; }
.report-table tbody th strong,
.report-table tbody th small { display: block; overflow: hidden; text-overflow: ellipsis; }
.report-table tbody th small { margin-top: 1px; color: var(--muted); font-size: 9px; font-weight: 400; }
/* Řádek pod kurzorem se zvýrazní i pruhem u levé hrany. V tabulce o čtyřech
   sloupcích se očima snadno sklouzne o řádek vedle a samotné podbarvení je na
   to slabé. */
.report-table tbody tr { transition: background .15s ease; }
.report-table tbody tr:hover,
.report-table tbody tr:focus-within { background: var(--accent-soft); }
.report-table tbody th { position: relative; }
.report-table tbody tr:hover > th::before,
.report-table tbody tr:focus-within > th::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background: var(--accent);
}
.report-table-empty { height: 175px; color: var(--muted); text-align: center !important; white-space: normal !important; }
.report-empty-small { min-height: 190px; display: grid; place-items: center; color: var(--muted); font-size: 11px; text-align: center; }
.paid-performance { margin-top: 14px; padding: 16px; }
.paid-performance-grid { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 14px; }
.paid-performance-grid article { padding: 8px 18px; border-right: 1px solid var(--line); }
.paid-performance-grid article:first-child { padding-left: 0; }
.paid-performance-grid article:last-child { border-right: 0; }
.paid-performance-grid span { display: block; color: var(--muted); font-size: 11px; }
.paid-performance-grid strong { display: block; margin-top: 4px; font-size: 22px; }
/* Z čeho se ROAS počítá. Bez toho by se číslo čtlo jako přesná návratnost. */
.paid-performance-note {
    margin: 14px 0 0;
    padding-top: 12px;
    border-top: 1px solid var(--line);
    color: var(--muted);
    font-size: 11px;
    line-height: 1.5;
}
.paid-performance-note strong { color: var(--ink); font-weight: 570; }
/* Nulový čitatel u krátkého období není nulová návratnost, ale ještě
   neuzavřené případy. Musí být vidět, že jde o jiný důvod. */
.paid-performance-warning {
    margin-top: 10px;
    padding: 10px 12px;
    border: 1px solid #f0d08a;
    border-top: 1px solid #f0d08a;
    border-radius: 7px;
    color: #7a5312;
    background: #fdf6e6;
}
.paid-performance-warning strong { color: inherit; }
.report-no-data {
    min-height: 440px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-top: 16px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    text-align: center;
}
.report-no-data > span { width: 54px; height: 54px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 9px; color: var(--accent); }
.report-no-data h2 { margin: 16px 0 0; font-size: 19px; }
.report-no-data p { max-width: 520px; margin: 6px 0 0; color: var(--muted); font-size: 13px; }
.report-no-data > div { display: flex; gap: 9px; margin-top: 19px; }
.report-no-data form { margin: 0; }
.report-dialog {
    width: min(560px, calc(100vw - 30px));
    padding: 25px;
    border: 1px solid var(--line-strong);
    border-radius: 10px;
    color: var(--ink);
    background: #fff;
    box-shadow: 0 25px 70px rgba(12, 23, 49, .2);
}
.report-dialog::backdrop { background: rgba(12, 23, 49, .34); backdrop-filter: blur(2px); }
.dialog-close-form { position: absolute; top: 10px; right: 12px; margin: 0; }
.dialog-close-form button {
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 7px;
    color: var(--muted);
    background: transparent;
    font-size: 24px;
    cursor: pointer;
}
.dialog-close-form button:hover { color: var(--ink); background: var(--surface-subtle); }
.report-dialog-heading h2 { margin: 0; font-size: 21px; letter-spacing: -.025em; }
.report-dialog-heading p { margin: 5px 25px 0 0; color: var(--muted); font-size: 12px; }
.report-builder-form { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 21px; }
.report-builder-form .button { grid-column: 1 / -1; justify-self: end; }
.report-chat-history { max-height: 280px; overflow: auto; display: grid; gap: 8px; margin-top: 18px; }
.report-chat-history article { padding: 10px 12px; border-radius: 8px; font-size: 11px; }
.report-chat-history article.is-user { margin-left: 40px; background: var(--accent-soft); }
.report-chat-history article.is-assistant { margin-right: 40px; border: 1px solid var(--line); }
.report-chat-history strong { font-size: 10px; }
.report-chat-history p { margin: 3px 0 0; white-space: pre-wrap; }
.report-chat-form { display: grid; gap: 8px; margin-top: 18px; }
.report-chat-form label { font-size: 12px; font-weight: 650; }
.report-chat-form textarea {
    width: 100%;
    resize: vertical;
    padding: 11px;
    border: 1px solid var(--line-strong);
    border-radius: 8px;
    color: var(--ink);
}
.report-chat-form .button { justify-self: end; }

/* CRM import and commercial reporting */
.crm-header { align-items: flex-end; }
.crm-summary {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin-top: 16px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #fff;
    overflow: hidden;
}
.crm-summary article {
    min-width: 0;
    padding: 18px 20px;
    border-right: 1px solid var(--line);
}
.crm-summary article:last-child { border-right: 0; }
.crm-summary span,
.crm-report-kpis span { display: block; color: var(--muted); font-size: 11px; }
.crm-summary strong { display: block; margin-top: 5px; font-size: 23px; letter-spacing: -.03em; }
.crm-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 310px;
    gap: 18px;
    align-items: start;
    margin-top: 18px;
}
.crm-import-panel,
.crm-attribution-help,
.crm-data-section,
.crm-import-history {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #fff;
}
.crm-import-panel { min-width: 0; padding: 22px; }
.raynet-connection-panel { margin-top: 16px; }
.raynet-connection-panel .crm-import-actions { margin-top: 14px; }
.raynet-connection-panel .crm-import-actions p { margin: 0; color: var(--muted); font-size: 12px; }
.settings-subsection-heading { margin-top: 26px; }
.settings-subsection-heading h3 { margin: 0; font-size: 17px; }
.crm-attribution-help { padding: 22px; }
.crm-section-heading,
.crm-preview-meta,
.crm-import-actions,
.crm-attribution-card header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}
.crm-section-heading h2,
.crm-attribution-help h2 { margin: 0; font-size: 17px; letter-spacing: -.02em; }
.crm-section-heading p { margin: 4px 0 0; color: var(--muted); font-size: 11px; }
.crm-section-heading > span { color: var(--accent); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; }
.crm-upload-form { display: grid; justify-items: start; gap: 14px; margin-top: 18px; }
.crm-upload-actions { display: flex; align-items: center; gap: 14px; }
.crm-upload-actions a { color: var(--accent); font-size: 11px; font-weight: 650; }
.crm-dropzone {
    width: 100%;
    min-height: 205px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 8px;
    border: 1px dashed #9db5df;
    border-radius: 9px;
    background: #f8faff;
    color: var(--ink);
    text-align: center;
    cursor: pointer;
    transition: border-color .15s ease, background .15s ease;
}
.crm-dropzone:hover { border-color: var(--accent); background: var(--accent-soft); }
.crm-dropzone > span {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border: 1px solid #bfd0f4;
    border-radius: 9px;
    color: var(--accent);
    background: #fff;
}
.crm-dropzone strong { margin-top: 3px; font-size: 14px; }
.crm-dropzone small { color: var(--muted); font-size: 11px; }
.crm-preview-meta {
    margin-top: 18px;
    padding: 12px 14px;
    border: 1px solid #aedfc8;
    border-radius: 8px;
    background: #f1fbf6;
}
.crm-preview-meta > span { color: #128451; }
.crm-preview-meta > div { flex: 1; min-width: 0; }
.crm-preview-meta strong,
.crm-preview-meta small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.crm-preview-meta strong { font-size: 12px; }
.crm-preview-meta small { margin-top: 2px; color: var(--muted); font-size: 10px; }
.crm-preview-meta a { color: var(--accent); font-size: 11px; font-weight: 650; }
.crm-mapping-form { margin-top: 22px; }
.crm-mapping-heading { align-items: flex-start; }
.crm-mapping-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 13px;
    margin-top: 16px;
}
.crm-mapping-grid label b { color: #c9374d; }
.crm-import-actions { margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--line); }
.crm-import-actions p { display: flex; align-items: center; gap: 6px; margin: 0; color: var(--muted); font-size: 10px; }
.crm-preview-table-wrap,
.crm-opportunity-table-wrap { width: 100%; overflow-x: auto; }
.crm-preview-table-wrap { margin-top: 21px; border: 1px solid var(--line); border-radius: 8px; }
.crm-preview-table,
.crm-opportunity-table { width: 100%; border-collapse: collapse; font-size: 10px; }
.crm-preview-table th,
.crm-preview-table td,
.crm-opportunity-table th,
.crm-opportunity-table td {
    padding: 8px 11px;
    border-bottom: 1px solid var(--line);
    text-align: left;
    white-space: nowrap;
}
.crm-preview-table th,
.crm-opportunity-table thead th { color: #4b566b; background: #f8faff; font-size: 9px; text-transform: uppercase; letter-spacing: .035em; }
.crm-preview-table tbody tr:last-child td,
.crm-opportunity-table tbody tr:last-child > * { border-bottom: 0; }
.crm-attribution-help > div { margin-top: 18px; padding-top: 17px; border-top: 1px solid var(--line); }
.crm-attribution-help strong { display: flex; align-items: center; gap: 8px; font-size: 12px; }
.crm-attribution-help p { margin: 5px 0 0; color: var(--muted); font-size: 10px; line-height: 1.55; }
.crm-source-dot,
.crm-attribution-card header i {
    width: 8px;
    height: 8px;
    display: inline-block;
    border-radius: 50%;
    background: #8792a5;
}
.crm-source-dot.is-ppc,
.crm-attribution-card.is-ppc header i { background: var(--accent); }
.crm-source-dot.is-web,
.crm-attribution-card.is-web header i { background: #20a477; }
.crm-source-dot.is-other,
.crm-attribution-card.is-other header i { background: #8792a5; }
.crm-attribution-help .crm-help-note { margin-top: 20px; padding: 12px; border-radius: 7px; background: var(--surface-subtle); }
.crm-data-section,
.crm-import-history { margin-top: 18px; padding: 20px; }
.crm-opportunity-table-wrap { margin-top: 14px; border: 1px solid var(--line); border-radius: 8px; }
.crm-opportunity-table th:first-child { min-width: 180px; }
.crm-opportunity-table td:last-child { font-variant-numeric: tabular-nums; font-weight: 650; text-align: right; }
.crm-attribution,
.crm-status {
    display: inline-flex;
    padding: 3px 7px;
    border-radius: 999px;
    color: #4e5b70;
    background: #eef1f6;
    font-size: 9px;
    font-weight: 650;
}
.crm-attribution.crm-ppc { color: #164da8; background: #e8f0ff; }
.crm-attribution.crm-web { color: #17704a; background: #e7f7ef; }
.crm-status-won { color: #17704a; background: #e7f7ef; }
.crm-status-lost { color: #a53042; background: #fdecef; }
.crm-status-open { color: #8a5a0c; background: #fff3d9; }
.crm-import-history > div:not(.crm-section-heading) {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto 130px;
    gap: 15px;
    padding: 10px 0;
    border-bottom: 1px solid var(--line);
    font-size: 10px;
}
.crm-import-history > div:last-child { border-bottom: 0; }
.crm-import-history span,
.crm-import-history time { color: var(--muted); text-align: right; }

.crm-report-section {
    margin-top: 14px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #fff;
}
.crm-report-section .report-panel-heading { align-items: center; }
.crm-report-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    margin-top: 14px;
    border-block: 1px solid var(--line);
}
.crm-report-kpis article { min-width: 0; padding: 13px 14px; border-right: 1px solid var(--line); }
.crm-report-kpis article:first-child { padding-left: 0; }
.crm-report-kpis article:last-child { border-right: 0; }
.crm-report-kpis strong { display: block; margin-top: 4px; font-size: 18px; white-space: nowrap; }
.crm-attribution-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 14px; }
.crm-attribution-card { min-width: 0; padding: 13px; border: 1px solid var(--line); border-radius: 8px; background: #fbfcfe; }
.crm-attribution-card header span { display: flex; align-items: center; gap: 7px; font-size: 11px; font-weight: 650; }
.crm-attribution-card header > strong { font-size: 10px; }
.crm-attribution-card > div { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 13px; }
.crm-attribution-card > div span { min-width: 0; }
.crm-attribution-card small { display: block; color: var(--muted); font-size: 8px; }
.crm-attribution-card b { display: block; margin-top: 3px; overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
/* Zdroje z Raynetu jsou hlavní obsah reportu, ne poznámka pod čarou. Dřív to
   byl jen oddíl za tenkou linkou s devítibodovými popisky, takže se v reportu
   ztrácel. Má vlastní rámec a čitelná čísla. */
.crm-dimension-section {
    margin-top: 20px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--surface-subtle);
}
.crm-dimension-heading { display: flex; align-items: end; justify-content: space-between; gap: 16px; }
.crm-dimension-heading h3 { margin: 0; font-size: 17px; }
.crm-dimension-heading small { display: block; margin-top: 4px; color: var(--muted); font-size: 12px; }
.crm-dimension-heading > span {
    padding: 7px 11px;
    border-radius: 999px;
    color: #9a4c00;
    background: #fff1df;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
}
.crm-dimension-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: 14px; }
.crm-dimension-grid article { padding: 13px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.crm-dimension-grid span { display: block; min-height: 30px; color: var(--muted); font-size: 12px; line-height: 1.35; }
.crm-dimension-grid strong { display: block; margin-top: 5px; font-size: 26px; line-height: 1.1; }
.crm-dimension-grid small { display: block; margin-top: 4px; color: var(--muted); font-size: 11px; }
.crm-report-empty {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) auto;
    align-items: center;
    gap: 13px;
    margin-top: 14px;
    padding: 18px;
    border: 1px dashed #b4c5e4;
    border-radius: 8px;
    background: #f8faff;
}
.crm-report-empty > span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 8px; color: var(--accent); background: #fff; }
.crm-report-empty strong { font-size: 12px; }
.crm-report-empty p { margin: 4px 0 0; color: var(--muted); font-size: 10px; }
.category-performance {
    margin-top: 18px;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--surface);
}
.category-performance-heading { align-items: center; }
/* Kategorie plus oba konce období plus tlačítko se do jednoho řádku vejdou jen
   na širokém panelu. Grid je zalomí a nechá stejně široké; u flexu se osamocené
   pole na dalším řádku roztáhlo přes celou šířku. */
.category-performance-filter {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    align-items: end;
    gap: 12px;
    margin-top: 16px;
    padding: 13px;
    border-radius: 8px;
    background: var(--surface-subtle);
}
/* Skryté vstupy by si v gridu jinak vzaly buňku. */
.category-performance-filter input[type="hidden"] { display: none; }
.category-performance-filter .button { justify-self: start; }
.category-performance-kpis {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 14px;
}
.category-performance-kpis article { padding: 13px; border: 1px solid var(--line); border-radius: 8px; }
.category-performance-kpis span { display: block; color: var(--muted); font-size: 9px; }
.category-performance-kpis strong { display: block; margin-top: 5px; font-size: 20px; }
.category-performance-kpis small { display: block; margin-top: 5px; color: var(--muted); font-size: 8px; line-height: 1.4; }
.category-performance-kpis .is-positive strong { color: #23785a; }
.category-performance-kpis .is-negative strong { color: #b33d3f; }
.category-performance-legend { justify-content: flex-start; margin-top: 16px; }
.category-performance-chart { min-height: 310px; margin-top: 8px; }
.category-performance-note { margin: 8px 0 0; color: var(--muted); font-size: 9px; }
.category-performance-empty { margin-top: 14px; }
.bi-zero-line { stroke: #8993a4; stroke-width: 1.3; }

.admin-responsible-panel,
.admin-cost-create,
.admin-cost-list { margin-top: 18px; padding: 20px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.admin-responsible-form { margin-top: 16px; }
.admin-responsible-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}
.admin-person-card {
    min-width: 0;
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr) auto;
    align-items: center;
    gap: 11px;
    padding: 13px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-subtle);
    cursor: pointer;
}
.admin-person-card:has(input:checked) { border-color: var(--accent-border); background: var(--accent-soft); }
.admin-person-switch {
    width: 36px;
    height: 20px;
    display: flex;
    align-items: center;
    padding: 2px;
    border-radius: 999px;
    background: #c7ccd5;
    transition: background .15s ease;
}
.admin-person-switch i {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 3px rgba(16, 27, 48, .22);
    transition: transform .15s ease;
}
.admin-person-card input:checked + .admin-person-switch { background: var(--accent); }
.admin-person-card input:checked + .admin-person-switch i { transform: translateX(16px); }
.admin-person-card input:focus-visible + .admin-person-switch { outline: 3px solid rgba(223, 116, 24, .2); outline-offset: 2px; }
.admin-person-copy { min-width: 0; }
.admin-person-copy strong,
.admin-person-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-person-copy strong { color: var(--ink); font-size: 11px; }
.admin-person-copy small { margin-top: 3px; color: var(--muted); font-size: 9px; }
.admin-person-state {
    padding: 3px 7px;
    border-radius: 999px;
    color: var(--muted);
    background: #e9ecf1;
    font-size: 8px;
    font-weight: 750;
    text-transform: uppercase;
}
.admin-person-card:has(input:checked) .admin-person-state { color: var(--accent-hover); background: #fff; }
.admin-cost-ads-note { margin: 14px 0 0; padding: 11px 13px; border-left: 3px solid var(--accent); border-radius: 0 7px 7px 0; color: #7d4b18; background: #fff8ef; font-size: 10px; line-height: 1.5; }
.admin-cost-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: end; gap: 12px; margin-top: 16px; }
.admin-cost-form .button { min-height: 40px; }
.admin-cost-empty { margin-top: 14px; padding: 16px; border: 1px dashed var(--line-strong); border-radius: 8px; color: var(--muted); font-size: 11px; }
.admin-cost-table-wrap { margin-top: 14px; overflow-x: auto; }
.admin-cost-table { width: 100%; border-collapse: collapse; font-size: 11px; }
.admin-cost-table th,
.admin-cost-table td { padding: 11px 10px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.admin-cost-table thead th { color: var(--muted); font-size: 9px; text-transform: uppercase; }
.admin-cost-table td:nth-child(4) { white-space: nowrap; }
.admin-cost-actions { display: flex; align-items: flex-start; gap: 8px; }
.admin-cost-actions details { position: relative; }
.admin-cost-actions summary { padding: 7px 10px; border: 1px solid var(--line-strong); border-radius: 7px; cursor: pointer; font-weight: 700; list-style: none; }
.admin-cost-edit-form { position: absolute; z-index: 10; right: 0; width: 310px; display: grid; gap: 8px; margin-top: 6px; padding: 12px; border: 1px solid var(--line-strong); border-radius: 8px; background: #fff; box-shadow: 0 14px 36px rgba(28, 37, 51, .16); }
.admin-cost-edit-form input,
.admin-cost-edit-form select { width: 100%; }
.button-danger { border-color: #e2aaaa; color: #a92f32; background: #fff5f5; }
.button-danger:hover { border-color: #c85254; background: #fff0f0; }

@media (max-width: 1320px) {
    .report-filter-form { flex-wrap: wrap; }
    .report-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .report-breakdowns { grid-template-columns: minmax(280px, 1fr) 240px; }
    .page-table-panel { grid-column: 1 / -1; }
    .report-source { min-width: 190px; margin-left: 0; }
    .crm-report-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .crm-report-kpis article:nth-child(3) { border-right: 0; }
}

@media (max-width: 1020px) {
    .report-filter-form { flex-wrap: wrap; }
    .report-source { margin-left: 0; }
    .reporting-workspace { grid-template-columns: 1fr; }
    .report-insights { min-height: 230px; }
    .insight-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .insight-item { border: 0; }
    .insight-action { width: auto; align-self: flex-start; }
    .crm-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .crm-summary article:nth-child(3) { border-right: 0; }
    .crm-summary article:nth-child(n+4) { border-top: 1px solid var(--line); }
    .crm-layout { grid-template-columns: 1fr; }
    .crm-mapping-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .crm-attribution-help { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
    .crm-attribution-help h2,
    .crm-attribution-help .crm-help-note { grid-column: 1 / -1; }
    .crm-attribution-help > div { margin: 0; }
    .crm-attribution-grid { grid-template-columns: 1fr; }
    .crm-dimension-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .admin-cost-form { grid-template-columns: 1fr 1fr; }
    .admin-cost-form .button { align-self: end; }
}

@media (max-width: 760px) {
    .reporting-header { display: block; }
    .reporting-header-actions { margin-top: 17px; }
    .reporting-header-actions .button { flex: 1; }
    .report-filter-form { align-items: stretch; }
    .report-period-field,
    .report-period-field select,
    .report-source { width: 100%; }
    .comparison-label { width: 100%; }
    .report-range { flex: 1; }
    .report-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .report-kpi > strong { font-size: 24px; }
    .report-chart-panel { padding-inline: 12px; }
    .report-panel-heading { display: block; }
    .report-series-legend { justify-content: flex-start; margin-top: 10px; }
    .bi-line-chart { min-height: 210px; overflow: visible; }
    .bi-line-chart svg { min-width: 0; height: auto; aspect-ratio: 420 / 260; }
    .insight-list { grid-template-columns: 1fr; }
    .report-breakdowns { grid-template-columns: 1fr; }
    .page-table-panel { grid-column: auto; }
    .report-table { min-width: 620px; }
    .report-table th:first-child,
    .report-table td:first-child { width: 43%; }
    .paid-performance-grid { grid-template-columns: repeat(2, 1fr); gap: 15px 0; }
    .paid-performance-grid article:nth-child(2) { border-right: 0; }
    .report-builder-form { grid-template-columns: 1fr; }
    .report-builder-form .button { grid-column: auto; justify-self: stretch; }
    .crm-header { display: block; }
    .crm-header .button { width: 100%; margin-top: 15px; }
    .crm-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .crm-summary article:nth-child(odd) { border-right: 1px solid var(--line); }
    .crm-summary article:nth-child(even) { border-right: 0; }
    .crm-summary article:nth-child(n+3) { border-top: 1px solid var(--line); }
    .crm-summary article:last-child { grid-column: 1 / -1; }
    .crm-import-panel,
    .crm-attribution-help,
    .crm-data-section,
    .crm-import-history { padding: 16px; }
    .crm-mapping-grid { grid-template-columns: 1fr; }
    .crm-import-actions,
    .crm-section-heading,
    .crm-preview-meta { align-items: flex-start; flex-wrap: wrap; }
    .crm-import-actions .button { width: 100%; }
    .crm-upload-actions { width: 100%; flex-direction: column; align-items: stretch; text-align: center; }
    .crm-attribution-help { display: block; }
    .crm-attribution-help > div { margin-top: 16px; }
    .crm-import-history > div:not(.crm-section-heading) { grid-template-columns: 1fr auto; }
    .crm-import-history time { grid-column: 1 / -1; text-align: left; }
    .crm-report-section .report-panel-heading .button { width: 100%; margin-top: 12px; }
    .crm-report-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .crm-report-kpis article,
    .crm-report-kpis article:nth-child(3) { padding-left: 10px; border-right: 1px solid var(--line); }
    .crm-report-kpis article:nth-child(even) { border-right: 0; }
    .crm-attribution-card > div { grid-template-columns: 1fr 1fr; }
    .crm-dimension-heading { display: block; }
    .crm-dimension-heading > span { display: inline-block; margin-top: 8px; }
    .crm-dimension-grid { grid-template-columns: 1fr 1fr; }
    .category-performance-filter { display: grid; grid-template-columns: 1fr; }
    .category-performance-filter .filter-field { min-width: 0; }
    .category-performance-kpis { grid-template-columns: 1fr; }
    .admin-cost-form { grid-template-columns: 1fr; }
    .admin-cost-actions { display: grid; }
    .admin-cost-edit-form { position: fixed; inset: 15% 16px auto; width: auto; }
    .crm-report-empty { grid-template-columns: 44px minmax(0, 1fr); }
    .crm-report-empty .button { grid-column: 1 / -1; width: 100%; }
}

/* Persistent AI data conversation */
.ai-chat-panel {
    grid-template-rows: auto auto minmax(0, 1fr) auto;
    gap: 0;
    padding: 28px 22px 22px;
    box-shadow: -12px 0 34px rgba(47, 32, 18, .035);
    z-index: 24;
}
.ai-chat-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--line);
}
.ai-chat-kicker {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: var(--accent-hover);
    font-size: 11px;
    font-weight: 720;
    letter-spacing: .035em;
    text-transform: uppercase;
}
.ai-chat-kicker i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--accent);
    box-shadow: 0 0 0 4px var(--accent-soft);
}
.ai-chat-header h2 {
    margin: 7px 0 0;
    font-size: 21px;
    line-height: 1.2;
    letter-spacing: -.028em;
}
.ai-chat-header p {
    margin: 6px 0 0;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.5;
}
.ai-panel-close {
    display: none;
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 8px;
    color: var(--muted);
    background: var(--surface-subtle);
    font-size: 23px;
    line-height: 1;
    cursor: pointer;
}
.ai-source-strip {
    display: flex;
    gap: 7px;
    padding: 13px 0;
    border-bottom: 1px solid var(--line);
}
.ai-source-strip span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 26px;
    padding: 0 9px;
    border: 1px solid var(--line);
    border-radius: 6px;
    color: var(--muted);
    background: #fff;
    font-size: 10px;
    font-weight: 680;
}
.ai-source-strip i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--subtle);
}
.ai-source-strip .is-connected {
    color: #166044;
    border-color: #b9decf;
    background: #f3fbf7;
}
.ai-source-strip .is-connected i { background: var(--success); }
.ai-chat-history {
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    display: grid;
    align-content: start;
    gap: 10px;
    padding: 17px 3px 18px 0;
    scrollbar-width: thin;
    scrollbar-color: #c7cbd4 transparent;
}
.ai-chat-history article {
    max-width: 94%;
    padding: 11px 12px;
    border-radius: 9px;
    font-size: 11px;
    line-height: 1.55;
}
.ai-chat-history article.is-user {
    justify-self: end;
    margin-left: 28px;
    background: var(--accent-soft);
    border: 1px solid #f5d8bc;
}
.ai-chat-history article.is-assistant {
    justify-self: start;
    margin-right: 20px;
    border: 1px solid var(--line);
    background: #fff;
}
.ai-chat-history article strong {
    display: block;
    color: var(--accent-hover);
    font-size: 9px;
    text-transform: uppercase;
    letter-spacing: .045em;
}
.ai-chat-history article.is-user strong { color: #7d4a20; }
.ai-chat-history article p { margin: 4px 0 0; white-space: pre-wrap; }
.ai-chat-empty {
    align-self: center;
    padding: 30px 14px;
    color: var(--muted);
    text-align: center;
}
.ai-chat-empty > span {
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    margin: 0 auto 12px;
    border: 1px solid #f0c79f;
    border-radius: 10px;
    color: var(--accent);
    background: var(--accent-soft);
}
.ai-chat-empty strong { display: block; color: var(--ink); font-size: 13px; }
.ai-chat-empty p { margin: 5px 0 0; font-size: 11px; line-height: 1.55; }
.ai-chat-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    padding-top: 16px;
    border-top: 1px solid var(--line);
}
.ai-chat-form label {
    grid-column: 1 / -1;
    font-size: 11px;
    font-weight: 680;
}
.ai-chat-form textarea {
    grid-column: 1 / -1;
    width: 100%;
    min-height: 88px;
    resize: vertical;
    padding: 11px 12px;
    border: 1px solid var(--line-strong);
    border-radius: 8px;
    color: var(--ink);
    background: #fff;
    font-size: 12px;
    line-height: 1.5;
}
.ai-chat-form textarea:focus {
    outline: 0;
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(223, 116, 24, .12);
}
.ai-chat-form textarea[readonly] { color: var(--muted); background: var(--surface-subtle); }
.ai-chat-submit { grid-column: 2; min-width: 126px; }
.ai-chat-submit:disabled { opacity: .72; cursor: wait; transform: none; }
.ai-submit-status {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    padding: 10px 11px;
    border: 1px solid #f0cfad;
    border-radius: 8px;
    color: #704218;
    background: #fff8f1;
}
.ai-submit-status[hidden] { display: none; }
.ai-submit-status strong { display: block; font-size: 11px; }
.ai-submit-status small { display: block; margin-top: 2px; color: #8b684b; font-size: 9px; line-height: 1.4; }
.ai-loading-spinner {
    width: 21px;
    height: 21px;
    border: 2px solid #f3cfaa;
    border-top-color: var(--accent);
    border-radius: 50%;
    animation: ai-spin .75s linear infinite;
}
@keyframes ai-spin { to { transform: rotate(360deg); } }
.ai-panel-toggle { display: none; }

/* Unified GA4 + GSC + Google Ads reporting */
.integrated-report {
    margin-top: 16px;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #fff;
}
.integrated-report-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
}
.integrated-report-heading h2 { margin: 0; font-size: 17px; letter-spacing: -.02em; }
.integrated-report-heading p { margin: 4px 0 0; color: var(--muted); font-size: 11px; }
.integrated-report-heading > span { color: var(--muted); font-size: 11px; white-space: nowrap; }
.integrated-source-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    margin-top: 16px;
    border: 1px solid var(--line);
    border-radius: 9px;
    overflow: hidden;
}
.integrated-source-card {
    min-width: 0;
    min-height: 190px;
    padding: 16px;
    border-right: 1px solid var(--line);
    background: #fff;
}
.integrated-source-card:last-child { border-right: 0; }
.integrated-source-card header { display: flex; align-items: center; gap: 10px; }
.integrated-source-mark {
    width: 37px;
    height: 37px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 8px;
    color: #fff;
    background: var(--accent);
    font-size: 10px;
    font-weight: 750;
}
.source-card-search_console .integrated-source-mark { background: #288a67; }
.source-card-ads .integrated-source-mark { color: #78400e; background: #ffc06a; }
.source-card-meta .integrated-source-mark { color: #fff; background: #0866ff; }
/* Raynet tmavě: není to reklamní systém, ale obchodní výsledek. */
.source-card-raynet .integrated-source-mark { color: #fff; background: #0c1731; }
.integrated-source-card h3 { margin: 0; font-size: 12px; }
.integrated-source-state {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-top: 3px;
    color: var(--muted);
    font-size: 9px;
}
.integrated-source-state i { width: 6px; height: 6px; border-radius: 50%; background: var(--subtle); }
.integrated-source-state.is-ready { color: #166044; }
.integrated-source-state.is-ready i { background: var(--success); }
.integrated-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 11px 14px;
    margin-top: 17px;
}
.integrated-metrics span { display: block; color: var(--muted); font-size: 9px; }
.integrated-metrics strong {
    display: block;
    overflow: hidden;
    margin-top: 2px;
    font-size: 17px;
    line-height: 1.25;
    letter-spacing: -.025em;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.integrated-source-empty { margin-top: 17px; }
.integrated-source-empty p { min-height: 54px; margin: 0; color: var(--muted); font-size: 10px; line-height: 1.55; }
.integrated-source-empty a { display: inline-block; margin-top: 9px; color: var(--accent-hover); font-size: 10px; font-weight: 680; }
.integrated-report-note { margin: 10px 0 0; color: var(--muted); font-size: 9px; }

@media (max-width: 1320px) {
    .reporting-workspace { grid-template-columns: 1fr; }
    .report-insights { min-height: 210px; }
    .insight-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .insight-item { border-bottom: 0; }
    .insight-action { width: auto; align-self: flex-start; margin-top: 12px; }
    .integrated-source-grid { grid-template-columns: 1fr; }
    .integrated-source-card { min-height: 0; border-right: 0; border-bottom: 1px solid var(--line); }
    .integrated-source-card:last-child { border-bottom: 0; }
    .integrated-metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 1100px) {
    .has-rightbar .app-shell { grid-template-columns: 200px minmax(0, 1fr); }
    .ai-chat-panel {
        position: fixed;
        top: 0;
        right: 0;
        width: min(var(--rightbar-width), calc(100vw - 24px));
        height: 100vh;
        padding: 25px 20px 20px;
        transform: translateX(104%);
        transition: transform .22s ease;
        box-shadow: -18px 0 55px rgba(28, 20, 12, .18);
    }
    .ai-chat-panel.is-open { transform: translateX(0); }
    .ai-panel-close { display: grid; place-items: center; }
    .ai-panel-toggle {
        position: fixed;
        right: 18px;
        bottom: 18px;
        z-index: 23;
        min-height: 44px;
        display: inline-flex;
        align-items: center;
        gap: 8px;
        padding: 0 15px;
        border: 1px solid #bc5708;
        border-radius: 9px;
        color: #fff;
        background: var(--accent);
        box-shadow: 0 10px 28px rgba(128, 62, 9, .25);
        font: 680 12px var(--font);
        cursor: pointer;
    }
    .chat-panel-open .ai-panel-toggle { visibility: hidden; }
}

@media (max-width: 760px) {
    .ai-chat-panel { width: 100vw; padding: 20px 17px 16px; }
    .integrated-report-heading { display: block; }
    .integrated-report-heading > span { display: block; margin-top: 7px; }
    .integrated-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (prefers-reduced-motion: reduce) {
    .ai-chat-panel { transition: none; }
    .ai-loading-spinner { animation-duration: 1.5s; }
}

/* ---- BI přehled obchodních případů (CRM) ---- */
.crm-header-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.crm-auto-sync { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-size: 10px; font-weight: 600; }
.crm-auto-sync i { width: 7px; height: 7px; border-radius: 50%; background: var(--success); box-shadow: 0 0 0 3px rgba(40, 138, 103, .12); }
.crm-basis-switch {
    display: inline-flex;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #fff;
}
.crm-basis-switch a {
    padding: 8px 15px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 570;
    text-decoration: none;
}
.crm-basis-switch a + a { border-left: 1px solid var(--line); }
.crm-basis-switch a:hover { background: var(--surface-subtle); color: var(--ink); }
.crm-basis-switch a.active { background: var(--accent); color: #fff; }
.crm-filter-panel {
    margin-top: 18px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface-subtle);
}
.crm-filter-panel form { display: flex; align-items: flex-end; gap: 11px; flex-wrap: wrap; }
.crm-filter-panel .filter-field input { min-width: 154px; }
.crm-retention-field { margin-left: auto; }
.crm-retention-field select { min-width: 170px; }
.crm-detail-filters {
    flex: 1 0 100%;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 11px;
    margin-top: 2px;
    padding-top: 12px;
    border-top: 1px solid var(--line);
}
.crm-detail-filters .filter-field,
.crm-detail-filters select { width: 100%; min-width: 0; }
.crm-filter-reset { align-self: center; color: var(--muted); font-size: 11px; font-weight: 650; }
.crm-filter-panel > p { margin: 10px 0 0; color: var(--muted); font-size: 10px; line-height: 1.5; }
.crm-header .crm-basis-help { margin-top: 4px; color: var(--muted); font-size: 10px; }
.crm-filter-panel > .crm-currency-warning { color: #8a4b0f; font-weight: 600; }
.crm-summary small { display: block; margin-top: 3px; color: var(--subtle); font-size: 10px; }
.crm-board-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
    gap: 16px;
    align-items: start;
    margin-top: 16px;
}
.crm-board-column {
    min-width: 0;
    display: grid;
    align-content: start;
    gap: 16px;
}
/* Odsazení sousedních panelů platí jen pro panely skládané ve svislém toku.
   V mřížce mezery řeší gap, a margin navíc by první panel posunul výš než
   ostatní a zkrátil jim rámeček. */
.crm-board-column > .report-breakdown-panel + .report-breakdown-panel,
.report-breakdowns > .report-breakdown-panel + .report-breakdown-panel { margin-top: 0; }
.crm-board-grid + .report-breakdown-panel,
.report-breakdown-panel + .report-breakdown-panel { margin-top: 16px; }
.crm-retention-summary {
    display: flex;
    align-items: baseline;
    gap: 9px;
    margin-top: 14px;
    padding: 11px 13px;
    border: 1px solid var(--accent-border);
    border-radius: 8px;
    background: var(--accent-soft);
}
.crm-retention-summary strong { color: var(--accent-hover); font-size: 18px; }
.crm-retention-summary span { color: #74410e; font-size: 10px; }
.crm-retention-warning { margin: 9px 0 0; color: var(--danger); font-size: 10px; }
.crm-source-legend { display: flex; justify-content: flex-end; gap: 14px; margin-top: 14px; color: var(--muted); font-size: 9px; }
.crm-source-legend span { display: inline-flex; align-items: center; gap: 5px; }
.crm-source-legend i { width: 8px; height: 8px; border-radius: 2px; background: var(--ink); }
.crm-source-legend span + span i { background: var(--accent); }
.crm-source-row {
    display: grid;
    grid-template-columns: minmax(130px, 220px) minmax(120px, 1fr) 150px;
    align-items: center;
    gap: 12px;
    min-height: 42px;
    border-bottom: 1px solid var(--line);
}
.crm-source-row:last-child { border-bottom: 0; }
.crm-source-row.is-selected-source { margin-inline: -8px; padding-inline: 8px; border-radius: 7px; background: var(--accent-soft); }
.crm-source-row > div strong,
.crm-source-row > div small,
.crm-source-row > span:last-child strong,
.crm-source-row > span:last-child small { display: block; }
.crm-source-row > div strong { overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.crm-source-row small { margin-top: 2px; color: var(--muted); font-size: 9px; font-weight: 400; }
.crm-source-row > span:last-child { text-align: right; font-variant-numeric: tabular-nums; }
.crm-source-row > span:last-child strong { font-size: 11px; }
.crm-source-track { display: flex; height: 8px; overflow: hidden; border-radius: 999px; background: var(--surface-subtle); }
.crm-source-track i { display: block; height: 100%; }
.crm-source-direct { background: var(--ink); }
.crm-source-retained { background: var(--accent); }
.crm-retained-badge {
    display: inline-block;
    margin-left: 5px;
    padding: 2px 6px;
    border-radius: 999px;
    color: var(--accent-hover);
    background: var(--accent-soft);
    font-size: 8px;
    font-weight: 700;
}
@media (max-width: 1100px) {
    .crm-board-grid { grid-template-columns: minmax(0, 1fr); }
    .crm-detail-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
    .crm-header-actions { align-items: stretch; flex-direction: column; }
    .crm-basis-switch { width: 100%; }
    .crm-basis-switch a { flex: 1; text-align: center; }
    .crm-filter-panel form { align-items: stretch; flex-direction: column; }
    .crm-filter-panel .filter-field input,
    .crm-retention-field select,
    .crm-filter-panel .button { width: 100%; }
    .crm-retention-field { width: 100%; margin-left: 0; }
    .crm-detail-filters { grid-template-columns: 1fr; }
    .crm-filter-reset { align-self: flex-start; }
    .crm-retention-summary { align-items: flex-start; flex-direction: column; }
    .crm-source-legend { justify-content: flex-start; }
    .crm-source-row { grid-template-columns: minmax(100px, 1fr) 90px; gap: 8px; padding-block: 8px; }
    .crm-source-track { grid-column: 1 / -1; grid-row: 2; }
}
/* Vodorovné pruhy bez pořadového čísla. Nelze použít .channel-row, ta má
   čtyřsloupcovou mřížku s buňkou pro pořadí. */
.crm-bar-row {
    display: grid;
    grid-template-columns: minmax(90px, 150px) minmax(70px, 1fr) 90px;
    align-items: center;
    gap: 9px;
    min-height: 32px;
    font-size: 10px;
}
.crm-bar-row strong { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-weight: 570; }
.crm-bar-row > span:last-child { text-align: right; font-variant-numeric: tabular-nums; }
/* Kategorie mají vlastní dvouřádkové rozvržení, aby se na širokých panelech
   nezkracovaly názvy a pruh skutečně využil dostupnou šířku. */
.crm-category-panel { padding: 18px 20px 20px; }
.crm-category-list {
    display: grid;
    gap: 0;
    margin-top: 12px;
    border-top: 1px solid var(--line);
}
.crm-category-row {
    display: grid;
    gap: 10px;
    padding: 15px 0;
    border-bottom: 1px solid var(--line);
}
.crm-category-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}
.crm-category-meta > div {
    min-width: 0;
    display: flex;
    align-items: baseline;
    gap: 10px;
}
.crm-category-meta > div:last-child { justify-content: flex-end; text-align: right; }
.crm-category-rank {
    color: var(--subtle);
    font-size: 9px;
    font-variant-numeric: tabular-nums;
    letter-spacing: .06em;
}
.crm-category-meta strong {
    overflow: hidden;
    color: var(--ink);
    font-size: 12px;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.crm-category-meta > div:last-child strong {
    min-width: 118px;
    font-variant-numeric: tabular-nums;
}
.crm-category-meta > div:last-child span { color: var(--muted); font-size: 9px; white-space: nowrap; }
.crm-category-track {
    height: 8px;
    overflow: hidden;
    border-radius: 999px;
    background: #f7eee6;
}
.crm-category-track i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--accent), #f0a055);
}
/* Svislé skládané pruhy po měsících. */
.crm-month-legend { display: flex; justify-content: flex-end; gap: 13px; margin-top: 8px; color: var(--muted); font-size: 9px; }
.crm-month-legend span { display: inline-flex; align-items: center; gap: 5px; }
.crm-month-legend i { display: inline-block; width: 8px; height: 8px; border-radius: 2px; }
.crm-month-chart { display: flex; align-items: flex-end; gap: 6px; padding-top: 10px; }
.crm-month-col { display: flex; flex: 1 1 0; min-width: 0; flex-direction: column; align-items: center; gap: 5px; }
.crm-month-track { display: flex; width: 100%; height: 165px; align-items: flex-end; justify-content: center; }
.crm-month-stack {
    display: flex;
    overflow: hidden;
    width: 100%;
    max-width: 42px;
    flex-direction: column-reverse;
    border-radius: 3px 3px 0 0;
}
.crm-month-stack > i { display: block; width: 100%; min-height: 1px; }
.crm-month-won { background: var(--accent); }
.crm-month-lost { background: #9aa4b5; }
.crm-month-open { background: var(--ink); }
.crm-month-name {
    max-width: 100%;
    overflow: hidden;
    color: var(--ink);
    font-size: 10px;
    font-weight: 570;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.crm-month-value { color: var(--muted); font-size: 9px; white-space: nowrap; }
/* Linka průměrné hodnoty. Kreslí se na serveru, viz šablona. */
.crm-line-chart { padding-top: 10px; }
.crm-line-chart svg { display: block; width: 100%; height: auto; }
.crm-line-area { fill: var(--accent-soft); stroke: none; }
.crm-line-stroke { fill: none; stroke: var(--ink); stroke-width: 2; }
.crm-line-dot { fill: var(--accent); stroke: #fff; stroke-width: 2; }
.crm-line-labels { display: flex; gap: 5px; margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--line); }
.crm-line-labels > div { flex: 1 1 0; min-width: 0; text-align: center; }
.crm-line-labels span { display: block; color: var(--muted); font-size: 9px; }
.crm-line-labels strong { display: block; font-size: 10px; font-variant-numeric: tabular-nums; }
.crm-responsible-donut {
    position: relative;
    width: 218px;
    height: 218px;
    display: grid;
    place-items: center;
    margin: 22px auto 20px;
}
.crm-responsible-panel .report-panel-heading h2 { font-size: 16px; }
.crm-responsible-panel .report-panel-heading p { margin-top: 3px; font-size: 11px; }
/* Výseč pod kurzorem se rozšíří a ostatní zesvětlí. Šířka tahu se řídí
   proměnnou, aby menší graf u zařízení mohl mít tenčí prstenec, ale stejné
   chování. */
[data-donut] svg { width: 100%; height: 100%; overflow: visible; }
.donut-track,
.donut-segment {
    --donut-stroke: 24px;
    fill: none;
    transform: rotate(-90deg);
    transform-origin: 80px 80px;
}
.donut-track { stroke: var(--surface-subtle); stroke-width: var(--donut-stroke); }
.donut-segment {
    stroke: var(--segment-color);
    stroke-width: var(--donut-stroke);
    cursor: pointer;
    transition: opacity .18s ease, stroke-width .18s ease, filter .18s ease;
}
[data-donut].has-active .donut-segment:not(.is-active) { opacity: .2; }
.donut-segment.is-active {
    stroke-width: calc(var(--donut-stroke) + 7px);
    filter: drop-shadow(0 3px 4px rgba(12, 23, 49, .22));
}
.donut-segment:focus-visible {
    outline: none;
    stroke-width: calc(var(--donut-stroke) + 7px);
    filter: drop-shadow(0 0 3px var(--segment-color));
}
.donut-center {
    position: absolute;
    z-index: 1;
    width: 112px;
    color: var(--muted);
    text-align: center;
    pointer-events: none;
}
.donut-center strong { display: block; color: var(--ink); font-size: 24px; line-height: 1.1; }
.donut-center small { display: block; overflow: hidden; margin-top: 5px; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.crm-responsible-legend { gap: 3px; }
.crm-responsible-row {
    width: 100%;
    display: grid;
    grid-template-columns: 11px minmax(0, 1fr) auto;
    align-items: center;
    gap: 9px;
    padding: 8px 9px;
    border: 1px solid transparent;
    border-radius: 7px;
    color: #445068;
    background: transparent;
    font: 500 12px var(--font);
    text-align: left;
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease, transform .15s ease;
}
.crm-responsible-row > i { width: 10px; height: 10px; }
.crm-responsible-row > span { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.crm-responsible-row strong { color: var(--ink); font-size: 13px; text-align: right; }
.crm-responsible-row strong small { display: block; margin-top: 2px; color: var(--subtle); font-size: 10px; font-weight: 400; }
.crm-responsible-row:hover,
.crm-responsible-row:focus-visible,
.crm-responsible-row.is-active {
    border-color: var(--line);
    background: var(--surface-subtle);
    outline: none;
    transform: translateX(-2px);
}
.crm-status { display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 10px; font-weight: 570; }
.crm-status-won { border: 1px solid var(--accent-border); background: var(--accent-soft); color: var(--accent-hover); }
.crm-status-lost { border: 1px solid #f0c4c8; background: var(--danger-soft); color: var(--danger); }
.crm-status-open { border: 1px solid var(--line); background: var(--surface-subtle); color: var(--muted); }
.crm-cell-number { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
@media (max-width: 760px) {
    .crm-responsible-donut { width: 190px; height: 190px; }
    .crm-category-panel { padding: 16px; }
    .crm-category-meta { align-items: flex-start; gap: 12px; }
    .crm-category-meta > div { display: grid; gap: 2px; }
    .crm-category-meta > div:last-child strong { min-width: 0; }
    .crm-category-meta > div:last-child span { order: 2; }
}

/* Lawyer performance */
.lawyer-header { align-items: flex-end; }
.lawyer-sync-note { margin-top: 3px !important; color: var(--subtle) !important; font-size: 11px !important; }
.lawyer-filter-panel { margin-top: 16px; }
.lawyer-filter-form {
    display: flex;
    align-items: flex-end;
    flex-wrap: wrap;
    gap: 12px;
}
.lawyer-filter-form .filter-field { flex: 1 1 150px; }
.lawyer-filter-form .filter-field:first-of-type { flex-basis: 130px; }
.lawyer-filter-form select,
.lawyer-filter-form input { width: 100%; }
.lawyer-filter-actions { display: flex; align-items: center; gap: 11px; }
.lawyer-filter-actions a { color: var(--muted); font-size: 11px; text-decoration: none; }
.lawyer-filter-actions a:hover { color: var(--accent-hover); }
.lawyer-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    margin-top: 16px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #fff;
}
.lawyer-kpis article { min-width: 0; padding: 18px; border-right: 1px solid var(--line); }
.lawyer-kpis article:last-child { border-right: 0; }
.lawyer-kpis span,
.lawyer-kpis small { display: block; color: var(--muted); font-size: 10px; }
.lawyer-kpis strong { display: block; overflow: hidden; margin-top: 6px; font-size: 21px; letter-spacing: -.03em; text-overflow: ellipsis; white-space: nowrap; }
.lawyer-kpis small { margin-top: 4px; color: var(--subtle); }
.lawyer-overview-grid,
.lawyer-breakdown-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(380px, .85fr); gap: 14px; margin-top: 14px; }
.lawyer-panel { min-width: 0; padding: 18px; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; }
.lawyer-ranking-list { display: grid; margin-top: 13px; }
.lawyer-ranking-row {
    display: grid;
    grid-template-columns: 24px minmax(135px, .8fr) minmax(100px, 1fr) 105px;
    align-items: center;
    gap: 10px;
    min-height: 49px;
    border-top: 1px solid var(--line);
}
.lawyer-rank { color: var(--subtle); font-size: 10px; text-align: right; }
.lawyer-ranking-name { min-width: 0; }
.lawyer-ranking-name strong,
.lawyer-ranking-name small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lawyer-ranking-name strong { font-size: 11px; }
.lawyer-ranking-name small { margin-top: 2px; color: var(--muted); font-size: 9px; }
.lawyer-ranking-track,
.lawyer-breakdown-track { height: 9px; overflow: hidden; border-radius: 999px; background: #f7eee6; }
.lawyer-ranking-track i,
.lawyer-breakdown-track i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--accent), #f0a055); }
.lawyer-ranking-value { font-size: 11px; text-align: right; white-space: nowrap; }
.lawyer-month-chart { display: flex; align-items: stretch; gap: 6px; min-height: 260px; margin-top: 18px; }
/* Popisky měly osm až devět bodů, což se v grafu přes celou šířku nedalo číst.
   Řádky mřížky musely povyrůst spolu s nimi, jinak by se text odřízl. */
.lawyer-month-column { display: grid; flex: 1 1 0; min-width: 0; grid-template-rows: 30px 1fr 20px 18px; gap: 4px; text-align: center; }
.lawyer-month-value { overflow: hidden; color: var(--ink); font-size: 12px; font-weight: 570; text-overflow: ellipsis; white-space: nowrap; }
.lawyer-month-track { display: flex; align-items: flex-end; justify-content: center; border-bottom: 1px solid var(--line); }
.lawyer-month-track i { width: min(34px, 72%); min-height: 1px; border-radius: 3px 3px 0 0; background: var(--accent); transition: opacity .15s ease; }
.lawyer-month-column:hover .lawyer-month-track i { opacity: .7; }
.lawyer-month-column > strong { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.lawyer-month-column > small { color: var(--muted); font-size: 11px; }
.lawyer-table-panel { margin-top: 14px; padding-inline: 0; padding-bottom: 0; overflow: hidden; }
.lawyer-table-panel > .report-panel-heading { padding: 0 18px 14px; }
.lawyer-table { table-layout: auto; }
.lawyer-table th:first-child,
.lawyer-table td:first-child { width: auto; }
.lawyer-table tbody th { font-weight: 650; }
.lawyer-table td strong { color: var(--accent-hover); }
.lawyer-breakdown-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.lawyer-breakdown-list { display: grid; margin-top: 12px; }
.lawyer-breakdown-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 16px; padding: 11px 0; border-top: 1px solid var(--line); }
.lawyer-breakdown-row > div:first-child strong,
.lawyer-breakdown-row > div:first-child span { display: block; }
.lawyer-breakdown-row > div:first-child strong { font-size: 11px; }
.lawyer-breakdown-row > div:first-child span { margin-top: 2px; color: var(--muted); font-size: 9px; }
.lawyer-breakdown-row > strong { align-self: center; font-size: 11px; white-space: nowrap; }
.lawyer-breakdown-track { grid-column: 1 / -1; margin-top: 3px; }
@media (max-width: 1180px) {
    .lawyer-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .lawyer-kpis article:nth-child(3) { border-right: 0; }
    .lawyer-kpis article:nth-child(n+4) { border-top: 1px solid var(--line); }
    .lawyer-overview-grid { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
    .lawyer-header { align-items: stretch; flex-direction: column; }
    .lawyer-header .crm-basis-switch { width: 100%; }
    .lawyer-header .crm-basis-switch a { flex: 1; text-align: center; }
    .lawyer-filter-form { display: grid; grid-template-columns: 1fr; }
    .lawyer-filter-form .custom-date-range { grid-template-columns: 1fr; }
    .lawyer-filter-actions { align-items: stretch; flex-direction: column; }
    .lawyer-filter-actions .button { width: 100%; }
    .lawyer-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .lawyer-kpis article:nth-child(3) { border-right: 1px solid var(--line); }
    .lawyer-kpis article:nth-child(even) { border-right: 0; }
    .lawyer-kpis article:nth-child(n+3) { border-top: 1px solid var(--line); }
    .lawyer-ranking-row { grid-template-columns: 22px minmax(0, 1fr) 96px; padding: 7px 0; }
    .lawyer-ranking-track { grid-column: 2 / -1; grid-row: 2; }
    .lawyer-breakdown-grid { grid-template-columns: 1fr; }
    .lawyer-month-chart { min-width: 540px; }
    .lawyer-month-panel { overflow-x: auto; }
}

/* ---- Zvýraznění podílu právníka v grafu při najetí ---- */
.lawyer-ranking-row[data-lawyer-row] {
    border-radius: 7px;
    transition: background-color .12s ease;
}
.lawyer-ranking-row[data-lawyer-row]:hover,
.lawyer-ranking-row.is-active { background: var(--accent-soft); }
.lawyer-ranking-row[data-lawyer-row]:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 1px;
}
.lawyer-month-track > i { position: relative; }
/* Kreslí se odspodu jako část celého pruhu, takže je na první pohled vidět,
   jak velký podíl z daného měsíce právníkovi patří. */
.lawyer-month-highlight {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 0;
    border-radius: inherit;
    background: var(--ink);
    transition: height .14s ease;
}
.lawyer-month-track.is-dimmed > i { opacity: .4; }
.lawyer-month-track.is-dimmed > i > .lawyer-month-highlight { opacity: 1; }
.lawyer-highlight-label { color: var(--accent-hover); font-weight: 570; }
/* ---- Vývoj výher podle produktové řady (stránka právníků) ---- */
.lawyer-productline-block { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); }
.lawyer-productline-block h3 { margin: 0; font-size: 13px; }
.lawyer-productline-empty { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); }
.lawyer-stack-chart { display: flex; align-items: flex-end; gap: 6px; margin-top: 12px; }
.lawyer-stack-column { display: flex; flex: 1 1 0; min-width: 0; flex-direction: column; align-items: center; gap: 5px; }
/* Segmenty se skládají odspodu, proto column-reverse — první řada v legendě
   tak leží nejníž a barvy odpovídají pořadí. */
.lawyer-stack-track {
    display: flex;
    width: 100%;
    max-width: 40px;
    height: 132px;
    flex-direction: column-reverse;
    justify-content: flex-start;
    overflow: hidden;
    border-radius: 3px 3px 0 0;
    background: var(--surface-subtle);
}
.lawyer-stack-track > span { display: block; width: 100%; }
.lawyer-stack-column strong { color: var(--muted); font-size: 12px; font-weight: 570; }
.lawyer-productline-legend { margin-top: 14px; }
/* Hodnota řady je to, na co se u tohohle grafu ptáte první. V devíti bodech
   a v barvě subtle se přitom skoro nedala přečíst. */
.lawyer-productline-legend > div[data-line-row] { font-size: 13px; }
.lawyer-productline-legend strong { font-size: 13px; text-align: right; white-space: nowrap; }
.lawyer-productline-legend strong small {
    display: block;
    margin-top: 2px;
    color: var(--ink);
    font-size: 13px;
    font-weight: 570;
    font-variant-numeric: tabular-nums;
}
/* ---- Rychlé volby počátečního měsíce v grafu marketingových nákladů ---- */
.performance-presets {
    display: flex;
    align-items: center;
    gap: 7px;
    flex-wrap: wrap;
    margin: 10px 0 0;
}
.performance-presets > span { color: var(--muted); font-size: 10px; }
.performance-presets a {
    padding: 6px 13px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fff;
    color: var(--muted);
    font-size: 11px;
    font-weight: 570;
    text-decoration: none;
    transition: background-color .12s ease, border-color .12s ease, color .12s ease;
}
.performance-presets a:hover {
    border-color: var(--accent-border);
    background: var(--accent-soft);
    color: var(--accent-hover);
}
.performance-presets a.active {
    border-color: var(--accent);
    background: var(--accent);
    color: #fff;
}
.performance-presets a:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
/* Select s měsíci má stejnou výšku jako ostatní pole filtru, aby řádek
   nepodskakoval. */
.category-performance-filter select { min-height: 38px; }
/* ---- Interaktivita skládaného grafu produktových řad ---- */
.lawyer-stack-track > span { transition: opacity .12s ease; cursor: default; }
.lawyer-stack-track > span.is-muted { opacity: .18; }
/* Řádek legendy: barevná tečka, název řady a hodnota u pravé hrany.
   Rozvržení stálo na obecném pravidle .device-legend > div, které padlo při
   přechodu legendy zařízení na tlačítka. Tady je proto vlastní. */
.lawyer-productline-legend > div[data-line-row] {
    display: grid;
    grid-template-columns: 10px minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    padding: 5px 6px;
    margin-inline: -6px;
    border-radius: 6px;
    color: #445068;
    cursor: default;
    transition: background-color .12s ease;
}
.lawyer-productline-legend > div[data-line-row] > span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.lawyer-productline-legend > div[data-line-row]:hover,
.lawyer-productline-legend > div[data-line-row].is-active { background: var(--accent-soft); }
.lawyer-productline-legend > div[data-line-row]:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 0;
}
/* Nevyplněný důvod prohry se odliší, aby se nečetl jako skutečný důvod. */
.crm-category-track i.crm-losing-unfilled {
    background: repeating-linear-gradient(
        135deg,
        var(--line-strong) 0 6px,
        var(--surface-subtle) 6px 12px
    );
}
/* ---- Cesta od zobrazení k obchodu ---- */
.marketing-funnel { margin-top: 16px; }
/* Trychtýř poptávek. Vypadá stejně jako ten hlavní, ale jeho stupně jsou
   skutečné podmnožiny, ne ukazatele mezi systémy. */
.lead-funnel-facts {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 10px;
    margin-top: 14px;
}
.lead-funnel-facts article { padding: 12px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.lead-funnel-facts span { display: block; color: var(--muted); font-size: 11px; }
.lead-funnel-facts strong { display: block; margin-top: 4px; font-size: 21px; line-height: 1.1; }
.lead-funnel-facts small { display: block; margin-top: 3px; color: var(--muted); font-size: 11px; }
/* Nízké pokrytí zdrojem není detail: bez něj se poptávka nedá přiřadit
   ke kanálu, takže rozpad po kanálech nic neříká. */
.lead-funnel-facts article.lead-funnel-coverage-low {
    border-color: #f0d08a;
    background: #fdf6e6;
}
.lead-funnel-facts article.lead-funnel-coverage-low strong { color: #7a5312; }
.funnel-list { display: grid; gap: 12px; margin-top: 12px; }
.funnel-stage-meta {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 5px;
}
.funnel-stage-meta strong { font-size: 12px; }
.funnel-stage-meta small { display: block; color: var(--subtle); font-size: 10px; }
.funnel-stage-numbers { text-align: right; }
.funnel-stage-numbers strong { font-size: 15px; font-variant-numeric: tabular-nums; }
.funnel-track { display: block; height: 14px; border-radius: 3px; background: var(--surface-subtle); }
.funnel-track i {
    display: block;
    height: 100%;
    border-radius: 3px;
    background: linear-gradient(90deg, var(--accent) 0%, var(--accent-hover) 100%);
}
/* ---- Trychtýř: segmenty se zužují na šířku dalšího stupně ---- */
.funnel-shape { margin-top: 14px; }
.funnel-row {
    display: grid;
    grid-template-columns: minmax(120px, 190px) minmax(0, 1fr) minmax(96px, 130px);
    align-items: center;
    gap: 14px;
}
.funnel-row-label strong { display: block; font-size: 12px; }
.funnel-row-label small { display: block; color: var(--subtle); font-size: 10px; }
.funnel-row-shape { min-width: 0; }
.funnel-segment {
    display: grid;
    height: 46px;
    margin: 0 auto;
    place-items: center;
    /* Zúžení dolů na šířku dalšího stupně; --funnel-taper je odsazení
       spodní hrany od kraje segmentu. */
    clip-path: polygon(0 0, 100% 0, calc(100% - var(--funnel-taper)) 100%, var(--funnel-taper) 100%);
    background: linear-gradient(180deg, var(--accent) 0%, var(--accent-hover) 100%);
}
.funnel-segment span {
    color: #fff;
    font-size: 12px;
    font-weight: 650;
    font-variant-numeric: tabular-nums;
    text-shadow: 0 1px 2px rgba(12, 23, 49, .35);
}
.funnel-row-ratio { text-align: right; }
.funnel-row-ratio strong { display: block; font-size: 13px; font-variant-numeric: tabular-nums; }
.funnel-row-ratio small { display: block; color: var(--subtle); font-size: 10px; }
.funnel-scale-note { margin: 12px 0 0; color: var(--subtle); font-size: 10px; }
@media (max-width: 760px) {
    .funnel-row { grid-template-columns: minmax(0, 1fr) 100px; }
    .funnel-row-shape { grid-column: 1 / -1; order: 3; }
}
/* Upozornění pod trychtýřem a označení nepokrytého období. */
.funnel-disclaimer {
    margin-top: 14px;
    padding: 11px 13px;
    border: 1px solid var(--accent-border);
    border-radius: var(--radius);
    background: var(--accent-soft);
}
.funnel-disclaimer strong { display: block; margin-bottom: 4px; color: var(--accent-hover); font-size: 11px; }
.funnel-disclaimer p { margin: 0 0 4px; color: #5c4a38; font-size: 10px; line-height: 1.5; }
.funnel-disclaimer p:last-child { margin-bottom: 0; }
.funnel-days-short { color: var(--warning) !important; font-weight: 570; }
/* ---- Modul kampaní ---- */
.campaign-active-field { align-self: end; }
.campaign-active-field input { width: 20px; height: 20px; margin-top: 6px; }
.campaign-summary { margin-top: 14px; }
.campaign-summary-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 10px;
    margin-top: 14px;
}
.campaign-summary-grid article { padding: 13px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.campaign-summary-grid span { display: block; color: var(--muted); font-size: 12px; }
.campaign-summary-grid strong { display: block; margin-top: 5px; font-size: 22px; line-height: 1.1; }
.campaign-platform-split {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 10px;
    margin-top: 12px;
}
.campaign-platform-split article { padding: 11px 13px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-subtle); }
.campaign-platform-split strong { display: block; font-size: 13px; }
.campaign-platform-split span { display: block; margin-top: 3px; font-size: 12px; }
.campaign-platform-split small { display: block; margin-top: 2px; color: var(--muted); font-size: 11px; }

.campaign-list-panel { margin-top: 14px; }
.campaign-list { display: grid; gap: 8px; margin-top: 14px; }
.campaign-item { border: 1px solid var(--line); border-radius: 9px; background: #fff; }
.campaign-item[open] { border-color: var(--line-strong); }
/* Rozklikávací řádek: platforma, název s trváním, útrata u pravé hrany. */
.campaign-item > summary {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    cursor: pointer;
    list-style: none;
}
.campaign-item > summary::-webkit-details-marker { display: none; }
.campaign-item > summary:hover { background: var(--accent-soft); border-radius: 8px; }
.campaign-platform {
    padding: 4px 8px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
    text-align: center;
    white-space: nowrap;
}
.campaign-platform-google_ads { color: #1a4d8f; background: #e6effa; }
.campaign-platform-meta { color: #9a4c00; background: #fff1df; }
.campaign-name { min-width: 0; }
.campaign-name strong { display: block; overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.campaign-name small { display: block; margin-top: 3px; color: var(--muted); font-size: 11px; }
.campaign-headline { text-align: right; white-space: nowrap; }
.campaign-headline strong { display: block; font-size: 16px; font-variant-numeric: tabular-nums; }
.campaign-headline small { display: block; margin-top: 2px; color: var(--muted); font-size: 11px; }
.campaign-detail { padding: 0 14px 14px; border-top: 1px solid var(--line); }
.campaign-metrics {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 8px;
    margin-top: 13px;
}
.campaign-metrics article { padding: 10px 11px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface-subtle); }
.campaign-metrics span { display: block; color: var(--muted); font-size: 11px; }
.campaign-metrics strong { display: block; margin-top: 3px; font-size: 16px; font-variant-numeric: tabular-nums; }
.campaign-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; margin: 12px 0 0; }
.campaign-facts dt { color: var(--muted); font-size: 11px; }
.campaign-facts dd { margin: 3px 0 0; font-size: 13px; }
.campaign-notes { margin-top: 14px; }

@media (max-width: 760px) {
    .campaign-item > summary { grid-template-columns: 1fr; }
    .campaign-headline { text-align: left; }
}

/* Hlavička kampaní: nadpis vlevo, načítací tlačítka u pravé hrany. */
.campaign-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.campaign-header-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.campaign-header-actions form { margin: 0; }
/* Tlačítko v prázdném stavu ať nesedí nalepené na text. */
.report-no-data form { margin-top: 14px; }

/* Napojení kampaně na Raynet. Odlišené rámcem, protože jde o jiný druh čísla
   než metriky z reklamy: přiblížení tématem, ne měřený výkon. */
.campaign-crm { margin-top: 13px; padding: 12px 13px; border: 1px solid var(--line-strong); border-radius: 8px; background: var(--surface-subtle); }
.campaign-crm-empty { border-style: dashed; }
.campaign-crm-heading strong { display: block; font-size: 13px; }
.campaign-crm-heading span { display: block; margin-top: 3px; color: var(--muted); font-size: 11px; }
.campaign-crm-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; margin-top: 11px; }
.campaign-crm-grid article { padding: 9px 11px; border: 1px solid var(--line); border-radius: 7px; background: #fff; }
.campaign-crm-grid span { display: block; color: var(--muted); font-size: 11px; }
.campaign-crm-grid strong { display: block; margin-top: 3px; font-size: 16px; font-variant-numeric: tabular-nums; }
/* Placená část je to, co se výkonu kampaně blíží nejvíc. */
.campaign-crm-paid { border-color: var(--accent-border) !important; background: var(--accent-soft) !important; }
.campaign-crm-note { margin: 10px 0 0; color: var(--muted); font-size: 11px; line-height: 1.5; }
.campaign-crm-links { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.campaign-crm-links form { margin: 0; }
.campaign-crm-links button {
    padding: 4px 9px;
    border: 1px solid var(--line-strong);
    border-radius: 999px;
    color: var(--muted);
    background: #fff;
    font: 500 11px var(--font);
    cursor: pointer;
}
.campaign-crm-links button:hover { border-color: var(--danger); color: var(--danger); }
.campaign-crm-form { display: grid; gap: 10px; margin-top: 11px; justify-items: start; }
/* Nabídek bývá u produktové kampaně i deset, proto se seznam roluje a stránka
   se kvůli napojení nenatahuje. */
.campaign-crm-choices {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 6px;
    width: 100%;
    max-height: 218px;
    overflow-y: auto;
    margin: 0;
    padding: 8px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
}
.campaign-crm-choices label {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 6px 8px;
    border: 1px solid transparent;
    border-radius: 6px;
    cursor: pointer;
}
.campaign-crm-choices label:hover { border-color: var(--accent-border); background: var(--accent-soft); }
.campaign-crm-choices input { margin: 1px 0 0; accent-color: var(--accent); }
.campaign-crm-choices strong { display: block; font-size: 12px; font-weight: 540; line-height: 1.35; }
.campaign-crm-choices small { display: block; margin-top: 1px; color: var(--muted); font-size: 10px; }
/* Doplňování témat u už napojené kampaně. */
.campaign-crm-more { margin-top: 12px; padding-top: 11px; border-top: 1px dashed var(--line-strong); }
.campaign-crm-more strong { display: block; font-size: 12px; }
.campaign-crm-more span { display: block; margin-top: 2px; color: var(--muted); font-size: 11px; }

/* ---- Koncentrace klientů ---- */
.crm-concentration-panel { margin-top: 14px; }
.crm-concentration-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 10px;
    margin-top: 14px;
}
.crm-concentration-grid article { padding: 13px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.crm-concentration-grid span { display: block; color: var(--muted); font-size: 12px; }
.crm-concentration-grid strong { display: block; margin-top: 5px; font-size: 22px; line-height: 1.1; font-variant-numeric: tabular-nums; }
/* Zvýrazní se jen podíl nad hranicí rizika; barvit to vždy by z upozornění
   udělalo dekoraci, kterou nikdo nečte. */
.crm-concentration-grid article.crm-concentration-risk {
    border-color: #f0c4c8;
    background: var(--danger-soft);
}
.crm-concentration-grid article.crm-concentration-risk strong { color: var(--danger); }
.crm-concentration-warning {
    margin: 12px 0 0;
    padding: 11px 13px;
    border: 1px solid #f0c4c8;
    border-radius: 8px;
    color: var(--danger);
    background: var(--danger-soft);
    font-size: 12px;
    line-height: 1.5;
}
.crm-concentration-table { margin-top: 14px; }
.crm-concentration-table th:first-child,
.crm-concentration-table td:first-child { width: 44%; }
.crm-concentration-note { margin-top: 14px; }

/* Detail a seznam obchodních případů */
.crm-case-link { color: var(--accent-hover); font-weight: 540; text-decoration: none; border-bottom: 1px solid transparent; }
.crm-case-link:hover,
.crm-case-link:focus-visible { border-bottom-color: var(--accent-border); }
.crm-case-breadcrumb { display: flex; align-items: center; gap: 6px; margin: 0 0 6px; font-size: 12px; color: var(--muted); }
.crm-case-breadcrumb a { color: var(--muted); text-decoration: none; }
.crm-case-breadcrumb a:hover { color: var(--accent-hover); }
.crm-case-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; margin: 14px 0 0; }
.crm-case-facts > div {
    display: grid;
    gap: 3px;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-subtle);
}
.crm-case-facts dt { font-size: 11px; text-transform: uppercase; letter-spacing: 0.04em; color: var(--muted); }
.crm-case-facts dd { margin: 0; font-size: 15px; font-weight: 540; color: var(--ink); overflow-wrap: anywhere; }
.crm-empty-note { margin: 14px 0 0; font-size: 13px; color: var(--muted); }
.crm-pager { display: flex; align-items: center; gap: 12px; margin-top: 16px; }
.crm-pager-status { font-size: 13px; color: var(--muted); font-variant-numeric: tabular-nums; }
.crm-pager-disabled {
    display: inline-flex;
    align-items: center;
    height: 42px;
    padding: 0 16px;
    border: 1px solid var(--line);
    border-radius: 8px;
    color: var(--subtle);
    font-size: 14px;
}
.crm-recent-actions { display: flex; justify-content: flex-end; margin-top: 14px; }