/* СГЛОБЕНО от tools/clean.src.css и tools/mid.src.css с tools/build_clean.py – не редактирай ръчно */
:root[data-skin="clean"], :root[data-skin="mid"], :root[data-skin="google"], :root[data-skin="chisto"] {--bg: #F7F7F8; --surface: #FFFFFF; --surface-2: #EFEFF1; --surface-3: #E4E4E7; --line: #E4E4E7; --text: #111113; --muted: #52525B; --faint: #71717A; --accent-soft: #FFF4CC; --accent-text: #7A5600; --pos: #15803D; --pos-soft: #DCFCE7; --neg: #DC2626; --neg-soft: #FEE2E2; --violet: var(--text); --v-soft: var(--surface-2); --v-line: var(--line); --v-strong: var(--line); --v-glow: transparent; --c-violet: var(--text); --c-pink: var(--text); --shadow: none; --r-xl: 18px; --r-lg: 16px; --r-md: 12px; --r-sm: 10px; --font: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif; --display: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif;}
:root[data-skin="clean"][data-theme="dark"], :root[data-skin="mid"][data-theme="dark"], :root[data-skin="google"][data-theme="dark"], :root[data-skin="chisto"][data-theme="dark"] {--bg: #0B0B0C; --surface: #161618; --surface-2: #1F1F22; --surface-3: #2A2A2E; --line: #2A2A2E; --text: #F4F4F5; --muted: #A1A1AA; --faint: #8A8A93; --accent-soft: #3A3011; --accent-text: #FFC21A; --pos: #4ADE80; --pos-soft: #12301F; --neg: #F87171; --neg-soft: #3A1717; --violet: var(--text); --v-soft: var(--surface-2); --v-line: var(--line); --v-strong: var(--line); --v-glow: transparent;}
@media (prefers-color-scheme: dark) {
:root[data-skin="clean"]:not([data-theme="light"]):not([data-theme="sun"]), :root[data-skin="mid"]:not([data-theme="light"]):not([data-theme="sun"]), :root[data-skin="google"]:not([data-theme="light"]):not([data-theme="sun"]), :root[data-skin="chisto"]:not([data-theme="light"]):not([data-theme="sun"]) {--bg: #0B0B0C; --surface: #161618; --surface-2: #1F1F22; --surface-3: #2A2A2E; --line: #2A2A2E; --text: #F4F4F5; --muted: #A1A1AA; --faint: #8A8A93; --accent-soft: #3A3011; --accent-text: #FFC21A; --pos: #4ADE80; --pos-soft: #12301F; --neg: #F87171; --neg-soft: #3A1717; --violet: var(--text); --v-soft: var(--surface-2); --v-line: var(--line); --v-strong: var(--line); --v-glow: transparent;}
}
:root[data-skin="clean"][data-theme="sun"], :root[data-skin="mid"][data-theme="sun"], :root[data-skin="google"][data-theme="sun"], :root[data-skin="chisto"][data-theme="sun"] {--bg: #FFFFFF; --line: #A1A1AA; --text: #000000; --muted: #27272A; --faint: #3F3F46;}
:root[data-skin="clean"] body, :root[data-skin="mid"] body, :root[data-skin="google"] body, :root[data-skin="chisto"] body, :root[data-skin="clean"] button, :root[data-skin="mid"] button, :root[data-skin="google"] button, :root[data-skin="chisto"] button, :root[data-skin="clean"] input, :root[data-skin="mid"] input, :root[data-skin="google"] input, :root[data-skin="chisto"] input, :root[data-skin="clean"] select, :root[data-skin="mid"] select, :root[data-skin="google"] select, :root[data-skin="chisto"] select, :root[data-skin="clean"] textarea, :root[data-skin="mid"] textarea, :root[data-skin="google"] textarea, :root[data-skin="chisto"] textarea {font-family: var(--font);}
:root[data-skin="clean"] body, :root[data-skin="mid"] body, :root[data-skin="google"] body, :root[data-skin="chisto"] body {letter-spacing: -.005em;}
:root[data-skin="clean"] .num, :root[data-skin="mid"] .num, :root[data-skin="google"] .num, :root[data-skin="chisto"] .num, :root[data-skin="clean"] .stat-value, :root[data-skin="mid"] .stat-value, :root[data-skin="google"] .stat-value, :root[data-skin="chisto"] .stat-value, :root[data-skin="clean"] .tile-val, :root[data-skin="mid"] .tile-val, :root[data-skin="google"] .tile-val, :root[data-skin="chisto"] .tile-val, :root[data-skin="clean"] .np-val, :root[data-skin="mid"] .np-val, :root[data-skin="google"] .np-val, :root[data-skin="chisto"] .np-val, :root[data-skin="clean"] .np-key, :root[data-skin="mid"] .np-key, :root[data-skin="google"] .np-key, :root[data-skin="chisto"] .np-key, :root[data-skin="clean"] .shift-amt b, :root[data-skin="mid"] .shift-amt b, :root[data-skin="google"] .shift-amt b, :root[data-skin="chisto"] .shift-amt b, :root[data-skin="clean"] .cost-amt b, :root[data-skin="mid"] .cost-amt b, :root[data-skin="google"] .cost-amt b, :root[data-skin="chisto"] .cost-amt b, :root[data-skin="clean"] .day-badge b, :root[data-skin="mid"] .day-badge b, :root[data-skin="google"] .day-badge b, :root[data-skin="chisto"] .day-badge b, :root[data-skin="clean"] .rem-days b, :root[data-skin="mid"] .rem-days b, :root[data-skin="google"] .rem-days b, :root[data-skin="chisto"] .rem-days b, :root[data-skin="clean"] .res-when b, :root[data-skin="mid"] .res-when b, :root[data-skin="google"] .res-when b, :root[data-skin="chisto"] .res-when b, :root[data-skin="clean"] .next-when b, :root[data-skin="mid"] .next-when b, :root[data-skin="google"] .next-when b, :root[data-skin="chisto"] .next-when b, :root[data-skin="clean"] .cal-ev-amt, :root[data-skin="mid"] .cal-ev-amt, :root[data-skin="google"] .cal-ev-amt, :root[data-skin="chisto"] .cal-ev-amt, :root[data-skin="clean"] .cl-amt, :root[data-skin="mid"] .cl-amt, :root[data-skin="google"] .cl-amt, :root[data-skin="chisto"] .cl-amt, :root[data-skin="clean"] .exp-item .amt, :root[data-skin="mid"] .exp-item .amt, :root[data-skin="google"] .exp-item .amt, :root[data-skin="chisto"] .exp-item .amt, :root[data-skin="clean"] .ms-row b, :root[data-skin="mid"] .ms-row b, :root[data-skin="google"] .ms-row b, :root[data-skin="chisto"] .ms-row b, :root[data-skin="clean"] .rec-title b, :root[data-skin="mid"] .rec-title b, :root[data-skin="google"] .rec-title b, :root[data-skin="chisto"] .rec-title b, :root[data-skin="clean"] .win b, :root[data-skin="mid"] .win b, :root[data-skin="google"] .win b, :root[data-skin="chisto"] .win b, :root[data-skin="clean"] .drive-sum b, :root[data-skin="mid"] .drive-sum b, :root[data-skin="google"] .drive-sum b, :root[data-skin="chisto"] .drive-sum b, :root[data-skin="clean"] .result-cell b, :root[data-skin="mid"] .result-cell b, :root[data-skin="google"] .result-cell b, :root[data-skin="chisto"] .result-cell b, :root[data-skin="clean"] .ci-grid b, :root[data-skin="mid"] .ci-grid b, :root[data-skin="google"] .ci-grid b, :root[data-skin="chisto"] .ci-grid b, :root[data-skin="clean"] .kpi-value, :root[data-skin="mid"] .kpi-value, :root[data-skin="google"] .kpi-value, :root[data-skin="chisto"] .kpi-value, :root[data-skin="clean"] .mini-kpi b, :root[data-skin="mid"] .mini-kpi b, :root[data-skin="google"] .mini-kpi b, :root[data-skin="chisto"] .mini-kpi b, :root[data-skin="clean"] .att-n, :root[data-skin="mid"] .att-n, :root[data-skin="google"] .att-n, :root[data-skin="chisto"] .att-n, :root[data-skin="clean"] .hap b, :root[data-skin="mid"] .hap b, :root[data-skin="google"] .hap b, :root[data-skin="chisto"] .hap b, :root[data-skin="clean"] .goal-num b, :root[data-skin="mid"] .goal-num b, :root[data-skin="google"] .goal-num b, :root[data-skin="chisto"] .goal-num b, :root[data-skin="clean"] .week-net, :root[data-skin="mid"] .week-net, :root[data-skin="google"] .week-net, :root[data-skin="chisto"] .week-net, :root[data-skin="clean"] .timer, :root[data-skin="mid"] .timer, :root[data-skin="google"] .timer, :root[data-skin="chisto"] .timer, :root[data-skin="clean"] .save-bar .sum b, :root[data-skin="mid"] .save-bar .sum b, :root[data-skin="google"] .save-bar .sum b, :root[data-skin="chisto"] .save-bar .sum b, :root[data-skin="clean"] .cover-info h1, :root[data-skin="mid"] .cover-info h1, :root[data-skin="google"] .cover-info h1, :root[data-skin="chisto"] .cover-info h1, :root[data-skin="clean"] .first-day h2, :root[data-skin="mid"] .first-day h2, :root[data-skin="google"] .first-day h2, :root[data-skin="chisto"] .first-day h2 {font-family: var(--font); font-weight: 700; letter-spacing: -.02em;}
:root[data-skin="clean"] h1, :root[data-skin="mid"] h1, :root[data-skin="google"] h1, :root[data-skin="chisto"] h1 {font-weight: 800; letter-spacing: -.025em;}
:root[data-skin="clean"] :focus-visible, :root[data-skin="mid"] :focus-visible, :root[data-skin="google"] :focus-visible, :root[data-skin="chisto"] :focus-visible {outline-color: var(--text);}
:root[data-skin="clean"] .card, :root[data-skin="mid"] .card, :root[data-skin="google"] .card, :root[data-skin="chisto"] .card, :root[data-skin="clean"] .stat-card, :root[data-skin="mid"] .stat-card, :root[data-skin="google"] .stat-card, :root[data-skin="chisto"] .stat-card, :root[data-skin="clean"] .live, :root[data-skin="mid"] .live, :root[data-skin="google"] .live, :root[data-skin="chisto"] .live, :root[data-skin="clean"] .tile, :root[data-skin="mid"] .tile, :root[data-skin="google"] .tile, :root[data-skin="chisto"] .tile, :root[data-skin="clean"] .big-link, :root[data-skin="mid"] .big-link, :root[data-skin="google"] .big-link, :root[data-skin="chisto"] .big-link, :root[data-skin="clean"] .home-link, :root[data-skin="mid"] .home-link, :root[data-skin="google"] .home-link, :root[data-skin="chisto"] .home-link, :root[data-skin="clean"] .cover, :root[data-skin="mid"] .cover, :root[data-skin="google"] .cover, :root[data-skin="chisto"] .cover, :root[data-skin="clean"] .ql, :root[data-skin="mid"] .ql, :root[data-skin="google"] .ql, :root[data-skin="chisto"] .ql, :root[data-skin="clean"] .reg-group, :root[data-skin="mid"] .reg-group, :root[data-skin="google"] .reg-group, :root[data-skin="chisto"] .reg-group, :root[data-skin="clean"] .first-day, :root[data-skin="mid"] .first-day, :root[data-skin="google"] .first-day, :root[data-skin="chisto"] .first-day, :root[data-skin="clean"] .msg, :root[data-skin="mid"] .msg, :root[data-skin="google"] .msg, :root[data-skin="chisto"] .msg, :root[data-skin="clean"] .drive, :root[data-skin="mid"] .drive, :root[data-skin="google"] .drive, :root[data-skin="chisto"] .drive, :root[data-skin="clean"] .install-bar, :root[data-skin="mid"] .install-bar, :root[data-skin="google"] .install-bar, :root[data-skin="chisto"] .install-bar, :root[data-skin="clean"] .more > summary, :root[data-skin="mid"] .more > summary, :root[data-skin="google"] .more > summary, :root[data-skin="chisto"] .more > summary, :root[data-skin="clean"] .invite-card, :root[data-skin="mid"] .invite-card, :root[data-skin="google"] .invite-card, :root[data-skin="chisto"] .invite-card, :root[data-skin="clean"] .kpi, :root[data-skin="mid"] .kpi, :root[data-skin="google"] .kpi, :root[data-skin="chisto"] .kpi, :root[data-skin="clean"] .mini-kpis, :root[data-skin="mid"] .mini-kpis, :root[data-skin="google"] .mini-kpis, :root[data-skin="chisto"] .mini-kpis, :root[data-skin="clean"] .scope-bar, :root[data-skin="mid"] .scope-bar, :root[data-skin="google"] .scope-bar, :root[data-skin="chisto"] .scope-bar, :root[data-skin="clean"] .adm-picker, :root[data-skin="mid"] .adm-picker, :root[data-skin="google"] .adm-picker, :root[data-skin="chisto"] .adm-picker, :root[data-skin="clean"] .week-sum, :root[data-skin="mid"] .week-sum, :root[data-skin="google"] .week-sum, :root[data-skin="chisto"] .week-sum, :root[data-skin="clean"] .month-sum, :root[data-skin="mid"] .month-sum, :root[data-skin="google"] .month-sum, :root[data-skin="chisto"] .month-sum {background: var(--surface); border: 1px solid var(--line) !important; box-shadow: none !important; border-radius: var(--r-lg);}
:root[data-skin="clean"] .card .shift-row, :root[data-skin="mid"] .card .shift-row, :root[data-skin="google"] .card .shift-row, :root[data-skin="chisto"] .card .shift-row, :root[data-skin="clean"] .card .cost-row, :root[data-skin="mid"] .card .cost-row, :root[data-skin="google"] .card .cost-row, :root[data-skin="chisto"] .card .cost-row, :root[data-skin="clean"] .card .res-row, :root[data-skin="mid"] .card .res-row, :root[data-skin="google"] .card .res-row, :root[data-skin="chisto"] .card .res-row {border-color: var(--line);}
:root[data-skin="clean"] .card:focus-within, :root[data-skin="mid"] .card:focus-within, :root[data-skin="google"] .card:focus-within, :root[data-skin="chisto"] .card:focus-within {border-color: var(--line);}
:root[data-skin="clean"] .more > summary, :root[data-skin="mid"] .more > summary, :root[data-skin="google"] .more > summary, :root[data-skin="chisto"] .more > summary {border-left-width: 1px !important;}
:root[data-skin="clean"] .more > summary .ic, :root[data-skin="mid"] .more > summary .ic, :root[data-skin="google"] .more > summary .ic, :root[data-skin="chisto"] .more > summary .ic {color: var(--muted);}
:root[data-skin="clean"] .section-title, :root[data-skin="mid"] .section-title, :root[data-skin="google"] .section-title, :root[data-skin="chisto"] .section-title {font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); margin: 26px 2px 10px;}
:root[data-skin="clean"] .section-title::before, :root[data-skin="mid"] .section-title::before, :root[data-skin="google"] .section-title::before, :root[data-skin="chisto"] .section-title::before {display: none;}
:root[data-skin="clean"] .page-title h1::after, :root[data-skin="mid"] .page-title h1::after, :root[data-skin="google"] .page-title h1::after, :root[data-skin="chisto"] .page-title h1::after {display: none;}
:root[data-skin="clean"] .page-title h1, :root[data-skin="mid"] .page-title h1, :root[data-skin="google"] .page-title h1, :root[data-skin="chisto"] .page-title h1 {font-size: 1.75rem;}
:root[data-skin="clean"] .sub-back, :root[data-skin="mid"] .sub-back, :root[data-skin="google"] .sub-back, :root[data-skin="chisto"] .sub-back, :root[data-skin="clean"] .back, :root[data-skin="mid"] .back, :root[data-skin="google"] .back, :root[data-skin="chisto"] .back, :root[data-skin="clean"] .adm-back, :root[data-skin="mid"] .adm-back, :root[data-skin="google"] .adm-back, :root[data-skin="chisto"] .adm-back {color: var(--muted);}
:root[data-skin="clean"] .f-ic, :root[data-skin="mid"] .f-ic, :root[data-skin="google"] .f-ic, :root[data-skin="chisto"] .f-ic, :root[data-skin="clean"] .t-ic, :root[data-skin="mid"] .t-ic, :root[data-skin="google"] .t-ic, :root[data-skin="chisto"] .t-ic, :root[data-skin="clean"] .bl-ic, :root[data-skin="mid"] .bl-ic, :root[data-skin="google"] .bl-ic, :root[data-skin="chisto"] .bl-ic, :root[data-skin="clean"] .ql-ic, :root[data-skin="mid"] .ql-ic, :root[data-skin="google"] .ql-ic, :root[data-skin="chisto"] .ql-ic, :root[data-skin="clean"] .cost-ic, :root[data-skin="mid"] .cost-ic, :root[data-skin="google"] .cost-ic, :root[data-skin="chisto"] .cost-ic, :root[data-skin="clean"] .mini-ic, :root[data-skin="mid"] .mini-ic, :root[data-skin="google"] .mini-ic, :root[data-skin="chisto"] .mini-ic, :root[data-skin="clean"] .kpi-ic, :root[data-skin="mid"] .kpi-ic, :root[data-skin="google"] .kpi-ic, :root[data-skin="chisto"] .kpi-ic, :root[data-skin="clean"] .list-btn .l-ic, :root[data-skin="mid"] .list-btn .l-ic, :root[data-skin="google"] .list-btn .l-ic, :root[data-skin="chisto"] .list-btn .l-ic, :root[data-skin="clean"] .info-row .l-ic, :root[data-skin="mid"] .info-row .l-ic, :root[data-skin="google"] .info-row .l-ic, :root[data-skin="chisto"] .info-row .l-ic, :root[data-skin="clean"] .tip-ic, :root[data-skin="mid"] .tip-ic, :root[data-skin="google"] .tip-ic, :root[data-skin="chisto"] .tip-ic, :root[data-skin="clean"] .msg-ic, :root[data-skin="mid"] .msg-ic, :root[data-skin="google"] .msg-ic, :root[data-skin="chisto"] .msg-ic, :root[data-skin="clean"] .hl-ic, :root[data-skin="mid"] .hl-ic, :root[data-skin="google"] .hl-ic, :root[data-skin="chisto"] .hl-ic, :root[data-skin="clean"] .empty-ic, :root[data-skin="mid"] .empty-ic, :root[data-skin="google"] .empty-ic, :root[data-skin="chisto"] .empty-ic, :root[data-skin="clean"] .rec-ic, :root[data-skin="mid"] .rec-ic, :root[data-skin="google"] .rec-ic, :root[data-skin="chisto"] .rec-ic, :root[data-skin="clean"] .cal-ev-ic, :root[data-skin="mid"] .cal-ev-ic, :root[data-skin="google"] .cal-ev-ic, :root[data-skin="chisto"] .cal-ev-ic, :root[data-skin="clean"] .gs-ic, :root[data-skin="mid"] .gs-ic, :root[data-skin="google"] .gs-ic, :root[data-skin="chisto"] .gs-ic, :root[data-skin="clean"] .att-ic, :root[data-skin="mid"] .att-ic, :root[data-skin="google"] .att-ic, :root[data-skin="chisto"] .att-ic, :root[data-skin="clean"] .hap-ic, :root[data-skin="mid"] .hap-ic, :root[data-skin="google"] .hap-ic, :root[data-skin="chisto"] .hap-ic, :root[data-skin="clean"] .due-ic, :root[data-skin="mid"] .due-ic, :root[data-skin="google"] .due-ic, :root[data-skin="chisto"] .due-ic, :root[data-skin="clean"] .quote-ic, :root[data-skin="mid"] .quote-ic, :root[data-skin="google"] .quote-ic, :root[data-skin="chisto"] .quote-ic {background: transparent !important; color: var(--muted) !important; box-shadow: none !important;}
:root[data-skin="clean"] .t-ic, :root[data-skin="mid"] .t-ic, :root[data-skin="google"] .t-ic, :root[data-skin="chisto"] .t-ic {width: 22px; height: 22px;}
:root[data-skin="clean"] .bl-ic, :root[data-skin="mid"] .bl-ic, :root[data-skin="google"] .bl-ic, :root[data-skin="chisto"] .bl-ic, :root[data-skin="clean"] .cost-ic, :root[data-skin="mid"] .cost-ic, :root[data-skin="google"] .cost-ic, :root[data-skin="chisto"] .cost-ic, :root[data-skin="clean"] .rec-ic, :root[data-skin="mid"] .rec-ic, :root[data-skin="google"] .rec-ic, :root[data-skin="chisto"] .rec-ic, :root[data-skin="clean"] .cal-ev-ic, :root[data-skin="mid"] .cal-ev-ic, :root[data-skin="google"] .cal-ev-ic, :root[data-skin="chisto"] .cal-ev-ic, :root[data-skin="clean"] .att-ic, :root[data-skin="mid"] .att-ic, :root[data-skin="google"] .att-ic, :root[data-skin="chisto"] .att-ic {width: 28px !important; height: 28px !important;}
:root[data-skin="clean"] .list-btn.danger .l-ic, :root[data-skin="mid"] .list-btn.danger .l-ic, :root[data-skin="google"] .list-btn.danger .l-ic, :root[data-skin="chisto"] .list-btn.danger .l-ic, :root[data-skin="clean"] .att-row.bad .att-ic, :root[data-skin="mid"] .att-row.bad .att-ic, :root[data-skin="google"] .att-row.bad .att-ic, :root[data-skin="chisto"] .att-row.bad .att-ic, :root[data-skin="clean"] .cal-ev.late .cal-ev-ic, :root[data-skin="mid"] .cal-ev.late .cal-ev-ic, :root[data-skin="google"] .cal-ev.late .cal-ev-ic, :root[data-skin="chisto"] .cal-ev.late .cal-ev-ic, :root[data-skin="clean"] .due-row.late .due-ic, :root[data-skin="mid"] .due-row.late .due-ic, :root[data-skin="google"] .due-row.late .due-ic, :root[data-skin="chisto"] .due-row.late .due-ic {color: var(--neg) !important;}
:root[data-skin="clean"] .empty-ic, :root[data-skin="mid"] .empty-ic, :root[data-skin="google"] .empty-ic, :root[data-skin="chisto"] .empty-ic {color: var(--faint) !important;}
:root[data-skin="clean"] .tile-top .ic-chip, :root[data-skin="mid"] .tile-top .ic-chip, :root[data-skin="google"] .tile-top .ic-chip, :root[data-skin="chisto"] .tile-top .ic-chip, :root[data-skin="clean"] .quick .q-ic, :root[data-skin="mid"] .quick .q-ic, :root[data-skin="google"] .quick .q-ic, :root[data-skin="chisto"] .quick .q-ic, :root[data-skin="clean"] .exp-item .e-ic, :root[data-skin="mid"] .exp-item .e-ic, :root[data-skin="google"] .exp-item .e-ic, :root[data-skin="chisto"] .exp-item .e-ic {background: transparent; color: var(--muted); width: 22px; height: 22px;}
:root[data-skin="clean"] .stat-label .ic, :root[data-skin="mid"] .stat-label .ic, :root[data-skin="google"] .stat-label .ic, :root[data-skin="chisto"] .stat-label .ic {color: var(--faint);}
:root[data-skin="clean"] .share-name .ic, :root[data-skin="mid"] .share-name .ic, :root[data-skin="google"] .share-name .ic, :root[data-skin="chisto"] .share-name .ic {color: var(--muted);}
:root[data-skin="clean"] .btn, :root[data-skin="mid"] .btn, :root[data-skin="google"] .btn, :root[data-skin="chisto"] .btn {border-radius: var(--r-md); font-weight: 700;}
:root[data-skin="clean"] .btn-lg, :root[data-skin="mid"] .btn-lg, :root[data-skin="google"] .btn-lg, :root[data-skin="chisto"] .btn-lg, :root[data-skin="clean"] .btn-xl, :root[data-skin="mid"] .btn-xl, :root[data-skin="google"] .btn-xl, :root[data-skin="chisto"] .btn-xl {border-radius: 14px;}
:root[data-skin="clean"] .btn:active, :root[data-skin="mid"] .btn:active, :root[data-skin="google"] .btn:active, :root[data-skin="chisto"] .btn:active {transform: none; opacity: .85;}
:root[data-skin="clean"] .btn-primary, :root[data-skin="mid"] .btn-primary, :root[data-skin="google"] .btn-primary, :root[data-skin="chisto"] .btn-primary, :root[data-skin="clean"] .btn-page, :root[data-skin="mid"] .btn-page, :root[data-skin="google"] .btn-page, :root[data-skin="chisto"] .btn-page, :root[data-skin="clean"] .shift-cta, :root[data-skin="mid"] .shift-cta, :root[data-skin="google"] .shift-cta, :root[data-skin="chisto"] .shift-cta, :root[data-skin="clean"] .fab, :root[data-skin="mid"] .fab, :root[data-skin="google"] .fab, :root[data-skin="chisto"] .fab {box-shadow: none !important;}
:root[data-skin="clean"] .btn-ghost, :root[data-skin="mid"] .btn-ghost, :root[data-skin="google"] .btn-ghost, :root[data-skin="chisto"] .btn-ghost {background: var(--surface); border: 1px solid var(--line); color: var(--text);}
:root[data-skin="clean"] .btn-ghost:hover, :root[data-skin="mid"] .btn-ghost:hover, :root[data-skin="google"] .btn-ghost:hover, :root[data-skin="chisto"] .btn-ghost:hover {border-color: var(--faint);}
:root[data-skin="clean"] .btn-outline, :root[data-skin="mid"] .btn-outline, :root[data-skin="google"] .btn-outline, :root[data-skin="chisto"] .btn-outline {border: 1px solid var(--line);}
:root[data-skin="clean"] .icon-btn, :root[data-skin="mid"] .icon-btn, :root[data-skin="google"] .icon-btn, :root[data-skin="chisto"] .icon-btn {background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md);}
:root[data-skin="clean"] .icon-btn.plain, :root[data-skin="mid"] .icon-btn.plain, :root[data-skin="google"] .icon-btn.plain, :root[data-skin="chisto"] .icon-btn.plain {background: transparent; border: 0;}
:root[data-skin="clean"] .chip, :root[data-skin="mid"] .chip, :root[data-skin="google"] .chip, :root[data-skin="chisto"] .chip, :root[data-skin="clean"] .chip.page, :root[data-skin="mid"] .chip.page, :root[data-skin="google"] .chip.page, :root[data-skin="chisto"] .chip.page, :root[data-skin="clean"] .chip.warn, :root[data-skin="mid"] .chip.warn, :root[data-skin="google"] .chip.warn, :root[data-skin="chisto"] .chip.warn, :root[data-skin="clean"] .chip.good, :root[data-skin="mid"] .chip.good, :root[data-skin="google"] .chip.good, :root[data-skin="chisto"] .chip.good, :root[data-skin="clean"] .chip.bad, :root[data-skin="mid"] .chip.bad, :root[data-skin="google"] .chip.bad, :root[data-skin="chisto"] .chip.bad {background: var(--surface-2); color: var(--muted);}
:root[data-skin="clean"] .chip.bad, :root[data-skin="mid"] .chip.bad, :root[data-skin="google"] .chip.bad, :root[data-skin="chisto"] .chip.bad {color: var(--neg);}
:root[data-skin="clean"] .chip.good, :root[data-skin="mid"] .chip.good, :root[data-skin="google"] .chip.good, :root[data-skin="chisto"] .chip.good {color: var(--pos);}
:root[data-skin="clean"] .ic-fill, :root[data-skin="mid"] .ic-fill, :root[data-skin="google"] .ic-fill, :root[data-skin="chisto"] .ic-fill {opacity: 0 !important;}
:root[data-skin="clean"] .seg, :root[data-skin="mid"] .seg, :root[data-skin="google"] .seg, :root[data-skin="chisto"] .seg {background: var(--surface-2); border: 0 !important; border-radius: var(--r-md); padding: 3px;}
:root[data-skin="clean"] .seg-btn, :root[data-skin="mid"] .seg-btn, :root[data-skin="google"] .seg-btn, :root[data-skin="chisto"] .seg-btn {border-radius: 9px;}
:root[data-skin="clean"] .seg-btn.on, :root[data-skin="mid"] .seg-btn.on, :root[data-skin="google"] .seg-btn.on, :root[data-skin="chisto"] .seg-btn.on, :root[data-skin="clean"] .seg.on-page .seg-btn.on, :root[data-skin="mid"] .seg.on-page .seg-btn.on, :root[data-skin="google"] .seg.on-page .seg-btn.on, :root[data-skin="chisto"] .seg.on-page .seg-btn.on, :root[data-skin="clean"] body.admin .seg-btn.on, :root[data-skin="mid"] body.admin .seg-btn.on, :root[data-skin="google"] body.admin .seg-btn.on, :root[data-skin="chisto"] body.admin .seg-btn.on, :root[data-skin="clean"] body.admin .seg.on-page .seg-btn.on, :root[data-skin="mid"] body.admin .seg.on-page .seg-btn.on, :root[data-skin="google"] body.admin .seg.on-page .seg-btn.on, :root[data-skin="chisto"] body.admin .seg.on-page .seg-btn.on {background: var(--surface); color: var(--text); box-shadow: 0 0 0 1px var(--line) !important;}
:root[data-skin="clean"] .nav, :root[data-skin="mid"] .nav, :root[data-skin="google"] .nav, :root[data-skin="chisto"] .nav {background: var(--surface); backdrop-filter: none; -webkit-backdrop-filter: none; border-top: 1px solid var(--line);}
:root[data-skin="clean"] .nav a, :root[data-skin="mid"] .nav a, :root[data-skin="google"] .nav a, :root[data-skin="chisto"] .nav a {color: var(--faint);}
:root[data-skin="clean"] .nav a.on, :root[data-skin="mid"] .nav a.on, :root[data-skin="google"] .nav a.on, :root[data-skin="chisto"] .nav a.on {color: var(--text); font-weight: 800;}
:root[data-skin="clean"] .nav-ic, :root[data-skin="mid"] .nav-ic, :root[data-skin="google"] .nav-ic, :root[data-skin="chisto"] .nav-ic, :root[data-skin="clean"] .nav.nav-3 .nav-ic, :root[data-skin="mid"] .nav.nav-3 .nav-ic, :root[data-skin="google"] .nav.nav-3 .nav-ic, :root[data-skin="chisto"] .nav.nav-3 .nav-ic {width: 44px; height: 30px; border-radius: 0; position: relative;}
:root[data-skin="clean"] .nav a:not(.on) .nav-ic, :root[data-skin="mid"] .nav a:not(.on) .nav-ic, :root[data-skin="google"] .nav a:not(.on) .nav-ic, :root[data-skin="chisto"] .nav a:not(.on) .nav-ic {color: var(--faint);}
:root[data-skin="clean"] .nav a.on .nav-ic, :root[data-skin="mid"] .nav a.on .nav-ic, :root[data-skin="google"] .nav a.on .nav-ic, :root[data-skin="chisto"] .nav a.on .nav-ic {background: transparent !important; color: var(--text) !important; box-shadow: none !important;}
:root[data-skin="clean"] .nav a.on .nav-ic::before, :root[data-skin="mid"] .nav a.on .nav-ic::before, :root[data-skin="google"] .nav a.on .nav-ic::before, :root[data-skin="chisto"] .nav a.on .nav-ic::before {content: ''; position: absolute; left: 8px; right: 8px; top: -7px; height: 3px; border-radius: 0 0 3px 3px; background: var(--accent);}
:root[data-skin="clean"] .hero, :root[data-skin="mid"] .hero, :root[data-skin="google"] .hero, :root[data-skin="chisto"] .hero {background: var(--surface) !important; color: var(--text); border: 1px solid var(--line) !important; box-shadow: none !important; padding: 18px;}
:root[data-skin="clean"] .hero::before, :root[data-skin="mid"] .hero::before, :root[data-skin="google"] .hero::before, :root[data-skin="chisto"] .hero::before, :root[data-skin="clean"] .hero::after, :root[data-skin="mid"] .hero::after, :root[data-skin="google"] .hero::after, :root[data-skin="chisto"] .hero::after {display: none !important;}
:root[data-skin="clean"] .hero h1, :root[data-skin="mid"] .hero h1, :root[data-skin="google"] .hero h1, :root[data-skin="chisto"] .hero h1 {font-family: var(--font); font-size: 1.5rem;}
:root[data-skin="clean"] .hero .hero-sub, :root[data-skin="mid"] .hero .hero-sub, :root[data-skin="google"] .hero .hero-sub, :root[data-skin="chisto"] .hero .hero-sub {color: var(--muted);}
:root[data-skin="clean"] .hero-num, :root[data-skin="mid"] .hero-num, :root[data-skin="google"] .hero-num, :root[data-skin="chisto"] .hero-num {color: var(--text); font-family: var(--font); font-weight: 800;}
:root[data-skin="clean"] .hero-chip, :root[data-skin="mid"] .hero-chip, :root[data-skin="google"] .hero-chip, :root[data-skin="chisto"] .hero-chip {background: var(--surface-2); border: 0; color: var(--muted); backdrop-filter: none;}
:root[data-skin="clean"] .hero-btn, :root[data-skin="mid"] .hero-btn, :root[data-skin="google"] .hero-btn, :root[data-skin="chisto"] .hero-btn {background: var(--surface); border: 1px solid var(--line); color: var(--text); border-radius: var(--r-md);}
:root[data-skin="clean"] .hero .seg, :root[data-skin="mid"] .hero .seg, :root[data-skin="google"] .hero .seg, :root[data-skin="chisto"] .hero .seg {background: var(--surface-2);}
:root[data-skin="clean"] .hero .seg-btn, :root[data-skin="mid"] .hero .seg-btn, :root[data-skin="google"] .hero .seg-btn, :root[data-skin="chisto"] .hero .seg-btn {color: var(--muted); opacity: 1;}
:root[data-skin="clean"] .hero .seg-btn.on, :root[data-skin="mid"] .hero .seg-btn.on, :root[data-skin="google"] .hero .seg-btn.on, :root[data-skin="chisto"] .hero .seg-btn.on {background: var(--surface); color: var(--text);}
:root[data-skin="clean"] .hero .period-nav .icon-btn, :root[data-skin="mid"] .hero .period-nav .icon-btn, :root[data-skin="google"] .hero .period-nav .icon-btn, :root[data-skin="chisto"] .hero .period-nav .icon-btn {background: transparent; color: var(--text);}
:root[data-skin="clean"] .hero .time-in, :root[data-skin="mid"] .hero .time-in, :root[data-skin="google"] .hero .time-in, :root[data-skin="chisto"] .hero .time-in {background: var(--surface-2);}
:root[data-skin="clean"] .hero .time-in span, :root[data-skin="mid"] .hero .time-in span, :root[data-skin="google"] .hero .time-in span, :root[data-skin="chisto"] .hero .time-in span {color: var(--muted); opacity: 1;}
:root[data-skin="clean"] .hero .time-in input, :root[data-skin="mid"] .hero .time-in input, :root[data-skin="google"] .hero .time-in input, :root[data-skin="chisto"] .hero .time-in input {color: var(--text); color-scheme: light dark;}
:root[data-skin="clean"] .hero .pos, :root[data-skin="mid"] .hero .pos, :root[data-skin="google"] .hero .pos, :root[data-skin="chisto"] .hero .pos, :root[data-skin="clean"] .meter .pos, :root[data-skin="mid"] .meter .pos, :root[data-skin="google"] .meter .pos, :root[data-skin="chisto"] .meter .pos {color: var(--text);}
:root[data-skin="clean"] .code-box, :root[data-skin="mid"] .code-box, :root[data-skin="google"] .code-box, :root[data-skin="chisto"] .code-box {background: var(--surface-2); border: 1px dashed var(--line);}
:root[data-skin="clean"] .code-btn, :root[data-skin="mid"] .code-btn, :root[data-skin="google"] .code-btn, :root[data-skin="chisto"] .code-btn {background: var(--surface); color: var(--text); border: 1px solid var(--line);}
:root[data-skin="clean"] .code-btn.solid, :root[data-skin="mid"] .code-btn.solid, :root[data-skin="google"] .code-btn.solid, :root[data-skin="chisto"] .code-btn.solid {background: var(--accent); color: var(--accent-ink); border: 0;}
:root[data-skin="clean"] .meter, :root[data-skin="mid"] .meter, :root[data-skin="google"] .meter, :root[data-skin="chisto"] .meter {background: var(--surface) !important; color: var(--text); border: 1px solid var(--line) !important; box-shadow: none !important; padding: 18px 16px 14px;}
:root[data-skin="clean"] .meter::before, :root[data-skin="mid"] .meter::before, :root[data-skin="google"] .meter::before, :root[data-skin="chisto"] .meter::before, :root[data-skin="clean"] .meter::after, :root[data-skin="mid"] .meter::after, :root[data-skin="google"] .meter::after, :root[data-skin="chisto"] .meter::after {display: none !important;}
:root[data-skin="clean"] .meter-label, :root[data-skin="mid"] .meter-label, :root[data-skin="google"] .meter-label, :root[data-skin="chisto"] .meter-label {color: var(--muted);}
:root[data-skin="clean"] .meter-pct, :root[data-skin="mid"] .meter-pct, :root[data-skin="google"] .meter-pct, :root[data-skin="chisto"] .meter-pct {background: var(--surface-2); color: var(--text);}
:root[data-skin="clean"] .meter-value, :root[data-skin="mid"] .meter-value, :root[data-skin="google"] .meter-value, :root[data-skin="chisto"] .meter-value {color: var(--text) !important; font-family: var(--font); font-weight: 800;}
:root[data-skin="clean"] .meter-value.neg, :root[data-skin="mid"] .meter-value.neg, :root[data-skin="google"] .meter-value.neg, :root[data-skin="chisto"] .meter-value.neg {color: var(--neg) !important;}
:root[data-skin="clean"] .meter-goal, :root[data-skin="mid"] .meter-goal, :root[data-skin="google"] .meter-goal, :root[data-skin="chisto"] .meter-goal {color: var(--muted);}
:root[data-skin="clean"] .meter-goal b, :root[data-skin="mid"] .meter-goal b, :root[data-skin="google"] .meter-goal b, :root[data-skin="chisto"] .meter-goal b {color: var(--text);}
:root[data-skin="clean"] .meter .road, :root[data-skin="mid"] .meter .road, :root[data-skin="google"] .meter .road, :root[data-skin="chisto"] .meter .road, :root[data-skin="clean"] .road, :root[data-skin="mid"] .road, :root[data-skin="google"] .road, :root[data-skin="chisto"] .road {height: 8px !important; border-radius: 999px; background: var(--surface-3); margin-top: 14px;}
:root[data-skin="clean"] .road-fill, :root[data-skin="mid"] .road-fill, :root[data-skin="google"] .road-fill, :root[data-skin="chisto"] .road-fill {background: var(--accent) !important; border-radius: 999px;}
:root[data-skin="clean"] .road-lane, :root[data-skin="mid"] .road-lane, :root[data-skin="google"] .road-lane, :root[data-skin="chisto"] .road-lane, :root[data-skin="clean"] .road-car, :root[data-skin="mid"] .road-car, :root[data-skin="google"] .road-car, :root[data-skin="chisto"] .road-car, :root[data-skin="clean"] .road-flag, :root[data-skin="mid"] .road-flag, :root[data-skin="google"] .road-flag, :root[data-skin="chisto"] .road-flag {display: none !important;}
:root[data-skin="clean"] .meter-today, :root[data-skin="mid"] .meter-today, :root[data-skin="google"] .meter-today, :root[data-skin="chisto"] .meter-today {background: var(--surface-2); color: var(--text);}
:root[data-skin="clean"] .meter-today b, :root[data-skin="mid"] .meter-today b, :root[data-skin="google"] .meter-today b, :root[data-skin="chisto"] .meter-today b {color: var(--text) !important;}
:root[data-skin="clean"] .meter-forecast, :root[data-skin="mid"] .meter-forecast, :root[data-skin="google"] .meter-forecast, :root[data-skin="chisto"] .meter-forecast {color: var(--muted);}
:root[data-skin="clean"] .meter-forecast b, :root[data-skin="mid"] .meter-forecast b, :root[data-skin="google"] .meter-forecast b, :root[data-skin="chisto"] .meter-forecast b {color: var(--text);}
:root[data-skin="clean"] .meter-forecast b.neg, :root[data-skin="mid"] .meter-forecast b.neg, :root[data-skin="google"] .meter-forecast b.neg, :root[data-skin="chisto"] .meter-forecast b.neg {color: var(--neg);}
:root[data-skin="clean"] .meter-hours, :root[data-skin="mid"] .meter-hours, :root[data-skin="google"] .meter-hours, :root[data-skin="chisto"] .meter-hours {color: var(--muted);}
:root[data-skin="clean"] .meter-hours b, :root[data-skin="mid"] .meter-hours b, :root[data-skin="google"] .meter-hours b, :root[data-skin="chisto"] .meter-hours b {color: var(--text); font-family: var(--font);}
:root[data-skin="clean"] .meter-more > summary, :root[data-skin="mid"] .meter-more > summary, :root[data-skin="google"] .meter-more > summary, :root[data-skin="chisto"] .meter-more > summary {color: var(--muted);}
:root[data-skin="clean"] .meter-cell, :root[data-skin="mid"] .meter-cell, :root[data-skin="google"] .meter-cell, :root[data-skin="chisto"] .meter-cell {background: var(--surface-2);}
:root[data-skin="clean"] .meter-cell span, :root[data-skin="mid"] .meter-cell span, :root[data-skin="google"] .meter-cell span, :root[data-skin="chisto"] .meter-cell span {color: var(--muted);}
:root[data-skin="clean"] .meter-cell b, :root[data-skin="mid"] .meter-cell b, :root[data-skin="google"] .meter-cell b, :root[data-skin="chisto"] .meter-cell b, :root[data-skin="clean"] .meter-cell b.hl, :root[data-skin="mid"] .meter-cell b.hl, :root[data-skin="google"] .meter-cell b.hl, :root[data-skin="chisto"] .meter-cell b.hl {color: var(--text);}
:root[data-skin="clean"] .meter-note, :root[data-skin="mid"] .meter-note, :root[data-skin="google"] .meter-note, :root[data-skin="chisto"] .meter-note {color: var(--muted);}
:root[data-skin="clean"] .goal-edit, :root[data-skin="mid"] .goal-edit, :root[data-skin="google"] .goal-edit, :root[data-skin="chisto"] .goal-edit {text-decoration-color: var(--faint);}
:root[data-skin="clean"] .avatar, :root[data-skin="mid"] .avatar, :root[data-skin="google"] .avatar, :root[data-skin="chisto"] .avatar, :root[data-skin="clean"] .cover-avatar, :root[data-skin="mid"] .cover-avatar, :root[data-skin="google"] .cover-avatar, :root[data-skin="chisto"] .cover-avatar {background: var(--surface-2); color: var(--text); box-shadow: none !important; border-radius: 50%; font-family: var(--font);}
:root[data-skin="clean"] .avatar.has-photo, :root[data-skin="mid"] .avatar.has-photo, :root[data-skin="google"] .avatar.has-photo, :root[data-skin="chisto"] .avatar.has-photo {border-radius: 50%;}
:root[data-skin="clean"] .cover-avatar img, :root[data-skin="mid"] .cover-avatar img, :root[data-skin="google"] .cover-avatar img, :root[data-skin="chisto"] .cover-avatar img {border-radius: 50%;}
:root[data-skin="clean"] .first-day h2, :root[data-skin="mid"] .first-day h2, :root[data-skin="google"] .first-day h2, :root[data-skin="chisto"] .first-day h2 {font-family: var(--font);}
:root[data-skin="clean"] .home-link.on, :root[data-skin="mid"] .home-link.on, :root[data-skin="google"] .home-link.on, :root[data-skin="chisto"] .home-link.on {box-shadow: none !important; border-color: var(--faint) !important;}
:root[data-skin="clean"] .home-link.on .hl-chev, :root[data-skin="mid"] .home-link.on .hl-chev, :root[data-skin="google"] .home-link.on .hl-chev, :root[data-skin="chisto"] .home-link.on .hl-chev {color: var(--text);}
:root[data-skin="clean"] .home-link:nth-child(2) .hl-ic, :root[data-skin="mid"] .home-link:nth-child(2) .hl-ic, :root[data-skin="google"] .home-link:nth-child(2) .hl-ic, :root[data-skin="chisto"] .home-link:nth-child(2) .hl-ic {background: transparent; color: var(--muted);}
:root[data-skin="clean"] .quote, :root[data-skin="mid"] .quote, :root[data-skin="google"] .quote, :root[data-skin="chisto"] .quote {background: var(--surface); border: 1px solid var(--line);}
:root[data-skin="clean"] .live, :root[data-skin="mid"] .live, :root[data-skin="google"] .live, :root[data-skin="chisto"] .live, :root[data-skin="clean"] .drive, :root[data-skin="mid"] .drive, :root[data-skin="google"] .drive, :root[data-skin="chisto"] .drive {border: 1px solid var(--line) !important;}
:root[data-skin="clean"] .live-dot, :root[data-skin="mid"] .live-dot, :root[data-skin="google"] .live-dot, :root[data-skin="chisto"] .live-dot {animation: none;}
:root[data-skin="clean"] .next-when, :root[data-skin="mid"] .next-when, :root[data-skin="google"] .next-when, :root[data-skin="chisto"] .next-when, :root[data-skin="clean"] .next-item.pay .next-when, :root[data-skin="mid"] .next-item.pay .next-when, :root[data-skin="google"] .next-item.pay .next-when, :root[data-skin="chisto"] .next-item.pay .next-when, :root[data-skin="clean"] .res-when, :root[data-skin="mid"] .res-when, :root[data-skin="google"] .res-when, :root[data-skin="chisto"] .res-when, :root[data-skin="clean"] .day-badge, :root[data-skin="mid"] .day-badge, :root[data-skin="google"] .day-badge, :root[data-skin="chisto"] .day-badge, :root[data-skin="clean"] .day-badge.night, :root[data-skin="mid"] .day-badge.night, :root[data-skin="google"] .day-badge.night, :root[data-skin="chisto"] .day-badge.night, :root[data-skin="clean"] .rem-days, :root[data-skin="mid"] .rem-days, :root[data-skin="google"] .rem-days, :root[data-skin="chisto"] .rem-days {background: var(--surface-2); color: var(--text);}
:root[data-skin="clean"] .next-when b, :root[data-skin="mid"] .next-when b, :root[data-skin="google"] .next-when b, :root[data-skin="chisto"] .next-when b {color: var(--text);}
:root[data-skin="clean"] .next-item.late .next-when, :root[data-skin="mid"] .next-item.late .next-when, :root[data-skin="google"] .next-item.late .next-when, :root[data-skin="chisto"] .next-item.late .next-when, :root[data-skin="clean"] .rem-days.bad, :root[data-skin="mid"] .rem-days.bad, :root[data-skin="google"] .rem-days.bad, :root[data-skin="chisto"] .rem-days.bad {background: var(--neg-soft); color: var(--neg);}
:root[data-skin="clean"] .res-when span, :root[data-skin="mid"] .res-when span, :root[data-skin="google"] .res-when span, :root[data-skin="chisto"] .res-when span {color: var(--muted);}
:root[data-skin="clean"] .trend.up, :root[data-skin="mid"] .trend.up, :root[data-skin="google"] .trend.up, :root[data-skin="chisto"] .trend.up, :root[data-skin="clean"] .trend.down, :root[data-skin="mid"] .trend.down, :root[data-skin="google"] .trend.down, :root[data-skin="chisto"] .trend.down {background: var(--surface-2);}
:root[data-skin="clean"] .week-bar.pos, :root[data-skin="mid"] .week-bar.pos, :root[data-skin="google"] .week-bar.pos, :root[data-skin="chisto"] .week-bar.pos, :root[data-skin="clean"] .bar.pos, :root[data-skin="mid"] .bar.pos, :root[data-skin="google"] .bar.pos, :root[data-skin="chisto"] .bar.pos, :root[data-skin="clean"] .bars.violet .bar.pos, :root[data-skin="mid"] .bars.violet .bar.pos, :root[data-skin="google"] .bars.violet .bar.pos, :root[data-skin="chisto"] .bars.violet .bar.pos {background: var(--accent); fill: var(--accent);}
:root[data-skin="clean"] .week-bar.neg, :root[data-skin="mid"] .week-bar.neg, :root[data-skin="google"] .week-bar.neg, :root[data-skin="chisto"] .week-bar.neg {background: var(--neg);}
:root[data-skin="clean"] .wd-row .wd-fill, :root[data-skin="mid"] .wd-row .wd-fill, :root[data-skin="google"] .wd-row .wd-fill, :root[data-skin="chisto"] .wd-row .wd-fill, :root[data-skin="clean"] .hours span, :root[data-skin="mid"] .hours span, :root[data-skin="google"] .hours span, :root[data-skin="chisto"] .hours span {background: var(--surface-3);}
:root[data-skin="clean"] .wd-row.best .wd-fill, :root[data-skin="mid"] .wd-row.best .wd-fill, :root[data-skin="google"] .wd-row.best .wd-fill, :root[data-skin="chisto"] .wd-row.best .wd-fill, :root[data-skin="clean"] .hours span.best, :root[data-skin="mid"] .hours span.best, :root[data-skin="google"] .hours span.best, :root[data-skin="chisto"] .hours span.best {background: var(--accent);}
:root[data-skin="clean"] .win-rank, :root[data-skin="mid"] .win-rank, :root[data-skin="google"] .win-rank, :root[data-skin="chisto"] .win-rank, :root[data-skin="clean"] .win:nth-child(2) .win-rank, :root[data-skin="mid"] .win:nth-child(2) .win-rank, :root[data-skin="google"] .win:nth-child(2) .win-rank, :root[data-skin="chisto"] .win:nth-child(2) .win-rank, :root[data-skin="clean"] .win:nth-child(3) .win-rank, :root[data-skin="mid"] .win:nth-child(3) .win-rank, :root[data-skin="google"] .win:nth-child(3) .win-rank, :root[data-skin="chisto"] .win:nth-child(3) .win-rank {background: var(--surface-2); color: var(--text);}
:root[data-skin="clean"] .tile, :root[data-skin="mid"] .tile, :root[data-skin="google"] .tile, :root[data-skin="chisto"] .tile {background: var(--surface);}
:root[data-skin="clean"] .tile:active, :root[data-skin="mid"] .tile:active, :root[data-skin="google"] .tile:active, :root[data-skin="chisto"] .tile:active {border-color: var(--text) !important;}
:root[data-skin="clean"] .quick button, :root[data-skin="mid"] .quick button, :root[data-skin="google"] .quick button, :root[data-skin="chisto"] .quick button {background: var(--surface); border: 1px solid var(--line);}
:root[data-skin="clean"] .quick .quick-edit, :root[data-skin="mid"] .quick .quick-edit, :root[data-skin="google"] .quick .quick-edit, :root[data-skin="chisto"] .quick .quick-edit, :root[data-skin="clean"] .quick .quick-more, :root[data-skin="mid"] .quick .quick-more, :root[data-skin="google"] .quick .quick-more, :root[data-skin="chisto"] .quick .quick-more {border-style: dashed;}
:root[data-skin="clean"] .exp-item, :root[data-skin="mid"] .exp-item, :root[data-skin="google"] .exp-item, :root[data-skin="chisto"] .exp-item, :root[data-skin="clean"] .time-in, :root[data-skin="mid"] .time-in, :root[data-skin="google"] .time-in, :root[data-skin="chisto"] .time-in, :root[data-skin="clean"] .np-field, :root[data-skin="mid"] .np-field, :root[data-skin="google"] .np-field, :root[data-skin="chisto"] .np-field, :root[data-skin="clean"] .stat, :root[data-skin="mid"] .stat, :root[data-skin="google"] .stat, :root[data-skin="chisto"] .stat, :root[data-skin="clean"] .result-cell, :root[data-skin="mid"] .result-cell, :root[data-skin="google"] .result-cell, :root[data-skin="chisto"] .result-cell, :root[data-skin="clean"] .result-goal, :root[data-skin="mid"] .result-goal, :root[data-skin="google"] .result-goal, :root[data-skin="chisto"] .result-goal, :root[data-skin="clean"] .ci-grid > div, :root[data-skin="mid"] .ci-grid > div, :root[data-skin="google"] .ci-grid > div, :root[data-skin="chisto"] .ci-grid > div, :root[data-skin="clean"] .fuel-line, :root[data-skin="mid"] .fuel-line, :root[data-skin="google"] .fuel-line, :root[data-skin="chisto"] .fuel-line, :root[data-skin="clean"] .drive-need, :root[data-skin="mid"] .drive-need, :root[data-skin="google"] .drive-need, :root[data-skin="chisto"] .drive-need, :root[data-skin="clean"] .info-box, :root[data-skin="mid"] .info-box, :root[data-skin="google"] .info-box, :root[data-skin="chisto"] .info-box, :root[data-skin="clean"] .next-empty, :root[data-skin="mid"] .next-empty, :root[data-skin="google"] .next-empty, :root[data-skin="chisto"] .next-empty, :root[data-skin="clean"] .hap, :root[data-skin="mid"] .hap, :root[data-skin="google"] .hap, :root[data-skin="chisto"] .hap, :root[data-skin="clean"] .step-row, :root[data-skin="mid"] .step-row, :root[data-skin="google"] .step-row, :root[data-skin="chisto"] .step-row {background: var(--surface-2);}
:root[data-skin="clean"] .stat-card, :root[data-skin="mid"] .stat-card, :root[data-skin="google"] .stat-card, :root[data-skin="chisto"] .stat-card {background: var(--surface);}
:root[data-skin="clean"] .np-field.active, :root[data-skin="mid"] .np-field.active, :root[data-skin="google"] .np-field.active, :root[data-skin="chisto"] .np-field.active {border-color: var(--text); background: var(--surface);}
:root[data-skin="clean"] .np-key, :root[data-skin="mid"] .np-key, :root[data-skin="google"] .np-key, :root[data-skin="chisto"] .np-key {background: var(--surface-2); font-family: var(--font); font-weight: 600; border-radius: var(--r-md);}
:root[data-skin="clean"] .save-bar, :root[data-skin="mid"] .save-bar, :root[data-skin="google"] .save-bar, :root[data-skin="chisto"] .save-bar {background: var(--surface); backdrop-filter: none; -webkit-backdrop-filter: none;}
:root[data-skin="clean"] .sheet, :root[data-skin="mid"] .sheet, :root[data-skin="google"] .sheet, :root[data-skin="chisto"] .sheet {border-radius: 20px 20px 0 0;}
:root[data-skin="clean"] .sheet-backdrop, :root[data-skin="mid"] .sheet-backdrop, :root[data-skin="google"] .sheet-backdrop, :root[data-skin="chisto"] .sheet-backdrop {background: rgba(0, 0, 0, .45);}
:root[data-skin="clean"] .chip-btn.on, :root[data-skin="mid"] .chip-btn.on, :root[data-skin="google"] .chip-btn.on, :root[data-skin="chisto"] .chip-btn.on, :root[data-skin="clean"] .option.on, :root[data-skin="mid"] .option.on, :root[data-skin="google"] .option.on, :root[data-skin="chisto"] .option.on {background: var(--surface); border-color: var(--text);}
:root[data-skin="clean"] .option.on .ic, :root[data-skin="mid"] .option.on .ic, :root[data-skin="google"] .option.on .ic, :root[data-skin="chisto"] .option.on .ic {color: var(--text);}
:root[data-skin="clean"] .option, :root[data-skin="mid"] .option, :root[data-skin="google"] .option, :root[data-skin="chisto"] .option {background: var(--surface-2);}
:root[data-skin="clean"] .input, :root[data-skin="mid"] .input, :root[data-skin="google"] .input, :root[data-skin="chisto"] .input, :root[data-skin="clean"] select.input, :root[data-skin="mid"] select.input, :root[data-skin="google"] select.input, :root[data-skin="chisto"] select.input {border: 1px solid var(--line); border-radius: var(--r-md);}
:root[data-skin="clean"] .input:focus, :root[data-skin="mid"] .input:focus, :root[data-skin="google"] .input:focus, :root[data-skin="chisto"] .input:focus {border-color: var(--text); box-shadow: none;}
:root[data-skin="clean"] .toggle.on, :root[data-skin="mid"] .toggle.on, :root[data-skin="google"] .toggle.on, :root[data-skin="chisto"] .toggle.on {background: var(--pos);}
:root[data-skin="clean"] .drive-btn, :root[data-skin="mid"] .drive-btn, :root[data-skin="google"] .drive-btn, :root[data-skin="chisto"] .drive-btn {background: var(--surface); border: 1px solid var(--line);}
:root[data-skin="clean"] .drive-btn .db-ic, :root[data-skin="mid"] .drive-btn .db-ic, :root[data-skin="google"] .drive-btn .db-ic, :root[data-skin="chisto"] .drive-btn .db-ic {background: var(--surface-2); color: var(--text) !important;}
:root[data-skin="clean"] .result-net, :root[data-skin="mid"] .result-net, :root[data-skin="google"] .result-net, :root[data-skin="chisto"] .result-net {color: var(--text); font-family: var(--font); font-weight: 800;}
:root[data-skin="clean"] .result-badge, :root[data-skin="mid"] .result-badge, :root[data-skin="google"] .result-badge, :root[data-skin="chisto"] .result-badge {background: var(--surface-2);}
:root[data-skin="clean"] .result-badge .ic, :root[data-skin="mid"] .result-badge .ic, :root[data-skin="google"] .result-badge .ic, :root[data-skin="chisto"] .result-badge .ic {color: var(--text);}
:root[data-skin="clean"] .result-bar span, :root[data-skin="mid"] .result-bar span, :root[data-skin="google"] .result-bar span, :root[data-skin="chisto"] .result-bar span, :root[data-skin="clean"] .inv-track span, :root[data-skin="mid"] .inv-track span, :root[data-skin="google"] .inv-track span, :root[data-skin="chisto"] .inv-track span, :root[data-skin="clean"] .ladder-track span, :root[data-skin="mid"] .ladder-track span, :root[data-skin="google"] .ladder-track span, :root[data-skin="chisto"] .ladder-track span, :root[data-skin="clean"] .drive-bar i, :root[data-skin="mid"] .drive-bar i, :root[data-skin="google"] .drive-bar i, :root[data-skin="chisto"] .drive-bar i, :root[data-skin="clean"] .ci-bar i, :root[data-skin="mid"] .ci-bar i, :root[data-skin="google"] .ci-bar i, :root[data-skin="chisto"] .ci-bar i {background: var(--accent);}
:root[data-skin="clean"] .result-verdict.up, :root[data-skin="mid"] .result-verdict.up, :root[data-skin="google"] .result-verdict.up, :root[data-skin="chisto"] .result-verdict.up, :root[data-skin="clean"] .result-verdict.down, :root[data-skin="mid"] .result-verdict.down, :root[data-skin="google"] .result-verdict.down, :root[data-skin="chisto"] .result-verdict.down {background: var(--surface-2);}
:root[data-skin="clean"] .ms-total b, :root[data-skin="mid"] .ms-total b, :root[data-skin="google"] .ms-total b, :root[data-skin="chisto"] .ms-total b, :root[data-skin="clean"] .ms-total b:not(.neg), :root[data-skin="mid"] .ms-total b:not(.neg), :root[data-skin="google"] .ms-total b:not(.neg), :root[data-skin="chisto"] .ms-total b:not(.neg) {color: var(--text); font-family: var(--font); font-weight: 800;}
:root[data-skin="clean"] .ms-total b.neg, :root[data-skin="mid"] .ms-total b.neg, :root[data-skin="google"] .ms-total b.neg, :root[data-skin="chisto"] .ms-total b.neg {color: var(--neg);}
:root[data-skin="clean"] .ms-row b, :root[data-skin="mid"] .ms-row b, :root[data-skin="google"] .ms-row b, :root[data-skin="chisto"] .ms-row b {color: var(--text);}
:root[data-skin="clean"] .big-link > .ic:last-child, :root[data-skin="mid"] .big-link > .ic:last-child, :root[data-skin="google"] .big-link > .ic:last-child, :root[data-skin="chisto"] .big-link > .ic:last-child {color: var(--faint);}
:root[data-skin="clean"] .big-link:hover, :root[data-skin="mid"] .big-link:hover, :root[data-skin="google"] .big-link:hover, :root[data-skin="chisto"] .big-link:hover, :root[data-skin="clean"] .home-link:hover, :root[data-skin="mid"] .home-link:hover, :root[data-skin="google"] .home-link:hover, :root[data-skin="chisto"] .home-link:hover {border-color: var(--faint) !important;}
:root[data-skin="clean"] .mcmp .mc-row.sel .mc-name, :root[data-skin="mid"] .mcmp .mc-row.sel .mc-name, :root[data-skin="google"] .mcmp .mc-row.sel .mc-name, :root[data-skin="chisto"] .mcmp .mc-row.sel .mc-name {color: var(--text); text-decoration: underline; text-underline-offset: 4px; text-decoration-color: var(--accent); text-decoration-thickness: 2px;}
:root[data-skin="clean"] .mc-best, :root[data-skin="mid"] .mc-best, :root[data-skin="google"] .mc-best, :root[data-skin="chisto"] .mc-best {background: var(--accent-soft); color: var(--accent-text);}
:root[data-skin="clean"] .mc-pct.up, :root[data-skin="mid"] .mc-pct.up, :root[data-skin="google"] .mc-pct.up, :root[data-skin="chisto"] .mc-pct.up {color: var(--pos);}
:root[data-skin="clean"] .mc-pct.down, :root[data-skin="mid"] .mc-pct.down, :root[data-skin="google"] .mc-pct.down, :root[data-skin="chisto"] .mc-pct.down {color: var(--neg);}
:root[data-skin="clean"] .mc-bar, :root[data-skin="mid"] .mc-bar, :root[data-skin="google"] .mc-bar, :root[data-skin="chisto"] .mc-bar {background: var(--surface-2);}
:root[data-skin="clean"] .mc-bar span, :root[data-skin="mid"] .mc-bar span, :root[data-skin="google"] .mc-bar span, :root[data-skin="chisto"] .mc-bar span {background: var(--surface-3); opacity: 1;}
:root[data-skin="clean"][data-theme="dark"] .mc-bar span, :root[data-skin="mid"][data-theme="dark"] .mc-bar span, :root[data-skin="google"][data-theme="dark"] .mc-bar span, :root[data-skin="chisto"][data-theme="dark"] .mc-bar span {background: #3F3F46;}
:root[data-skin="clean"] .mc-bar span.best, :root[data-skin="mid"] .mc-bar span.best, :root[data-skin="google"] .mc-bar span.best, :root[data-skin="chisto"] .mc-bar span.best {background: var(--accent);}
:root[data-skin="clean"] .bar.hl, :root[data-skin="mid"] .bar.hl, :root[data-skin="google"] .bar.hl, :root[data-skin="chisto"] .bar.hl {fill: var(--text);}
:root[data-skin="clean"] .share-fill, :root[data-skin="mid"] .share-fill, :root[data-skin="google"] .share-fill, :root[data-skin="chisto"] .share-fill {background: var(--text);}
:root[data-skin="clean"] .car-inv .ci-big, :root[data-skin="mid"] .car-inv .ci-big, :root[data-skin="google"] .car-inv .ci-big, :root[data-skin="chisto"] .car-inv .ci-big {color: var(--text); font-family: var(--font);}
:root[data-skin="clean"] .cover-img, :root[data-skin="mid"] .cover-img, :root[data-skin="google"] .cover-img, :root[data-skin="chisto"] .cover-img {height: 120px;}
:root[data-skin="clean"] .cover-img::after, :root[data-skin="mid"] .cover-img::after, :root[data-skin="google"] .cover-img::after, :root[data-skin="chisto"] .cover-img::after {background: transparent;}
:root[data-skin="clean"] .cover-btn, :root[data-skin="mid"] .cover-btn, :root[data-skin="google"] .cover-btn, :root[data-skin="chisto"] .cover-btn {background: rgba(0, 0, 0, .55); backdrop-filter: none;}
:root[data-skin="clean"] .cover-code, :root[data-skin="mid"] .cover-code, :root[data-skin="google"] .cover-code, :root[data-skin="chisto"] .cover-code {box-shadow: none; font-family: var(--font);}
:root[data-skin="clean"] .cover-info h1, :root[data-skin="mid"] .cover-info h1, :root[data-skin="google"] .cover-info h1, :root[data-skin="chisto"] .cover-info h1 {font-size: 1.25rem;}
:root[data-skin="clean"] .plate em, :root[data-skin="mid"] .plate em, :root[data-skin="google"] .plate em, :root[data-skin="chisto"] .plate em {background: #1D4ED8;}
:root[data-skin="clean"] .notify-box, :root[data-skin="mid"] .notify-box, :root[data-skin="google"] .notify-box, :root[data-skin="chisto"] .notify-box {background: var(--surface-2);}
:root[data-skin="clean"] .idea-vote.on, :root[data-skin="mid"] .idea-vote.on, :root[data-skin="google"] .idea-vote.on, :root[data-skin="chisto"] .idea-vote.on {background: var(--accent-soft); color: var(--text);}
:root[data-skin="clean"] .ticket .bubble.them, :root[data-skin="mid"] .ticket .bubble.them, :root[data-skin="google"] .ticket .bubble.them, :root[data-skin="chisto"] .ticket .bubble.them {border: 1px solid var(--line);}
:root[data-skin="clean"] .msg-reply, :root[data-skin="mid"] .msg-reply, :root[data-skin="google"] .msg-reply, :root[data-skin="chisto"] .msg-reply {border-color: var(--line) !important;}
:root[data-skin="clean"] .preview-bar, :root[data-skin="mid"] .preview-bar, :root[data-skin="google"] .preview-bar, :root[data-skin="chisto"] .preview-bar {background: var(--text); color: var(--bg);}
:root[data-skin="clean"] .auth::before, :root[data-skin="mid"] .auth::before, :root[data-skin="google"] .auth::before, :root[data-skin="chisto"] .auth::before {display: none;}
:root[data-skin="clean"] .brand-mark, :root[data-skin="mid"] .brand-mark, :root[data-skin="google"] .brand-mark, :root[data-skin="chisto"] .brand-mark, :root[data-skin="clean"] .brand-logo, :root[data-skin="mid"] .brand-logo, :root[data-skin="google"] .brand-logo, :root[data-skin="chisto"] .brand-logo {box-shadow: none !important;}
:root[data-skin="clean"] .auth-hero h1, :root[data-skin="mid"] .auth-hero h1, :root[data-skin="google"] .auth-hero h1, :root[data-skin="chisto"] .auth-hero h1 {font-family: var(--font); font-weight: 800;}
:root[data-skin="clean"] .brand-name, :root[data-skin="mid"] .brand-name, :root[data-skin="google"] .brand-name, :root[data-skin="chisto"] .brand-name {font-family: var(--font); font-weight: 800;}
:root[data-skin="clean"] .brand-name b, :root[data-skin="mid"] .brand-name b, :root[data-skin="google"] .brand-name b, :root[data-skin="chisto"] .brand-name b {color: inherit;}
:root[data-skin="clean"] .demo-box, :root[data-skin="mid"] .demo-box, :root[data-skin="google"] .demo-box, :root[data-skin="chisto"] .demo-box {border: 1px dashed var(--line);}
:root[data-skin="clean"] .tour-card, :root[data-skin="mid"] .tour-card, :root[data-skin="google"] .tour-card, :root[data-skin="chisto"] .tour-card {border: 1px solid var(--line); box-shadow: 0 20px 50px -20px rgba(0, 0, 0, .45);}
:root[data-skin="clean"] .tour-hole, :root[data-skin="mid"] .tour-hole, :root[data-skin="google"] .tour-hole, :root[data-skin="chisto"] .tour-hole {border-color: var(--accent);}
:root[data-skin="clean"] .toast, :root[data-skin="mid"] .toast, :root[data-skin="google"] .toast, :root[data-skin="chisto"] .toast {box-shadow: none;}
:root[data-skin="clean"] body:not(.admin) .arr-bar, :root[data-skin="mid"] body:not(.admin) .arr-bar, :root[data-skin="google"] body:not(.admin) .arr-bar, :root[data-skin="chisto"] body:not(.admin) .arr-bar {border: 1px solid var(--line); box-shadow: 0 16px 40px -16px rgba(0, 0, 0, .35);}
:root[data-skin="clean"] body.admin, :root[data-skin="mid"] body.admin, :root[data-skin="google"] body.admin, :root[data-skin="chisto"] body.admin {--side: var(--surface); --side-2: var(--surface-2); --side-text: var(--muted);}
:root[data-skin="clean"] .adm-side, :root[data-skin="mid"] .adm-side, :root[data-skin="google"] .adm-side, :root[data-skin="chisto"] .adm-side {background: var(--surface); color: var(--text); border-bottom: 1px solid var(--line); border-right: 0;}
:root[data-skin="clean"] .adm-side .brand-name, :root[data-skin="mid"] .adm-side .brand-name, :root[data-skin="google"] .adm-side .brand-name, :root[data-skin="chisto"] .adm-side .brand-name {color: var(--text);}
:root[data-skin="clean"] .adm-side .brand-name b, :root[data-skin="mid"] .adm-side .brand-name b, :root[data-skin="google"] .adm-side .brand-name b, :root[data-skin="chisto"] .adm-side .brand-name b {color: inherit;}
:root[data-skin="clean"] .adm-side .brand-logo, :root[data-skin="mid"] .adm-side .brand-logo, :root[data-skin="google"] .adm-side .brand-logo, :root[data-skin="chisto"] .adm-side .brand-logo {box-shadow: none !important;}
:root[data-skin="clean"] .adm-badge, :root[data-skin="mid"] .adm-badge, :root[data-skin="google"] .adm-badge, :root[data-skin="chisto"] .adm-badge {color: var(--muted); border-color: var(--line);}
:root[data-skin="clean"] .adm-nav a, :root[data-skin="mid"] .adm-nav a, :root[data-skin="google"] .adm-nav a, :root[data-skin="chisto"] .adm-nav a {color: var(--muted);}
:root[data-skin="clean"] .adm-nav a:hover, :root[data-skin="mid"] .adm-nav a:hover, :root[data-skin="google"] .adm-nav a:hover, :root[data-skin="chisto"] .adm-nav a:hover {background: var(--surface-2); color: var(--text);}
:root[data-skin="clean"] .adm-nav a.on, :root[data-skin="mid"] .adm-nav a.on, :root[data-skin="google"] .adm-nav a.on, :root[data-skin="chisto"] .adm-nav a.on {background: var(--accent); color: var(--accent-ink); box-shadow: none;}
:root[data-skin="clean"] .adm-nav .count, :root[data-skin="mid"] .adm-nav .count, :root[data-skin="google"] .adm-nav .count, :root[data-skin="chisto"] .adm-nav .count {background: var(--surface-2); color: var(--muted);}
:root[data-skin="clean"] .adm-nav a.on .count, :root[data-skin="mid"] .adm-nav a.on .count, :root[data-skin="google"] .adm-nav a.on .count, :root[data-skin="chisto"] .adm-nav a.on .count {background: rgba(0, 0, 0, .1); color: inherit;}
:root[data-skin="clean"] .adm-side-foot .who, :root[data-skin="mid"] .adm-side-foot .who, :root[data-skin="google"] .adm-side-foot .who, :root[data-skin="chisto"] .adm-side-foot .who {color: var(--faint);}
:root[data-skin="clean"] .adm-side-foot .icon-btn, :root[data-skin="mid"] .adm-side-foot .icon-btn, :root[data-skin="google"] .adm-side-foot .icon-btn, :root[data-skin="chisto"] .adm-side-foot .icon-btn, :root[data-skin="clean"] .adm-side-foot .btn, :root[data-skin="mid"] .adm-side-foot .btn, :root[data-skin="google"] .adm-side-foot .btn, :root[data-skin="chisto"] .adm-side-foot .btn {background: var(--surface); color: var(--text); border: 1px solid var(--line);}
:root[data-skin="clean"] .adm-side-foot a.icon-btn.on, :root[data-skin="mid"] .adm-side-foot a.icon-btn.on, :root[data-skin="google"] .adm-side-foot a.icon-btn.on, :root[data-skin="chisto"] .adm-side-foot a.icon-btn.on {background: var(--accent); color: var(--accent-ink); border-color: transparent;}
:root[data-skin="clean"] .adm-head h1, :root[data-skin="mid"] .adm-head h1, :root[data-skin="google"] .adm-head h1, :root[data-skin="chisto"] .adm-head h1 {font-family: var(--font); font-weight: 800;}
:root[data-skin="clean"] .adm-tabs, :root[data-skin="mid"] .adm-tabs, :root[data-skin="google"] .adm-tabs, :root[data-skin="chisto"] .adm-tabs {background: var(--surface-2); border: 0 !important; border-radius: var(--r-md); padding: 3px;}
:root[data-skin="clean"] .adm-tab, :root[data-skin="mid"] .adm-tab, :root[data-skin="google"] .adm-tab, :root[data-skin="chisto"] .adm-tab {border-radius: 9px;}
:root[data-skin="clean"] .adm-tab:hover, :root[data-skin="mid"] .adm-tab:hover, :root[data-skin="google"] .adm-tab:hover, :root[data-skin="chisto"] .adm-tab:hover {background: transparent; color: var(--text);}
:root[data-skin="clean"] .adm-tab.on, :root[data-skin="mid"] .adm-tab.on, :root[data-skin="google"] .adm-tab.on, :root[data-skin="chisto"] .adm-tab.on {background: var(--surface); color: var(--text); box-shadow: 0 0 0 1px var(--line) !important;}
:root[data-skin="clean"] .adm-tab .count, :root[data-skin="mid"] .adm-tab .count, :root[data-skin="google"] .adm-tab .count, :root[data-skin="chisto"] .adm-tab .count {background: var(--surface-3);}
:root[data-skin="clean"] .adm-tab.on .count, :root[data-skin="mid"] .adm-tab.on .count, :root[data-skin="google"] .adm-tab.on .count, :root[data-skin="chisto"] .adm-tab.on .count {background: var(--surface-2); color: var(--muted);}
:root[data-skin="clean"] .adm-tab .count.alert, :root[data-skin="mid"] .adm-tab .count.alert, :root[data-skin="google"] .adm-tab .count.alert, :root[data-skin="chisto"] .adm-tab .count.alert, :root[data-skin="clean"] .adm-nav .count.alert, :root[data-skin="mid"] .adm-nav .count.alert, :root[data-skin="google"] .adm-nav .count.alert, :root[data-skin="chisto"] .adm-nav .count.alert {background: var(--neg); color: #fff;}
:root[data-skin="clean"] body.admin .card, :root[data-skin="mid"] body.admin .card, :root[data-skin="google"] body.admin .card, :root[data-skin="chisto"] body.admin .card, :root[data-skin="clean"] body.admin .kpi, :root[data-skin="mid"] body.admin .kpi, :root[data-skin="google"] body.admin .kpi, :root[data-skin="chisto"] body.admin .kpi, :root[data-skin="clean"] body.admin .mini-kpis, :root[data-skin="mid"] body.admin .mini-kpis, :root[data-skin="google"] body.admin .mini-kpis, :root[data-skin="chisto"] body.admin .mini-kpis, :root[data-skin="clean"] body.admin .scope-bar, :root[data-skin="mid"] body.admin .scope-bar, :root[data-skin="google"] body.admin .scope-bar, :root[data-skin="chisto"] body.admin .scope-bar, :root[data-skin="clean"] body.admin .tbl-wrap, :root[data-skin="mid"] body.admin .tbl-wrap, :root[data-skin="google"] body.admin .tbl-wrap, :root[data-skin="chisto"] body.admin .tbl-wrap {border-color: var(--line) !important;}
:root[data-skin="clean"] .icon-btn.top-btn, :root[data-skin="mid"] .icon-btn.top-btn, :root[data-skin="google"] .icon-btn.top-btn, :root[data-skin="chisto"] .icon-btn.top-btn {background: var(--surface);}
:root[data-skin="clean"] .icon-btn.top-btn.has, :root[data-skin="mid"] .icon-btn.top-btn.has, :root[data-skin="google"] .icon-btn.top-btn.has, :root[data-skin="chisto"] .icon-btn.top-btn.has {color: var(--text); border-color: var(--faint);}
:root[data-skin="clean"] .gs-row em, :root[data-skin="mid"] .gs-row em, :root[data-skin="google"] .gs-row em, :root[data-skin="chisto"] .gs-row em, :root[data-skin="clean"] .tag, :root[data-skin="mid"] .tag, :root[data-skin="google"] .tag, :root[data-skin="chisto"] .tag {background: var(--surface-2); color: var(--muted); border-color: var(--line);}
:root[data-skin="clean"] .arr-toggle.on, :root[data-skin="mid"] .arr-toggle.on, :root[data-skin="google"] .arr-toggle.on, :root[data-skin="chisto"] .arr-toggle.on {background: var(--text); color: var(--bg);}
:root[data-skin="clean"] .goal-bar i, :root[data-skin="mid"] .goal-bar i, :root[data-skin="google"] .goal-bar i, :root[data-skin="chisto"] .goal-bar i {background: var(--accent);}
:root[data-skin="clean"] .hap, :root[data-skin="mid"] .hap, :root[data-skin="google"] .hap, :root[data-skin="chisto"] .hap {color: var(--muted);}
:root[data-skin="clean"] .hap.good .hap-ic, :root[data-skin="mid"] .hap.good .hap-ic, :root[data-skin="google"] .hap.good .hap-ic, :root[data-skin="chisto"] .hap.good .hap-ic, :root[data-skin="clean"] .hap.warn .hap-ic, :root[data-skin="mid"] .hap.warn .hap-ic, :root[data-skin="google"] .hap.warn .hap-ic, :root[data-skin="chisto"] .hap.warn .hap-ic, :root[data-skin="clean"] .hap.bad .hap-ic, :root[data-skin="mid"] .hap.bad .hap-ic, :root[data-skin="google"] .hap.bad .hap-ic, :root[data-skin="chisto"] .hap.bad .hap-ic {background: transparent;}
:root[data-skin="clean"] .hap.good .hap-ic, :root[data-skin="mid"] .hap.good .hap-ic, :root[data-skin="google"] .hap.good .hap-ic, :root[data-skin="chisto"] .hap.good .hap-ic {color: var(--pos) !important;}
:root[data-skin="clean"] .hap.bad .hap-ic, :root[data-skin="mid"] .hap.bad .hap-ic, :root[data-skin="google"] .hap.bad .hap-ic, :root[data-skin="chisto"] .hap.bad .hap-ic {color: var(--neg) !important;}
:root[data-skin="clean"] .kpi-value, :root[data-skin="mid"] .kpi-value, :root[data-skin="google"] .kpi-value, :root[data-skin="chisto"] .kpi-value {color: var(--text);}
:root[data-skin="clean"] .trend-chip.up, :root[data-skin="mid"] .trend-chip.up, :root[data-skin="google"] .trend-chip.up, :root[data-skin="chisto"] .trend-chip.up, :root[data-skin="clean"] .trend-chip.down, :root[data-skin="mid"] .trend-chip.down, :root[data-skin="google"] .trend-chip.down, :root[data-skin="chisto"] .trend-chip.down {background: var(--surface-2);}
:root[data-skin="clean"] .attention, :root[data-skin="mid"] .attention, :root[data-skin="google"] .attention, :root[data-skin="chisto"] .attention {border-color: var(--line) !important;}
:root[data-skin="clean"] .scope-ic, :root[data-skin="mid"] .scope-ic, :root[data-skin="google"] .scope-ic, :root[data-skin="chisto"] .scope-ic, :root[data-skin="clean"] .drv-av, :root[data-skin="mid"] .drv-av, :root[data-skin="google"] .drv-av, :root[data-skin="chisto"] .drv-av {background: var(--surface-2); color: var(--text);}
@media (min-width: 1000px) {
:root[data-skin="clean"] .adm-side, :root[data-skin="mid"] .adm-side, :root[data-skin="google"] .adm-side, :root[data-skin="chisto"] .adm-side {border-right: 1px solid var(--line); border-bottom: 0;}
}
:root[data-skin="clean"] body.admin .adm-head h1::after, :root[data-skin="mid"] body.admin .adm-head h1::after, :root[data-skin="google"] body.admin .adm-head h1::after, :root[data-skin="chisto"] body.admin .adm-head h1::after {display: none;}
:root[data-skin="clean"] .hap.hc, :root[data-skin="mid"] .hap.hc, :root[data-skin="google"] .hap.hc, :root[data-skin="chisto"] .hap.hc, :root[data-skin="clean"] .hap.hc.has, :root[data-skin="mid"] .hap.hc.has, :root[data-skin="google"] .hap.hc.has, :root[data-skin="chisto"] .hap.hc.has {border-left: 0;}
:root[data-skin="clean"] .fuel-line .ic, :root[data-skin="mid"] .fuel-line .ic, :root[data-skin="google"] .fuel-line .ic, :root[data-skin="chisto"] .fuel-line .ic {color: var(--muted);}
:root[data-skin="clean"] .cover-img, :root[data-skin="mid"] .cover-img, :root[data-skin="google"] .cover-img, :root[data-skin="chisto"] .cover-img {background-color: var(--surface-2);}
:root[data-skin="clean"] .adm-side-foot .icon-btn, :root[data-skin="mid"] .adm-side-foot .icon-btn, :root[data-skin="google"] .adm-side-foot .icon-btn, :root[data-skin="chisto"] .adm-side-foot .icon-btn, :root[data-skin="clean"] .adm-side-foot .btn, :root[data-skin="mid"] .adm-side-foot .btn, :root[data-skin="google"] .adm-side-foot .btn, :root[data-skin="chisto"] .adm-side-foot .btn {border-color: var(--line) !important; box-shadow: none !important;}
:root[data-skin="mid"], :root[data-skin="mid"] [data-page] {--c-green: #16A34A; --c-blue: #2563EB; --c-violet: #7C3AED; --c-amber: #D97706; --c-orange: #EA580C; --c-sky: #0284C7; --c-red: #DC2626; --c-teal: #0D9488; --c-pink: #DB2777; --c-slate: #475569; --c-gray: #71717A; --violet: #7C3AED; --v-soft: rgba(124, 58, 237, .09); --v-line: rgba(124, 58, 237, .28); --v-strong: rgba(124, 58, 237, .5); --y-line: rgba(245, 165, 0, .55); --shadow: 0 1px 2px rgba(17, 17, 19, .04), 0 6px 18px -12px rgba(17, 17, 19, .14);}
:root[data-skin="mid"][data-theme="dark"], :root[data-skin="mid"][data-theme="dark"] [data-page] {--c-green: #4ADE80; --c-blue: #60A5FA; --c-violet: #A78BFA; --c-amber: #FBBF24; --c-orange: #FB923C; --c-sky: #38BDF8; --c-red: #F87171; --c-teal: #2DD4BF; --c-pink: #F472B6; --c-slate: #94A3B8; --violet: #A78BFA; --v-soft: rgba(167, 139, 250, .13); --v-line: rgba(167, 139, 250, .3); --v-strong: rgba(167, 139, 250, .55); --y-line: rgba(255, 194, 26, .5); --shadow: none;}
@media (prefers-color-scheme: dark) {
:root[data-skin="mid"]:not([data-theme="light"]):not([data-theme="sun"]), :root[data-skin="mid"]:not([data-theme="light"]):not([data-theme="sun"]) [data-page] {--c-green: #4ADE80; --c-blue: #60A5FA; --c-violet: #A78BFA; --c-amber: #FBBF24; --c-orange: #FB923C; --c-sky: #38BDF8; --c-red: #F87171; --c-teal: #2DD4BF; --c-pink: #F472B6; --c-slate: #94A3B8; --violet: #A78BFA; --v-soft: rgba(167, 139, 250, .13); --v-line: rgba(167, 139, 250, .3); --v-strong: rgba(167, 139, 250, .55); --y-line: rgba(255, 194, 26, .5); --shadow: none;}
}
:root[data-skin="mid"] [data-page] {--pc: var(--c-violet);}
:root[data-skin="mid"] [data-page="home"] {--pc: var(--c-amber);}
:root[data-skin="mid"] [data-page="money"], :root[data-skin="mid"] [data-page="shifts"] {--pc: var(--c-green);}
:root[data-skin="mid"] [data-page="stats"] {--pc: var(--c-violet);}
:root[data-skin="mid"] [data-page="costs"] {--pc: var(--c-orange);}
:root[data-skin="mid"] [data-page="shift"] {--pc: var(--c-blue);}
:root[data-skin="mid"] [data-page="me"], :root[data-skin="mid"] [data-page="profile"], :root[data-skin="mid"] [data-page="car"], :root[data-skin="mid"] [data-page="vehicle"] {--pc: var(--c-teal);}
:root[data-skin="mid"] .card, :root[data-skin="mid"] .stat-card, :root[data-skin="mid"] .tile, :root[data-skin="mid"] .big-link, :root[data-skin="mid"] .home-link, :root[data-skin="mid"] .cover, :root[data-skin="mid"] .reg-group, :root[data-skin="mid"] .msg, :root[data-skin="mid"] .drive, :root[data-skin="mid"] .more > summary, :root[data-skin="mid"] .kpi, :root[data-skin="mid"] .mini-kpis, :root[data-skin="mid"] .scope-bar, :root[data-skin="mid"] .adm-picker, :root[data-skin="mid"] .week-sum {box-shadow: var(--shadow) !important;}
:root[data-skin="mid"][data-theme="dark"] .card {box-shadow: none !important;}
:root[data-skin="mid"] .meter, :root[data-skin="mid"] .month-sum, :root[data-skin="mid"] .hero {border: 1.5px solid var(--y-line) !important; box-shadow: var(--shadow) !important;}
:root[data-skin="mid"] .meter, :root[data-skin="mid"] .hero {position: relative; overflow: hidden; padding-top: 24px !important;}
:root[data-skin="mid"] .meter::before, :root[data-skin="mid"] .hero::before {display: block !important; content: '' !important; position: absolute; left: 0 !important; right: 0 !important; top: 0 !important; height: 8px !important; border-radius: 0 !important; background: conic-gradient(#FFC21A 25%, #111 0 50%, #FFC21A 0 75%, #111 0) 0 0 / 16px 16px !important; opacity: 1 !important;}
:root[data-skin="mid"] .hero::after, :root[data-skin="mid"] .meter::after {display: none !important;}
:root[data-skin="mid"] .meter .road, :root[data-skin="mid"] .road {height: 26px !important; border-radius: 10px; background: var(--surface-2); margin-top: 14px;}
:root[data-skin="mid"] .road-fill {border-radius: 10px;}
:root[data-skin="mid"] .road-lane {display: block !important; background: repeating-linear-gradient(90deg, var(--faint) 0 10px, transparent 10px 20px) !important; opacity: .45; height: 2px;}
:root[data-skin="mid"] .road-car {display: grid !important; width: 26px !important; height: 26px !important; border-radius: 8px; background: var(--text); color: var(--accent); box-shadow: none;}
:root[data-skin="mid"] .road-flag {display: block !important; color: var(--muted);}
:root[data-skin="mid"] .meter-pct {background: var(--accent-soft); color: var(--accent-text);}
:root[data-skin="mid"] .meter-today {background: var(--accent-soft); border: 1px solid var(--y-line);}
:root[data-skin="mid"] .t-ic, :root[data-skin="mid"] .bl-ic, :root[data-skin="mid"] .ql-ic, :root[data-skin="mid"] .list-btn .l-ic, :root[data-skin="mid"] .info-row .l-ic, :root[data-skin="mid"] .msg-ic, :root[data-skin="mid"] .hl-ic, :root[data-skin="mid"] .empty-ic, :root[data-skin="mid"] .gs-ic, :root[data-skin="mid"] .kpi-ic, :root[data-skin="mid"] .mini-ic {background: color-mix(in srgb, var(--pc) 12%, var(--surface)) !important; color: var(--pc) !important; border-radius: 10px;}
:root[data-skin="mid"] .t-ic {width: 30px; height: 30px;}
:root[data-skin="mid"] .bl-ic {width: 40px !important; height: 40px !important; border-radius: 12px;}
:root[data-skin="mid"] .cost-ic, :root[data-skin="mid"] .rec-ic, :root[data-skin="mid"] .cal-ev-ic, :root[data-skin="mid"] .tip-ic, :root[data-skin="mid"] .att-ic, :root[data-skin="mid"] .hap-ic, :root[data-skin="mid"] .due-ic {background: color-mix(in srgb, var(--rc, var(--pc)) 12%, var(--surface)) !important; color: var(--rc, var(--pc)) !important; border-radius: 10px;}
:root[data-skin="mid"] .cost-ic, :root[data-skin="mid"] .rec-ic, :root[data-skin="mid"] .cal-ev-ic, :root[data-skin="mid"] .att-ic {width: 38px !important; height: 38px !important;}
:root[data-skin="mid"] .tile-top .ic-chip, :root[data-skin="mid"] .quick .q-ic, :root[data-skin="mid"] .exp-item .e-ic {background: color-mix(in srgb, var(--tc, var(--qc, var(--pc))) 13%, transparent); color: var(--tc, var(--qc, var(--pc))); width: 28px; height: 28px; border-radius: 9px;}
:root[data-skin="mid"] .quick .q-ic {width: 36px; height: 36px; border-radius: 11px;}
:root[data-skin="mid"] .stat-label .ic {color: var(--pc);}
:root[data-skin="mid"] .share-name .ic {color: var(--rc, var(--muted));}
:root[data-skin="mid"] .share-fill {background: var(--rc, var(--text));}
:root[data-skin="mid"] .list-btn.danger .l-ic {background: var(--neg-soft) !important; color: var(--neg) !important;}
:root[data-skin="mid"] .big-links > [data-k="stats"] .bl-ic, :root[data-skin="mid"] .big-links > [data-k="ideas"] .bl-ic {--pc: var(--c-violet);}
:root[data-skin="mid"] .big-links > [data-k="shifts"] .bl-ic, :root[data-skin="mid"] .big-links > [data-k="profile"] .bl-ic {--pc: var(--c-blue);}
:root[data-skin="mid"] .big-links > [data-k="costs"] .bl-ic, :root[data-skin="mid"] .big-links > [data-k="vehicle"] .bl-ic {--pc: var(--c-orange);}
:root[data-skin="mid"] .big-links > [data-k="excel"] .bl-ic, :root[data-skin="mid"] .big-links > [data-k="guide"] .bl-ic {--pc: var(--c-green);}
:root[data-skin="mid"] .big-links > [data-k="carset"] .bl-ic, :root[data-skin="mid"] .big-links > [data-k="write"] .bl-ic {--pc: var(--c-teal);}
:root[data-skin="mid"] .big-links > [data-k="tour"] .bl-ic, :root[data-skin="mid"] .big-links > [data-k="arrange"] .bl-ic {--pc: var(--c-amber);}
:root[data-skin="mid"] .home-link:nth-child(1) .hl-ic {--pc: var(--c-blue);}
:root[data-skin="mid"] .home-link:nth-child(2) .hl-ic {--pc: var(--c-violet); background: color-mix(in srgb, var(--c-violet) 12%, var(--surface)) !important; color: var(--c-violet) !important;}
:root[data-skin="mid"] .big-link:hover, :root[data-skin="mid"] .home-link:hover, :root[data-skin="mid"] .home-link.on {border-color: color-mix(in srgb, var(--pc) 45%, var(--line)) !important;}
:root[data-skin="mid"] .tile:active {border-color: var(--tc, var(--pc)) !important;}
:root[data-skin="mid"] .section-title {text-transform: none; letter-spacing: 0; font-size: .92rem; color: var(--muted); display: flex; align-items: center; gap: 8px;}
:root[data-skin="mid"] .section-title::before {display: block; content: ''; width: 4px; height: 15px; border-radius: 4px; background: var(--pc); flex: none;}
:root[data-skin="mid"] .nav a.on .nav-ic {background: var(--accent) !important; color: var(--accent-ink) !important; border-radius: 999px;}
:root[data-skin="mid"] .nav a.on .nav-ic::before {display: none;}
:root[data-skin="mid"] .nav-ic, :root[data-skin="mid"] .nav.nav-3 .nav-ic {width: 56px; height: 32px; border-radius: 999px;}
:root[data-skin="mid"] .seg-btn.on, :root[data-skin="mid"] .seg.on-page .seg-btn.on, :root[data-skin="mid"] .hero .seg-btn.on {background: var(--accent); color: var(--accent-ink); box-shadow: none !important;}
:root[data-skin="mid"] body.admin .seg-btn.on, :root[data-skin="mid"] body.admin .seg.on-page .seg-btn.on {background: var(--violet); color: #fff; box-shadow: none !important;}
:root[data-skin="mid"] .hero-chip {background: color-mix(in srgb, var(--pc) 10%, var(--surface)); color: var(--text); border: 1px solid color-mix(in srgb, var(--pc) 25%, transparent);}
:root[data-skin="mid"] .chip.good {background: var(--pos-soft);}
:root[data-skin="mid"] .chip.bad {background: var(--neg-soft);}
:root[data-skin="mid"] .trend.up {background: var(--pos-soft); color: var(--pos);}
:root[data-skin="mid"] .trend.down {background: var(--neg-soft); color: var(--neg);}
:root[data-skin="mid"] .mc-bar span {background: color-mix(in srgb, var(--c-violet) 45%, var(--surface-2));}
:root[data-skin="mid"] .mc-best {background: var(--accent-soft);}
:root[data-skin="mid"] .week-bar.pos, :root[data-skin="mid"] .bar.pos {background: var(--accent); fill: var(--accent);}
:root[data-skin="mid"] .wd-row .wd-fill, :root[data-skin="mid"] .hours span {background: color-mix(in srgb, var(--c-violet) 35%, var(--surface-2));}
:root[data-skin="mid"] .next-when {background: var(--v-soft);}
:root[data-skin="mid"] .next-when b {color: var(--violet);}
:root[data-skin="mid"] .day-badge {background: color-mix(in srgb, var(--c-green) 10%, var(--surface));}
:root[data-skin="mid"] .day-badge.night {background: var(--v-soft);}
:root[data-skin="mid"] .rem-days {background: var(--accent-soft);}
:root[data-skin="mid"] .np-field.active {border-color: var(--accent);}
:root[data-skin="mid"] .option.on, :root[data-skin="mid"] .chip-btn.on {border-color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, var(--surface));}
:root[data-skin="mid"] .input:focus {border-color: var(--accent); box-shadow: none;}
:root[data-skin="mid"] .avatar, :root[data-skin="mid"] .cover-avatar {background: var(--accent); color: var(--accent-ink);}
:root[data-skin="mid"] .cover-avatar {box-shadow: none !important; border-color: var(--accent) !important; border-width: 3px !important;}
:root[data-skin="mid"] .live, :root[data-skin="mid"] .drive {border: 1.5px solid color-mix(in srgb, var(--pos) 45%, transparent) !important;}
:root[data-skin="mid"] .live-dot {animation: pulse 2s infinite;}
:root[data-skin="mid"] .msg {border-left: 4px solid var(--violet) !important;}
:root[data-skin="mid"] .more > summary {border-left: 4px solid var(--pc) !important;}
:root[data-skin="mid"] .sub-back {color: var(--pc);}
:root[data-skin="mid"] .fuel-line .ic {color: var(--c-orange);}
:root[data-skin="mid"] .adm-side .brand-name b {color: var(--violet);}
:root[data-skin="mid"] .adm-nav a.on {background: var(--accent); color: var(--accent-ink);}
:root[data-skin="mid"] .adm-tab.on {background: var(--violet); color: #fff; box-shadow: none !important;}
:root[data-skin="mid"] .adm-tab.on .count {background: rgba(255, 255, 255, .22); color: #fff;}
:root[data-skin="mid"] .hap.hc {border-left: 4px solid transparent;}
:root[data-skin="mid"] .hap.hc.has {border-left-color: var(--hc);}
:root[data-skin="mid"] .hap.good .hap-ic {background: var(--pos-soft) !important;}
:root[data-skin="mid"] .hap.warn .hap-ic {background: var(--accent-soft) !important; color: var(--accent-text) !important;}
:root[data-skin="mid"] .hap.bad .hap-ic {background: var(--neg-soft) !important;}
:root[data-skin="mid"] .kpi-ic, :root[data-skin="mid"] .mini-ic {--pc: var(--kc, var(--violet));}
:root[data-skin="mid"] .attention {border-color: var(--y-line) !important;}
:root[data-skin="mid"] .goal-bar i {background: linear-gradient(90deg, var(--violet), #A78BFA);}
:root[data-skin="mid"] body.admin {--pc: var(--violet);}
:root[data-skin="mid"] .f-ic {background: color-mix(in srgb, var(--tc, var(--pc)) 13%, var(--surface)) !important; color: var(--tc, var(--pc)) !important;}
:root[data-skin="google"], :root[data-skin="chisto"], :root[data-skin="google"] [data-page], :root[data-skin="chisto"] [data-page] {--bg: #EAF0FA; --surface: #FFFFFF; --surface-2: #F0F4F9; --surface-3: #DDE3EA; --line: #E1E3E1; --text: #1F1F1F; --muted: #444746; --faint: #747775; --accent: #0B57D0; --accent-press: #0842A0; --accent-ink: #FFFFFF; --accent-soft: #D3E3FD; --accent-text: #0B57D0; --g-cont: #FFFFFF; --g-cont-hi: #F1F5FC; --g-in: #F1F5FC; --g-sec: #D3E3FD; --g-on-sec: #041E49; --g-outline: #747775; --g-outline-v: #C4C7C5; --pos: #146C2E; --pos-soft: #C4EED0; --neg: #B3261E; --neg-soft: #F9DEDC; --pc: #0B57D0; --c-violet: #8430CE; --c-green: #188038; --c-blue: #1A73E8; --c-amber: #E37400; --c-orange: #E8710A; --c-red: #D93025; --c-teal: #007B83; --c-sky: #129EAF; --c-pink: #D01884; --c-slate: #5F6368; --g-hero: #0B57D0; --g-hero-ink: #FFFFFF; --g-go: #188038; --g-go-ink: #FFFFFF; --g-warn: #FEEFC3; --g-on-warn: #4A3200; --g-yellow: #FBBC04; --violet: #0B57D0; --v-soft: #D3E3FD; --v-line: #E1E3E1; --v-strong: #C4C7C5; --v-glow: transparent; --r-xl: 28px; --r-lg: 24px; --r-md: 16px; --r-sm: 12px;}
:root[data-skin="google"][data-theme="dark"], :root[data-skin="chisto"][data-theme="dark"], :root[data-skin="google"][data-theme="dark"] [data-page], :root[data-skin="chisto"][data-theme="dark"] [data-page] {--bg: #131314; --surface: #131314; --surface-2: #1E1F20; --surface-3: #333537; --line: #444746; --text: #E3E3E3; --muted: #C4C7C5; --faint: #8E918F; --accent: #A8C7FA; --accent-press: #7FCFFF; --accent-ink: #062E6F; --accent-soft: #0842A0; --accent-text: #A8C7FA; --g-cont: #1E1F20; --g-cont-hi: #282A2C; --g-in: #282A2C; --g-sec: #004A77; --g-on-sec: #C2E7FF; --g-outline: #8E918F; --g-outline-v: #444746; --pos: #6DD58C; --pos-soft: #0F5223; --neg: #F2B8B5; --neg-soft: #601410; --pc: #A8C7FA; --c-violet: #D7AEFB; --c-blue: #8AB4F8; --c-green: #81C995; --c-amber: #FDD663; --c-orange: #FCAD70; --c-red: #F28B82; --c-teal: #4ECDE6; --c-sky: #78D9EC; --c-pink: #FF8BCB; --c-slate: #BDC1C6; --g-hero: #0842A0; --g-hero-ink: #FFFFFF; --g-go: #6DD58C; --g-go-ink: #0A3818; --g-warn: #4A3200; --g-on-warn: #FFE08A; --g-yellow: #FDD663; --violet: #A8C7FA; --v-soft: #0842A0; --v-line: #444746; --v-strong: #444746;}
@media (prefers-color-scheme: dark) {
:root[data-skin="google"]:not([data-theme="light"]):not([data-theme="sun"]), :root[data-skin="chisto"]:not([data-theme="light"]):not([data-theme="sun"]), :root[data-skin="google"]:not([data-theme="light"]):not([data-theme="sun"]) [data-page], :root[data-skin="chisto"]:not([data-theme="light"]):not([data-theme="sun"]) [data-page] {--bg: #131314; --surface: #131314; --surface-2: #1E1F20; --surface-3: #333537; --line: #444746; --text: #E3E3E3; --muted: #C4C7C5; --faint: #8E918F; --accent: #A8C7FA; --accent-press: #7FCFFF; --accent-ink: #062E6F; --accent-soft: #0842A0; --accent-text: #A8C7FA; --g-cont: #1E1F20; --g-cont-hi: #282A2C; --g-in: #282A2C; --g-sec: #004A77; --g-on-sec: #C2E7FF; --g-outline: #8E918F; --g-outline-v: #444746; --pos: #6DD58C; --pos-soft: #0F5223; --neg: #F2B8B5; --neg-soft: #601410; --pc: #A8C7FA; --c-violet: #D7AEFB; --c-blue: #8AB4F8; --c-green: #81C995; --c-amber: #FDD663; --c-orange: #FCAD70; --c-red: #F28B82; --c-teal: #4ECDE6; --c-sky: #78D9EC; --c-pink: #FF8BCB; --c-slate: #BDC1C6; --g-hero: #0842A0; --g-hero-ink: #FFFFFF; --g-go: #6DD58C; --g-go-ink: #0A3818; --g-warn: #4A3200; --g-on-warn: #FFE08A; --g-yellow: #FDD663; --violet: #A8C7FA; --v-soft: #0842A0; --v-line: #444746; --v-strong: #444746;}
}
:root[data-skin="google"] body, :root[data-skin="chisto"] body {letter-spacing: 0;}
:root[data-skin="google"] h1, :root[data-skin="chisto"] h1, :root[data-skin="google"] .page-title h1, :root[data-skin="chisto"] .page-title h1, :root[data-skin="google"] .hero h1, :root[data-skin="chisto"] .hero h1, :root[data-skin="google"] .adm-head h1, :root[data-skin="chisto"] .adm-head h1 {font-weight: 400 !important; letter-spacing: 0;}
:root[data-skin="google"] .page-title h1, :root[data-skin="chisto"] .page-title h1 {font-size: 1.75rem;}
:root[data-skin="google"] .hello h1, :root[data-skin="chisto"] .hello h1 {font-weight: 400; font-size: 1.4rem;}
:root[data-skin="google"] .card-title h2, :root[data-skin="chisto"] .card-title h2, :root[data-skin="google"] .card-title h3, :root[data-skin="chisto"] .card-title h3, :root[data-skin="google"] .f-row .grow b, :root[data-skin="chisto"] .f-row .grow b, :root[data-skin="google"] .big-link b, :root[data-skin="chisto"] .big-link b, :root[data-skin="google"] .setting-title, :root[data-skin="chisto"] .setting-title, :root[data-skin="google"] .list-btn, :root[data-skin="chisto"] .list-btn {font-weight: 500 !important;}
:root[data-skin="google"] .meter-value, :root[data-skin="chisto"] .meter-value, :root[data-skin="google"] .hero-num, :root[data-skin="chisto"] .hero-num, :root[data-skin="google"] .ms-total b, :root[data-skin="chisto"] .ms-total b, :root[data-skin="google"] .result-net, :root[data-skin="chisto"] .result-net, :root[data-skin="google"] .kpi-value, :root[data-skin="chisto"] .kpi-value, :root[data-skin="google"] .big-net, :root[data-skin="chisto"] .big-net, :root[data-skin="google"] .num, :root[data-skin="chisto"] .num, :root[data-skin="google"] .stat-value, :root[data-skin="chisto"] .stat-value, :root[data-skin="google"] .f-val, :root[data-skin="chisto"] .f-val, :root[data-skin="google"] .tile-val, :root[data-skin="chisto"] .tile-val, :root[data-skin="google"] .np-val, :root[data-skin="chisto"] .np-val {font-weight: 500 !important; letter-spacing: -.01em;}
:root[data-skin="google"] .meter-value, :root[data-skin="chisto"] .meter-value, :root[data-skin="google"] .hero-num, :root[data-skin="chisto"] .hero-num {font-size: clamp(2.4rem, 12vw, 3.2rem);}
:root[data-skin="google"] .section-title, :root[data-skin="chisto"] .section-title {text-transform: none !important; letter-spacing: 0 !important; font-size: .95rem !important; font-weight: 500 !important; color: var(--text) !important; margin: 24px 4px 8px !important;}
:root[data-skin="google"] .section-title::before, :root[data-skin="chisto"] .section-title::before {display: none !important;}
:root[data-skin="google"] .muted, :root[data-skin="chisto"] .muted, :root[data-skin="google"] .hero-sub, :root[data-skin="chisto"] .hero-sub, :root[data-skin="google"] .meter-label, :root[data-skin="chisto"] .meter-label, :root[data-skin="google"] .stat-label, :root[data-skin="chisto"] .stat-label, :root[data-skin="google"] .f-row small, :root[data-skin="chisto"] .f-row small, :root[data-skin="google"] .big-link .grow > span, :root[data-skin="chisto"] .big-link .grow > span {color: var(--muted);}
:root[data-skin="google"] .card, :root[data-skin="chisto"] .card, :root[data-skin="google"] .stat-card, :root[data-skin="chisto"] .stat-card, :root[data-skin="google"] .tile, :root[data-skin="chisto"] .tile, :root[data-skin="google"] .big-link, :root[data-skin="chisto"] .big-link, :root[data-skin="google"] .home-link, :root[data-skin="chisto"] .home-link, :root[data-skin="google"] .cover, :root[data-skin="chisto"] .cover, :root[data-skin="google"] .ql, :root[data-skin="chisto"] .ql, :root[data-skin="google"] .reg-group, :root[data-skin="chisto"] .reg-group, :root[data-skin="google"] .first-day, :root[data-skin="chisto"] .first-day, :root[data-skin="google"] .msg, :root[data-skin="chisto"] .msg, :root[data-skin="google"] .install-bar, :root[data-skin="chisto"] .install-bar, :root[data-skin="google"] .more > summary, :root[data-skin="chisto"] .more > summary, :root[data-skin="google"] .invite-card, :root[data-skin="chisto"] .invite-card, :root[data-skin="google"] .kpi, :root[data-skin="chisto"] .kpi, :root[data-skin="google"] .mini-kpis, :root[data-skin="chisto"] .mini-kpis, :root[data-skin="google"] .scope-bar, :root[data-skin="chisto"] .scope-bar, :root[data-skin="google"] .adm-picker, :root[data-skin="chisto"] .adm-picker, :root[data-skin="google"] .week-sum, :root[data-skin="chisto"] .week-sum, :root[data-skin="google"] .month-sum, :root[data-skin="chisto"] .month-sum, :root[data-skin="google"] .hero, :root[data-skin="chisto"] .hero, :root[data-skin="google"] .meter, :root[data-skin="chisto"] .meter, :root[data-skin="google"] .drive, :root[data-skin="chisto"] .drive, :root[data-skin="google"] .live, :root[data-skin="chisto"] .live, :root[data-skin="google"] .yday, :root[data-skin="chisto"] .yday, :root[data-skin="google"] .search-link, :root[data-skin="chisto"] .search-link, :root[data-skin="google"] .first-tip, :root[data-skin="chisto"] .first-tip {background: var(--g-cont) !important; border: 0 !important; box-shadow: none !important;}
:root[data-skin="google"] .card, :root[data-skin="chisto"] .card, :root[data-skin="google"] .hero, :root[data-skin="chisto"] .hero, :root[data-skin="google"] .meter, :root[data-skin="chisto"] .meter, :root[data-skin="google"] .month-sum, :root[data-skin="chisto"] .month-sum, :root[data-skin="google"] .drive, :root[data-skin="chisto"] .drive, :root[data-skin="google"] .cover, :root[data-skin="chisto"] .cover {border-radius: var(--r-xl) !important;}
:root[data-skin="google"] .big-link, :root[data-skin="chisto"] .big-link, :root[data-skin="google"] .home-link, :root[data-skin="chisto"] .home-link, :root[data-skin="google"] .more > summary, :root[data-skin="chisto"] .more > summary, :root[data-skin="google"] .yday, :root[data-skin="chisto"] .yday, :root[data-skin="google"] .first-tip, :root[data-skin="chisto"] .first-tip, :root[data-skin="google"] .tile, :root[data-skin="chisto"] .tile, :root[data-skin="google"] .stat-card, :root[data-skin="chisto"] .stat-card {border-radius: var(--r-lg) !important;}
:root[data-skin="google"] .hero, :root[data-skin="chisto"] .hero, :root[data-skin="google"] .meter, :root[data-skin="chisto"] .meter {padding: 20px !important;}
:root[data-skin="google"] .meter::before, :root[data-skin="chisto"] .meter::before, :root[data-skin="google"] .hero::before, :root[data-skin="chisto"] .hero::before, :root[data-skin="google"] .meter::after, :root[data-skin="chisto"] .meter::after, :root[data-skin="google"] .hero::after, :root[data-skin="chisto"] .hero::after {display: none !important;}
:root[data-skin="google"] .card .shift-row, :root[data-skin="chisto"] .card .shift-row, :root[data-skin="google"] .card .cost-row, :root[data-skin="chisto"] .card .cost-row, :root[data-skin="google"] .card .res-row, :root[data-skin="chisto"] .card .res-row {border-color: var(--g-outline-v) !important;}
:root[data-skin="google"] .exp-item, :root[data-skin="chisto"] .exp-item, :root[data-skin="google"] .time-in, :root[data-skin="chisto"] .time-in, :root[data-skin="google"] .np-field, :root[data-skin="chisto"] .np-field, :root[data-skin="google"] .stat, :root[data-skin="chisto"] .stat, :root[data-skin="google"] .result-cell, :root[data-skin="chisto"] .result-cell, :root[data-skin="google"] .result-goal, :root[data-skin="chisto"] .result-goal, :root[data-skin="google"] .ci-grid > div, :root[data-skin="chisto"] .ci-grid > div, :root[data-skin="google"] .fuel-line, :root[data-skin="chisto"] .fuel-line, :root[data-skin="google"] .drive-need, :root[data-skin="chisto"] .drive-need, :root[data-skin="google"] .info-box, :root[data-skin="chisto"] .info-box, :root[data-skin="google"] .next-empty, :root[data-skin="chisto"] .next-empty, :root[data-skin="google"] .meter-cell, :root[data-skin="chisto"] .meter-cell, :root[data-skin="google"] .hap, :root[data-skin="chisto"] .hap, :root[data-skin="google"] .step-row, :root[data-skin="chisto"] .step-row {background: var(--g-in) !important;}
:root[data-skin="google"] .yday, :root[data-skin="chisto"] .yday {background: var(--g-sec) !important; color: var(--g-on-sec);}
:root[data-skin="google"] .yday .grow small, :root[data-skin="chisto"] .yday .grow small {color: var(--g-on-sec); opacity: .8;}
:root[data-skin="google"] .first-tip, :root[data-skin="chisto"] .first-tip {background: var(--g-sec) !important; color: var(--g-on-sec);}
:root[data-skin="google"] .first-tip .ft-ic, :root[data-skin="chisto"] .first-tip .ft-ic {color: var(--g-on-sec);}
:root[data-skin="google"] .t-ic, :root[data-skin="chisto"] .t-ic, :root[data-skin="google"] .bl-ic, :root[data-skin="chisto"] .bl-ic, :root[data-skin="google"] .ql-ic, :root[data-skin="chisto"] .ql-ic, :root[data-skin="google"] .cost-ic, :root[data-skin="chisto"] .cost-ic, :root[data-skin="google"] .mini-ic, :root[data-skin="chisto"] .mini-ic, :root[data-skin="google"] .kpi-ic, :root[data-skin="chisto"] .kpi-ic, :root[data-skin="google"] .list-btn .l-ic, :root[data-skin="chisto"] .list-btn .l-ic, :root[data-skin="google"] .info-row .l-ic, :root[data-skin="chisto"] .info-row .l-ic, :root[data-skin="google"] .tip-ic, :root[data-skin="chisto"] .tip-ic, :root[data-skin="google"] .msg-ic, :root[data-skin="chisto"] .msg-ic, :root[data-skin="google"] .hl-ic, :root[data-skin="chisto"] .hl-ic, :root[data-skin="google"] .empty-ic, :root[data-skin="chisto"] .empty-ic, :root[data-skin="google"] .rec-ic, :root[data-skin="chisto"] .rec-ic, :root[data-skin="google"] .cal-ev-ic, :root[data-skin="chisto"] .cal-ev-ic, :root[data-skin="google"] .gs-ic, :root[data-skin="chisto"] .gs-ic, :root[data-skin="google"] .att-ic, :root[data-skin="chisto"] .att-ic, :root[data-skin="google"] .hap-ic, :root[data-skin="chisto"] .hap-ic, :root[data-skin="google"] .due-ic, :root[data-skin="chisto"] .due-ic, :root[data-skin="google"] .f-ic, :root[data-skin="chisto"] .f-ic {background: transparent !important; color: var(--muted) !important; border-radius: 50% !important;}
:root[data-skin="google"] .f-ic, :root[data-skin="chisto"] .f-ic {width: 40px !important; height: 40px !important;}
:root[data-skin="google"] .btn, :root[data-skin="chisto"] .btn {border-radius: 999px !important; font-weight: 500 !important; letter-spacing: .01em;}
:root[data-skin="google"] .btn-primary, :root[data-skin="chisto"] .btn-primary, :root[data-skin="google"] .btn-page, :root[data-skin="chisto"] .btn-page {background: var(--accent) !important; color: var(--accent-ink) !important;}
:root[data-skin="google"] .btn-ghost, :root[data-skin="chisto"] .btn-ghost, :root[data-skin="google"] .btn-outline, :root[data-skin="chisto"] .btn-outline {background: transparent !important; border: 1px solid var(--g-outline) !important; color: var(--accent-text) !important;}
:root[data-skin="google"] .btn-dark, :root[data-skin="chisto"] .btn-dark {background: var(--g-sec) !important; color: var(--g-on-sec) !important;}
:root[data-skin="google"] .icon-btn, :root[data-skin="chisto"] .icon-btn {border-radius: 50% !important; background: transparent !important; border: 0 !important; color: var(--muted);}
:root[data-skin="google"] .chip, :root[data-skin="chisto"] .chip, :root[data-skin="google"] .chip-btn, :root[data-skin="chisto"] .chip-btn {border-radius: 8px !important; background: transparent !important; border: 1px solid var(--g-outline-v) !important; color: var(--muted) !important;}
:root[data-skin="google"] .chip.good, :root[data-skin="chisto"] .chip.good {color: var(--pos) !important;}
:root[data-skin="google"] .chip.bad, :root[data-skin="chisto"] .chip.bad {color: var(--neg) !important;}
:root[data-skin="google"] .f-btn, :root[data-skin="chisto"] .f-btn {border-radius: 999px !important; border: 0 !important; background: var(--g-sec) !important; color: var(--g-on-sec) !important; font-weight: 500 !important;}
:root[data-skin="google"] .f-btn.has, :root[data-skin="chisto"] .f-btn.has {background: transparent !important; border: 1px solid var(--g-outline-v) !important; color: var(--muted) !important;}
:root[data-skin="google"] .goal-edit, :root[data-skin="chisto"] .goal-edit {color: var(--accent-text); text-decoration-color: var(--accent-text);}
:root[data-skin="google"] .seg, :root[data-skin="chisto"] .seg {background: transparent !important; border: 1px solid var(--g-outline) !important; border-radius: 999px !important; padding: 0 !important; gap: 0 !important; overflow: hidden;}
:root[data-skin="google"] .seg-btn, :root[data-skin="chisto"] .seg-btn {border-radius: 0 !important; color: var(--text) !important; font-weight: 500; border-left: 1px solid var(--g-outline) !important; min-height: 40px;}
:root[data-skin="google"] .seg-btn:first-child, :root[data-skin="chisto"] .seg-btn:first-child {border-left: 0 !important;}
:root[data-skin="google"] .seg-btn.on, :root[data-skin="chisto"] .seg-btn.on, :root[data-skin="google"] .seg.on-page .seg-btn.on, :root[data-skin="chisto"] .seg.on-page .seg-btn.on, :root[data-skin="google"] .hero .seg-btn.on, :root[data-skin="chisto"] .hero .seg-btn.on, :root[data-skin="google"] body.admin .seg-btn.on, :root[data-skin="chisto"] body.admin .seg-btn.on, :root[data-skin="google"] body.admin .seg.on-page .seg-btn.on, :root[data-skin="chisto"] body.admin .seg.on-page .seg-btn.on {background: var(--g-sec) !important; color: var(--g-on-sec) !important; box-shadow: none !important;}
:root[data-skin="google"] .seg-btn.on::before, :root[data-skin="chisto"] .seg-btn.on::before {content: '✓ ';}
:root[data-skin="google"] .seg.seg-outline, :root[data-skin="chisto"] .seg.seg-outline {border: 0 !important; gap: 8px !important;}
:root[data-skin="google"] .seg.seg-outline .seg-btn, :root[data-skin="chisto"] .seg.seg-outline .seg-btn {border: 1px solid var(--g-outline-v) !important; border-radius: 8px !important;}
:root[data-skin="google"] .seg.seg-outline .seg-btn.on, :root[data-skin="chisto"] .seg.seg-outline .seg-btn.on {background: var(--g-sec) !important; border-color: transparent !important;}
:root[data-skin="google"] .input, :root[data-skin="chisto"] .input, :root[data-skin="google"] select.input, :root[data-skin="chisto"] select.input, :root[data-skin="google"] .pk-field.input, :root[data-skin="chisto"] .pk-field.input {border: 1px solid var(--g-outline) !important; border-radius: 4px !important; background: transparent !important;}
:root[data-skin="google"] .input:focus, :root[data-skin="chisto"] .input:focus {border: 2px solid var(--accent) !important; box-shadow: none !important;}
:root[data-skin="google"] .search-bar, :root[data-skin="chisto"] .search-bar {border-radius: 999px !important; background: var(--g-cont-hi) !important; border: 0 !important; padding: 2px 4px 2px 16px !important;}
:root[data-skin="google"] .search-bar .search-mic, :root[data-skin="chisto"] .search-bar .search-mic {background: transparent !important; color: var(--muted) !important; border-radius: 50% !important;}
:root[data-skin="google"] .search-link, :root[data-skin="chisto"] .search-link {border-radius: 999px !important; background: var(--g-cont-hi) !important;}
:root[data-skin="google"] .nav, :root[data-skin="chisto"] .nav {background: var(--g-cont) !important; border-top: 0 !important;}
:root[data-skin="google"] .nav a, :root[data-skin="chisto"] .nav a {color: var(--muted) !important; font-weight: 500 !important; font-size: .78rem !important;}
:root[data-skin="google"] .nav a.on, :root[data-skin="chisto"] .nav a.on {color: var(--text) !important; font-weight: 700 !important;}
:root[data-skin="google"] .nav-ic, :root[data-skin="chisto"] .nav-ic, :root[data-skin="google"] .nav.nav-3 .nav-ic, :root[data-skin="chisto"] .nav.nav-3 .nav-ic {width: 64px !important; height: 32px !important; border-radius: 999px !important;}
:root[data-skin="google"] .nav a.on .nav-ic, :root[data-skin="chisto"] .nav a.on .nav-ic {background: var(--g-sec) !important; color: var(--g-on-sec) !important;}
:root[data-skin="google"] .nav a.on .nav-ic::before, :root[data-skin="chisto"] .nav a.on .nav-ic::before {display: none !important;}
:root[data-skin="google"] .meter-label, :root[data-skin="chisto"] .meter-label, :root[data-skin="google"] .meter-goal, :root[data-skin="chisto"] .meter-goal {color: var(--muted) !important;}
:root[data-skin="google"] .meter-value, :root[data-skin="chisto"] .meter-value {color: var(--text) !important;}
:root[data-skin="google"] .meter-pct, :root[data-skin="chisto"] .meter-pct {background: var(--g-sec) !important; color: var(--g-on-sec) !important;}
:root[data-skin="google"] .meter .road, :root[data-skin="chisto"] .meter .road, :root[data-skin="google"] .road, :root[data-skin="chisto"] .road {height: 8px !important; border-radius: 999px !important; background: var(--g-sec) !important;}
:root[data-skin="google"] .road-fill, :root[data-skin="chisto"] .road-fill {background: var(--accent) !important;}
:root[data-skin="google"] .road-lane, :root[data-skin="chisto"] .road-lane, :root[data-skin="google"] .road-car, :root[data-skin="chisto"] .road-car, :root[data-skin="google"] .road-flag, :root[data-skin="chisto"] .road-flag {display: none !important;}
:root[data-skin="google"] .meter-today, :root[data-skin="chisto"] .meter-today {background: var(--g-in) !important; border: 0 !important; border-radius: 16px;}
:root[data-skin="google"] .avatar, :root[data-skin="chisto"] .avatar, :root[data-skin="google"] .cover-avatar, :root[data-skin="chisto"] .cover-avatar {background: var(--accent) !important; color: var(--accent-ink) !important; border-radius: 50% !important;}
:root[data-skin="google"] .shift-cta, :root[data-skin="chisto"] .shift-cta {position: fixed !important; z-index: 30; right: max(16px, calc(50% - 264px)); bottom: calc(var(--nav-h) + env(safe-area-inset-bottom) + 18px); width: auto !important; min-height: 56px !important; padding: 0 22px !important; border-radius: 16px !important; background: var(--g-sec) !important; color: var(--g-on-sec) !important; font-size: 1rem !important; box-shadow: 0 1px 3px rgba(0, 0, 0, .3), 0 4px 8px 3px rgba(0, 0, 0, .15) !important;}
:root[data-skin="google"] .home-shift, :root[data-skin="chisto"] .home-shift {padding-bottom: 4px;}
:root[data-skin="google"] .g-search, :root[data-skin="chisto"] .g-search {display: none;}
:root[data-skin="google"] .g-search, :root[data-skin="chisto"] .g-search {display: flex; align-items: center; gap: 12px; height: 52px; padding: 0 6px 0 16px; border-radius: 999px; background: var(--g-cont-hi); color: var(--muted); text-decoration: none; margin: 0 0 16px;}
:root[data-skin="google"] .g-search span, :root[data-skin="chisto"] .g-search span {flex: 1; font-size: 1rem;}
:root[data-skin="google"] .g-search .avatar, :root[data-skin="chisto"] .g-search .avatar {width: 34px !important; height: 34px !important; font-size: .8rem;}
:root[data-skin="google"] .hello .row.gap, :root[data-skin="chisto"] .hello .row.gap {display: none !important;}
:root[data-skin="google"] .hello h1, :root[data-skin="chisto"] .hello h1 {font-size: 1.6rem !important;}
:root[data-skin="google"] .drive-voice, :root[data-skin="chisto"] .drive-voice {background: var(--accent) !important; color: var(--accent-ink) !important;}
:root[data-skin="google"] .drive .drive-list, :root[data-skin="chisto"] .drive .drive-list {background: var(--g-in) !important; border: 0 !important; border-radius: 20px !important;}
:root[data-skin="google"] .drive-end, :root[data-skin="chisto"] .drive-end {background: var(--g-sec) !important; color: var(--g-on-sec) !important;}
:root[data-skin="google"] .drive-label, :root[data-skin="chisto"] .drive-label {text-transform: none !important; letter-spacing: 0 !important; font-size: .9rem !important; font-weight: 500 !important; color: var(--text) !important;}
:root[data-skin="google"] .voice-btn, :root[data-skin="chisto"] .voice-btn {border-color: var(--g-outline) !important; color: var(--accent-text) !important;}
:root[data-skin="google"] .save-bar, :root[data-skin="chisto"] .save-bar {background: var(--g-cont) !important; border-top: 0 !important;}
:root[data-skin="google"] .f-card .f-list, :root[data-skin="chisto"] .f-card .f-list {background: var(--g-in); border-radius: 20px; padding: 0 12px;}
:root[data-skin="google"] .f-row, :root[data-skin="chisto"] .f-row {border-color: var(--g-outline-v) !important;}
:root[data-skin="google"] .sheet, :root[data-skin="chisto"] .sheet {border-radius: 28px 28px 0 0 !important; background: var(--g-cont) !important;}
:root[data-skin="google"] .np-key, :root[data-skin="chisto"] .np-key {border-radius: 999px !important; background: var(--g-in) !important; font-weight: 400 !important;}
:root[data-skin="google"] .np-field, :root[data-skin="chisto"] .np-field {border-radius: 4px !important; border: 1px solid var(--g-outline) !important;}
:root[data-skin="google"] .np-field.active, :root[data-skin="chisto"] .np-field.active {border: 2px solid var(--accent) !important;}
:root[data-skin="google"] .toast, :root[data-skin="chisto"] .toast {border-radius: 4px !important; background: #303030 !important; color: #F2F2F2 !important;}
:root[data-skin="google"] .pk, :root[data-skin="chisto"] .pk {background: var(--g-cont) !important;}
:root[data-skin="google"] .pk .pk-tbox.on, :root[data-skin="chisto"] .pk .pk-tbox.on, :root[data-skin="google"] .pk .pk-day.on, :root[data-skin="chisto"] .pk .pk-day.on, :root[data-skin="google"] .pk .pk-mon.on, :root[data-skin="chisto"] .pk .pk-mon.on, :root[data-skin="google"] .pk-knob, :root[data-skin="chisto"] .pk-knob, :root[data-skin="google"] .pk-hand, :root[data-skin="chisto"] .pk-hand, :root[data-skin="google"] .pk-center, :root[data-skin="chisto"] .pk-center {background: var(--accent) !important; color: var(--accent-ink) !important;}
:root[data-skin="google"] .pk-num.on, :root[data-skin="chisto"] .pk-num.on {color: var(--accent-ink) !important;}
:root[data-skin="google"] .ms-total b, :root[data-skin="chisto"] .ms-total b, :root[data-skin="google"] .ms-total b:not(.neg), :root[data-skin="chisto"] .ms-total b:not(.neg) {color: var(--text) !important;}
:root[data-skin="google"] .bar.pos, :root[data-skin="chisto"] .bar.pos, :root[data-skin="google"] .week-bar.pos, :root[data-skin="chisto"] .week-bar.pos {fill: var(--accent) !important; background: var(--accent) !important;}
:root[data-skin="google"] .mc-bar span, :root[data-skin="chisto"] .mc-bar span, :root[data-skin="google"] .mc-bar span.best, :root[data-skin="chisto"] .mc-bar span.best {background: var(--accent) !important; opacity: .35;}
:root[data-skin="google"] .mc-bar span.best, :root[data-skin="chisto"] .mc-bar span.best {opacity: 1;}
:root[data-skin="google"] .mc-best, :root[data-skin="chisto"] .mc-best {background: var(--g-sec) !important; color: var(--g-on-sec) !important;}
:root[data-skin="google"] .mc-pct.up, :root[data-skin="chisto"] .mc-pct.up {color: var(--pos) !important;}
:root[data-skin="google"] .hero-chip, :root[data-skin="chisto"] .hero-chip {background: var(--g-in) !important; border: 0 !important; color: var(--muted) !important; border-radius: 8px !important;}
:root[data-skin="google"] .hero-btn, :root[data-skin="chisto"] .hero-btn {background: transparent !important; border: 0 !important; color: var(--muted) !important; border-radius: 50% !important;}
:root[data-skin="google"] .adm-side, :root[data-skin="chisto"] .adm-side {background: var(--bg) !important; border: 0 !important;}
:root[data-skin="google"] .adm-nav a, :root[data-skin="chisto"] .adm-nav a {border-radius: 999px !important; color: var(--muted) !important; font-weight: 500 !important;}
:root[data-skin="google"] .adm-nav a.on, :root[data-skin="chisto"] .adm-nav a.on {background: var(--g-sec) !important; color: var(--g-on-sec) !important; font-weight: 700 !important;}
:root[data-skin="google"] .adm-tabs, :root[data-skin="chisto"] .adm-tabs {background: transparent !important; border: 0 !important; border-bottom: 1px solid var(--g-outline-v) !important; border-radius: 0 !important; padding: 0 !important; gap: 0 !important;}
:root[data-skin="google"] .adm-tab, :root[data-skin="chisto"] .adm-tab {border-radius: 0 !important; border-bottom: 3px solid transparent; padding: 12px 16px !important;}
:root[data-skin="google"] .adm-tab.on, :root[data-skin="chisto"] .adm-tab.on {background: transparent !important; color: var(--accent-text) !important; border-bottom-color: var(--accent); box-shadow: none !important;}
:root[data-skin="google"] .adm-tab.on .count, :root[data-skin="chisto"] .adm-tab.on .count {background: var(--g-sec) !important; color: var(--g-on-sec) !important;}
:root[data-skin="google"] .adm-main, :root[data-skin="chisto"] .adm-main {background: var(--bg);}
:root[data-skin="google"] .gsearch .input, :root[data-skin="chisto"] .gsearch .input {border-radius: 999px !important; background: var(--g-cont-hi) !important; border: 0 !important;}
:root[data-skin="google"] .icon-btn.top-btn, :root[data-skin="chisto"] .icon-btn.top-btn {background: transparent !important;}
:root[data-skin="google"] [data-page="home"].screen, :root[data-skin="chisto"] [data-page="home"].screen {padding-bottom: calc(var(--nav-h) + env(safe-area-inset-bottom) + 96px) !important;}
:root[data-skin="google"] .g-search span:not(.avatar), :root[data-skin="chisto"] .g-search span:not(.avatar) {white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0;}
:root[data-skin="google"] .g-search .avatar, :root[data-skin="chisto"] .g-search .avatar {flex: none; overflow: hidden; padding: 0; display: grid; place-items: center;}
:root[data-skin="google"] .g-search .avatar img, :root[data-skin="chisto"] .g-search .avatar img {width: 100%; height: 100%; object-fit: cover; display: block;}
:root[data-skin="google"] .search-bar .search-in, :root[data-skin="chisto"] .search-bar .search-in, :root[data-skin="google"] .search-bar .search-in:focus, :root[data-skin="chisto"] .search-bar .search-in:focus {border: 0 !important; background: transparent !important;}
:root[data-skin="google"] [data-page], :root[data-skin="chisto"] [data-page] {--pc: var(--c-blue);}
:root[data-skin="google"] [data-page="money"], :root[data-skin="chisto"] [data-page="money"], :root[data-skin="google"] [data-page="shifts"], :root[data-skin="chisto"] [data-page="shifts"] {--pc: var(--c-green);}
:root[data-skin="google"] [data-page="stats"], :root[data-skin="chisto"] [data-page="stats"] {--pc: var(--c-violet);}
:root[data-skin="google"] [data-page="costs"], :root[data-skin="chisto"] [data-page="costs"] {--pc: var(--c-orange);}
:root[data-skin="google"] .t-ic, :root[data-skin="chisto"] .t-ic, :root[data-skin="google"] .bl-ic, :root[data-skin="chisto"] .bl-ic, :root[data-skin="google"] .ql-ic, :root[data-skin="chisto"] .ql-ic, :root[data-skin="google"] .cost-ic, :root[data-skin="chisto"] .cost-ic, :root[data-skin="google"] .mini-ic, :root[data-skin="chisto"] .mini-ic, :root[data-skin="google"] .kpi-ic, :root[data-skin="chisto"] .kpi-ic, :root[data-skin="google"] .list-btn .l-ic, :root[data-skin="chisto"] .list-btn .l-ic, :root[data-skin="google"] .info-row .l-ic, :root[data-skin="chisto"] .info-row .l-ic, :root[data-skin="google"] .msg-ic, :root[data-skin="chisto"] .msg-ic, :root[data-skin="google"] .hl-ic, :root[data-skin="chisto"] .hl-ic, :root[data-skin="google"] .gs-ic, :root[data-skin="chisto"] .gs-ic, :root[data-skin="google"] .rec-ic, :root[data-skin="chisto"] .rec-ic, :root[data-skin="google"] .cal-ev-ic, :root[data-skin="chisto"] .cal-ev-ic, :root[data-skin="google"] .att-ic, :root[data-skin="chisto"] .att-ic, :root[data-skin="google"] .due-ic, :root[data-skin="chisto"] .due-ic, :root[data-skin="google"] .f-ic, :root[data-skin="chisto"] .f-ic {background: color-mix(in srgb, var(--tc, var(--pc)) 15%, transparent) !important; color: var(--tc, var(--pc)) !important;}
:root[data-skin="google"] .t-ic, :root[data-skin="chisto"] .t-ic {width: 32px; height: 32px; display: inline-grid; place-items: center; margin-right: 4px;}
:root[data-skin="google"] .bl-ic, :root[data-skin="chisto"] .bl-ic {width: 42px !important; height: 42px !important;}
:root[data-skin="google"] .big-links > [data-k="stats"] .bl-ic, :root[data-skin="chisto"] .big-links > [data-k="stats"] .bl-ic, :root[data-skin="google"] .big-links > [data-k="ideas"] .bl-ic, :root[data-skin="chisto"] .big-links > [data-k="ideas"] .bl-ic {--pc: var(--c-violet);}
:root[data-skin="google"] .big-links > [data-k="shifts"] .bl-ic, :root[data-skin="chisto"] .big-links > [data-k="shifts"] .bl-ic, :root[data-skin="google"] .big-links > [data-k="profile"] .bl-ic, :root[data-skin="chisto"] .big-links > [data-k="profile"] .bl-ic {--pc: var(--c-blue);}
:root[data-skin="google"] .big-links > [data-k="costs"] .bl-ic, :root[data-skin="chisto"] .big-links > [data-k="costs"] .bl-ic, :root[data-skin="google"] .big-links > [data-k="vehicle"] .bl-ic, :root[data-skin="chisto"] .big-links > [data-k="vehicle"] .bl-ic {--pc: var(--c-orange);}
:root[data-skin="google"] .big-links > [data-k="excel"] .bl-ic, :root[data-skin="chisto"] .big-links > [data-k="excel"] .bl-ic, :root[data-skin="google"] .big-links > [data-k="guide"] .bl-ic, :root[data-skin="chisto"] .big-links > [data-k="guide"] .bl-ic {--pc: var(--c-green);}
:root[data-skin="google"] .big-links > [data-k="carset"] .bl-ic, :root[data-skin="chisto"] .big-links > [data-k="carset"] .bl-ic, :root[data-skin="google"] .big-links > [data-k="write"] .bl-ic, :root[data-skin="chisto"] .big-links > [data-k="write"] .bl-ic {--pc: var(--c-teal);}
:root[data-skin="google"] .big-links > [data-k="tour"] .bl-ic, :root[data-skin="chisto"] .big-links > [data-k="tour"] .bl-ic, :root[data-skin="google"] .big-links > [data-k="arrange"] .bl-ic, :root[data-skin="chisto"] .big-links > [data-k="arrange"] .bl-ic {--pc: var(--c-amber);}
:root[data-skin="google"] .home-link:nth-child(1) .hl-ic, :root[data-skin="chisto"] .home-link:nth-child(1) .hl-ic {--pc: var(--c-blue);}
:root[data-skin="google"] .home-link:nth-child(2) .hl-ic, :root[data-skin="chisto"] .home-link:nth-child(2) .hl-ic {--pc: var(--c-violet);}
:root[data-skin="google"] .list-btn.danger .l-ic, :root[data-skin="chisto"] .list-btn.danger .l-ic {--tc: var(--c-red);}
:root[data-skin="google"] .kpi-ic, :root[data-skin="chisto"] .kpi-ic, :root[data-skin="google"] .mini-ic, :root[data-skin="chisto"] .mini-ic {--pc: var(--kc, var(--c-blue));}
:root[data-skin="google"] [data-sec="data"] .t-ic, :root[data-skin="chisto"] [data-sec="data"] .t-ic {--pc: var(--c-teal);}
:root[data-skin="google"] [data-sec="inc"] .t-ic, :root[data-skin="chisto"] [data-sec="inc"] .t-ic {--pc: var(--c-green);}
:root[data-skin="google"] [data-sec="exp"] .t-ic, :root[data-skin="chisto"] [data-sec="exp"] .t-ic {--pc: var(--c-orange);}
:root[data-skin="google"] .fuel-line .ic, :root[data-skin="chisto"] .fuel-line .ic {color: var(--c-orange);}
:root[data-skin="google"] .meter, :root[data-skin="chisto"] .meter {background: var(--g-hero) !important; color: var(--g-hero-ink) !important;}
:root[data-skin="google"] .meter .meter-label, :root[data-skin="chisto"] .meter .meter-label, :root[data-skin="google"] .meter .meter-goal, :root[data-skin="chisto"] .meter .meter-goal, :root[data-skin="google"] .meter .meter-value, :root[data-skin="chisto"] .meter .meter-value, :root[data-skin="google"] .meter .goal-edit, :root[data-skin="chisto"] .meter .goal-edit, :root[data-skin="google"] .meter .meter-forecast, :root[data-skin="chisto"] .meter .meter-forecast, :root[data-skin="google"] .meter .meter-forecast b, :root[data-skin="chisto"] .meter .meter-forecast b, :root[data-skin="google"] .meter .meter-more summary, :root[data-skin="chisto"] .meter .meter-more summary, :root[data-skin="google"] .meter .meter-note, :root[data-skin="chisto"] .meter .meter-note, :root[data-skin="google"] .meter b, :root[data-skin="chisto"] .meter b {color: var(--g-hero-ink) !important;}
:root[data-skin="google"] .meter .meter-label, :root[data-skin="chisto"] .meter .meter-label, :root[data-skin="google"] .meter .meter-goal > span, :root[data-skin="chisto"] .meter .meter-goal > span, :root[data-skin="google"] .meter .meter-forecast span, :root[data-skin="chisto"] .meter .meter-forecast span, :root[data-skin="google"] .meter .meter-note, :root[data-skin="chisto"] .meter .meter-note {opacity: .88;}
:root[data-skin="google"] .meter .goal-edit, :root[data-skin="chisto"] .meter .goal-edit {text-decoration-color: rgba(255, 255, 255, .6) !important;}
:root[data-skin="google"] .meter .meter-value.neg, :root[data-skin="chisto"] .meter .meter-value.neg, :root[data-skin="google"] .meter .meter-forecast b.neg, :root[data-skin="chisto"] .meter .meter-forecast b.neg {color: #FFB4AB !important;}
:root[data-skin="google"] .meter .meter-pct, :root[data-skin="chisto"] .meter .meter-pct {background: #FFFFFF !important; color: var(--g-hero) !important; font-weight: 700;}
:root[data-skin="google"] .meter .road, :root[data-skin="chisto"] .meter .road {background: rgba(255, 255, 255, .25) !important;}
:root[data-skin="google"] .meter .road-fill, :root[data-skin="chisto"] .meter .road-fill {background: var(--g-yellow) !important;}
:root[data-skin="google"] .meter .meter-today, :root[data-skin="chisto"] .meter .meter-today, :root[data-skin="google"] .meter .meter-cell, :root[data-skin="chisto"] .meter .meter-cell {background: rgba(255, 255, 255, .14) !important; color: var(--g-hero-ink) !important;}
:root[data-skin="google"] .meter .meter-cell span, :root[data-skin="chisto"] .meter .meter-cell span {color: var(--g-hero-ink) !important; opacity: .8;}
:root[data-skin="google"] .meter .ic, :root[data-skin="chisto"] .meter .ic, :root[data-skin="google"] .meter svg, :root[data-skin="chisto"] .meter svg {color: inherit;}
:root[data-skin="google"] .shift-cta, :root[data-skin="chisto"] .shift-cta {background: var(--g-go) !important; color: var(--g-go-ink) !important;}
:root[data-skin="google"] .yday, :root[data-skin="chisto"] .yday {background: var(--g-warn) !important; color: var(--g-on-warn) !important;}
:root[data-skin="google"] .yday .grow small, :root[data-skin="chisto"] .yday .grow small {color: var(--g-on-warn) !important;}
:root[data-skin="google"] .month-sum .ms-row:nth-child(1) b, :root[data-skin="chisto"] .month-sum .ms-row:nth-child(1) b {color: var(--pos) !important;}
:root[data-skin="google"] .month-sum .ms-row:nth-child(2) b, :root[data-skin="chisto"] .month-sum .ms-row:nth-child(2) b {color: var(--neg) !important;}
:root[data-skin="google"] .ms-total b.neg, :root[data-skin="chisto"] .ms-total b.neg {color: var(--neg) !important;}
:root[data-skin="google"] [data-sec="inc"] .card-title .num:not(:empty), :root[data-skin="chisto"] [data-sec="inc"] .card-title .num:not(:empty) {color: var(--pos);}
:root[data-skin="google"] [data-sec="exp"] .card-title .num:not(:empty), :root[data-skin="chisto"] [data-sec="exp"] .card-title .num:not(:empty) {color: var(--neg);}
:root[data-skin="google"] .chip.good, :root[data-skin="chisto"] .chip.good {background: var(--pos-soft) !important; border-color: transparent !important;}
:root[data-skin="google"] .chip.bad, :root[data-skin="chisto"] .chip.bad {background: var(--neg-soft) !important; border-color: transparent !important;}
:root[data-skin="google"] .bar.pos, :root[data-skin="chisto"] .bar.pos, :root[data-skin="google"] .week-bar.pos, :root[data-skin="chisto"] .week-bar.pos {fill: var(--c-green) !important; background: var(--c-green) !important;}
:root[data-skin="google"] .mc-bar span, :root[data-skin="chisto"] .mc-bar span, :root[data-skin="google"] .mc-bar span.best, :root[data-skin="chisto"] .mc-bar span.best {background: var(--c-green) !important;}
:root[data-skin="google"] .drive-sum .pos, :root[data-skin="chisto"] .drive-sum .pos, :root[data-skin="google"] .drive .pos, :root[data-skin="chisto"] .drive .pos {color: var(--pos) !important;}
:root[data-skin="google"] body, :root[data-skin="chisto"] body, :root[data-skin="google"] .screen, :root[data-skin="chisto"] .screen, :root[data-skin="google"] .adm-main, :root[data-skin="chisto"] .adm-main, :root[data-skin="google"] .adm-side, :root[data-skin="chisto"] .adm-side {background: var(--bg) !important;}
:root[data-skin="google"] .nav, :root[data-skin="chisto"] .nav, :root[data-skin="google"] .save-bar, :root[data-skin="chisto"] .save-bar {background: var(--g-cont) !important; box-shadow: 0 -1px 0 var(--g-outline-v);}
:root[data-skin="google"] .card, :root[data-skin="chisto"] .card, :root[data-skin="google"] .big-link, :root[data-skin="chisto"] .big-link, :root[data-skin="google"] .home-link, :root[data-skin="chisto"] .home-link, :root[data-skin="google"] .more > summary, :root[data-skin="chisto"] .more > summary, :root[data-skin="google"] .tile, :root[data-skin="chisto"] .tile, :root[data-skin="google"] .month-sum, :root[data-skin="chisto"] .month-sum, :root[data-skin="google"] .cover, :root[data-skin="chisto"] .cover {box-shadow: 0 1px 2px rgba(16, 40, 90, .06) !important;}
:root[data-skin="google"] .g-search, :root[data-skin="chisto"] .g-search, :root[data-skin="google"] .search-bar, :root[data-skin="chisto"] .search-bar, :root[data-skin="google"] .search-link, :root[data-skin="chisto"] .search-link {background: var(--g-cont) !important; box-shadow: 0 1px 2px rgba(16, 40, 90, .08);}
:root[data-skin="google"] .grid2 > .stat:nth-child(1), :root[data-skin="chisto"] .grid2 > .stat:nth-child(1) {--sc: var(--c-blue);}
:root[data-skin="google"] .grid2 > .stat:nth-child(2), :root[data-skin="chisto"] .grid2 > .stat:nth-child(2) {--sc: var(--c-teal);}
:root[data-skin="google"] .grid2 > .stat:nth-child(3), :root[data-skin="chisto"] .grid2 > .stat:nth-child(3) {--sc: var(--c-violet);}
:root[data-skin="google"] .grid2 > .stat:nth-child(4), :root[data-skin="chisto"] .grid2 > .stat:nth-child(4) {--sc: var(--c-orange);}
:root[data-skin="google"] .stat.stat-card, :root[data-skin="chisto"] .stat.stat-card, :root[data-skin="google"] .grid2 > .stat, :root[data-skin="chisto"] .grid2 > .stat {background: color-mix(in srgb, var(--sc, var(--c-blue)) 13%, var(--g-cont)) !important; border-radius: var(--r-lg) !important; padding: 16px !important;}
:root[data-skin="google"] .stat.stat-card .stat-label, :root[data-skin="chisto"] .stat.stat-card .stat-label, :root[data-skin="google"] .stat.stat-card .stat-label .ic, :root[data-skin="chisto"] .stat.stat-card .stat-label .ic, :root[data-skin="google"] .grid2 > .stat .stat-label svg, :root[data-skin="chisto"] .grid2 > .stat .stat-label svg {color: var(--sc, var(--c-blue)) !important;}
:root[data-skin="google"] .card.tip, :root[data-skin="chisto"] .card.tip {background: color-mix(in srgb, var(--c-amber) 12%, var(--g-cont)) !important;}
:root[data-skin="google"] .card.tip .tip-ic, :root[data-skin="chisto"] .card.tip .tip-ic {background: color-mix(in srgb, var(--c-amber) 22%, transparent) !important; color: var(--c-amber) !important; border-radius: 50%;}
:root[data-skin="google"] .card.tip .muted, :root[data-skin="chisto"] .card.tip .muted {color: var(--text) !important; opacity: .75;}
:root[data-skin="chisto"], :root[data-skin="chisto"] [data-page] {--ch-bg: #FDF9F9; --ch-lowest: #FFFFFF; --ch-low: #F1EBEB; --ch-c: #EBE5E5; --ch-high: #E4DEDE; --ch-highest: #DCD5D5; --ch-on: #1D1B1B; --ch-on-v: #48423F; --ch-outline: #776F70; --ch-outline-v: #C9C0C1; --ch-pri: #231F20; --ch-on-pri: #FFFFFF; --ch-pri-c: #231F20; --ch-on-pri-c: #FFFFFF; --ch-sec-c: #DAE0D7; --ch-on-sec-c: #1E1B1C; --ch-ter: #2F6B39; --ch-ter-c: #BFF0BE; --ch-on-ter-c: #00210A; --ch-err: #BA1A1A; --ch-err-c: #FFDAD6; --ch-on-err-c: #410002; --ch-inv: #322F30; --ch-on-inv: #F5EFEF; --bg: var(--ch-bg); --surface: var(--ch-lowest); --surface-2: var(--ch-c); --surface-3: var(--ch-highest); --line: var(--ch-outline-v); --text: var(--ch-on); --muted: var(--ch-on-v); --faint: var(--ch-outline); --accent: var(--ch-pri); --accent-press: #000000; --accent-ink: var(--ch-on-pri); --accent-soft: var(--ch-sec-c); --accent-text: var(--ch-pri); --g-cont: var(--ch-low); --g-cont-hi: var(--ch-high); --g-in: var(--ch-lowest); --g-sec: var(--ch-sec-c); --g-on-sec: var(--ch-on-sec-c); --g-outline: var(--ch-outline); --g-outline-v: var(--ch-outline-v); --g-hero: var(--ch-pri-c); --g-hero-ink: var(--ch-on-pri-c); --g-go: var(--ch-pri); --g-go-ink: var(--ch-on-pri); --g-warn: var(--ch-err-c); --g-on-warn: var(--ch-on-err-c); --g-yellow: var(--ch-on-pri-c); --pos: var(--ch-ter); --pos-soft: var(--ch-ter-c); --neg: var(--ch-err); --neg-soft: var(--ch-err-c); --pc: var(--ch-pri); --violet: var(--ch-pri); --v-soft: var(--ch-sec-c); --v-line: var(--ch-outline-v); --v-strong: var(--ch-outline-v); --c-green: var(--ch-ter); --c-red: var(--ch-err); --c-blue: var(--ch-on-v); --c-violet: var(--ch-on-v); --c-amber: var(--ch-on-v); --c-orange: var(--ch-on-v); --c-teal: var(--ch-on-v); --c-sky: var(--ch-on-v); --c-pink: var(--ch-on-v); --c-slate: var(--ch-on-v); --c-gray: var(--ch-outline); --font: -apple-system, BlinkMacSystemFont, system-ui, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; --display: var(--font); --r-xl: 28px; --r-lg: 24px; --r-md: 16px; --r-sm: 12px;}
:root[data-skin="chisto"][data-theme="dark"], :root[data-skin="chisto"][data-theme="dark"] [data-page] {--ch-bg: #131212; --ch-lowest: #0D0C0C; --ch-low: #211F1F; --ch-c: #242222; --ch-high: #2F2C2C; --ch-highest: #3A3737; --ch-on: #E6E1E1; --ch-on-v: #CCC4C5; --ch-outline: #968E8F; --ch-outline-v: #4A4546; --ch-pri: #E8E1E1; --ch-on-pri: #231F20; --ch-pri-c: #3A3536; --ch-on-pri-c: #FFFFFF; --ch-sec-c: #3E4A40; --ch-on-sec-c: #EDE6E6; --ch-ter: #A3D3A2; --ch-ter-c: #1F4D2A; --ch-on-ter-c: #BFF0BE; --ch-err: #FFB4AB; --ch-err-c: #93000A; --ch-on-err-c: #FFDAD6; --ch-inv: #E6E1E1; --ch-on-inv: #322F30; --accent-press: #FFFFFF;}
@media (prefers-color-scheme: dark) {
:root[data-skin="chisto"]:not([data-theme="light"]):not([data-theme="sun"]), :root[data-skin="chisto"]:not([data-theme="light"]):not([data-theme="sun"]) [data-page] {--ch-bg: #131212; --ch-lowest: #0D0C0C; --ch-low: #211F1F; --ch-c: #242222; --ch-high: #2F2C2C; --ch-highest: #3A3737; --ch-on: #E6E1E1; --ch-on-v: #CCC4C5; --ch-outline: #968E8F; --ch-outline-v: #4A4546; --ch-pri: #E8E1E1; --ch-on-pri: #231F20; --ch-pri-c: #3A3536; --ch-on-pri-c: #FFFFFF; --ch-sec-c: #3E4A40; --ch-on-sec-c: #EDE6E6; --ch-ter: #A3D3A2; --ch-ter-c: #1F4D2A; --ch-on-ter-c: #BFF0BE; --ch-err: #FFB4AB; --ch-err-c: #93000A; --ch-on-err-c: #FFDAD6; --ch-inv: #E6E1E1; --ch-on-inv: #322F30; --accent-press: #FFFFFF;}
}
:root[data-skin="chisto"] html, :root[data-skin="chisto"] body, :root[data-skin="chisto"] .screen, :root[data-skin="chisto"] .adm-main, :root[data-skin="chisto"] .adm-side {background: var(--ch-bg) !important; color: var(--ch-on); font-family: var(--font);}
:root[data-skin="chisto"] body {-webkit-font-smoothing: antialiased;}
:root[data-skin="chisto"] .num, :root[data-skin="chisto"] .meter-value, :root[data-skin="chisto"] .hero-num, :root[data-skin="chisto"] .timer, :root[data-skin="chisto"] .stat-value, :root[data-skin="chisto"] .day-badge b, :root[data-skin="chisto"] .ms-total b, :root[data-skin="chisto"] .result-net, :root[data-skin="chisto"] .kpi-value, :root[data-skin="chisto"] .big-net, :root[data-skin="chisto"] .f-val, :root[data-skin="chisto"] .tile-val, :root[data-skin="chisto"] .np-val, :root[data-skin="chisto"] .meter-cell b {font-family: var(--font) !important;}
:root[data-skin="chisto"] .ic-fill {display: none;}
:root[data-skin="chisto"] .ic path {stroke-width: 2;}
:root[data-skin="chisto"] h1, :root[data-skin="chisto"] .page-title h1, :root[data-skin="chisto"] .hero h1 {font-weight: 500 !important; letter-spacing: -.2px !important;}
:root[data-skin="chisto"] .page-title h1 {font-size: 1.75rem !important;}
:root[data-skin="chisto"] .muted, :root[data-skin="chisto"] .hero-sub, :root[data-skin="chisto"] .meter-label, :root[data-skin="chisto"] .stat-label, :root[data-skin="chisto"] .f-row small, :root[data-skin="chisto"] .big-link .grow > span, :root[data-skin="chisto"] .setting-sub {color: var(--ch-on-v) !important;}
:root[data-skin="chisto"] .section-title {color: var(--ch-on) !important; font-weight: 500 !important; font-size: .9rem !important; margin: 24px 8px 8px !important;}
:root[data-skin="chisto"] .card, :root[data-skin="chisto"] .stat-card, :root[data-skin="chisto"] .tile, :root[data-skin="chisto"] .big-link, :root[data-skin="chisto"] .home-link, :root[data-skin="chisto"] .cover, :root[data-skin="chisto"] .ql, :root[data-skin="chisto"] .reg-group, :root[data-skin="chisto"] .first-day, :root[data-skin="chisto"] .msg, :root[data-skin="chisto"] .install-bar, :root[data-skin="chisto"] .more > summary, :root[data-skin="chisto"] .invite-card, :root[data-skin="chisto"] .kpi, :root[data-skin="chisto"] .mini-kpis, :root[data-skin="chisto"] .scope-bar, :root[data-skin="chisto"] .adm-picker, :root[data-skin="chisto"] .week-sum, :root[data-skin="chisto"] .month-sum, :root[data-skin="chisto"] .hero, :root[data-skin="chisto"] .meter, :root[data-skin="chisto"] .drive, :root[data-skin="chisto"] .live, :root[data-skin="chisto"] .yday, :root[data-skin="chisto"] .search-link, :root[data-skin="chisto"] .first-tip, :root[data-skin="chisto"] .drive-card {background: var(--ch-low) !important; border: 0 !important; box-shadow: none !important;}
:root[data-skin="chisto"] .card, :root[data-skin="chisto"] .hero, :root[data-skin="chisto"] .meter, :root[data-skin="chisto"] .month-sum, :root[data-skin="chisto"] .cover, :root[data-skin="chisto"] .drive-card {border-radius: 28px !important;}
:root[data-skin="chisto"] .exp-item, :root[data-skin="chisto"] .time-in, :root[data-skin="chisto"] .np-field, :root[data-skin="chisto"] .stat, :root[data-skin="chisto"] .result-cell, :root[data-skin="chisto"] .result-goal, :root[data-skin="chisto"] .ci-grid > div, :root[data-skin="chisto"] .fuel-line, :root[data-skin="chisto"] .drive-need, :root[data-skin="chisto"] .info-box, :root[data-skin="chisto"] .next-empty, :root[data-skin="chisto"] .meter-cell, :root[data-skin="chisto"] .hap, :root[data-skin="chisto"] .step-row, :root[data-skin="chisto"] .hero-chip {background: var(--ch-lowest) !important;}
:root[data-skin="chisto"] .t-ic, :root[data-skin="chisto"] .bl-ic, :root[data-skin="chisto"] .ql-ic, :root[data-skin="chisto"] .cost-ic, :root[data-skin="chisto"] .mini-ic, :root[data-skin="chisto"] .kpi-ic, :root[data-skin="chisto"] .list-btn .l-ic, :root[data-skin="chisto"] .info-row .l-ic, :root[data-skin="chisto"] .msg-ic, :root[data-skin="chisto"] .hl-ic, :root[data-skin="chisto"] .gs-ic, :root[data-skin="chisto"] .rec-ic, :root[data-skin="chisto"] .cal-ev-ic, :root[data-skin="chisto"] .att-ic, :root[data-skin="chisto"] .due-ic, :root[data-skin="chisto"] .f-ic, :root[data-skin="chisto"] .tip-ic, :root[data-skin="chisto"] .empty-ic, :root[data-skin="chisto"] .hap-ic {color: var(--ch-on-v) !important; background: transparent !important;}
:root[data-skin="chisto"] .t-ic {display: none !important;}
:root[data-skin="chisto"] .card-title h3, :root[data-skin="chisto"] .card-title h2 {font-size: .95rem !important; font-weight: 500 !important; color: var(--ch-on) !important;}
:root[data-skin="chisto"] .bl-ic, :root[data-skin="chisto"] .list-btn .l-ic, :root[data-skin="chisto"] .info-row .l-ic {width: 40px !important; height: 40px !important; border-radius: 50% !important; background: var(--ch-highest) !important; color: var(--ch-on) !important;}
:root[data-skin="chisto"] .btn {border-radius: 999px !important; font-weight: 600 !important; letter-spacing: 0 !important; box-shadow: none !important;}
:root[data-skin="chisto"] .btn-primary, :root[data-skin="chisto"] .btn-page, :root[data-skin="chisto"] .btn-dark {background: var(--ch-pri) !important; color: var(--ch-on-pri) !important; border: 0 !important;}
:root[data-skin="chisto"] .btn-ghost, :root[data-skin="chisto"] .btn-outline {background: transparent !important; border: 1px solid var(--ch-outline) !important; color: var(--ch-on) !important;}
:root[data-skin="chisto"] .btn-tonal {background: var(--ch-highest) !important; color: var(--ch-on) !important; border: 0 !important;}
:root[data-skin="chisto"] .btn-danger {background: var(--ch-err) !important; color: #fff !important; border: 0 !important;}
:root[data-skin="chisto"] .btn-xl {min-height: 64px !important; border-radius: 20px !important; font-size: 1.1rem !important;}
:root[data-skin="chisto"] .btn-lg {min-height: 56px !important;}
:root[data-skin="chisto"] .btn-sm {min-height: 40px !important; padding: 0 16px !important; font-size: .875rem !important;}
:root[data-skin="chisto"] .icon-btn {color: var(--ch-on-v) !important; background: transparent !important; border: 0 !important;}
:root[data-skin="chisto"] .link, :root[data-skin="chisto"] .goal-edit {color: var(--ch-pri) !important; font-weight: 600 !important; text-decoration: none !important;}
:root[data-skin="chisto"] .chip, :root[data-skin="chisto"] .chip-btn {border-radius: 8px !important; background: transparent !important; border: 1px solid var(--ch-outline-v) !important; color: var(--ch-on-v) !important; font-weight: 600 !important;}
:root[data-skin="chisto"] .chip.on {background: var(--ch-sec-c) !important; color: var(--ch-on-sec-c) !important; border-color: transparent !important;}
:root[data-skin="chisto"] .chip.good {background: var(--ch-ter-c) !important; color: var(--ch-on-ter-c) !important; border-color: transparent !important;}
:root[data-skin="chisto"] .chip.bad {background: var(--ch-err-c) !important; color: var(--ch-on-err-c) !important; border-color: transparent !important;}
:root[data-skin="chisto"] .f-btn {border-radius: 999px !important; background: var(--ch-sec-c) !important; color: var(--ch-on-sec-c) !important; font-weight: 600 !important; border: 0 !important; height: 40px; padding: 0 16px !important;}
:root[data-skin="chisto"] .f-btn.has {background: transparent !important; border: 1px solid var(--ch-outline-v) !important; color: var(--ch-on-v) !important; padding: 0 !important; width: 40px;}
:root[data-skin="chisto"] [data-sec="exp"] .f-btn:not(.has), :root[data-skin="chisto"] .drive-list.exp .f-btn:not(.has) {background: transparent !important; border: 1px solid var(--ch-outline) !important; color: var(--ch-on-v) !important;}
:root[data-skin="chisto"] .seg {border: 1px solid var(--ch-outline) !important; background: transparent !important;}
:root[data-skin="chisto"] .seg-btn {color: var(--ch-on) !important; border-left-color: var(--ch-outline) !important; font-weight: 600 !important;}
:root[data-skin="chisto"] .seg-btn.on, :root[data-skin="chisto"] .seg.on-page .seg-btn.on, :root[data-skin="chisto"] .hero .seg-btn.on, :root[data-skin="chisto"] body.admin .seg-btn.on, :root[data-skin="chisto"] body.admin .seg.on-page .seg-btn.on {background: var(--ch-sec-c) !important; color: var(--ch-on-sec-c) !important;}
:root[data-skin="chisto"] .seg.seg-outline .seg-btn {border-color: var(--ch-outline) !important;}
:root[data-skin="chisto"] .seg.seg-outline .seg-btn.on {background: var(--ch-sec-c) !important;}
:root[data-skin="chisto"] .input, :root[data-skin="chisto"] select.input, :root[data-skin="chisto"] .pk-field.input {border: 1px solid var(--ch-outline) !important; border-radius: 8px !important; background: transparent !important; color: var(--ch-on) !important; min-height: 56px;}
:root[data-skin="chisto"] .input:focus {border: 2px solid var(--ch-pri) !important;}
:root[data-skin="chisto"] .toggle.on {background: var(--ch-pri) !important;}
:root[data-skin="chisto"] .toggle.on::after {background: var(--ch-on-pri) !important;}
:root[data-skin="chisto"] .g-search {background: var(--ch-high) !important; color: var(--ch-on-v) !important; height: 56px !important; box-shadow: none !important;}
:root[data-skin="chisto"] .g-search .avatar:not(.has-photo) {background: var(--ch-pri) !important; color: var(--ch-on-pri) !important;}
:root[data-skin="chisto"] .search-bar, :root[data-skin="chisto"] .search-link {background: var(--ch-high) !important; box-shadow: none !important; border: 0 !important;}
:root[data-skin="chisto"] .avatar, :root[data-skin="chisto"] .cover-avatar {background: var(--ch-pri) !important; color: var(--ch-on-pri) !important;}
:root[data-skin="chisto"] .hello {padding: 8px 8px 4px !important;}
:root[data-skin="chisto"] .hello h1 {font-size: 2rem !important; font-weight: 500 !important; line-height: 1.25 !important;}
:root[data-skin="chisto"] .hello .date {color: var(--ch-on-v) !important; font-size: 1rem !important;}
:root[data-skin="chisto"] .nav {background: var(--ch-c) !important; box-shadow: none !important; border: 0 !important;}
:root[data-skin="chisto"] .nav a {color: var(--ch-on-v) !important; font-size: .75rem !important; font-weight: 500 !important;}
:root[data-skin="chisto"] .nav a.on {color: var(--ch-on) !important; font-weight: 700 !important;}
:root[data-skin="chisto"] .nav a.on .nav-ic {background: var(--ch-sec-c) !important; color: var(--ch-on-sec-c) !important;}
:root[data-skin="chisto"] .meter-stack {display: flex; flex-direction: column; gap: 12px;}
:root[data-skin="chisto"] .meter {background: var(--ch-pri-c) !important; color: var(--ch-on-pri-c) !important; padding: 24px !important; display: flex !important; flex-direction: column;}
:root[data-skin="chisto"] .meter > .meter-label {order: 1; display: flex; justify-content: space-between; align-items: center;}
:root[data-skin="chisto"] .meter > .meter-value {order: 2;}
:root[data-skin="chisto"] .meter > .road {order: 3;}
:root[data-skin="chisto"] .meter > .meter-goal {order: 4;}
:root[data-skin="chisto"] .meter .meter-label {color: var(--ch-on-pri-c) !important; opacity: 1 !important; font-weight: 500; font-size: 1rem !important;}
:root[data-skin="chisto"] .meter .meter-pct {background: #DDF3DB !important; color: var(--ch-pri-c) !important; height: 32px; padding: 0 12px !important; border-radius: 16px !important; display: inline-flex; align-items: center; font-weight: 700;}
:root[data-skin="chisto"] .meter .meter-value {font-size: clamp(2.4rem, 11.5vw, 2.9rem) !important; font-weight: 700 !important; letter-spacing: -1px !important; color: var(--ch-on-pri-c) !important; margin: 8px 0 0 !important;}
:root[data-skin="chisto"] .meter .meter-value.neg {color: #FFB4AB !important;}
:root[data-skin="chisto"] .meter .meter-goal, :root[data-skin="chisto"] .meter .meter-goal > span, :root[data-skin="chisto"] .meter .goal-edit, :root[data-skin="chisto"] .meter b {color: var(--ch-on-pri-c) !important; opacity: 1 !important;}
:root[data-skin="chisto"] .meter .meter-goal {font-size: 1rem; margin-top: 0; line-height: 1.45;}
:root[data-skin="chisto"] .meter .goal-edit {text-decoration: none !important; font-weight: 400 !important;}
:root[data-skin="chisto"] .meter .goal-edit .ic {opacity: .7;}
:root[data-skin="chisto"] .meter .road {height: 16px !important; background: transparent !important; position: relative; margin: 16px 0 8px !important; border-radius: 0 !important; overflow: visible !important;}
:root[data-skin="chisto"] .meter .road::before {content: ''; position: absolute; left: 0; right: 4px; top: 6px; height: 4px; border-radius: 2px; background: color-mix(in srgb, var(--ch-on-pri-c) 22%, transparent);}
:root[data-skin="chisto"] .meter .road::after {content: ''; position: absolute; right: 0; top: 5.5px; width: 5px; height: 5px; border-radius: 50%; background: var(--ch-on-pri-c);}
:root[data-skin="chisto"] .meter .road-fill {position: relative; z-index: 1; height: 16px !important; min-width: 12px; border-radius: 0 !important; background: var(--ch-pri-c) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='16' viewBox='0 0 20 16'%3E%3Cpath d='M0 8q5-5 10 0t10 0' fill='none' stroke='%23fff' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E") left center / 20px 16px repeat-x !important;}
:root[data-skin="chisto"] .meter-plan {padding: 20px !important;}
:root[data-skin="chisto"] .meter-plan .meter-today {display: flex !important; align-items: center; gap: 16px; background: transparent !important; padding: 0 !important; margin: 0 !important; border: 0 !important; color: var(--ch-on) !important;}
:root[data-skin="chisto"] .meter-plan .mt-ic {width: 48px; height: 48px; flex: none; border-radius: 16px; background: var(--ch-sec-c); color: var(--ch-on-sec-c); display: grid; place-items: center;}
:root[data-skin="chisto"] .meter-plan small {display: block; font-size: .875rem; color: var(--ch-on-v); line-height: 1.35;}
:root[data-skin="chisto"] .meter-plan .mt-val b {font-size: 1.375rem; font-weight: 800;}
:root[data-skin="chisto"] .meter-plan .mt-val span {font-size: .875rem; color: var(--ch-on-v);}
:root[data-skin="chisto"] .meter-plan .mp-line {height: 1px; background: var(--ch-outline-v); margin: 16px 0;}
:root[data-skin="chisto"] .meter-plan .meter-forecast {display: flex; justify-content: space-between; align-items: center; border: 0 !important; padding: 0 !important; margin: 0 !important; color: var(--ch-on) !important;}
:root[data-skin="chisto"] .meter-plan .meter-forecast b {display: block; font-size: 1.375rem; font-weight: 800; color: var(--ch-on) !important;}
:root[data-skin="chisto"] .meter-plan .meter-forecast b.neg {color: var(--ch-err) !important;}
:root[data-skin="chisto"] .meter-plan .mp-toggle {height: 40px; padding: 0 12px; border-radius: 20px; font-size: .875rem;}
:root[data-skin="chisto"] .meter-plan .meter-more {display: none; margin-top: 12px;}
:root[data-skin="chisto"] .meter-plan.open .meter-more {display: block;}
:root[data-skin="chisto"] .meter-plan .meter-grid {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0 !important;}
:root[data-skin="chisto"] .meter-plan .meter-cell {background: var(--ch-lowest) !important; border-radius: 16px !important; padding: 12px !important; border: 0 !important;}
:root[data-skin="chisto"] .meter-plan .meter-cell span {font-size: .75rem; color: var(--ch-on-v) !important;}
:root[data-skin="chisto"] .meter-plan .meter-cell b {color: var(--ch-on) !important; font-size: 1.125rem !important; font-weight: 800 !important;}
:root[data-skin="chisto"] .meter-plan .meter-note {background: transparent !important; color: var(--ch-on-v) !important; font-size: .8125rem; padding: 0 !important; margin-top: 12px !important; border: 0 !important;}
:root[data-skin="chisto"] .meter-plan .meter-note .ic {display: none;}
:root[data-skin="chisto"] .home-shift {display: flex; flex-direction: column; gap: 8px; padding: 4px 0;}
:root[data-skin="chisto"] .shift-cta {position: static !important; width: 100% !important; min-height: 64px !important; border-radius: 20px !important; background: var(--ch-pri) !important; color: var(--ch-on-pri) !important; font-size: 1.125rem !important; box-shadow: 0 1px 3px rgba(0,0,0,.18), 0 4px 8px rgba(0,0,0,.08) !important; padding: 0 22px !important;}
:root[data-skin="chisto"] .home-shift > .btn-ghost {background: var(--ch-sec-c) !important; color: var(--ch-on-sec-c) !important; border: 0 !important; min-height: 56px; margin-top: 0 !important;}
:root[data-skin="chisto"] [data-page="home"].screen {padding-bottom: calc(var(--nav-h) + env(safe-area-inset-bottom) + 28px) !important;}
:root[data-skin="chisto"] .home-links {gap: 12px !important;}
:root[data-skin="chisto"] .home-link {flex-direction: column !important; align-items: flex-start !important; gap: 12px !important; padding: 16px !important; border-radius: 24px !important; text-align: left;}
:root[data-skin="chisto"] .home-link .hl-ic {width: 40px !important; height: 40px !important; border-radius: 50% !important; background: var(--ch-highest) !important; color: var(--ch-on-v) !important; display: grid; place-items: center;}
:root[data-skin="chisto"] .home-link .grow b {font-weight: 500 !important; font-size: 1rem;}
:root[data-skin="chisto"] .home-link .grow small {font-size: .8125rem; color: var(--ch-on-v);}
:root[data-skin="chisto"] .home-link .hl-chev {display: none !important;}
:root[data-skin="chisto"] .home-link.on {background: var(--ch-sec-c) !important;}
:root[data-skin="chisto"] .next-stack {display: flex; flex-direction: column; gap: 12px;}
:root[data-skin="chisto"] .next {padding: 20px !important;}
:root[data-skin="chisto"] .next .card-title h3 {color: var(--ch-on-v) !important; font-size: .875rem !important;}
:root[data-skin="chisto"] .next .card-title .link .ic {display: none;}
:root[data-skin="chisto"] .next-when {width: 64px !important; height: 64px !important; border-radius: 20px !important; background: var(--ch-ter-c) !important; color: var(--ch-on-ter-c) !important; border: 0 !important;}
:root[data-skin="chisto"] .next-when b {font-size: 1.125rem; font-weight: 800; color: var(--ch-on-ter-c) !important;}
:root[data-skin="chisto"] .next-when span {color: var(--ch-on-ter-c) !important; font-size: .75rem;}
:root[data-skin="chisto"] .next-title {font-weight: 500 !important; font-size: 1rem;}
:root[data-skin="chisto"] .next-title .muted {color: var(--ch-on) !important;}
:root[data-skin="chisto"] .next-sub {color: var(--ch-on-v) !important; white-space: normal !important; overflow: visible !important; text-overflow: clip !important;}
:root[data-skin="chisto"] .next .next-item {position: relative;}
:root[data-skin="chisto"] .next .next-actions {margin-left: -80px !important; flex-wrap: wrap;}
:root[data-skin="chisto"] .next-actions {margin-top: 16px !important; gap: 8px !important;}
:root[data-skin="chisto"] .next-actions .btn:first-child[href^="tel:"] {background: var(--ch-pri) !important; color: var(--ch-on-pri) !important; border: 0 !important;}
:root[data-skin="chisto"] .next-actions .btn {border-color: var(--ch-outline) !important; color: var(--ch-on-v) !important;}
:root[data-skin="chisto"] .next-empty {background: transparent !important; border: 1px dashed var(--ch-outline-v) !important; border-radius: 16px !important; color: var(--ch-on-v) !important;}
:root[data-skin="chisto"] .due-card {display: flex; gap: 16px; align-items: flex-start; padding: 20px !important; background: var(--ch-err-c) !important; color: var(--ch-on-err-c) !important;}
:root[data-skin="chisto"] .due-card .due-ic {width: 40px; height: 40px; flex: none; border-radius: 50%; background: var(--ch-lowest) !important; color: var(--ch-err) !important; display: grid; place-items: center;}
:root[data-skin="chisto"] .due-card .grow {flex: 1; min-width: 0; display: flex; flex-direction: column;}
:root[data-skin="chisto"] .due-card .next-title {font-weight: 600 !important; color: var(--ch-on-err-c) !important;}
:root[data-skin="chisto"] .due-card .next-sub {color: var(--ch-on-err-c) !important;}
:root[data-skin="chisto"] .due-card .next-sub + .next-sub {font-size: .8125rem; opacity: .8; margin-top: 2px;}
:root[data-skin="chisto"] .due-card .btn {background: var(--ch-lowest) !important; color: var(--ch-on-err-c) !important; border: 0 !important; flex: none;}
:root[data-skin="chisto"] details.more > summary {background: transparent !important; color: var(--ch-on-v) !important; justify-content: center !important; font-size: .875rem; font-weight: 500 !important; min-height: 48px;}
:root[data-skin="chisto"] details.more > summary .ic {color: var(--ch-on-v);}
:root[data-skin="chisto"] .more-body > .dz {display: flex; flex-direction: column; gap: 12px;}
:root[data-skin="chisto"] .week-card {padding: 20px !important; margin-top: 0 !important;}
:root[data-skin="chisto"] .wk-head {display: flex; justify-content: space-between; align-items: flex-end; gap: 8px;}
:root[data-skin="chisto"] .wk-head small {display: block; font-size: .875rem; color: var(--ch-on-v);}
:root[data-skin="chisto"] .wk-num {display: block; font-size: 2rem; line-height: 1.25; font-weight: 800; letter-spacing: -.5px;}
:root[data-skin="chisto"] .wk-num.neg {color: var(--ch-err);}
:root[data-skin="chisto"] .trend {height: 28px; padding: 0 10px; border-radius: 14px; display: inline-flex !important; align-items: center; gap: 4px; font-size: .75rem !important; font-weight: 600 !important; white-space: nowrap;}
:root[data-skin="chisto"] .trend.up {background: var(--ch-ter-c) !important; color: var(--ch-on-ter-c) !important;}
:root[data-skin="chisto"] .trend.down {background: var(--ch-err-c) !important; color: var(--ch-on-err-c) !important;}
:root[data-skin="chisto"] .week {gap: 10px !important; height: auto !important; align-items: end !important; margin-top: 16px !important;}
:root[data-skin="chisto"] .week-day {display: flex !important; flex-direction: column; align-items: center; justify-content: flex-end; gap: 6px; height: 128px;}
:root[data-skin="chisto"] .wk-val {font-size: .6875rem; color: var(--ch-on-v); min-height: 14px;}
:root[data-skin="chisto"] .wk-val.neg {color: var(--ch-err); font-weight: 600;}
:root[data-skin="chisto"] .week-bar {width: 100% !important; border-radius: 10px !important; background: var(--ch-outline-v) !important; max-width: none !important;}
:root[data-skin="chisto"] .week-bar.pos {background: var(--ch-pri) !important;}
:root[data-skin="chisto"] .week-bar.neg {background: var(--ch-err) !important;}
:root[data-skin="chisto"] .week-bar.today {outline: 0 !important; box-shadow: none !important;}
:root[data-skin="chisto"] .week-bar:not(.pos):not(.neg) {height: 6px !important; border-radius: 3px !important;}
:root[data-skin="chisto"] .wk-day {font-size: .75rem; color: var(--ch-on-v);}
:root[data-skin="chisto"] .week-day.today .wk-day {color: var(--ch-on); font-weight: 700;}
:root[data-skin="chisto"] .week-foot {margin-top: 12px !important;}
:root[data-skin="chisto"] .week-foot .muted {font-size: .875rem;}
:root[data-skin="chisto"] .card.tip {display: flex; gap: 16px; align-items: flex-start; padding: 20px !important; margin-top: 0 !important;}
:root[data-skin="chisto"] .card.tip.best {background: var(--ch-ter-c) !important; color: var(--ch-on-ter-c) !important;}
:root[data-skin="chisto"] .card.tip.best .tip-ic {width: 40px; height: 40px; border-radius: 50%; background: var(--ch-lowest) !important; color: var(--ch-ter) !important; display: grid; place-items: center; flex: none;}
:root[data-skin="chisto"] .card.tip.best .muted, :root[data-skin="chisto"] .card.tip.best b {color: var(--ch-on-ter-c) !important; opacity: 1 !important;}
:root[data-skin="chisto"] .card.tip.best > .ic:last-child {display: none;}
:root[data-skin="chisto"] .card.tip.streak {background: var(--ch-sec-c) !important; color: var(--ch-on-sec-c) !important; align-items: center;}
:root[data-skin="chisto"] .card.tip.streak .tip-ic {width: 48px; height: 48px; border-radius: 50%; background: var(--ch-pri) !important; color: var(--ch-on-pri) !important; display: grid; place-items: center; flex: none;}
:root[data-skin="chisto"] .card.tip.streak .muted {color: var(--ch-on-sec-c) !important; opacity: 1 !important;}
:root[data-skin="chisto"] .card.tip b {font-size: 1rem; font-weight: 600; display: block;}
:root[data-skin="chisto"] .card.tip .small {font-size: .875rem !important; line-height: 1.45;}
:root[data-skin="chisto"] .grid2 {gap: 12px !important;}
:root[data-skin="chisto"] .grid2 > .stat, :root[data-skin="chisto"] .stat.stat-card {background: var(--ch-low) !important; border-radius: 24px !important; padding: 16px !important; border: 0 !important;}
:root[data-skin="chisto"] .stat .stat-label {font-size: .8125rem !important; color: var(--ch-on-v) !important;}
:root[data-skin="chisto"] .stat .stat-label .ic {display: none;}
:root[data-skin="chisto"] .stat .stat-value {font-size: 1.5rem !important; font-weight: 800 !important; color: var(--ch-on) !important; margin-top: 4px;}
:root[data-skin="chisto"] .stat .stat-sub {font-size: .75rem; color: var(--ch-on-v);}
:root[data-skin="chisto"] .drive {background: transparent !important; padding: 0 !important; display: flex; flex-direction: column; gap: 12px;}
:root[data-skin="chisto"] .drive-hero {background: var(--ch-pri-c); color: var(--ch-on-pri-c); border-radius: 28px; padding: 20px 20px 24px;}
:root[data-skin="chisto"] .drive-top {display: flex; justify-content: space-between; align-items: center;}
:root[data-skin="chisto"] .drive-on {height: 32px; padding: 0 12px; border-radius: 16px; background: var(--ch-on-pri-c); color: var(--ch-pri-c); display: inline-flex; align-items: center; gap: 8px; font-size: .8125rem; font-weight: 600;}
:root[data-skin="chisto"] .drive-on .live-dot {width: 8px; height: 8px; border-radius: 4px; background: #4ADE80 !important; box-shadow: none !important;}
:root[data-skin="chisto"] .drive-fix {background: transparent !important; color: var(--ch-on-pri-c) !important; border: 1px solid var(--ch-on-pri-c) !important; border-radius: 18px !important; height: 36px;}
:root[data-skin="chisto"] .drive-fix .ic {display: none;}
:root[data-skin="chisto"] .drive-timer {font-size: 4rem !important; line-height: 1.1 !important; font-weight: 800 !important; letter-spacing: -1px; text-align: center; margin: 20px 0 16px !important; color: var(--ch-on-pri-c) !important;}
:root[data-skin="chisto"] .drive-sum {display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px !important; text-align: center;}
:root[data-skin="chisto"] .drive-sum > div {border-radius: 16px; background: color-mix(in srgb, var(--ch-on-pri-c) 9%, transparent) !important; padding: 10px 4px; border: 0 !important;}
:root[data-skin="chisto"] .drive-sum span {display: block; font-size: .75rem; color: var(--ch-on-pri-c) !important; opacity: 1 !important;}
:root[data-skin="chisto"] .drive-sum b {font-size: 1.25rem; font-weight: 800; color: var(--ch-on-pri-c) !important;}
:root[data-skin="chisto"] .drive-sum b.neg {color: #FFB4AB !important;}
:root[data-skin="chisto"] .drive-sum b.pos {color: var(--ch-on-pri-c) !important;}
:root[data-skin="chisto"] .drive-hero .drive-need {background: transparent !important; padding: 0 !important; margin-top: 16px; color: var(--ch-on-pri-c) !important; border: 0 !important;}
:root[data-skin="chisto"] .drive-need span, :root[data-skin="chisto"] .drive-need b {color: var(--ch-on-pri-c) !important; font-size: .875rem;}
:root[data-skin="chisto"] .drive-bar {height: 8px !important; border-radius: 4px !important; background: color-mix(in srgb, var(--ch-on-pri-c) 18%, transparent) !important; margin-top: 8px;}
:root[data-skin="chisto"] .drive-bar i {background: var(--ch-on-pri-c) !important; border-radius: 4px; min-width: 8px;}
:root[data-skin="chisto"] .drive-voice {display: flex !important; align-items: center; gap: 14px; text-align: left; border-radius: 28px !important; background: var(--ch-high) !important; color: var(--ch-on) !important; padding: 14px 16px !important; min-height: 0 !important; width: 100%; border: 0;}
:root[data-skin="chisto"] .drive-voice .dv-ic {width: 48px; height: 48px; flex: none; border-radius: 50%; background: var(--ch-pri); color: var(--ch-on-pri); display: grid; place-items: center;}
:root[data-skin="chisto"] .drive-voice b {display: block; font-size: 1rem; font-weight: 600;}
:root[data-skin="chisto"] .drive-voice .drive-hint {display: block; font-size: .875rem; color: var(--ch-on-v); margin: 0 !important; text-align: left;}
:root[data-skin="chisto"] .drive-card {padding: 8px 0 !important;}
:root[data-skin="chisto"] .drive-card .drive-label {padding: 12px 20px 4px; font-size: .875rem !important; font-weight: 600 !important; color: var(--ch-pri) !important;}
:root[data-skin="chisto"] .drive .drive-list {background: transparent !important; border: 0 !important; padding: 0 !important; margin: 0 !important;}
:root[data-skin="chisto"] .drive-scan {margin: 8px 16px 12px !important; width: calc(100% - 32px) !important;}
:root[data-skin="chisto"] .drive-end {background: var(--ch-inv) !important; color: var(--ch-on-inv) !important; min-height: 64px !important; border-radius: 20px !important;}
:root[data-skin="chisto"] .drive-all {border: 0 !important; color: var(--ch-pri) !important;}
:root[data-skin="chisto"] .drive-all .ic {display: none;}
:root[data-skin="chisto"] .f-list {background: transparent !important; padding: 0 !important;}
:root[data-skin="chisto"] .f-row {border: 0 !important; min-height: 64px; padding: 8px 16px 8px 20px !important; gap: 16px !important; background: transparent !important;}
:root[data-skin="chisto"] .f-row .f-ic {width: auto !important; height: auto !important; background: transparent !important; color: var(--ch-on-v) !important; border-radius: 0 !important;}
:root[data-skin="chisto"] .f-row .grow b {font-weight: 400 !important; font-size: 1rem;}
:root[data-skin="chisto"] .f-row .grow small {font-size: .8125rem;}
:root[data-skin="chisto"] .f-row .f-val {font-weight: 700 !important; color: var(--ch-on) !important;}
:root[data-skin="chisto"] .f-card {padding: 8px 0 !important;}
:root[data-skin="chisto"] .f-card .card-title {padding: 12px 20px 4px !important; margin: 0 !important;}
:root[data-skin="chisto"] .f-card .card-title h3 {font-size: .875rem !important; font-weight: 600 !important;}
:root[data-skin="chisto"] .f-card .card-title .num {font-weight: 700 !important; font-size: .95rem !important;}
:root[data-skin="chisto"] .f-card .f-list {background: transparent !important; border-radius: 0 !important; padding: 0 !important;}
:root[data-skin="chisto"] [data-sec="data"] .f-row:has(.f-val) .grow b {font-size: .8125rem !important; color: var(--ch-on-v) !important;}
:root[data-skin="chisto"] [data-sec="data"] .f-row:has(.f-val) {display: grid !important; grid-template-columns: auto 1fr auto; grid-template-areas: "ic t btn" "ic v btn"; align-items: center; row-gap: 0;}
:root[data-skin="chisto"] [data-sec="data"] .f-row:has(.f-val) > .f-ic {grid-area: ic;}
:root[data-skin="chisto"] [data-sec="data"] .f-row:has(.f-val) > .grow {grid-area: t;}
:root[data-skin="chisto"] [data-sec="data"] .f-row:has(.f-val) > .f-val {grid-area: v; font-size: 1rem; justify-self: start;}
:root[data-skin="chisto"] [data-sec="data"] .f-row:has(.f-val) > .f-btn {grid-area: btn;}
:root[data-skin="chisto"] .time-in {background: transparent !important; border: 0 !important; padding: 0 !important; min-height: 0 !important; font-weight: 600 !important; color: var(--ch-on) !important;}
:root[data-skin="chisto"] .time-in .ic {display: none;}
:root[data-skin="chisto"] .voice-btn {background: var(--ch-pri) !important; color: var(--ch-on-pri) !important; border: 0 !important; min-height: 56px !important;}
:root[data-skin="chisto"] .save-bar {background: var(--ch-c) !important; box-shadow: 0 -1px 0 var(--ch-outline-v) !important; border: 0 !important;}
:root[data-skin="chisto"] .save-bar .btn {background: var(--ch-pri) !important; color: var(--ch-on-pri) !important; border-radius: 16px !important; min-height: 56px;}
:root[data-skin="chisto"] .sheet {background: var(--ch-low) !important; border-radius: 28px 28px 0 0 !important;}
:root[data-skin="chisto"] .sheet-handle, :root[data-skin="chisto"] .sheet::before {background: var(--ch-outline-v) !important;}
:root[data-skin="chisto"] .np-field {background: var(--ch-lowest) !important; border: 2px solid var(--ch-pri) !important; border-radius: 12px !important;}
:root[data-skin="chisto"] .np-field:not(.active) {border: 1px solid var(--ch-outline) !important;}
:root[data-skin="chisto"] .np-val {font-size: 3rem !important; font-weight: 800 !important;}
:root[data-skin="chisto"] .np-key {background: var(--ch-highest) !important; color: var(--ch-on) !important; border-radius: 999px !important; font-size: 1.5rem !important; font-weight: 400 !important; border: 0 !important;}
:root[data-skin="chisto"] .np-key:active {background: var(--ch-outline-v) !important;}
:root[data-skin="chisto"] .toast {background: var(--ch-inv) !important; color: var(--ch-on-inv) !important; border-radius: 8px !important;}
:root[data-skin="chisto"] .pk {background: var(--ch-low) !important;}
:root[data-skin="chisto"] .pk .pk-tbox.on, :root[data-skin="chisto"] .pk .pk-day.on, :root[data-skin="chisto"] .pk .pk-mon.on, :root[data-skin="chisto"] .pk-knob, :root[data-skin="chisto"] .pk-hand, :root[data-skin="chisto"] .pk-center {background: var(--ch-pri) !important; color: var(--ch-on-pri) !important;}
:root[data-skin="chisto"] .month-sum, :root[data-skin="chisto"] .hero {background: var(--ch-pri-c) !important; color: var(--ch-on-pri-c) !important; padding: 24px !important;}
:root[data-skin="chisto"] .hero *, :root[data-skin="chisto"] .month-sum * {border-color: color-mix(in srgb, var(--ch-on-pri-c) 18%, transparent) !important;}
:root[data-skin="chisto"] .hero h1, :root[data-skin="chisto"] .hero-num, :root[data-skin="chisto"] .hero-sub, :root[data-skin="chisto"] .hero .muted, :root[data-skin="chisto"] .hero b, :root[data-skin="chisto"] .month-sum span, :root[data-skin="chisto"] .month-sum b, :root[data-skin="chisto"] .month-sum .muted, :root[data-skin="chisto"] .month-sum p {color: var(--ch-on-pri-c) !important;}
:root[data-skin="chisto"] .hero-num {font-weight: 800 !important; font-size: clamp(2.6rem, 14vw, 3.4rem) !important; letter-spacing: -1px !important;}
:root[data-skin="chisto"] .hero-chip {background: color-mix(in srgb, var(--ch-on-pri-c) 12%, transparent) !important; color: var(--ch-on-pri-c) !important; border: 0 !important; border-radius: 16px !important;}
:root[data-skin="chisto"] .hero-btn {color: var(--ch-on-pri-c) !important; background: transparent !important;}
:root[data-skin="chisto"] .ms-total b {font-size: clamp(2.4rem, 11.5vw, 2.9rem) !important; font-weight: 700 !important;}
:root[data-skin="chisto"] .ms-total b.neg {color: #FFB4AB !important;}
:root[data-skin="chisto"] .month-sum .ms-row b {font-size: 1.25rem; font-weight: 800;}
:root[data-skin="chisto"] .month-sum .ms-row:nth-child(1) b, :root[data-skin="chisto"] .month-sum .ms-row:nth-child(2) b {color: var(--ch-on-pri-c) !important;}
:root[data-skin="chisto"] .fuel-line {background: var(--ch-high) !important; border-radius: 8px !important;}
:root[data-skin="chisto"] .fuel-line .ic {color: var(--ch-on-v) !important;}
:root[data-skin="chisto"] .bar.pos, :root[data-skin="chisto"] .week-bar.pos, :root[data-skin="chisto"] .mc-bar span {fill: var(--ch-pri) !important; background: var(--ch-pri) !important; opacity: 1 !important;}
:root[data-skin="chisto"] .bar.neg {fill: var(--ch-err) !important;}
:root[data-skin="chisto"] .mc-best {background: var(--ch-pri) !important; color: var(--ch-on-pri) !important;}
:root[data-skin="chisto"] .mc-pct.up {background: var(--ch-ter-c); color: var(--ch-on-ter-c) !important; border-radius: 8px; padding: 2px 6px;}
:root[data-skin="chisto"] .mc-pct.down {background: var(--ch-err-c); color: var(--ch-on-err-c) !important; border-radius: 8px; padding: 2px 6px;}
:root[data-skin="chisto"] .shift-amt b.pos, :root[data-skin="chisto"] .pos {color: var(--ch-ter) !important;}
:root[data-skin="chisto"] .neg {color: var(--ch-err) !important;}
:root[data-skin="chisto"] .day-badge {background: var(--ch-highest) !important; color: var(--ch-on) !important; border-radius: 12px !important; border: 0 !important;}
:root[data-skin="chisto"] .day-badge.night {background: var(--ch-pri) !important; color: var(--ch-on-pri) !important;}
:root[data-skin="chisto"] .shift-row {border-color: var(--ch-outline-v) !important;}
:root[data-skin="chisto"] .big-links > [data-k="costs"] .bl-ic {background: var(--ch-err-c) !important; color: var(--ch-err) !important;}
:root[data-skin="chisto"] .big-links > [data-k="excel"] .bl-ic {background: var(--ch-ter-c) !important; color: var(--ch-ter) !important;}
:root[data-skin="chisto"] .big-link {border-radius: 0 !important; background: transparent !important;}
:root[data-skin="chisto"] .big-links {background: var(--ch-low); border-radius: 28px; padding: 6px 0; overflow: hidden;}
:root[data-skin="chisto"] .big-links > * + * .big-link, :root[data-skin="chisto"] .big-links > .big-link + .big-link {border-top: 0 !important;}
:root[data-skin="chisto"] .cover {background: var(--ch-pri-c) !important; color: var(--ch-on-pri-c) !important;}
:root[data-skin="chisto"] .cover * {color: inherit;}
:root[data-skin="chisto"] .list-btn.danger .l-ic {background: var(--ch-err-c) !important; color: var(--ch-err) !important;}
:root[data-skin="chisto"] .hap.good .hap-ic {background: var(--ch-ter-c) !important; color: var(--ch-on-ter-c) !important;}
:root[data-skin="chisto"] .hap.bad .hap-ic {background: var(--ch-err-c) !important; color: var(--ch-on-err-c) !important;}
:root[data-skin="chisto"] .result-net {color: var(--ch-ter) !important; font-weight: 800 !important;}
:root[data-skin="chisto"] .result-net.neg {color: var(--ch-err) !important;}
:root[data-skin="chisto"] .result-goal {background: var(--ch-pri-c) !important; color: var(--ch-on-pri-c) !important; border-radius: 20px !important;}
:root[data-skin="chisto"] .result-goal * {color: var(--ch-on-pri-c) !important;}
:root[data-skin="chisto"] .adm-nav a.on {background: var(--ch-sec-c) !important; color: var(--ch-on-sec-c) !important;}
:root[data-skin="chisto"] .adm-tab.on {color: var(--ch-pri) !important; border-bottom-color: var(--ch-pri) !important;}
:root[data-skin="chisto"] .adm-tab.on .count {background: var(--ch-sec-c) !important; color: var(--ch-on-sec-c) !important;}
:root[data-skin="chisto"] .gsearch .input {background: var(--ch-high) !important;}
:root[data-skin="chisto"] .top {margin-bottom: 12px !important; gap: 8px !important; justify-content: flex-start !important;}
:root[data-skin="chisto"] .top .back {width: 48px; height: 48px; justify-content: center; margin-left: -12px; color: var(--ch-on) !important;}
:root[data-skin="chisto"] .top .back .back-txt {display: none;}
:root[data-skin="chisto"] .top-title h1 {font-size: 1.375rem !important; line-height: 1.3; font-weight: 500 !important;}
:root[data-skin="chisto"] .top-title p {font-size: .8125rem !important; color: var(--ch-on-v) !important;}
:root[data-skin="chisto"] .top .icon-btn {margin-left: auto;}
:root[data-skin="chisto"] .f-row.f-timerow {display: grid !important; grid-template-columns: auto 1fr; grid-template-areas: "ic t" "ic v"; align-items: center; row-gap: 0; cursor: pointer;}
:root[data-skin="chisto"] .f-row.f-timerow > .f-ic {grid-area: ic;}
:root[data-skin="chisto"] .f-row.f-timerow > .grow {grid-area: t;}
:root[data-skin="chisto"] .f-row.f-timerow > .grow b {font-size: .8125rem !important; color: var(--ch-on-v) !important;}
:root[data-skin="chisto"] .f-row.f-timerow > .pk-field, :root[data-skin="chisto"] .f-row.f-timerow > input {grid-area: v; justify-self: start; border: 0 !important; background: transparent !important; padding: 0 !important; min-height: 0 !important; height: auto !important; font-weight: 600 !important; font-size: 1rem !important; color: var(--ch-on) !important; box-shadow: none !important;}
:root[data-skin="chisto"] .f-row.f-timerow .pk-field .ic, :root[data-skin="chisto"] .f-row.f-timerow .pk-field svg {display: none !important;}
:root[data-skin="chisto"] [data-sec="data"] .f-btn.has {display: none !important;}
:root[data-skin="chisto"] .f-card .f-btn .fb-plus {display: none;}
:root[data-skin="chisto"] .f-note .f-input {border: 0 !important; background: transparent !important; padding: 0 !important;}
:root[data-skin="chisto"] .f-note:has(.f-input:placeholder-shown) .grow b {font-size: 1rem !important; color: var(--ch-on) !important;}
:root[data-skin="chisto"] .f-tools {display: grid !important; grid-template-columns: 1fr 1fr; gap: 8px !important; margin: 12px 0 0 !important;}
:root[data-skin="chisto"] .f-tools .btn {background: var(--ch-high) !important; border: 0 !important; color: var(--ch-on) !important; min-height: 48px !important;}
:root[data-skin="chisto"] .auto-note {display: flex; gap: 8px; align-items: flex-start; color: var(--ch-on-v) !important; font-size: .8125rem !important; margin: 12px 8px !important; background: transparent !important;}
:root[data-skin="chisto"] .page-title {display: flex !important; justify-content: space-between !important; align-items: center !important; margin: 8px 8px 12px !important;}
:root[data-skin="chisto"] .page-title h1 {font-size: 2.25rem !important; font-weight: 500 !important;}
:root[data-skin="chisto"] .month-pick {border: 1px solid var(--ch-outline) !important; color: var(--ch-on) !important; border-radius: 12px !important;}
:root[data-skin="chisto"] .ms-stack {display: flex; flex-direction: column; gap: 12px;}
:root[data-skin="chisto"] .month-sum {display: flex; flex-direction: column; gap: 0;}
:root[data-skin="chisto"] .month-sum .ms-total {display: flex; flex-direction: column; align-items: flex-start; gap: 4px; border: 0 !important; padding: 0 !important; margin: 0 0 16px !important;}
:root[data-skin="chisto"] .month-sum .ms-total span {font-size: 1rem; font-weight: 500;}
:root[data-skin="chisto"] .month-sum .ms-cells {display: grid; grid-template-columns: 1fr 1fr; gap: 8px;}
:root[data-skin="chisto"] .month-sum .ms-row {display: flex !important; flex-direction: column; align-items: flex-start !important; gap: 2px; border-radius: 16px; padding: 12px 14px !important; background: color-mix(in srgb, var(--ch-on-pri-c) 9%, transparent); border: 0 !important; margin: 0 !important;}
:root[data-skin="chisto"] .month-sum .ms-row span {font-size: .875rem;}
:root[data-skin="chisto"] .month-sum p {margin: 16px 0 0 !important; font-size: .9375rem !important; line-height: 1.45;}
:root[data-skin="chisto"] .ms-chips {margin-top: 0 !important;}
:root[data-skin="chisto"] .ms-chips .fuel-line {display: inline-flex !important; align-items: center; gap: 8px; height: 32px; padding: 0 12px !important; border-radius: 8px !important; background: var(--ch-highest) !important; font-size: .875rem; margin: 0 !important; border: 0 !important;}
:root[data-skin="chisto"] .ms-chips .fuel-line b {font-weight: 400;}
:root[data-skin="chisto"] .ms-share {height: 32px; display: inline-flex !important; align-items: center; gap: 6px; border: 1px solid var(--ch-outline) !important; color: var(--ch-on) !important; font-weight: 500 !important;}
:root[data-skin="chisto"] .chart-card {position: relative; padding: 20px !important;}
:root[data-skin="chisto"] .chart-card .chart-scale {position: absolute; top: 24px; right: 20px; font-size: .8125rem; color: var(--ch-on-v);}
:root[data-skin="chisto"] .chart-card .card-title h3 {font-size: 1rem !important; font-weight: 600 !important;}
:root[data-skin="chisto"] .chart-tip {font-size: .8125rem; color: var(--ch-on-v);}
:root[data-skin="chisto"] .bars-zero {stroke: var(--ch-outline-v) !important; stroke-dasharray: 6 6;}
:root[data-skin="chisto"] .bar.future {fill: var(--ch-outline-v) !important;}
:root[data-skin="chisto"] .block-head {margin: 24px 8px 8px !important;}
:root[data-skin="chisto"] .block-head h2 {font-size: 1rem !important; font-weight: 600 !important;}
:root[data-skin="chisto"] .block-head .link {font-size: .875rem;}
:root[data-skin="chisto"] .recent-card {padding: 6px 4px !important;}
:root[data-skin="chisto"] .shift-row {border: 0 !important; padding: 10px 12px !important;}
:root[data-skin="chisto"] .shift-amt b {font-size: 1.125rem; font-weight: 800;}
:root[data-skin="chisto"] .shift-amt span {font-size: .75rem; color: var(--ch-on-v);}
:root[data-skin="chisto"] .day-badge {width: 44px !important; height: 48px !important;}
:root[data-skin="chisto"] .shift-meta {font-size: .8125rem; color: var(--ch-on-v);}
:root[data-skin="chisto"] .shift-meta span + span::before {content: '· ';}
:root[data-skin="chisto"] .big-links > * .big-link {padding: 12px 16px !important; min-height: 72px;}
:root[data-skin="chisto"] .big-link .grow b {font-weight: 500 !important; font-size: 1rem;}
:root[data-skin="chisto"] [data-sec="data"] .f-row:has(.f-val), :root[data-skin="chisto"] .f-row.f-timerow {grid-template-rows: auto auto; align-content: center;}
:root[data-skin="chisto"] [data-sec="data"] .f-row .f-val, :root[data-skin="chisto"] .f-row.f-timerow > .pk-field {line-height: 1.35 !important; padding: 0 !important; margin: 0 !important;}
:root[data-skin="chisto"] .f-tools .btn {white-space: nowrap; font-size: .875rem !important; padding: 0 12px !important;}
:root[data-skin="chisto"] .month-sum .ms-total b, :root[data-skin="chisto"] .month-sum .ms-total b:not(.neg) {color: var(--ch-on-pri-c) !important; line-height: 1.1;}
:root[data-skin="chisto"] .month-sum .ms-total b.neg {color: #FFB4AB !important;}
:root[data-skin="chisto"] .chart-card .chart {position: static !important; display: flex; flex-direction: column;}
:root[data-skin="chisto"] .chart-card .chart .bars-labels {order: 3; margin-top: 8px;}
:root[data-skin="chisto"] .chart-card .chart .chart-tip {order: 4; margin-top: 10px;}
:root[data-skin="chisto"] .shift-meta {display: block !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
:root[data-skin="chisto"] .shift-meta span {display: inline !important;}
:root[data-skin="chisto"] .shift-meta span + span::before {content: ' · ';}
:root[data-skin="chisto"] .screen {position: relative;}
:root[data-skin="chisto"] .screen > .sub-back {position: absolute; top: max(6px, env(safe-area-inset-top)); left: 4px; z-index: 2; width: 48px; height: 48px; padding: 0 !important; margin: 0 !important; justify-content: center; font-size: 0 !important; color: var(--ch-on) !important;}
:root[data-skin="chisto"] .screen > .sub-back .ic {width: 24px; height: 24px;}
:root[data-skin="chisto"] .screen > .sub-back ~ .hero-wrap .hero-head, :root[data-skin="chisto"] .screen > .sub-back ~ .top, :root[data-skin="chisto"] .screen > .sub-back ~ .page-title {padding-left: 44px;}
:root[data-skin="chisto"] .hero-head {min-height: 48px; display: flex; align-items: center;}
:root[data-skin="chisto"] .hero-head .hero-top {width: 100%;}
:root[data-skin="chisto"] .hero-head h1 {font-size: 1.375rem !important; font-weight: 500 !important; line-height: 1.3; color: var(--ch-on) !important;}
:root[data-skin="chisto"] .hero-head .hero-sub {font-size: .8125rem !important; color: var(--ch-on-v) !important; margin: 0 !important;}
:root[data-skin="chisto"] .hero-head .hero-btn {color: var(--ch-on) !important; background: transparent !important; border: 0 !important;}
:root[data-skin="chisto"] .hero-wrap .hero-ctl .seg {margin: 0 !important;}
:root[data-skin="chisto"] .hero-wrap .hero-ctl .period-nav {margin-top: 8px !important;}
:root[data-skin="chisto"] .hero-wrap .hero-ctl .period-nav b {color: var(--ch-on) !important;}
:root[data-skin="chisto"] .hero {padding: 20px 24px !important;}
:root[data-skin="chisto"] .hero .hero-label {font-size: .875rem; font-weight: 500; color: var(--ch-on-pri-c) !important;}
:root[data-skin="chisto"] .hero .hero-num {margin: 4px 0 0 !important; color: var(--ch-on-pri-c) !important; line-height: 1.1 !important;}
:root[data-skin="chisto"] .hero .hero-sub, :root[data-skin="chisto"] .hero .hero-line {color: var(--ch-on-pri-c) !important; font-size: .875rem !important; margin-top: 6px;}
:root[data-skin="chisto"] .hero .hero-chips {margin-top: 12px !important; gap: 8px !important;}
:root[data-skin="chisto"] .hero .hero-chip {height: 32px; padding: 0 12px !important; display: inline-flex; align-items: center; gap: 6px; font-size: .8125rem !important; font-weight: 600 !important;}
:root[data-skin="chisto"] [data-page="shifts"] .hero {display: grid; grid-template-columns: 1fr auto; align-items: end; column-gap: 12px;}
:root[data-skin="chisto"] [data-page="shifts"] .hero .hero-num, :root[data-skin="chisto"] [data-page="shifts"] .hero .hero-sub {grid-column: 1;}
:root[data-skin="chisto"] [data-page="shifts"] .hero .hero-chips {grid-column: 2; grid-row: 1 / span 2; margin: 0 !important; align-self: end;}
:root[data-skin="chisto"] [data-page="reservations"] .hero {display: grid; grid-template-columns: auto 1fr; column-gap: 16px; align-items: center;}
:root[data-skin="chisto"] [data-page="reservations"] .hero .hero-num {grid-row: 1 / span 3; font-size: 3.5rem !important; margin: 0 !important;}
:root[data-skin="chisto"] [data-page="reservations"] .hero .hero-sub {margin: 0 !important; font-size: 1rem !important; font-weight: 600;}
:root[data-skin="chisto"] [data-page="reservations"] .hero .hero-line {margin: 0 !important;}
:root[data-skin="chisto"] [data-page="reservations"] .hero .hero-chips {margin-top: 8px !important;}
:root[data-skin="chisto"] .month-head h2 {font-size: 1rem !important; font-weight: 600 !important;}
:root[data-skin="chisto"] .month-head .chip {border: 0 !important; color: var(--ch-on-v) !important; font-weight: 500 !important;}
:root[data-skin="chisto"] .month-head {margin: 16px 8px 8px !important;}
:root[data-skin="chisto"] .fab {background: var(--ch-pri) !important; color: var(--ch-on-pri) !important; border-radius: 16px !important; min-height: 56px; box-shadow: 0 4px 8px 3px rgba(0,0,0,.15), 0 1px 3px rgba(0,0,0,.3) !important;}
:root[data-skin="chisto"] .cover2 {padding: 20px !important; overflow: visible !important;}
:root[data-skin="chisto"] .cover2 .cover-avatar {position: static !important; width: 68px !important; height: 68px !important; border-radius: 18px !important; overflow: hidden; border: 0 !important; background: var(--ch-on-pri-c) !important; color: var(--ch-pri-c) !important; font-size: 1.5rem !important; font-weight: 800 !important; margin: 0 !important; overflow: hidden; display: grid; place-items: center; flex: none;}
:root[data-skin="chisto"] .cover2 .cover-avatar img {width: 100%; height: 100%; object-fit: cover; border-radius: 0 !important; display: block;}
:root[data-skin="chisto"] .cover2 .cover-info h1 {font-size: 1.375rem !important; font-weight: 600 !important; color: var(--ch-on-pri-c) !important;}
:root[data-skin="chisto"] .cover2 .cv-sub {color: var(--ch-on-pri-c); opacity: .85;}
:root[data-skin="chisto"] .cover2 .cv-edit {height: 36px; padding: 0 14px; border-radius: 18px; border: 1px solid var(--ch-on-pri-c); color: var(--ch-on-pri-c) !important; display: inline-flex; align-items: center; font-size: .875rem; font-weight: 600; text-decoration: none;}
:root[data-skin="chisto"] .cover2 .cover-code {position: static !important; display: inline-flex !important; align-items: baseline; gap: 6px; height: 40px; padding: 0 12px; border-radius: 10px; background: color-mix(in srgb, var(--ch-on-pri-c) 12%, transparent) !important; color: var(--ch-on-pri-c) !important; font-size: 1.125rem; font-weight: 800; line-height: 40px;}
:root[data-skin="chisto"] .cover2 .cover-code small {font-size: .875rem; font-weight: 400;}
:root[data-skin="chisto"] .cover2 .plate {height: 40px; display: inline-flex !important; align-items: center; border-radius: 6px !important; background: #fff !important; color: #111 !important; font-weight: 800; padding-right: 10px; overflow: hidden; border: 2px solid #fff;}
:root[data-skin="chisto"] .cover2 .plate em {background: #2B4CC4; color: #fff; align-self: stretch; display: flex; align-items: flex-end; padding: 0 5px 3px; margin-right: 8px; font-size: .55rem; font-style: normal;}
:root[data-skin="chisto"] .cover2 .cover-car {color: var(--ch-on-pri-c) !important; font-size: .9375rem;}
:root[data-skin="chisto"] .cover2 .cover-car .ic {color: var(--ch-on-pri-c);}
:root[data-skin="chisto"] .cover2 .cover-chips .chip.good {background: var(--ch-ter-c) !important; color: var(--ch-on-ter-c) !important; height: 32px; display: inline-flex; align-items: center; padding: 0 12px; border-radius: 16px !important;}
:root[data-skin="chisto"] .screen > .sub-back ~ .page-title {min-height: 48px; margin: 0 0 8px !important; flex-wrap: wrap;}
:root[data-skin="chisto"] .screen > .sub-back ~ .page-title h1 {font-size: 1.375rem !important;}
:root[data-skin="chisto"] .screen > .sub-back ~ .page-title .muted, :root[data-skin="chisto"] .screen > .sub-back ~ .page-title p {width: 100%; font-size: .8125rem !important; margin: 0 !important;}
:root[data-skin="chisto"] [data-page="profile"] .info-row .l-ic, :root[data-skin="chisto"] [data-page="profile"] .info-row > .ic:last-child {display: none !important;}
:root[data-skin="chisto"] .auth .brand-name {font-size: 1.6rem; font-weight: 700; color: var(--ch-on) !important;}
:root[data-skin="chisto"] .auth .brand-name b {color: var(--ch-on) !important;}
:root[data-skin="chisto"] .auth .brand-logo {border-radius: 18px !important;}
:root[data-skin="chisto"] .auth-hero h1 {font-size: 2.25rem !important; font-weight: 500 !important; line-height: 1.22 !important; letter-spacing: -.4px !important;}
:root[data-skin="chisto"] .auth-hero p {color: var(--ch-on-v) !important; font-size: 1rem !important;}
:root[data-skin="chisto"] .auth .field {position: relative; display: block;}
:root[data-skin="chisto"] .auth .field-label {position: absolute; top: -9px; left: 12px; padding: 0 4px; background: var(--ch-bg); font-size: .75rem !important; color: var(--ch-on-v) !important; z-index: 1; font-weight: 400 !important;}
:root[data-skin="chisto"] .auth .field:focus-within .field-label {color: var(--ch-pri) !important;}
:root[data-skin="chisto"] .auth .input {min-height: 56px;}
:root[data-skin="chisto"] .auth a[href*="forgot"], :root[data-skin="chisto"] .auth .link-forgot, :root[data-skin="chisto"] .auth .forgot {text-decoration: none !important; color: var(--ch-pri) !important; font-weight: 600;}
:root[data-skin="chisto"] .auth .demo, :root[data-skin="chisto"] .demo-box {background: var(--ch-sec-c) !important; border: 0 !important; border-radius: 24px !important; color: var(--ch-on-sec-c) !important;}
:root[data-skin="chisto"] .search-pop {display: flex !important; flex-direction: column; gap: 0 !important;}
:root[data-skin="chisto"] .search-pop .chip {border: 0 !important; background: transparent !important; color: var(--ch-on) !important; font-weight: 400 !important; font-size: 1rem !important; justify-content: flex-start; min-height: 56px; padding: 0 8px !important; border-radius: 16px !important; text-align: left; display: flex; align-items: center; gap: 16px;}
:root[data-skin="chisto"] .search-pop .chip::before {content: ''; width: 22px; height: 22px; flex: none; background: currentColor; opacity: .7; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='6.5'/%3E%3Cpath d='m20 20-4.2-4.2'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='6.5'/%3E%3Cpath d='m20 20-4.2-4.2'/%3E%3C/svg%3E") center / contain no-repeat;}
:root[data-skin="chisto"] .seg.seg-wrap {border: 0 !important; display: flex !important; flex-wrap: wrap; gap: 8px !important; overflow: visible;}
:root[data-skin="chisto"] .seg.seg-wrap .seg-btn {flex: none !important; border: 1px solid var(--ch-outline) !important; border-radius: 8px !important; min-height: 32px !important; padding: 0 12px !important; font-size: .875rem !important; background: transparent !important;}
:root[data-skin="chisto"] .seg.seg-wrap .seg-btn.on {background: var(--ch-sec-c) !important; border-color: transparent !important;}
:root[data-skin="chisto"] .np-field {text-align: right;}
:root[data-skin="chisto"] .np-field .np-val {justify-content: flex-end;}
:root[data-skin="chisto"] .cal-day.sel b, :root[data-skin="chisto"] .cal-day.on b, :root[data-skin="chisto"] .cal-day.today.sel b {background: var(--ch-pri) !important; color: var(--ch-on-pri) !important; border-radius: 50% !important;}
:root[data-skin="chisto"] .cal-day.today:not(.sel) b {box-shadow: inset 0 0 0 1px var(--ch-pri); border-radius: 50%;}
:root[data-skin="chisto"] .dot-shift {background: var(--ch-pri) !important;}
:root[data-skin="chisto"] .dot-pay {background: var(--ch-err) !important;}
:root[data-skin="chisto"] .dot-res {background: var(--ch-ter) !important;}
:root[data-skin="chisto"] .dot-rem {background: var(--ch-outline) !important;}
:root[data-skin="chisto"] .mcmp .mc-row {border: 0 !important; border-radius: 16px !important; padding: 12px !important; margin: 2px -4px !important; background: transparent !important;}
:root[data-skin="chisto"] .mcmp .mc-row .mc-bar {display: none !important;}
:root[data-skin="chisto"] .mcmp .mc-row .num, :root[data-skin="chisto"] .mcmp .mc-row .num.pos {color: var(--ch-on) !important; font-weight: 800 !important;}
:root[data-skin="chisto"] .mcmp .mc-row .num.neg {color: var(--ch-err) !important;}
:root[data-skin="chisto"] .mcmp .mc-name {font-weight: 500 !important; color: var(--ch-on) !important; text-decoration: none !important;}
:root[data-skin="chisto"] .mcmp .mc-name small {display: block; color: var(--ch-on-v);}
:root[data-skin="chisto"] .mcmp .mc-row.sel:not(.best) {background: var(--ch-high) !important;}
:root[data-skin="chisto"] .mcmp .mc-row.best {background: var(--ch-pri) !important;}
:root[data-skin="chisto"] .mcmp .mc-row.best .mc-name, :root[data-skin="chisto"] .mcmp .mc-row.best .num {color: var(--ch-on-pri) !important;}
:root[data-skin="chisto"] .mcmp .mc-row.best .mc-best {display: block; background: transparent !important; color: var(--ch-on-pri) !important; padding: 0 !important; font-size: .75rem; font-weight: 600;}
:root[data-skin="chisto"] .mcmp .mc-row.best .mc-best .ic {display: none;}
:root[data-skin="chisto"] .mc-pct {font-size: .75rem !important; font-weight: 600 !important;}
:root[data-skin="chisto"] .adm-nav a {min-height: 44px; padding-top: 0 !important; padding-bottom: 0 !important;}
:root[data-skin="chisto"] .adm-nav .count {line-height: 20px; height: 20px; display: inline-flex; align-items: center;}
:root[data-skin="chisto"] .adm-head h1, :root[data-skin="chisto"] .adm-title h1 {font-weight: 500 !important;}
:root[data-skin="chisto"] .tbl th {color: var(--ch-on-v) !important; font-weight: 600 !important;}
:root[data-skin="chisto"] .tbl tr {border-color: var(--ch-outline-v) !important;}
:root[data-skin="chisto"][data-theme="dark"], :root[data-skin="chisto"][data-theme="dark"] [data-page] {--bg: var(--ch-bg); --surface: var(--ch-lowest); --surface-2: var(--ch-c); --surface-3: var(--ch-highest); --line: var(--ch-outline-v); --text: var(--ch-on); --muted: var(--ch-on-v); --faint: var(--ch-outline); --accent: var(--ch-pri); --accent-press: #000000; --accent-ink: var(--ch-on-pri); --accent-soft: var(--ch-sec-c); --accent-text: var(--ch-pri); --g-cont: var(--ch-low); --g-cont-hi: var(--ch-high); --g-in: var(--ch-lowest); --g-sec: var(--ch-sec-c); --g-on-sec: var(--ch-on-sec-c); --g-outline: var(--ch-outline); --g-outline-v: var(--ch-outline-v); --g-hero: var(--ch-pri-c); --g-hero-ink: var(--ch-on-pri-c); --g-go: var(--ch-pri); --g-go-ink: var(--ch-on-pri); --g-warn: var(--ch-err-c); --g-on-warn: var(--ch-on-err-c); --g-yellow: var(--ch-on-pri-c); --pos: var(--ch-ter); --pos-soft: var(--ch-ter-c); --neg: var(--ch-err); --neg-soft: var(--ch-err-c); --pc: var(--ch-pri); --violet: var(--ch-pri); --v-soft: var(--ch-sec-c); --v-line: var(--ch-outline-v); --v-strong: var(--ch-outline-v); --c-green: var(--ch-ter); --c-red: var(--ch-err); --c-blue: var(--ch-on-v); --c-violet: var(--ch-on-v); --c-amber: var(--ch-on-v); --c-orange: var(--ch-on-v); --c-teal: var(--ch-on-v); --c-sky: var(--ch-on-v); --c-pink: var(--ch-on-v); --c-slate: var(--ch-on-v); --c-gray: var(--ch-outline); --font: -apple-system, BlinkMacSystemFont, system-ui, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; --display: var(--font);}
@media (prefers-color-scheme: dark) {
:root[data-skin="chisto"]:not([data-theme="light"]):not([data-theme="sun"]), :root[data-skin="chisto"]:not([data-theme="light"]):not([data-theme="sun"]) [data-page] {--bg: var(--ch-bg); --surface: var(--ch-lowest); --surface-2: var(--ch-c); --surface-3: var(--ch-highest); --line: var(--ch-outline-v); --text: var(--ch-on); --muted: var(--ch-on-v); --faint: var(--ch-outline); --accent: var(--ch-pri); --accent-press: #000000; --accent-ink: var(--ch-on-pri); --accent-soft: var(--ch-sec-c); --accent-text: var(--ch-pri); --g-cont: var(--ch-low); --g-cont-hi: var(--ch-high); --g-in: var(--ch-lowest); --g-sec: var(--ch-sec-c); --g-on-sec: var(--ch-on-sec-c); --g-outline: var(--ch-outline); --g-outline-v: var(--ch-outline-v); --g-hero: var(--ch-pri-c); --g-hero-ink: var(--ch-on-pri-c); --g-go: var(--ch-pri); --g-go-ink: var(--ch-on-pri); --g-warn: var(--ch-err-c); --g-on-warn: var(--ch-on-err-c); --g-yellow: var(--ch-on-pri-c); --pos: var(--ch-ter); --pos-soft: var(--ch-ter-c); --neg: var(--ch-err); --neg-soft: var(--ch-err-c); --pc: var(--ch-pri); --violet: var(--ch-pri); --v-soft: var(--ch-sec-c); --v-line: var(--ch-outline-v); --v-strong: var(--ch-outline-v); --c-green: var(--ch-ter); --c-red: var(--ch-err); --c-blue: var(--ch-on-v); --c-violet: var(--ch-on-v); --c-amber: var(--ch-on-v); --c-orange: var(--ch-on-v); --c-teal: var(--ch-on-v); --c-sky: var(--ch-on-v); --c-pink: var(--ch-on-v); --c-slate: var(--ch-on-v); --c-gray: var(--ch-outline); --font: -apple-system, BlinkMacSystemFont, system-ui, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; --display: var(--font);}
}
:root[data-skin="chisto"] .win {background: var(--ch-lowest) !important; border-radius: 16px !important;}
:root[data-skin="chisto"] .win:nth-child(1) {background: var(--ch-pri) !important; color: var(--ch-on-pri) !important;}
:root[data-skin="chisto"] .win:nth-child(1) * {color: var(--ch-on-pri) !important;}
:root[data-skin="chisto"] .win .win-rank {background: var(--ch-highest) !important; color: var(--ch-on) !important; border-radius: 50% !important;}
:root[data-skin="chisto"] .win:nth-child(1) .win-rank {background: var(--ch-on-pri) !important; color: var(--ch-pri) !important;}
:root[data-skin="chisto"] .wd-fill, :root[data-skin="chisto"] .hours span {background: var(--ch-outline-v) !important;}
:root[data-skin="chisto"] .wd-row.best .wd-fill, :root[data-skin="chisto"] .hours span.best {background: var(--ch-pri) !important;}
:root[data-skin="chisto"] .hours span.none {background: var(--ch-highest) !important;}
:root[data-skin="chisto"] .shift-cta {z-index: auto !important;}
:root[data-skin="chisto"] .btn-ok, :root[data-skin="chisto"] .btn.btn-ok {background: var(--ch-sec-c) !important; color: var(--ch-on-sec-c) !important; border: 0 !important;}
:root[data-skin="chisto"] .count.alert, :root[data-skin="chisto"] .adm-tab .count.alert, :root[data-skin="chisto"] .adm-nav .count.alert {background: var(--ch-err-c) !important; color: var(--ch-on-err-c) !important;}
:root[data-skin="chisto"] .seg.seg-outline {border: 1px solid var(--ch-outline) !important; border-radius: 999px !important; gap: 0 !important; overflow: hidden; display: flex !important;}
:root[data-skin="chisto"] .seg.seg-outline .seg-btn {border: 0 !important; border-left: 1px solid var(--ch-outline) !important; border-radius: 0 !important; flex: 1 1 0 !important; min-width: 0; white-space: nowrap; font-size: .8125rem !important; padding: 0 4px !important; min-height: 40px;}
:root[data-skin="chisto"] .seg.seg-outline .seg-btn:first-child {border-left: 0 !important;}
:root[data-skin="chisto"] .seg.seg-outline .seg-btn.on {background: var(--ch-sec-c) !important;}
:root[data-skin="chisto"] .seg .seg-btn.on::before {content: '✓\00a0';}
:root[data-skin="chisto"] .seg.seg-sm .seg-btn {font-size: .8125rem !important; padding: 0 2px !important; white-space: nowrap; min-width: 0;}
:root[data-skin="chisto"] .f-tools {grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;}
:root[data-skin="chisto"] .f-tools .btn {min-width: 0; white-space: normal !important; line-height: 1.2;}
:root[data-skin="chisto"] .due-card {gap: 12px !important;}
:root[data-skin="chisto"] .due-card .btn {padding: 0 12px !important; font-size: .8125rem !important;}
:root[data-skin="chisto"] .due-card .btn .ic {width: 16px; height: 16px;}
:root[data-skin="chisto"] .due-card .next-sub {font-size: .875rem;}
:root[data-skin="chisto"] [data-sec="data"] .f-row:has(.f-val), :root[data-skin="chisto"] .f-row.f-timerow {min-height: 0 !important; padding-top: 10px !important; padding-bottom: 10px !important;}
:root[data-skin="chisto"] .f-row.f-timerow > .pk-field {gap: 0 !important; text-indent: 0 !important;}
:root[data-skin="chisto"] .f-row.f-timerow > .pk-field .pk-fi {display: none !important;}
:root[data-skin="chisto"] .f-row.f-timerow > .pk-field .pk-fv {margin: 0 !important; padding: 0 !important;}
:root[data-skin="chisto"] .f-row .f-ic .ic {width: 22px !important; height: 22px !important;}
:root[data-skin="chisto"] [data-page="profile"] .section-title + .card > .card-title:first-child {display: none !important;}
:root[data-skin="chisto"] [data-page="profile"] .setting {padding: 14px 0 !important;}
:root[data-skin="chisto"] [data-page="profile"] .setting + p {margin: 0 0 12px !important; padding: 0 4px;}
:root[data-skin="chisto"] .shift-meta {font-size: .75rem !important;}
:root[data-skin="chisto"] .chart {display: flex !important; flex-direction: column;}
:root[data-skin="chisto"] .chart .bars-labels {order: 3; margin-top: 6px;}
:root[data-skin="chisto"] .chart .chart-tip {order: 4; margin-top: 10px;}
:root[data-skin="chisto"] .mcmp .mc-top {display: grid !important; grid-template-columns: minmax(0, 1fr) auto 78px; align-items: center; gap: 8px;}
:root[data-skin="chisto"] .mcmp .mc-top .mc-pct {justify-self: end; white-space: nowrap;}
:root[data-skin="chisto"] .mcmp .mc-name {min-width: 0;}
:root[data-skin="chisto"] .hero-chip {white-space: nowrap; justify-content: flex-start; font-size: .75rem !important;}
:root[data-skin="chisto"] .option-grid:has(> :nth-child(2):last-child) {grid-template-columns: 1fr 1fr !important;}
:root[data-skin="chisto"] .search-link, :root[data-skin="chisto"] .search-link span {font-weight: 400 !important; color: var(--ch-on-v) !important;}
:root[data-skin="chisto"] .leaflet-container, :root[data-skin="chisto"] .map, :root[data-skin="chisto"] .hmap {background: var(--ch-high) !important;}
:root[data-skin="chisto"] .hero .hero-chip {max-width: 100%; white-space: normal !important; height: auto !important; min-height: 32px; padding: 6px 12px !important; line-height: 1.3; text-align: left;}
:root[data-skin="chisto"] .shift-meta {white-space: normal !important; overflow: visible !important;}
:root[data-skin="chisto"] [data-sec="data"] .f-row .grow, :root[data-skin="chisto"] .f-row.f-timerow .grow {min-height: 0 !important; line-height: 1.2 !important; padding: 0 !important; margin: 0 !important;}
:root[data-skin="chisto"] [data-sec="data"] .f-row .grow b, :root[data-skin="chisto"] .f-row.f-timerow .grow b {line-height: 1.2 !important; display: block;}
:root[data-skin="chisto"] .theme-fab {background: var(--ch-high) !important; color: var(--ch-on) !important; box-shadow: none !important;}
:root[data-skin="chisto"] .nav-theme, :root[data-skin="chisto"] .g-search-row .theme-toggle {background: var(--ch-high) !important; color: var(--ch-on) !important; border: 0;}
:root[data-skin="chisto"] .nav.nav-3 {grid-template-columns: repeat(3, minmax(0, 1fr)) !important; padding-right: 0;}
:root[data-skin="chisto"] .meter-value, :root[data-skin="chisto"] .hero-num, :root[data-skin="chisto"] .ms-total b, :root[data-skin="chisto"] .wk-num, :root[data-skin="chisto"] .stat-value, :root[data-skin="chisto"] .drive-timer, :root[data-skin="chisto"] .result-net, :root[data-skin="chisto"] .np-val {font-weight: 800 !important; letter-spacing: -.02em !important; font-variant-numeric: proportional-nums !important;}
:root[data-skin="chisto"] body, :root[data-skin="chisto"] .screen, :root[data-skin="chisto"] .adm-main {font-variant-numeric: proportional-nums !important; font-feature-settings: 'pnum' 1;}
:root[data-skin="chisto"] .meter-value, :root[data-skin="chisto"] .hero-num, :root[data-skin="chisto"] .ms-total b, :root[data-skin="chisto"] .wk-num, :root[data-skin="chisto"] .stat-value, :root[data-skin="chisto"] .np-val, :root[data-skin="chisto"] .num, :root[data-skin="chisto"] b {font-feature-settings: 'pnum' 1;}
:root[data-skin="chisto"] .drive-timer, :root[data-skin="chisto"] .timer, :root[data-skin="chisto"] .tbl td {font-variant-numeric: tabular-nums !important; font-feature-settings: 'tnum' 1 !important;}
@media (min-width: 1000px) {
:root[data-skin="chisto"] .adm-side {background: #231F20 !important; color: #F5EFEF;}
:root[data-skin="chisto"] .adm-side .brand-name, :root[data-skin="chisto"] .adm-side .brand-name b, :root[data-skin="chisto"] .adm-side .who {color: #F5EFEF !important;}
:root[data-skin="chisto"] .adm-side .adm-badge {border-color: rgba(255,255,255,.25) !important; color: #E5E0E0 !important; background: transparent !important;}
:root[data-skin="chisto"] .adm-side .adm-nav a {color: #CEC6C7 !important;}
:root[data-skin="chisto"] .adm-side .adm-nav a:hover {background: rgba(255,255,255,.07) !important;}
:root[data-skin="chisto"] .adm-side .adm-nav a.on {background: #FFFFFF !important; color: #231F20 !important;}
:root[data-skin="chisto"] .adm-side .adm-nav .count {background: rgba(255,255,255,.12) !important; color: #F5EFEF !important;}
:root[data-skin="chisto"] .adm-side .adm-nav a.on .count {background: #231F20 !important; color: #fff !important;}
:root[data-skin="chisto"] .adm-side .adm-nav .count.alert {background: #FFB4AB !important; color: #410002 !important;}
:root[data-skin="chisto"] .adm-side .icon-btn {color: #E5E0E0 !important;}
:root[data-skin="chisto"] .adm-side .sf-out {background: transparent !important; color: #F5EFEF !important; border: 1px solid rgba(255,255,255,.3) !important;}
:root[data-skin="chisto"][data-theme="dark"] .adm-side {background: #0D0C0C !important; box-shadow: 1px 0 0 #2F2C2C;}
}
:root[data-skin="chisto"] .adm-head h1 {font-size: 2rem !important; font-weight: 700 !important; letter-spacing: -.5px !important;}
:root[data-skin="chisto"] .adm-head p {color: var(--ch-on-v) !important;}
:root[data-skin="chisto"] .big-num b, :root[data-skin="chisto"] .kpi-value, :root[data-skin="chisto"] .kpi-big {font-weight: 800 !important; letter-spacing: -.03em;}
:root[data-skin="chisto"] .adm-nav .count {min-width: 22px; justify-content: center;}
:root[data-skin="chisto"] .tbl tbody tr:hover {background: var(--ch-c);}
:root[data-skin="chisto"] .scope-bar {background: var(--ch-low) !important;}
:root[data-skin="chisto"] .onshift .count.live {background: var(--ch-ter-c) !important; color: var(--ch-on-ter-c) !important; padding: 0 10px; border-radius: 999px; font-weight: 700;}
:root[data-skin="chisto"] .os-list, :root[data-skin="chisto"] .feed-list {display: flex; flex-direction: column;}
:root[data-skin="chisto"] .os-row, :root[data-skin="chisto"] .feed-row {display: flex; align-items: center; gap: 12px; padding: 10px 4px; text-decoration: none; color: var(--ch-on); border-top: 1px solid var(--ch-outline-v);}
:root[data-skin="chisto"] .os-row:first-child, :root[data-skin="chisto"] .feed-row:first-child {border-top: 0;}
:root[data-skin="chisto"] .os-row .live-dot {width: 10px; height: 10px; border-radius: 50%; background: #2F9E44; flex: none;}
:root[data-skin="chisto"] .os-row .grow, :root[data-skin="chisto"] .feed-row .grow {min-width: 0; display: flex; flex-direction: column;}
:root[data-skin="chisto"] .os-row small, :root[data-skin="chisto"] .feed-row small {color: var(--ch-on-v); font-size: .8125rem;}
:root[data-skin="chisto"] .os-time {text-align: right; display: flex; flex-direction: column;}
:root[data-skin="chisto"] .feed-ic {width: 32px; height: 32px; border-radius: 50%; background: var(--ch-highest); display: grid; place-items: center; flex: none; color: var(--ch-on);}
:root[data-skin="chisto"] .feed-row .grow {display: block; font-size: .9rem;}
:root[data-skin="chisto"] .feed-ago {white-space: nowrap;}
:root[data-skin="chisto"] .keys {display: flex; flex-direction: column; gap: 10px;}
:root[data-skin="chisto"] .key-row {display: flex; align-items: center; gap: 14px;}
:root[data-skin="chisto"] .key-row kbd {min-width: 72px; text-align: center; padding: 6px 10px; border-radius: 8px; background: var(--ch-highest); font: inherit; font-weight: 700;}
:root[data-skin="chisto"] .adm-side .sf-theme {display: none !important;}
@media (max-width: 699px) {
:root[data-skin="chisto"] body.admin .seg:not(.seg-wrap) {display: flex !important; overflow-x: auto !important; scrollbar-width: none; flex-wrap: nowrap !important;}
:root[data-skin="chisto"] body.admin .seg:not(.seg-wrap)::-webkit-scrollbar {display: none;}
:root[data-skin="chisto"] body.admin .seg:not(.seg-wrap) .seg-btn {flex: 0 0 auto !important; padding: 0 14px !important; white-space: nowrap;}
}
:root[data-skin="chisto"] .seg.seg-outline.seg-wrap {border: 0 !important; border-radius: 0 !important; overflow: visible !important; flex-wrap: wrap !important; gap: 8px !important; display: flex !important;}
:root[data-skin="chisto"] .seg.seg-outline.seg-wrap .seg-btn {flex: 0 0 auto !important; border: 1px solid var(--ch-outline) !important; border-radius: 8px !important; min-height: 36px; padding: 0 12px !important; white-space: nowrap;}
:root[data-skin="chisto"] .seg.seg-outline.seg-wrap .seg-btn.on {border-color: transparent !important;}
:root[data-skin="chisto"] .meter > .meter-hours {order: 5; font-size: .9375rem; color: var(--ch-on-pri-c); opacity: .8; margin-top: 6px; line-height: 1.4;}
:root[data-skin="chisto"] .meter .meter-goal b {white-space: nowrap;}
:root[data-skin="chisto"] .screen > .sub-back + .first-tip {margin-top: 52px !important;}
:root[data-skin="chisto"] .cover2.has-car .cv-photo {display: block; margin: 16px -20px; padding: 0; border: 0; background: #111; cursor: pointer; aspect-ratio: 16 / 10; overflow: hidden;}
:root[data-skin="chisto"] .cover2.has-car .cv-photo img {width: 100%; height: 100%; object-fit: cover; display: block;}
:root[data-skin="chisto"] .cover2 .cv-carbtn {position: absolute; right: 16px; bottom: 16px; z-index: 2; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: rgba(0,0,0,.55); color: #fff !important; border: 1px solid rgba(255,255,255,.5); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);}
:root[data-skin="chisto"] .cover2:not(.has-car) .cv-carbtn {background: color-mix(in srgb, var(--ch-on-pri-c) 12%, transparent); border: 0;}
:root[data-skin="chisto"] .cover2 {position: relative;}
:root[data-skin="chisto"] .meter .meter-value, :root[data-skin="chisto"] .month-sum .ms-total b {font-size: clamp(2.4rem, 11.5vw, 2.9rem) !important; font-weight: 700 !important; line-height: 1.05 !important; letter-spacing: -1px !important;}
:root[data-skin="chisto"] .meter .meter-label, :root[data-skin="chisto"] .month-sum .ms-total span {font-size: 1rem !important; font-weight: 500 !important;}
:root[data-skin="chisto"] .meter .meter-goal, :root[data-skin="chisto"] .month-sum p {font-size: 1rem !important; line-height: 1.45 !important;}
:root[data-skin="chisto"] .meter > .meter-hours {font-size: .9375rem !important;}
:root[data-skin="chisto"] .month-sum .ms-row span, :root[data-skin="chisto"] .meter-forecast small {font-size: .875rem !important;}
:root[data-skin="chisto"] .month-sum .ms-row b, :root[data-skin="chisto"] .meter-forecast b {font-size: 1.375rem !important; font-weight: 800 !important;}
:root[data-skin="chisto"] .screen > .tab-head {min-height: 76px !important; height: 76px; margin: 0 0 14px !important; padding: 0 4px !important; display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px; box-sizing: border-box;}
:root[data-skin="chisto"] .screen > .tab-head h1 {font-size: 2rem !important; font-weight: 500 !important; line-height: 1.15 !important; letter-spacing: -.02em !important; margin: 0 !important;}
:root[data-skin="chisto"] .screen > .tab-head .date {font-size: .9375rem !important; color: var(--ch-on-v) !important; margin-top: 2px;}
:root[data-skin="chisto"] .screen.tab-in {animation: tabIn .22s ease-out;}
@keyframes tabIn {
:root[data-skin="chisto"] from {opacity: 0; transform: translateY(4px);}
:root[data-skin="chisto"] to {opacity: 1; transform: none;}
}
@media (prefers-reduced-motion: reduce) {
:root[data-skin="chisto"] .screen.tab-in {animation: none;}
}
:root[data-skin="chisto"] .cover2 .cover-info {min-width: 0;}
:root[data-skin="chisto"] .cover2 .cover-info h1, :root[data-skin="chisto"] .cover2 .cv-sub {white-space: normal !important; overflow: visible !important; text-overflow: clip !important; overflow-wrap: anywhere; line-height: 1.2 !important;}
:root[data-skin="chisto"] .cover.cover3 {padding: 0 !important; overflow: hidden !important; background: var(--ch-pri-c) !important; color: var(--ch-on-pri-c) !important;}
:root[data-skin="chisto"] .cover3 .c3-bar {display: flex; align-items: center; gap: 10px; padding: 10px 14px 10px 16px; min-height: 52px; color: var(--ch-on-pri-c) !important; text-decoration: none;}
:root[data-skin="chisto"] .cover3 .c3-who {display: flex; flex-direction: column; min-width: 0; flex: 1; line-height: 1.2;}
:root[data-skin="chisto"] .cover3 .c3-who b {font-size: 1rem; font-weight: 700; color: #fff !important;}
:root[data-skin="chisto"] .cover3 .c3-who small {font-size: .78rem; opacity: .75; color: #fff !important;}
:root[data-skin="chisto"] .cover3 .c3-edit {flex: none; height: 30px; padding: 0 12px; border-radius: 15px; border: 1px solid rgba(255,255,255,.5); color: #fff !important; display: inline-flex; align-items: center; font-size: .8125rem; font-weight: 600; text-decoration: none;}
:root[data-skin="chisto"] .cover3 .c3-photo {position: relative; aspect-ratio: 16 / 10; background: #111;}
:root[data-skin="chisto"] .cover3 .c3-photo.empty {aspect-ratio: auto; height: 120px; display: flex; align-items: center; justify-content: center; background: color-mix(in srgb, var(--ch-on-pri-c) 8%, transparent);}
:root[data-skin="chisto"] .cover3 .c3-car {width: 100%; height: 100%; object-fit: cover; display: block;}
:root[data-skin="chisto"] .cover3 .c3-avatar {position: absolute; left: 12px; top: 12px; width: 56px; height: 56px; padding: 0; border-radius: 14px; overflow: hidden; border: 2px solid #fff; background: var(--ch-on-pri-c); color: var(--ch-pri-c); font-weight: 700; font-size: 1.2rem; display: grid; place-items: center; box-shadow: 0 2px 8px rgba(0,0,0,.35);}
:root[data-skin="chisto"] .cover3 .c3-avatar img {width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 0 !important;}
:root[data-skin="chisto"] .cover3 .c3-cam {position: absolute; right: 10px; bottom: 10px; width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: rgba(0,0,0,.55); color: #fff; border: 1px solid rgba(255,255,255,.5); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);}
:root[data-skin="chisto"] .cover3 .c3-addcar {display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px; border-radius: 20px; border: 1px dashed rgba(255,255,255,.5); background: transparent; color: #fff; font-weight: 600; font-size: .875rem;}
:root[data-skin="chisto"] .cover3 .c3-bot {font-size: .875rem; min-height: 44px; padding-top: 8px; padding-bottom: 8px;}
:root[data-skin="chisto"] .cover3 .c3-bot span {white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0;}
:root[data-skin="chisto"] .cover3 .c3-bar {position: relative; justify-content: center; text-align: center; padding: 12px 48px; min-height: 60px; background: linear-gradient(180deg, color-mix(in srgb, #fff 6%, transparent), transparent);}
:root[data-skin="chisto"] .cover3 .c3-top {border-bottom: 1px solid rgba(255,255,255,.08);}
:root[data-skin="chisto"] .cover3 .c3-bot {border-top: 1px solid rgba(255,255,255,.08); background: linear-gradient(0deg, color-mix(in srgb, #fff 6%, transparent), transparent);}
:root[data-skin="chisto"] .cover3 .c3-who {align-items: center; flex: 0 1 auto;}
:root[data-skin="chisto"] .cover3 .c3-who b {font-size: 1.15rem !important; letter-spacing: -.01em;}
:root[data-skin="chisto"] .cover3 .c3-who small {font-size: .875rem !important; opacity: .8; margin-top: 2px;}
:root[data-skin="chisto"] .cover3 .c3-edit {position: absolute; right: 12px; top: 50%; transform: translateY(-50%); width: 34px; height: 34px; padding: 0; border-radius: 50%; justify-content: center; border: 1px solid rgba(255,255,255,.35);}
:root[data-skin="chisto"] .cover3 .c3-bot {font-size: 1rem !important; font-weight: 600; gap: 8px;}
:root[data-skin="chisto"] .cover3 .c3-bot .ic {flex: none; opacity: .8;}
:root[data-skin="chisto"] .screen > .tab-head .tab-avatar {flex: none; width: 60px; height: 60px; padding: 0; border-radius: 16px; overflow: hidden; border: 0; background: var(--ch-pri); color: var(--ch-on-pri); font-weight: 700; font-size: 1.25rem; display: grid; place-items: center;}
:root[data-skin="chisto"] .screen > .tab-head .tab-avatar img {width: 100%; height: 100%; object-fit: cover; display: block;}
:root[data-skin="chisto"] .cover3 .c3-bot {padding: 12px 16px !important;}
:root[data-skin="chisto"] .cover3 .c3-bot span {white-space: normal !important; overflow: visible !important; text-overflow: clip !important; line-height: 1.3;}
:root[data-skin="chisto"] .cover.cover3 {padding: 6px !important; border-radius: 30px !important;}
:root[data-skin="chisto"] .cover3 .c3-bar {background: none !important; border: 0 !important;}
:root[data-skin="chisto"] .cover3 .c3-top {padding: 12px 52px 12px !important; min-height: 64px;}
:root[data-skin="chisto"] .cover3 .c3-who b {font-size: 1.2rem !important; font-weight: 700; letter-spacing: -.015em;}
:root[data-skin="chisto"] .cover3 .c3-who small {font-size: .875rem !important; opacity: .7; letter-spacing: .01em;}
:root[data-skin="chisto"] .cover3 .c3-edit {right: 14px; width: 36px; height: 36px; background: rgba(255,255,255,.08); border: 0 !important;}
:root[data-skin="chisto"] .cover3 .c3-photo {border-radius: 24px; overflow: hidden; box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);}
:root[data-skin="chisto"] .cover3 .c3-photo.empty {border: 1px dashed rgba(255,255,255,.25); box-shadow: none;}
:root[data-skin="chisto"] .cover3 .c3-cam {right: 12px; bottom: 12px; width: 38px; height: 38px; background: rgba(20,19,19,.55); border: 1px solid rgba(255,255,255,.25);}
:root[data-skin="chisto"] .cover3 .c3-bot {flex-wrap: wrap; gap: 8px !important; padding: 12px 10px 10px !important; min-height: 0;}
:root[data-skin="chisto"] .cover3 .c3-chip {display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 14px; border-radius: 17px; background: rgba(255,255,255,.09); box-shadow: inset 0 0 0 1px rgba(255,255,255,.1); font-size: .9375rem; font-weight: 600; letter-spacing: .01em; white-space: nowrap;}
:root[data-skin="chisto"] .cover3 .c3-chip:first-child {background: #DDF3DB; color: #1D1B1B !important; box-shadow: none;}
:root[data-skin="chisto"] .cover3 .c3-bot span.c3-chip {overflow: visible;}
:root[data-skin="chisto"] .screen > .tab-head .tab-avatar {width: 68px !important; height: 68px !important; border-radius: 18px !important;}
:root[data-skin="chisto"] .cover4 {margin: 0 -16px 8px;}
:root[data-skin="chisto"] .cover4 .c4-line {display: block; padding: 0 16px; text-align: center; white-space: nowrap; overflow: hidden; color: var(--ch-on) !important; text-decoration: none;}
:root[data-skin="chisto"] .cover4 .c4-top {font-size: clamp(.95rem, 4.4vw, 1.1rem); padding-bottom: 10px;}
:root[data-skin="chisto"] .cover4 .c4-top b {font-weight: 700;}
:root[data-skin="chisto"] .cover4 .c4-top span {color: var(--ch-on-v);}
:root[data-skin="chisto"] .cover4 .c4-bot {font-size: clamp(.9rem, 4.2vw, 1.05rem); font-weight: 600; padding-top: 10px;}
:root[data-skin="chisto"] .cover4 .c4-photo {position: relative; aspect-ratio: 16 / 10; background: #111;}
:root[data-skin="chisto"] .cover4 .c4-photo img {width: 100%; height: 100%; object-fit: cover; display: block;}
:root[data-skin="chisto"] .cover4 .c4-photo.empty {aspect-ratio: auto; height: 140px; display: flex; align-items: center; justify-content: center; background: var(--ch-c);}
:root[data-skin="chisto"] .cover4 .c4-addcar {display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px; border-radius: 20px; border: 1px dashed var(--ch-outline); background: transparent; color: var(--ch-on); font-weight: 600;}
:root[data-skin="chisto"] .cover4 .c4-cam {position: absolute; right: 12px; bottom: 12px; width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: rgba(20,19,19,.55); color: #fff; border: 1px solid rgba(255,255,255,.3); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);}
@media (min-width: 560px) {
:root[data-skin="chisto"] .cover4 {margin: 0 0 8px;}
:root[data-skin="chisto"] .cover4 .c4-photo {border-radius: 24px; overflow: hidden;}
}
:root[data-skin="chisto"] .cover4 .c4-line {background: var(--ch-pri-c); color: var(--ch-on-pri-c) !important; padding: 11px 16px !important;}
:root[data-skin="chisto"] .cover4 .c4-top span {color: var(--ch-on-pri-c) !important; opacity: .72;}
:root[data-skin="chisto"] .cover4 .c4-top {padding-bottom: 11px !important;}
:root[data-skin="chisto"] .cover4 .c4-bot {padding-top: 11px !important;}
@media (min-width: 560px) {
:root[data-skin="chisto"] .cover4 {border-radius: 24px; overflow: hidden;}
:root[data-skin="chisto"] .cover4 .c4-photo {border-radius: 0;}
}
:root[data-skin="chisto"] .cover4 .c4-line, :root[data-skin="chisto"] .cover4 .c4-line b, :root[data-skin="chisto"] .cover4 .c4-line span {font-weight: 700 !important;}
:root[data-skin="chisto"] .cover4 .c4-top span {opacity: .85;}
:root[data-skin="chisto"] .nav.nav-3.nav-2 {grid-template-columns: repeat(2, minmax(0, 1fr)) !important;}
/* Долният ред с „Запази“ в листовете е в цвета на самия лист (преди – бяла/черна ивица зад бутона) */
:root[data-skin="chisto"] .sheet .sheet-actions {background: var(--ch-low) !important;}
:root[data-skin="google"] .sheet .sheet-actions {background: var(--g-cont) !important;}

/* ---------- Цветовете по смисъл: приходи – бледо зелено, разходи – бледо червено, данни/ефективност – бледо жълто ---------- */
:root { --tg-bg: #DCF1E0; --tg-fg: #1D5A30; --tr-bg: #FBE1E1; --tr-fg: #8E1F24; --ty-bg: #FBEFC8; --ty-fg: #6A4C00; }
:root[data-theme="dark"] { --tg-bg: rgba(52, 196, 106, .2); --tg-fg: #A9E8B8; --tr-bg: rgba(229, 72, 77, .22); --tr-fg: #FFB8B8; --ty-bg: rgba(255, 194, 26, .2); --ty-fg: #FFE08A; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --tg-bg: rgba(52, 196, 106, .2); --tg-fg: #A9E8B8; --tr-bg: rgba(229, 72, 77, .22); --tr-fg: #FFB8B8; --ty-bg: rgba(255, 194, 26, .2); --ty-fg: #FFE08A; } }
html:root[data-skin] [data-sec="inc"] .f-btn:not(.has), html:root[data-skin] .drive-list.inc .f-btn:not(.has) { background: var(--tg-bg) !important; color: var(--tg-fg) !important; border: 0 !important; }
html:root[data-skin] [data-sec="exp"] .f-btn:not(.has), html:root[data-skin] .drive-list.exp .f-btn:not(.has) { background: var(--tr-bg) !important; color: var(--tr-fg) !important; border: 0 !important; }
html:root[data-skin] [data-sec="data"] .f-btn:not(.has) { background: var(--ty-bg) !important; color: var(--ty-fg) !important; border: 0 !important; }
/* Статистика: цялата карта е в цвета си (преди – правоъгълник вътре в заоблената карта) */
html:root[data-skin] .st-fold-inc { background: var(--tg-bg) !important; }
html:root[data-skin] .st-fold-exp { background: var(--tr-bg) !important; }
html:root[data-skin] .st-fold-eff { background: var(--ty-bg) !important; }
html:root[data-skin] .st-fold > summary { background: transparent !important; border-radius: inherit !important; margin: 0 !important; }
html:root[data-skin] .st-fold-inc > summary { color: var(--tg-fg) !important; }
html:root[data-skin] .st-fold-exp > summary { color: var(--tr-fg) !important; }
html:root[data-skin] .st-fold-eff > summary { color: var(--ty-fg) !important; }
html:root[data-skin] .st-fold > summary * { color: inherit !important; }
html:root[data-skin] .st-fold > summary .st-fic { background: rgba(255, 255, 255, .55) !important; }
:root[data-theme="dark"] .st-fold > summary .st-fic { background: rgba(0, 0, 0, .28) !important; }
html:root[data-skin] .st-fold .st-row { background: var(--surface) !important; }

/* ---------- Изтриване: кошчето е винаги червено ---------- */
:root { --del: #C62828; --del-bg: #FDECEC; }
:root[data-theme="dark"] { --del: #FF8A8A; --del-bg: rgba(229, 72, 77, .18); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --del: #FF8A8A; --del-bg: rgba(229, 72, 77, .18); } }
html:root[data-skin] button:has(svg[data-icon="trash"]):not(.btn-danger), html:root[data-skin] a:has(svg[data-icon="trash"]):not(.btn-danger) { color: var(--del) !important; }
html:root[data-skin] .btn:has(svg[data-icon="trash"]):not(.btn-danger) { background: var(--del-bg) !important; border-color: transparent !important; }
html:root[data-skin] button:has(svg[data-icon="trash"]):not(.btn-danger) svg, html:root[data-skin] .list-btn.danger, html:root[data-skin] .list-btn.danger * { color: var(--del) !important; }
html:root[data-skin] .list-btn.danger .l-ic { background: var(--del-bg) !important; }
/* бутонът „Изтрий“ в потвърждението – наситено червено с бял текст и в тъмната тема */
html:root[data-skin] .btn-danger { background: #D93036 !important; color: #fff !important; border-color: #D93036 !important; }
html:root[data-skin] .btn-danger svg { color: #fff !important; }
.field-err { color: var(--del); font-weight: 600; margin: 8px 0 0; font-size: .92rem; }

/* Неизбраните варианти (Под наем, Бензин…) – с видима рамка, за да личат като бутони */
html:root[data-skin] .option:not(.on) { border: 1.5px solid var(--ch-outline-v, var(--line)) !important; }
/* Плочките Календар / Резервации на „Днес“ – текстът не излиза */
html:root[data-skin] .home-link { padding: 12px !important; gap: 8px !important; }
html:root[data-skin] .home-link b { font-size: .95rem; letter-spacing: -.01em; }
html:root[data-skin] .home-link .hl-ic { width: 34px !important; height: 34px !important; }
html:root[data-skin] .home-link .hl-ic svg { width: 19px; height: 19px; }
html:root[data-skin] .home-link .hl-ic { flex: none; }

/* Полетата и картите – с ясна тънка рамка, за да личат едно от друго (светла и тъмна тема) */
html:root[data-skin] .card, html:root[data-skin] .st-row, html:root[data-skin] .st-tile, html:root[data-skin] .home-link, html:root[data-skin] .big-link,
html:root[data-skin] .tile, html:root[data-skin] .ql, html:root[data-skin] details.more > summary, html:root[data-skin] .stat-card, html:root[data-skin] .kpi, html:root[data-skin] .big-num {
  outline: 1px solid var(--ch-outline-v, var(--line)); outline-offset: -1px;
}
html:root[data-skin] .card .card, html:root[data-skin] .st-fold, html:root[data-skin] .card.hero, html:root[data-skin] .meter, html:root[data-skin] .drive-card { outline: none; }

/* ---------- Полетата да личат: тънка, но видима рамка около всяка карта, ред и клетка ---------- */
:root { --fld-line: rgba(35, 31, 32, .16); --fld-bg: rgba(35, 31, 32, .035); }
:root[data-theme="dark"] { --fld-line: rgba(255, 255, 255, .14); --fld-bg: rgba(255, 255, 255, .04); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --fld-line: rgba(255, 255, 255, .14); --fld-bg: rgba(255, 255, 255, .04); } }
html:root[data-skin] .card, html:root[data-skin] .home-link, html:root[data-skin] .stat-card,
html:root[data-skin] .st-row, html:root[data-skin] .cost-row, html:root[data-skin] .res-row, html:root[data-skin] .more > summary,
html:root[data-skin] .tile, html:root[data-skin] .ms-mini, html:root[data-skin] .st-tile, html:root[data-skin] .live, html:root[data-skin] .kpi, html:root[data-skin] .big-num { border: 1px solid var(--fld-line) !important; }
/* картите вътре в карта (редовете в Статистика) – само рамка, без втори фон */
html:root[data-skin] .st-row { background: var(--fld-bg) !important; }
/* Приходи / Разходи / Ефективност – цялата карта е в цвета, без квадрат вътре */
html:root[data-skin] .st-fold { padding: 0 !important; overflow: hidden !important; }
html:root[data-skin] .st-fold > summary { margin: 0 !important; border-radius: 0 !important; padding: 18px 20px !important; border: 0 !important; }
html:root[data-skin] .st-fold-inc { border-color: color-mix(in srgb, var(--tg-fg) 35%, transparent) !important; }
html:root[data-skin] .st-fold-exp { border-color: color-mix(in srgb, var(--tr-fg) 35%, transparent) !important; }
html:root[data-skin] .st-fold-eff { border-color: color-mix(in srgb, var(--ty-fg) 35%, transparent) !important; }
html:root[data-skin] .st-fold[open] .st-rows { padding-top: 12px !important; }
/* Календарът: всеки ден е отделно квадратче */
html:root[data-skin] .cal-grid { gap: 5px !important; }
html:root[data-skin] .cal-day { border: 1px solid var(--fld-line) !important; background: var(--fld-bg) !important; border-radius: 12px !important; }
html:root[data-skin] .cal-day.out { opacity: .45; }
html:root[data-skin] .cal-day.sel { border: 2px solid var(--text) !important; }
/* превключвателите „изключено“ – личи, че са бутон */
html:root[data-skin] .toggle:not(.on) { background: transparent !important; border: 2px solid var(--fld-line) !important; box-shadow: inset 0 0 0 1px var(--fld-line); }
html:root[data-skin] .toggle:not(.on)::after { background: var(--muted) !important; top: 4px; left: 4px; width: 20px; height: 20px; box-shadow: none; }
/* Списъците с редове (Профил, Пари, Помощ, Колата): рамка около целия списък, редовете – с тънка линия между тях */
html:root[data-skin] .big-links { border: 1px solid var(--fld-line) !important; border-radius: 24px !important; overflow: hidden !important; gap: 0 !important; }
html:root[data-skin] .big-links .big-link { border: 0 !important; border-radius: 0 !important; margin: 0 !important; box-shadow: none !important; }
html:root[data-skin] .big-links .big-link + .big-link, html:root[data-skin] .big-links > * + * .big-link, html:root[data-skin] .big-links > * + .big-link { border-top: 1px solid var(--fld-line) !important; }

/* ---------- Графиките: нагоре (печалба) – светло зелено, надолу (загуба) – червено ---------- */
:root { --bar-pos: #7FCB95; --bar-pos-hl: #2E9E57; }
:root[data-theme="dark"] { --bar-pos: #4FAF6E; --bar-pos-hl: #8FE0A8; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --bar-pos: #4FAF6E; --bar-pos-hl: #8FE0A8; } }
html:root[data-skin] .bar.pos, html:root[data-skin] .bars.violet .bar.pos, html:root[data-skin] .week-bar.pos { fill: var(--bar-pos) !important; background: var(--bar-pos) !important; }
html:root[data-skin] .bar.pos.sel, html:root[data-skin] .bar.pos.hl { fill: var(--bar-pos-hl) !important; }
html:root[data-skin] .hours span:not(.none) { background: var(--bar-pos) !important; }
html:root[data-skin] .hours span.best { background: var(--bar-pos-hl) !important; }
html:root[data-skin] .hours span.none { background: var(--fld-bg) !important; box-shadow: inset 0 0 0 1px var(--fld-line); }
/* По дни от седмицата: сумата е вътре в лентата – всеки ден е едно поле */
html:root[data-skin] .wd-row { grid-template-columns: 30px 1fr !important; }
html:root[data-skin] .wd-row .wd-track { position: relative; height: 38px !important; border-radius: 12px !important; background: var(--fld-bg) !important; border: 1px solid var(--fld-line); overflow: hidden; }
html:root[data-skin] .wd-row .wd-fill { background: color-mix(in srgb, var(--bar-pos) 55%, transparent) !important; border-radius: 0 !important; }
html:root[data-skin] .wd-row.best .wd-fill { background: var(--bar-pos) !important; }
html:root[data-skin] .wd-row .wd-track b { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); font-weight: 700; color: var(--text); }
.ti-avg { display: flex; justify-content: space-between; align-items: center; padding: 10px 14px; border-radius: 14px; border: 1px solid var(--fld-line); background: var(--fld-bg); margin: 0 0 12px; font-size: .95rem; }
.ti-avg span { color: var(--muted); }
/* ---------- Календарът: стрелките и месецът в една лента; легендата – центрирана ---------- */
html:root[data-skin] .cal-nav { border: 1px solid var(--fld-line); background: var(--fld-bg); border-radius: 999px; padding: 5px; }
html:root[data-skin] .cal-nav .icon-btn { width: 42px; height: 42px; border-radius: 50% !important; border: 1px solid var(--fld-line) !important; background: var(--bg, transparent) !important; flex: none; }
html:root[data-skin] .cal-nav .chip { flex: none; }
html:root[data-skin] .cal-legend { justify-content: center; }
.ti-avg b { white-space: nowrap; }
html:root[data-skin] .cal-legend { gap: 4px 10px !important; font-size: .8rem !important; flex-wrap: nowrap !important; white-space: nowrap; }
html:root[data-skin] .cal-legend span { gap: 4px !important; }
html:root[data-skin] .big-links { padding: 0 !important; box-shadow: none !important; }
html:root[data-skin] .big-links .big-link::before, html:root[data-skin] .big-links .big-link::after { display: none !important; }
