:root {
    --mw-canvas: #fafafa;
    --mw-surface: #fff;
    --mw-sunk: #f5f5f7;
    --mw-line: #e9e9ee;
    --mw-line-strong: #d7d7df;
    --mw-ink: #17171d;
    --mw-muted: #6e6e7d;
    --mw-faint: #9a9aa8;
    --mw-accent: #6360dd;
    --mw-wash: #f4f4fe;
    --mw-display: 'Outfit', Inter, ui-sans-serif, system-ui, sans-serif;
    --mw-mono: 'JetBrains Mono', ui-monospace, Consolas, monospace;
    --mw-e1: 0 1px 2px rgb(16 16 22 / 5%);
    --mw-e2: 0 6px 24px -6px rgb(16 16 22 / 12%);
    --mw-ease: cubic-bezier(.16, 1, .3, 1);
    --am-faint: var(--mw-faint);
    --am-panel: var(--mw-surface);
    --am-shadow: var(--mw-e1);
}

html, body, .fi-body, .fi-layout {
    font-family: Inter, ui-sans-serif, system-ui, sans-serif !important;
    font-feature-settings: 'cv02', 'cv03', 'cv04', 'cv11';
    letter-spacing: -.011em;
    color: var(--mw-ink);
}
* { scrollbar-width: thin; scrollbar-color: #d7d7df transparent; }
body.fi-body { isolation: isolate; }
body.fi-body:has(.fi-layout)::before {
    content: '';
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background-color: #fcfdfb;
    background-image: url('../img/typ-workspace-brush.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
}
.fi-layout, .fi-main { background: transparent !important; }
.fi-main { padding-inline: 0 !important; }
.fi-main-ctn { min-width: 0; }
.fi-page { padding: 32px !important; }
.fi-page > section { padding-block: 0 !important; gap: 28px !important; }
.fi-header { margin-bottom: 0 !important; }
.fi-header-heading {
    font-family: var(--mw-display) !important;
    font-size: 2rem !important;
    line-height: 1.1 !important;
    font-weight: 800 !important;
    letter-spacing: -.03em !important;
}
.fi-header-subheading { font-size: 14px !important; line-height: 1.6; }
.mw h2, .mw h3, .fi-section-header-heading, .fi-wi-chart-heading {
    font-family: var(--mw-display);
    letter-spacing: -.022em;
    font-weight: 600;
}
.mw h2 { font-size: 18px; }
.mw h3 { font-size: 16px; }
.mw-mono, .mw-numeric, .mw-table time { font-family: var(--mw-mono); font-variant-numeric: tabular-nums; }

.fi-sidebar { background: #fff !important; border-right: 1px solid var(--mw-line) !important; }
.fi-sidebar-header { height: 64px !important; min-height: 64px !important; padding: 0 16px !important; border-bottom: 1px solid var(--mw-line) !important; }
.fi-sidebar-header > .fi-icon-btn { display: none !important; }
.fi-sidebar-header > div { display: flex !important; opacity: 1 !important; width: 100%; }
.mw-brand { display: inline-flex; align-items: center; gap: 9px; white-space: nowrap; font: 700 22px/1 var(--mw-display); letter-spacing: -.035em; }
.mw-brand img { width: 28px; height: 28px; object-fit: contain; }
.mw-brand-dot { color: #7d79ea; }
.fi-sidebar-nav { padding: 16px 12px 24px !important; gap: 0 !important; scrollbar-gutter: auto !important; }
.fi-sidebar-nav { scrollbar-width: none; }
.fi-sidebar-nav::-webkit-scrollbar { display: none; }
.fi-sidebar-nav-groups { gap: 0 !important; margin-inline: 0 !important; }
.fi-sidebar-group { gap: 0 !important; }
.fi-sidebar-group-button { padding: 0 12px !important; margin: 24px 0 6px !important; gap: 0 !important; }
.fi-sidebar-group-label { padding: 0 !important; font-size: 10px !important; font-weight: 700 !important; line-height: 16px !important; letter-spacing: .13em !important; color: var(--mw-faint) !important; }
.fi-sidebar-group-collapse-button { width: 18px !important; height: 18px !important; opacity: .6; }
.fi-sidebar-group-items { gap: 4px !important; }
.fi-sidebar-item-button { position: relative; gap: 12px !important; padding: 8px 12px !important; min-height: 36px; border-radius: 9px !important; color: var(--mw-muted) !important; }
.fi-sidebar-item-label { font-size: 13px !important; line-height: 20px !important; font-weight: 500 !important; }
.fi-sidebar-item-button svg { width: 20px !important; height: 20px !important; color: var(--mw-faint) !important; }
.fi-sidebar-item-button:hover { background: var(--mw-sunk) !important; color: var(--mw-ink) !important; }
.fi-sidebar-item-active .fi-sidebar-item-button { color: var(--mw-ink) !important; background: var(--mw-sunk) !important; box-shadow: none !important; }
.fi-sidebar-item-active .fi-sidebar-item-label { font-weight: 600 !important; color: var(--mw-ink) !important; }
.fi-sidebar-item-active .fi-sidebar-item-button::before { content: ''; position: absolute; left: -12px; top: 50%; transform: translateY(-50%); width: 3px; height: 18px; border-radius: 0 4px 4px 0; background: var(--mw-accent); }
.fi-sidebar-item-active .fi-sidebar-item-button svg { color: var(--mw-accent) !important; }
.fi-sidebar-item-badge { background: var(--mw-sunk) !important; color: var(--mw-muted) !important; border-radius: 5px !important; }
.am-sidebar-context { padding: 0 12px !important; margin: 24px 0 6px; gap: 10px !important; }
.am-sidebar-context__label { color: var(--mw-faint) !important; font-size: 10px !important; font-weight: 700 !important; letter-spacing: .13em !important; }
.am-sidebar-alert { margin-bottom: 8px; font-weight: 500 !important; font-size: 11px !important; }

.fi-topbar { background: rgb(250 250 250 / 85%) !important; border: 0 !important; backdrop-filter: saturate(180%) blur(12px); }
.fi-topbar > nav { height: 64px !important; min-height: 64px !important; padding: 0 28px !important; border: 0 !important; background: transparent !important; box-shadow: none !important; gap: 16px; }
.fi-topbar-open-sidebar-btn, .fi-topbar-close-sidebar-btn { display: none !important; }
.mw-topbar-context { display: flex; align-items: center; gap: 16px; min-width: 0; font-size: 14px; font-weight: 700; }
.mw-topbar-context > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mw-sidebar-toggle { display: grid; place-items: center; width: 36px; height: 36px; flex-shrink: 0; border-radius: 10px; color: var(--mw-faint); }
.mw-sidebar-toggle:hover { background: var(--mw-sunk); color: var(--mw-ink); }
.mw-sidebar-toggle svg { width: 20px; height: 20px; }
.mw-mobile-sidebar-close { display: none; }
.am-topbar-actions { padding: 0; gap: 8px; }
.am-topbar-chip, .am-topbar-button { font-size: 11px !important; min-height: 30px; padding: 5px 9px; font-weight: 500 !important; border-radius: 8px; }
.am-topbar-chip { background: var(--mw-sunk); }
.am-topbar-button:hover { background: #26262e; }
.am-topbar-crisis { color: #c13237; background: rgb(229 72 77 / 8%); border-color: rgb(229 72 77 / 18%); }

.mw { gap: 24px; }
.mw-overline { font-size: 10px; font-weight: 700; letter-spacing: .13em; }
.mw-dashboard-hero { display: flex; justify-content: space-between; align-items: end; gap: 20px; }
.mw-dashboard-hero h1 { margin: 10px 0 8px; font: 800 2.6rem/1.05 var(--mw-display); letter-spacing: -.03em; }
.mw-dashboard-hero h1 > span { color: #7d79ea; }
.mw-dashboard-hero .mw-muted { font-size: 14px; line-height: 1.6; max-width: 520px; }
.mw-dashboard-hero .mw-muted, .mw-dashboard-hero .mw-overline, .aw-intro .mw-muted, .aw-intro .mw-overline, .mw-toolbar > .mw-actions > .mw-overline { color: var(--mw-ink); }
.aw-tabs { background: rgb(255 255 255 / 95%); border-radius: 10px 10px 0 0; padding-inline: 16px; }
.mw-card, .mw-filters, .mw-inbox, .fi-section, .fi-ta-ctn, .fi-modal-window, .fi-dropdown-panel { border-radius: 14px !important; border-color: var(--mw-line) !important; box-shadow: var(--mw-e1) !important; }
.mw-card, .mw-kpi { transition: border-color .35s var(--mw-ease), box-shadow .35s var(--mw-ease); }
.mw-card:hover, .mw-kpi:hover { border-color: var(--mw-line-strong); box-shadow: var(--mw-e2); }
.mw-card-head { padding: 20px; }
.mw-card-body { padding: 20px; }
.mw-grid, .mw-stack, .mw-breakdowns { gap: 24px; }
.mw-kpis { gap: 16px; background: none; border: 0; border-radius: 0; overflow: visible; }
.mw-kpi { position: relative; padding: 20px; background: #fff; border: 1px solid var(--mw-line) !important; border-radius: 14px; box-shadow: var(--mw-e1); display: flex; flex-direction: column; }
.mw-kpi-icon { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; background: var(--mw-wash); color: var(--mw-accent); margin-bottom: 16px; }
.mw-kpi-icon svg { width: 18px; height: 18px; }
.mw-kpi:nth-child(2) .mw-kpi-icon { background: #f0fdf4; color: #12a150; }
.mw-kpi:nth-child(3) .mw-kpi-icon { background: #fffbeb; color: #d98216; }
.mw-kpi:nth-child(4) .mw-kpi-icon { background: #fff1f2; color: #e5484d; }
.mw-kpi-value { order: 1; margin: 0; font: 800 30px/1.1 var(--mw-display); letter-spacing: -.025em; }
.mw-kpi-label { order: 2; margin-top: 6px; color: var(--mw-faint); font-size: 11px; line-height: 1.5; text-transform: uppercase; letter-spacing: .07em; }
.mw-kpi-label svg { width: 14px; height: 14px; }
.mw-kpi-foot { order: 3; margin-top: 12px; font-size: 11px; }
.mw-channel-total, .mw-stat strong, .aw-summary strong { font-family: var(--mw-display); font-weight: 800; letter-spacing: -.025em; }
.mw-button, .fi-btn { padding: 8px 12px; min-height: 36px; border-radius: 10px !important; font-size: 13px !important; font-weight: 600 !important; letter-spacing: -.006em; box-shadow: var(--mw-e1) !important; }
.mw-button--primary, .fi-btn-color-primary { color: white !important; background: #17171d !important; border-color: #17171d !important; }
.mw-button--primary:hover, .fi-btn-color-primary:hover { background: #26262e !important; }
.mw-input, .fi-input-wrp { border-radius: 10px !important; border-color: var(--mw-line) !important; }
.mw-input:hover, .fi-input-wrp:hover { border-color: var(--mw-line-strong) !important; }
.mw-input:focus, .fi-input-wrp:focus-within { border-color: #7d79ea !important; box-shadow: 0 0 0 3px rgb(125 121 234 / 14%) !important; }
.fi-input, .fi-select-input, .fi-textarea { font-size: 14px !important; }
.mw-table th, .fi-ta-header-cell { background: var(--mw-sunk) !important; font-size: 10px !important; font-weight: 600 !important; text-transform: uppercase; letter-spacing: .06em; }
.mw-table tbody tr:hover, .fi-ta-row:hover { background: #fbfbfc !important; }
.fi-tabs { background: var(--mw-sunk) !important; }
.fi-badge { border-radius: 6px !important; font-weight: 500 !important; }
.aw-intro h2 { font: 800 2rem/1.1 var(--mw-display); letter-spacing: -.03em; }
.aw-template-grid, .aw-builder-grid, .aw-results { gap: 24px; }
.aw-query-bar, .aw-save-bar { border-radius: 14px; }
.aw-editor .mw-card-head, .aw-grain, .aw-save-bar { background: var(--mw-sunk); }
.aw-data-table th { background: var(--mw-sunk) !important; }
.aw-summary strong { font-size: 30px; }
.mw-conversation.is-active { background: var(--mw-sunk); }
.mw-inbox-toolbar h1 { font: 800 2rem/1.1 var(--mw-display); letter-spacing: -.03em; }
.mw:has(.mw-inbox) > .mw-toolbar .mw-muted, .mw-inbox-toolbar .mw-overline { color: var(--mw-ink); }
:focus-visible { outline: 2px solid #7d79ea !important; outline-offset: 3px; }
::selection { background: rgb(125 121 234 / 22%); color: var(--mw-ink); }

@media (min-width: 1024px) {
    .fi-main-sidebar:not(.fi-sidebar-open) { width: 72px; min-width: 72px; }
    .fi-main-sidebar:not(.fi-sidebar-open) .mw-brand > span { display: none; }
    .fi-main-sidebar:not(.fi-sidebar-open) .fi-sidebar-header a { display: flex; justify-content: center; width: 100%; }
    .fi-main-sidebar:not(.fi-sidebar-open) .fi-sidebar-group { margin-top: 12px; }
    .fi-main-sidebar:not(.fi-sidebar-open) .fi-sidebar-item-button { padding: 8px 12px !important; }
}
@media (max-width: 1200px) { .am-topbar-online { display: none; } }
@media (max-width: 1023px) {
    .fi-page { padding: 24px !important; }
    .fi-topbar > nav { padding-inline: 16px !important; }
    .mw-dashboard-hero { align-items: start; flex-direction: column; }
    .mw-dashboard-hero h1 { font-size: 2rem; }
    .fi-sidebar { max-width: calc(100vw - 48px); }
    .mw-mobile-sidebar-close { display: grid; place-items: center; position: absolute; top: 16px; right: 10px; width: 32px; height: 32px; border-radius: 8px; color: var(--mw-muted); }
    .mw-mobile-sidebar-close svg { width: 18px; height: 18px; }
}
@media (max-width: 700px) {
    .fi-page { padding: 20px 16px !important; }
    .fi-page > section { gap: 24px !important; }
    .mw-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    .mw-kpi { padding: 16px; }
    .mw-kpi-value { font-size: 26px; }
    .mw-kpi-foot { gap: 4px; }
    .am-topbar-actions .am-topbar-chip:not(.am-topbar-crisis), .am-topbar-button { display: none; }
    .mw-topbar-context { gap: 8px; font-size: 13px; }
    .fi-topbar > nav { gap: 8px; }
    .am-topbar-actions { margin-left: 0; }
    .mw-topbar-context { margin-right: auto; }
    .fi-topbar .fi-global-search { display: none; }
    .aw-intro h2 { font-size: 1.75rem; }
    .aw-template-grid, .aw-results, .aw-builder-grid { gap: 16px; }
}
@media (prefers-reduced-motion: reduce) {
    .mw-card, .mw-kpi, .fi-sidebar { transition: none !important; }
}
@media print {
    body.fi-body::before { display: none; }
    .fi-page { padding: 0 !important; }
    .mw-card, .mw-kpi { box-shadow: none !important; }
    .mw-dashboard-hero { break-after: avoid; }
}
