﻿.home-board {
        --home-ink: #1f2637;
        --home-muted: #7e889b;
        --home-soft: #f4f7f7;
        --home-card: rgba(255, 255, 255, 0.88);
        --home-line: rgba(31, 38, 55, 0.08);
        position: relative;
        min-height: calc(100dvh - 32px);
        padding: clamp(18px, 3vw, 34px);
        padding-bottom: 156px;
        overflow: hidden;
        border-radius: 34px;
        background: radial-gradient(circle at 15% 4%, color-mix(in srgb, var(--tab-accent) 18%, transparent), transparent 28%), radial-gradient(circle at 86% 22%, rgba(22, 51, 73, 0.12), transparent 30%), linear-gradient(135deg, #eef4f3 0%, #f8faf8 44%, #edf3f0 100%);
        color: var(--home-ink);
    }

    .home-ambient {
        position: absolute;
        pointer-events: none;
        border-radius: 999px;
        filter: blur(2px);
        opacity: 0.7;
    }

    .home-ambient--left {
        width: 190px;
        height: 190px;
        left: -80px;
        top: 28%;
        background: color-mix(in srgb, var(--tab-accent) 32%, white);
    }

    .home-ambient--right {
        width: 320px;
        height: 320px;
        right: -130px;
        bottom: 8%;
        background: rgba(255, 255, 255, 0.72);
    }

    .home-topbar,
    .home-focus-tabs,
    .home-grid,
    .home-tabbar {
        position: relative;
        z-index: 1;
    }

    .home-topbar {
        display: flex;
        justify-content: space-between;
        gap: 24px;
        align-items: flex-start;
        max-width: 1220px;
        margin: 0 auto 22px;
    }

    .home-kicker {
        display: inline-flex;
        width: fit-content;
        padding: 7px 12px;
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.72);
        color: color-mix(in srgb, var(--tab-accent) 62%, #2a3449);
        font-size: 12px;
        font-weight: 800;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        box-shadow: 0 10px 30px rgba(45, 58, 76, 0.08);
    }

    .home-topbar h1 {
        margin: 18px 0 8px;
        font-size: clamp(34px, 5vw, 64px);
        line-height: 0.96;
        letter-spacing: -0.05em;
    }

    .home-topbar p {
        max-width: 560px;
        margin: 0;
        color: var(--home-muted);
        font-size: 16px;
        line-height: 1.6;
    }

    .home-refresh {
        width: 50px;
        height: 50px;
        display: grid;
        place-items: center;
        border: 0;
        border-radius: 18px;
        background: #fff;
        color: color-mix(in srgb, var(--tab-accent) 74%, #233047);
        cursor: pointer;
        box-shadow: 0 18px 40px rgba(35, 48, 71, 0.11);
        transition: transform 180ms ease, box-shadow 180ms ease;
    }

    @media (max-width: 390px) {
        .home-card--hero {
            padding-inline: 12px;
        }

        .home-annual-title {
            font-size: 26px;
        }

        .home-annual-chart-track {
            min-width: 430px;
        }

        .home-annual-chart .apexcharts-xaxis text,
        .home-annual-chart .apexcharts-yaxis text,
        .home-annual-chart .apexcharts-legend-text {
            font-size: 10px !important;
        }
    }

        .home-refresh:hover {
            transform: rotate(18deg) scale(1.04);
            box-shadow: 0 24px 54px rgba(35, 48, 71, 0.14);
        }

        .home-refresh:disabled {
            cursor: wait;
            opacity: 0.64;
            transform: none;
        }

    .home-toolbar {
        display: flex;
        gap: 10px;
        align-items: center;
    }

    .home-date-filters {
        display: inline-flex;
        gap: 10px;
        align-items: center;
    }

    .home-year-filter {
        min-height: 50px;
        display: inline-flex;
        align-items: center;
        gap: 9px;
        padding: 0 14px;
        border-radius: 18px;
        background: rgba(255, 255, 255, 0.86);
        color: var(--home-muted);
        box-shadow: 0 18px 40px rgba(35, 48, 71, 0.1);
    }

        .home-year-filter i {
            color: color-mix(in srgb, var(--tab-accent) 74%, #233047);
        }

        .home-year-filter select {
            min-width: 82px;
            border: 0;
            outline: 0;
            background: transparent;
            color: var(--home-ink);
            font: inherit;
            font-weight: 800;
            cursor: pointer;
        }

    .home-month-filter select {
        min-width: 58px;
    }

    .home-data-refresh {
        min-height: 50px;
        display: inline-flex;
        align-items: center;
        gap: 10px;
        padding: 0 16px;
        border: 0;
        border-radius: 18px;
        background: var(--brand-primary);
        color: #fff;
        font-weight: 800;
        cursor: pointer;
        box-shadow: 0 18px 40px rgba(35, 48, 71, 0.16);
        transition: transform 180ms ease, box-shadow 180ms ease, opacity 180ms ease;
    }

        .home-data-refresh:hover {
            transform: translateY(-1px);
            box-shadow: 0 24px 54px rgba(35, 48, 71, 0.18);
        }

        .home-data-refresh:disabled {
            cursor: wait;
            opacity: 0.68;
            transform: none;
        }

    .home-status {
        max-width: 1220px;
        margin: -4px auto 18px;
        display: flex;
        justify-content: space-between;
        gap: 12px;
        align-items: center;
        color: var(--home-muted);
        font-size: 13px;
        font-weight: 700;
    }

    .home-status strong {
        color: var(--home-ink);
    }

    .home-loading-panel,
    .home-error-panel {
        position: relative;
        z-index: 1;
        max-width: 1220px;
        margin: 0 auto;
        padding: 22px;
        border-radius: 26px;
        background: rgba(255, 255, 255, 0.84);
        box-shadow: 0 24px 70px rgba(35, 48, 71, 0.11);
        color: var(--home-muted);
    }

    .home-loading-panel strong,
    .home-error-panel strong {
        display: block;
        margin-bottom: 6px;
        color: var(--home-ink);
    }

.home-busy-overlay {
    position: fixed;
    inset: 0;
    z-index: 1100;
    display: grid;
    place-items: center;
    padding: 24px;
        background: rgba(18, 25, 38, 0.28);
        backdrop-filter: blur(8px);
    }

    .home-busy-box {
        width: min(360px, 100%);
        padding: 24px;
        border-radius: 26px;
        background: #fff;
        box-shadow: 0 30px 90px rgba(19, 33, 45, 0.24);
        text-align: center;
    }

    .home-spinner {
        width: 42px;
        height: 42px;
        display: inline-block;
        margin-bottom: 14px;
        border-radius: 999px;
        border: 4px solid rgba(31, 38, 55, 0.1);
        border-top-color: var(--tab-accent);
        animation: home-spin 780ms linear infinite;
    }

    .home-busy-box strong {
        display: block;
        color: var(--home-ink);
    }

    .home-busy-box small {
        display: block;
        margin-top: 6px;
        color: var(--home-muted);
    }

    .home-detail-backdrop {
        position: fixed;
        inset: 0;
        z-index: 70;
        display: grid;
        place-items: center;
        padding: 22px;
        background: rgba(18, 25, 38, 0.26);
        backdrop-filter: blur(8px);
    }

    .home-detail-modal {
        width: min(760px, 100%);
        max-height: min(720px, calc(100dvh - 44px));
        display: grid;
        grid-template-rows: auto minmax(0, 1fr);
        border-radius: 28px;
        background: #fff;
        box-shadow: 0 30px 90px rgba(19, 33, 45, 0.24);
        overflow: hidden;
    }

    .home-detail-head {
        display: flex;
        justify-content: space-between;
        gap: 16px;
        align-items: center;
        padding: 18px 20px;
        border-bottom: 1px solid var(--home-line);
    }

        .home-detail-head span {
            color: var(--home-muted);
            font-size: 12px;
            font-weight: 800;
            letter-spacing: 0.08em;
            text-transform: uppercase;
        }

        .home-detail-head strong {
            display: block;
            margin-top: 4px;
            color: var(--home-ink);
            font-size: 22px;
        }

    .home-detail-modal-title span {
        display: inline;
    }

        .home-detail-modal-title span + span::before {
            content: " - ";
        }

    .home-detail-close {
        width: 42px;
        height: 42px;
        display: grid;
        place-items: center;
        border: 0;
        border-radius: 16px;
        background: color-mix(in srgb, var(--tab-accent) 12%, white);
        color: var(--tab-accent);
        cursor: pointer;
    }

    .home-detail-body {
        overflow: auto;
        padding: 14px 20px 20px;
    }

    .home-detail-table {
        width: 100%;
        border-collapse: collapse;
        font-size: 13px;
    }

        .home-detail-table th,
        .home-detail-table td {
            padding: 12px 10px;
            border-bottom: 1px solid var(--home-line);
            text-align: right;
            white-space: nowrap;
        }

        .home-detail-table th:first-child,
        .home-detail-table td:first-child {
            text-align: left;
            white-space: normal;
        }

        .home-detail-table th {
            color: var(--home-muted);
            font-size: 11px;
            font-weight: 800;
            text-transform: uppercase;
        }

    .home-detail-table td {
        color: var(--home-ink);
        font-weight: 700;
    }

    @media (min-width: 761px) {
        .home-detail-backdrop--mobile {
            display: none;
        }

        .home-detail-inline .home-detail-head {
            padding: 14px 16px;
        }

        .home-detail-inline .home-detail-head strong {
            font-size: 18px;
        }

        .home-detail-inline .home-detail-body {
            overflow: visible;
            padding: 10px 14px 14px;
        }

        .home-detail-inline .home-detail-table {
            font-size: 12px;
        }

        .home-detail-inline .home-detail-table th,
        .home-detail-inline .home-detail-table td {
            padding: 10px 8px;
        }
    }

    .home-focus-tabs {
        max-width: 1220px;
        margin: 0 auto 18px;
        display: flex;
        gap: 8px;
        padding: 6px;
        width: fit-content;
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.72);
        box-shadow: inset 0 0 0 1px var(--home-line);
    }

    .home-focus-tab {
        min-width: 104px;
        height: 42px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 9px;
        border: 0;
        border-radius: 999px;
        background: transparent;
        color: var(--home-muted);
        font-weight: 800;
        cursor: pointer;
        transition: background-color 180ms ease, color 180ms ease, transform 180ms ease;
    }

        .home-focus-tab.is-active {
            background: var(--tab-accent);
            color: #fff;
            box-shadow: 0 14px 30px color-mix(in srgb, var(--tab-accent) 34%, transparent);
        }

        .home-focus-tab:hover {
            transform: translateY(-1px);
        }

    .home-grid {
        max-width: 1220px;
        margin: 0 auto;
        display: grid;
        grid-template-columns: minmax(280px, 0.95fr) minmax(320px, 1.25fr) minmax(280px, 0.8fr);
        gap: 18px;
        align-items: stretch;
        animation: home-rise 320ms cubic-bezier(0.2, 0.8, 0.2, 1) both;
    }

    .home-card {
        min-width: 0;
        border: 1px solid rgba(255, 255, 255, 0.72);
        border-radius: 30px;
        background: var(--home-card);
        box-shadow: 0 24px 70px rgba(35, 48, 71, 0.11);
        backdrop-filter: blur(16px);
    }

    .home-card--hero,
    .home-card--chart,
    .home-card--actions {
        padding: 22px;
    }

    .home-card--hero {
        grid-column: span 2;
    }

        .home-card--hero.is-detail-open {
            grid-column: 1 / -1;
        }

    .home-card__head {
        display: flex;
        justify-content: space-between;
        gap: 16px;
        align-items: flex-start;
        margin-bottom: 16px;
    }

        .home-card__head span,
        .home-card__head small {
            color: var(--home-muted);
            font-size: 13px;
            font-weight: 700;
        }

        .home-card__head strong {
            display: block;
            margin-top: 4px;
            color: var(--home-ink);
            font-size: 28px;
            letter-spacing: -0.03em;
        }

    .home-donut-wrap {
        position: relative;
        width: 100%;
        max-width: 100%;
        min-height: 265px;
        overflow: hidden;
    }

    .home-donut-chart {
        width: 100%;
        max-width: 100%;
        display: grid;
        place-items: center;
    }

    .home-donut-center {
        position: absolute;
        inset: 50% auto auto 50%;
        width: 138px;
        height: 138px;
        display: grid;
        place-items: center;
        align-content: center;
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.84);
        transform: translate(-50%, -50%);
        box-shadow: inset 0 0 0 1px rgba(31, 38, 55, 0.05), 0 20px 46px rgba(35, 48, 71, 0.08);
    }

        .home-donut-center span,
        .home-donut-center small {
            color: var(--home-muted);
            font-size: 12px;
            font-weight: 700;
        }

        .home-donut-center strong {
            color: var(--home-ink);
            font-size: 28px;
            letter-spacing: -0.06em;
        }

    .home-annual-chart {
        position: relative;
        min-height: 236px;
        display: grid;
        align-content: start;
    }

.home-annual-chart-scroll {
    width: 100%;
    min-width: 0;
    overflow: visible;
}

.home-annual-chart-scroll--compact {
    margin-inline: 0;
    padding-inline: 0;
}

.home-annual-chart-scroll--wide {
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 10px;
    scrollbar-width: thin;
}

.home-annual-chart-scroll,
.home-annual-chart-scroll--wide,
.home-chart-scroll,
.home-abc-table-shell {
    scrollbar-gutter: stable both-edges;
}

.home-annual-chart-scroll::-webkit-scrollbar,
.home-annual-chart-scroll--wide::-webkit-scrollbar,
.home-chart-scroll::-webkit-scrollbar,
.home-abc-table-shell::-webkit-scrollbar {
    height: 12px;
}

.home-annual-chart-scroll::-webkit-scrollbar-track,
.home-annual-chart-scroll--wide::-webkit-scrollbar-track,
.home-chart-scroll::-webkit-scrollbar-track,
.home-abc-table-shell::-webkit-scrollbar-track {
    background: rgba(148, 163, 184, 0.16);
    border-radius: 999px;
}

.home-annual-chart-scroll::-webkit-scrollbar-thumb,
.home-annual-chart-scroll--wide::-webkit-scrollbar-thumb,
.home-chart-scroll::-webkit-scrollbar-thumb,
.home-abc-table-shell::-webkit-scrollbar-thumb {
    background: rgba(71, 85, 105, 0.42);
    border-radius: 999px;
    border: 2px solid transparent;
    background-clip: padding-box;
}

.home-annual-chart--compact .apexcharts-canvas {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

    .home-annual-chart-track {
        position: relative;
        min-width: 0;
    }

    .home-annual-chart-track--monthly {
        min-width: 440px;
    }

    .home-annual-chart-track--annual-overview,
    .home-annual-chart-track--monthly-overview {
        min-width: 0;
    }

    .home-annual-chart-track--annual-monthly-bars {
        min-width: 760px;
    }

    .home-annual-chart-track--division-bars {
        min-width: 680px;
    }

    .home-annual-chart-track--mix {
        min-width: 620px;
    }

    .home-annual-chart-track--price-kg {
        min-width: 560px;
    }

    .home-annual-shell {
        display: grid;
        gap: 18px;
        align-items: stretch;
    }

        .home-annual-shell.is-detail-open {
            grid-template-columns: minmax(460px, 1fr) minmax(460px, 1fr);
        }

    .home-annual-visual-stack {
        display: grid;
        gap: 12px;
        min-width: 0;
        align-content: start;
    }

    .home-detail-inline {
        display: grid;
        grid-template-rows: auto auto;
        min-height: 100%;
        overflow: visible;
        border: 1px solid var(--home-line);
        border-radius: 22px;
        background: rgba(255, 255, 255, 0.82);
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.54);
    }

        .home-card--hero.is-detail-open .home-annual-chart,
        .home-card--hero.is-detail-open .home-detail-inline {
            min-height: 540px;
        }

    .home-secondary-chart {
        margin-top: 8px;
        padding-top: 8px;
        border-top: 1px solid var(--home-line);
    }

    .home-secondary-chart--compact {
        margin-top: 0;
        padding-top: 8px;
    }

    .home-secondary-chart--annual-monthly .home-annual-chart {
        min-height: 250px;
    }

    .home-secondary-chart--annual-monthly .home-annual-chart-track--annual-monthly-bars {
        min-width: 760px;
    }

    .home-secondary-chart__head {
        display: flex;
        justify-content: space-between;
        gap: 10px;
        align-items: flex-start;
        margin-bottom: 6px;
    }

    .home-secondary-chart__head span,
    .home-secondary-chart__head small {
        color: var(--home-muted);
        font-size: 11px;
        font-weight: 750;
        letter-spacing: 0.06em;
        text-transform: uppercase;
    }

    .home-secondary-chart__head strong {
        display: block;
        margin-top: 4px;
        color: var(--home-ink);
        font-size: 18px;
        font-weight: 700;
        line-height: 1.2;
    }

    .home-annual-title {
        margin: 0 0 8px;
        color: #424242;
        font-size: 29px;
        font-weight: 800;
        line-height: 1.1;
        text-align: center;
    }

    .home-bar-labels {
        position: absolute;
        inset: 0;
        z-index: 2;
        pointer-events: none;
    }

    .home-bar-label {
        position: absolute;
        left: 0;
        top: 0;
        display: block;
        color: #111111;
        font-size: 14px;
        font-weight: 800;
        line-height: 1;
        text-align: left;
        white-space: nowrap;
        opacity: 0;
        visibility: hidden;
        transform: translate(-50%, -50%);
        transform-origin: center center;
    }

    .home-bar-label.is-outside {
        text-align: left;
        transform: translate(0, -50%);
    }

    .home-bar-label.is-inside {
        text-align: left;
        transform: translate(0, -50%);
    }

    .home-bar-label.is-positioned {
        opacity: 1;
        visibility: visible;
    }

    .home-bar-label--meta {
        color: #ffffff;
    }

    .home-annual-mobile-detail-button {
        display: none;
    }

    .home-insight-strip {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .home-insight {
        min-height: 96px;
        padding: 14px;
        border-radius: 22px;
        background: rgba(255, 255, 255, 0.74);
        box-shadow: inset 0 0 0 1px var(--home-line);
    }

        .home-insight span {
            width: 34px;
            height: 34px;
            display: grid;
            place-items: center;
            margin-bottom: 10px;
            border-radius: 14px;
            background: color-mix(in srgb, var(--tab-accent) 14%, white);
            color: var(--tab-accent);
        }

        .home-insight strong,
        .home-insight small {
            display: block;
        }

        .home-insight strong {
            font-size: 18px;
        }

        .home-insight small {
            margin-top: 3px;
            color: var(--home-muted);
            font-size: 12px;
        }

    .home-card--chart {
        display: flex;
        flex-direction: column;
        min-height: 430px;
    }

    .home-chart-scroll {
        width: 100%;
        min-width: 0;
        overflow-x: auto;
        overflow-y: hidden;
        overscroll-behavior-inline: contain;
        scrollbar-width: thin;
        scrollbar-color: color-mix(in srgb, var(--tab-accent) 42%, #cbd3dc) transparent;
    }

        .home-chart-scroll::-webkit-scrollbar {
            height: 7px;
        }

        .home-chart-scroll::-webkit-scrollbar-thumb {
            border-radius: 999px;
            background: color-mix(in srgb, var(--tab-accent) 42%, #cbd3dc);
        }

    .home-chart-track {
        width: 100%;
        min-width: 0;
    }

    .home-stack {
        display: grid;
        gap: 18px;
    }

    .home-card--alert {
        display: grid;
        grid-template-columns: auto 1fr;
        gap: 14px;
        padding: 20px;
        background: linear-gradient(135deg, color-mix(in srgb, var(--tab-accent) 14%, white) 0%, rgba(255, 255, 255, 0.9) 100%);
    }

    .home-alert-icon {
        width: 46px;
        height: 46px;
        display: grid;
        place-items: center;
        border-radius: 18px;
        background: #fff;
        color: var(--tab-accent);
        box-shadow: 0 14px 32px rgba(35, 48, 71, 0.1);
    }

    .home-card--alert strong {
        display: block;
        margin-top: 2px;
    }

    .home-card--alert p {
        margin: 8px 0 0;
        color: var(--home-muted);
        line-height: 1.5;
    }

    .home-action-list {
        display: grid;
        gap: 10px;
    }

    .home-action {
        width: 100%;
        display: grid;
        grid-template-columns: auto 1fr auto;
        gap: 12px;
        align-items: center;
        padding: 12px;
        border: 0;
        border-radius: 20px;
        background: rgba(255, 255, 255, 0.68);
        color: inherit;
        text-align: left;
        cursor: pointer;
        box-shadow: inset 0 0 0 1px var(--home-line);
        transition: transform 180ms ease, background-color 180ms ease, box-shadow 180ms ease;
    }

        .home-action:hover {
            transform: translateY(-2px);
            background: #fff;
            box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tab-accent) 22%, transparent), 0 16px 32px rgba(35, 48, 71, 0.09);
        }

        .home-action > span {
            width: 40px;
            height: 40px;
            display: grid;
            place-items: center;
            border-radius: 16px;
            background: color-mix(in srgb, var(--tab-accent) 12%, white);
            color: var(--tab-accent);
        }

        .home-action strong,
        .home-action small {
            display: block;
        }

        .home-action small {
            margin-top: 3px;
            color: var(--home-muted);
        }

        .home-action > i {
            color: color-mix(in srgb, var(--tab-accent) 70%, #9098a8);
        }

    .home-tabbar {
        position: fixed;
        left: 50%;
        bottom: 18px;
        width: min(560px, calc(100vw - 48px));
        max-width: 560px;
        margin: 0;
        padding: 10px;
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 8px;
        border-radius: 28px;
        background: var(--brand-primary);
        box-shadow: 0 24px 70px rgba(19, 33, 45, 0.26);
        backdrop-filter: blur(18px);
        transform: translateX(-50%);
        z-index: 30;
    }

    .home-tabbar__item {
        min-height: 72px;
        font-size: 1.5rem;
        display: grid;
        place-items: center;
        gap: 6px;
        border: 0;
        border-radius: 22px;
        background: transparent;
        color: rgba(255, 255, 255, 0.5);
        cursor: pointer;
        text-decoration: none;
        transition: background-color 180ms ease, color 180ms ease, transform 180ms ease;
    }

        .home-tabbar__item span {
            /* width: 38px; */
            /* height: 38px; */
            display: grid;
            place-items: center;
            border-radius: 999px;
            /* background: rgba(255, 255, 255, 0.12); */
        }

        .home-tabbar__item small {
            font-size: 12px;
            font-weight: 800;
        }

    .home-tabbar__item.is-active,
    .home-tabbar__item.active {
        /* background: rgba(255, 255, 255, 0.14); */
        color: #fff;
        /* box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08); */
    }

.home-tabbar__item.is-active span,
.home-tabbar__item.active span {
    background: transparent;
}

.home-radial-proposal {
    display: grid;
    grid-template-columns: 1fr;
    align-content: start;
    justify-items: center;
    gap: 12px;
}

.home-radial-proposal__chart {
    width: 100%;
    max-width: 880px;
    margin: 0;
    display: grid;
    justify-items: center;
    gap: 14px;
}

.home-radial-proposal__visual {
    position: relative;
    width: min(100%, 620px);
    aspect-ratio: 1.15 / 0.8;
    margin: 0 auto;
}

.home-radial-proposal__apex {
    width: 100%;
    height: 100%;
    min-height: 360px;
}

.home-radial-proposal__center {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    pointer-events: none;
    text-align: center;
}

    .home-radial-proposal__center strong,
    .home-radial-proposal__fallback-value {
        color: #171717;
        font-size: clamp(22px, 3vw, 36px);
        /*font-size: clamp(26px, 3.4vw, 42px);*/
        line-height: 1;
        font-weight: 800;
    }

.home-radial-proposal__center span,
.home-radial-proposal__fallback-label {
        color: #FEB019;
        font-size: clamp(11px, 0.9vw, 14px);
        /*font-size: clamp(12px, 1vw, 16px);*/
        font-weight: 700;
    }

.home-radial-proposal__summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    width: 100%;
    max-width: 880px;
    justify-self: stretch;
}

.home-radial-proposal__metric {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    border: 1px solid rgba(31, 38, 55, 0.08);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.78);
}

.home-radial-proposal__metric--real {
    background: rgba(255, 149, 0, 0.10);
    border-color: rgba(255, 149, 0, 0.20);
}

.home-radial-proposal__metric--projected {
    background: rgba(22, 163, 74, 0.10);
    border-color: rgba(22, 163, 74, 0.20);
}

.home-radial-proposal__metric--meta {
    background: rgba(36, 91, 255, 0.10);
    border-color: rgba(36, 91, 255, 0.20);
}

.home-radial-proposal__metric div {
    min-width: 0;
}

.home-radial-proposal__metric strong,
.home-radial-proposal__metric b {
    color: #1f2637;
}

.home-radial-proposal__metric small {
    display: block;
    color: #667085;
}

@media (max-width: 1280px) {
    .home-division-kpi-track {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .home-radial-proposal__chart {
        max-width: 760px;
        gap: 10px;
    }

    .home-radial-proposal__visual {
        width: min(100%, 520px);
    }

    .home-radial-proposal__apex {
        min-height: 320px;
    }

    .home-radial-proposal__summary {
        grid-template-columns: 1fr;
        width: min(100%, 420px);
        justify-self: start;
    }
}

@media (max-width: 430px) {
    .home-radial-proposal__chart {
        max-width: 100%;
        gap: 8px;
    }

    .home-radial-proposal__visual {
        width: min(100%, 320px);
    }

    .home-radial-proposal__apex {
        min-height: 248px;
    }

    .home-radial-proposal__center strong,
    .home-radial-proposal__fallback-value {
        font-size: clamp(18px, 6vw, 24px);
    }

    .home-radial-proposal__center span,
    .home-radial-proposal__fallback-label {
        font-size: 12px;
    }

    .home-radial-proposal__summary {
        width: 100%;
        max-width: 100%;
    }
}

.home-radial-proposal__dot {
    width: 10px;
    height: 10px;
    border-radius: 999px;
}

.home-radial-proposal__dot--meta {
    background: #008FFB;
}

.home-radial-proposal__dot--projected {
    background: #00E396;
}

.home-radial-proposal__dot--real {
    background: #FEB019;
}

@media (max-width: 760px) {
    .home-radial-proposal {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .home-radial-proposal__chart {
        max-width: none;
        margin: 0 auto;
    }

    .home-radial-proposal__visual {
        width: min(100%, 420px);
    }

    .home-radial-proposal__summary {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 430px) {
    .home-radial-proposal__chart {
        max-width: 100%;
        gap: 8px;
    }

    .home-radial-proposal__visual {
        width: min(100%, 312px);
        max-width: calc(100vw - 44px);
        aspect-ratio: 1.08 / 0.84;
    }

    .home-radial-proposal__apex {
        min-height: 238px;
        overflow: hidden;
    }

    .home-radial-proposal__center strong,
    .home-radial-proposal__fallback-value {
        font-size: clamp(18px, 6vw, 24px);
    }

    .home-radial-proposal__center span,
    .home-radial-proposal__fallback-label {
        font-size: 11px;
    }

    .home-radial-proposal__summary {
        width: 100%;
        max-width: 100%;
    }
}

    .home-board .apexcharts-toolbar {
        display: none !important;
    }

    .home-board .apexcharts-canvas {
        margin: 0 auto;
    }

    .home-board .apexcharts-text,
    .home-board .apexcharts-xaxis text,
    .home-board .apexcharts-yaxis text {
        fill: #111111;
        font-family: inherit;
    }

    .home-board .apexcharts-legend-text {
        color: #111111 !important;
        fill: #111111 !important;
    }

    .home-board .apexcharts-bar-area,
    .home-board .apexcharts-area,
    .home-board .apexcharts-line {
        filter: drop-shadow(0 12px 12px color-mix(in srgb, var(--tab-accent) 18%, transparent));
    }

    @keyframes home-rise {
        from {
            opacity: 0;
            transform: translateY(14px);
        }

        to {
            opacity: 1;
            transform: translateY(0);
        }
    }

    @keyframes home-spin {
        to {
            transform: rotate(360deg);
        }
    }

    @media (max-width: 1120px) {
        .home-grid {
            grid-template-columns: 1fr 1fr;
        }

        .home-card--hero {
            grid-column: 1 / -1;
        }

        .home-annual-shell.is-detail-open {
            grid-template-columns: minmax(0, 1fr) minmax(390px, 1fr);
        }

        .home-stack {
            grid-column: 1 / -1;
            grid-template-columns: 1fr 1fr;
        }
    }

    @media (max-width: 760px) {
        .home-board {
            height: auto;
            max-height: none;
            min-height: auto;
            padding: 18px 14px 196px;
            overflow-x: hidden;
            overflow-y: visible;
            border-radius: 0;
        }

        .home-bar-label {
            font-size: 11px;
            line-height: 1;
            max-width: calc(100% - 12px);
        }

        .home-topbar {
            padding: 8px 15px;
            align-items: center;
            margin: 0 auto 12px;
        }

        .home-toolbar {
            flex-direction: column;
            gap: 8px;
        }

        .home-date-filters {
            display: flex;
            gap: 8px;
        }

        .home-year-filter {
            width: 58px;
            min-height: 50px;
            justify-content: center;
            padding: 0;
        }

            .home-year-filter i {
                display: none;
            }

            .home-year-filter select {
                min-width: 48px;
                text-align: center;
                font-size: 12px;
            }

        .home-data-refresh {
            width: 50px;
            min-height: 50px;
            justify-content: center;
            padding: 0;
        }

            .home-data-refresh span {
                display: none;
            }

        .home-status {
            padding-inline: 15px;
            align-items: flex-start;
            flex-direction: column;
            margin-bottom: 12px;
        }

            .home-topbar h1 {
                font-size: 26px;
                font-weight: 400;
            }

            .home-topbar p {
                font-size: 14px;
            }

        .home-focus-tabs {
            width: 100%;
            overflow-x: auto;
            justify-content: flex-start;
        }

        .home-focus-tab {
            height: 42px;
            font-size: 0.85rem;
            font-weight: 500;
            min-width: 92px;
        }

        .home-grid,
        .home-stack {
            grid-template-columns: 1fr;
        }

        .home-card--hero,
        .home-card--chart,
        .home-card--actions {
            width: 100%;
            min-width: 0;
            padding: 18px;
            border-radius: 26px;
        }

        .home-card--hero {
            grid-column: auto;
            overflow: hidden;
        }

        .home-annual-shell.is-detail-open {
            grid-template-columns: 1fr;
        }

        .home-annual-chart {
            min-height: 208px;
        }

        .home-annual-chart-scroll {
            margin-inline: -8px;
            padding-inline: 8px;
            overflow-x: auto;
            overflow-y: hidden;
            -webkit-overflow-scrolling: touch;
            scrollbar-width: thin;
            padding-bottom: 12px;
            touch-action: pan-x pan-y;
        }

        .home-annual-chart-scroll--compact {
            margin-inline: 0;
            padding-inline: 0;
        }
            
        .home-annual-chart-track {
            min-width: 340px;
        }

        .home-annual-chart-track--monthly {
            min-width: 300px;
        }

        .home-annual-chart-track--annual-overview {
            min-width: 420px;
        }

        .home-annual-chart-track--monthly-overview {
            min-width: 0;
        }

        .home-annual-chart-track--annual-monthly-bars {
            min-width: 560px;
        }

        .home-annual-chart-track--division-bars {
            min-width: 420px;
        }

        .home-annual-chart-track--mix {
            min-width: 620px;
        }

        .home-annual-chart-track--price-kg {
            min-width: 560px;
        }

        .home-detail-inline {
            display: none;
        }

        .home-annual-mobile-detail-button {
            width: fit-content;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            margin: 5px auto 0;
            padding: 11px 16px;
            border: 1px solid ;
            border-radius: 999px;
            font-size: 13px;
            font-weight: 800;
            line-height: 1.2;
            box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.48);
            cursor: pointer;
        }

        .home-donut-wrap {
            min-height: min(260px, 72vw);
        }

        .home-donut-chart .apexcharts-canvas,
        .home-donut-chart svg {
            width: 100% !important;
            max-width: 100% !important;
        }

        .home-annual-chart-track,
        .home-chart-card .apexcharts-canvas,
        .home-chart-card .apexcharts-canvas svg,
        .home-chart-card svg {
            touch-action: pan-y !important;
        }

        .home-chart-card__header {
            gap: 8px;
        }

        .home-chart-card__header h2 {
            font-size: 1.9rem;
            line-height: 1.08;
        }

        .home-chart-card__header p {
            font-size: 0.92rem;
        }

        .home-chart-card__body {
            gap: 8px;
        }

        .home-chart-card .home-annual-chart .apexcharts-xaxis text,
        .home-chart-card .home-annual-chart .apexcharts-yaxis text,
        .home-chart-card .home-annual-chart .apexcharts-legend-text {
            font-size: 10px !important;
        }

        .home-secondary-chart__head strong {
            font-size: 16px;
        }

        .home-secondary-chart__head small {
            font-size: 10px;
        }

        .home-donut-center {
            width: clamp(112px, 36vw, 132px);
            height: clamp(112px, 36vw, 132px);
        }

            .home-donut-center strong {
                font-size: clamp(22px, 7vw, 28px);
            }

        .home-chart-scroll {
            margin-inline: -4px;
            padding-inline: 4px;
            padding-bottom: 12px;
            touch-action: pan-x pan-y;
        }

        .home-chart-track {
            min-width: 620px;
        }

        .home-card__head {
            margin-bottom: 10px;
        }

        .home-insight-strip {
            grid-template-columns: 1fr;
        }

        .home-insight {
            min-height: auto;
            display: grid;
            grid-template-columns: auto 1fr;
            column-gap: 12px;
            align-items: center;
        }

            .home-insight span {
                grid-row: span 2;
                margin-bottom: 0;
            }

        .home-detail-backdrop {
            align-items: end;
            padding: 10px;
        }

        .home-detail-modal {
            max-height: min(620px, calc(100dvh - 20px));
            border-radius: 24px;
        }

        .home-detail-body {
            padding-inline: 14px;
        }

        .home-detail-modal-title span {
            display: block;
        }

            .home-detail-modal-title span + span::before {
                content: "";
            }

        .home-tabbar {
            position: fixed;
            left: 8px;
            right: 8px;
            bottom: 8px;
            width: auto;
            margin: 0;
            padding: 7px 10px;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            transform: none;
        }

        .home-tabbar__item {
            font-size: 1rem;
            gap: 0px;
            min-height: 42px;
        }

            .home-tabbar__item small {
                font-size: 0.75rem;
                font-weight: 400;
            }

        .home-kicker {
            padding: 5px 10px;
            font-size: 0.70rem;
            font-weight: 500;
        }
        .home-card__head strong{
            font-size: 1.3rem;
        }

        .home-action strong,
        .home-action small{
            font-size: .85rem;        
        }


    }

/* Dashboard V2  */
.home-board {
    --home-ink: #1f2637;
    --home-muted: #727b8d;
    --home-line: rgba(31, 38, 55, 0.10);
    --home-card: rgba(255, 255, 255, 0.94);
    --home-content-max: 100%;
    min-height: calc(100dvh - 32px);
    padding-inline: clamp(8px, 1vw, 16px);
    background: linear-gradient(135deg, #f4f6f5 0%, #ffffff 46%, #eef3f1 100%);
}

.home-topbar,
.home-status,
.home-focus-tabs,
.home-grid,
.home-loading-panel,
.home-error-panel {
    max-width: var(--home-content-max);
}

.home-topbar {
    z-index: 8;
}

.home-toolbar {
    position: relative;
    z-index: 9;
}

.home-ambient {
    display: none;
}

.home-topbar h1 {
    margin: 16px 0 6px;
    font-size: clamp(28px, 3.6vw, 44px);
    font-weight: 500;
    line-height: 1.08;
    letter-spacing: 0;
}

.home-topbar p {
    font-size: 15px;
}

.home-kicker {
    font-weight: 650;
    letter-spacing: 0.07em;
}

.home-igv-toggle {
    min-height: 50px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 5px;
    border: 1px solid var(--home-line);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.88);
    box-shadow: 0 14px 30px rgba(35, 48, 71, 0.08);
}

.home-igv-toggle button {
    min-height: 38px;
    padding: 0 12px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--home-muted);
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
}

.home-igv-toggle button.is-active {
    background: #ff9500;
    color: #111;
}

.home-igv-toggle button:disabled {
    cursor: wait;
    opacity: 0.65;
}

.home-date-filters {
    display: inline-flex;
    gap: 10px;
    align-items: center;
}

.home-month-filter select {
    min-width: 58px;
}

.home-grid--dashboard {
    grid-template-columns: 1fr;
}

.home-chart-card {
    min-width: 0;
    overflow: hidden;
    scroll-margin-top: 156px;
    border: 1px solid rgba(31, 38, 55, 0.08);
    border-radius: 8px;
    background: var(--home-card);
    box-shadow: 0 18px 44px rgba(35, 48, 71, 0.08);
}

#dashboard-abc.home-chart-card {
    position: relative;
    overflow: visible;
}

.home-chart-card__header {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: flex-start;
    padding: 22px 24px 16px;
    border-bottom: 1px solid var(--home-line);
}

.home-chart-card__header span,
.home-chart-card__header small,
.home-chart-card__footer span {
    color: var(--home-muted);
    font-size: 12px;
    font-weight: 650;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.home-chart-card__header h2 {
    margin: 6px 0 4px;
    color: var(--home-ink);
    font-size: clamp(24px, 2.4vw, 32px);
    font-weight: 500;
    line-height: 1.15;
    letter-spacing: 0;
}

.home-chart-card__header p {
    margin: 0;
    color: var(--home-muted);
    font-size: 14px;
}

.home-chart-card__body {
    padding: 20px 24px 18px;
}

.home-chart-card__footer {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
    padding: 16px 24px;
    border-top: 1px solid var(--home-line);
    background: #f3f4f4;
}

.home-chart-card__footer--ghost {
    min-height: 8px;
    justify-content: center;
    padding-top: 4px;
    padding-bottom: 4px;
    background: #f4f4f3;
}

.home-chart-card .home-annual-shell.is-detail-open {
    grid-template-columns: minmax(460px, 1fr) minmax(460px, 1fr);
}

.home-chart-card .home-annual-chart,
.home-chart-card .home-detail-inline {
    min-height: 480px;
}

.home-chart-card .home-annual-chart {
    align-content: start;
}

.home-chart-card .home-annual-visual-stack .home-annual-chart {
    min-height: 0;
}

.home-chart-card .home-secondary-chart--annual-monthly .home-annual-chart {
    min-height: 250px;
}

#dashboard-soles .home-chart-card__body {
    padding-top: 12px;
    padding-bottom: 8px;
}

#dashboard-soles .home-chart-card__footer--ghost {
    min-height: 4px;
    padding-top: 2px;
    padding-bottom: 2px;
}

#dashboard-soles .home-annual-chart--compact .apexcharts-legend {
    margin-top: -10px !important;
}

.home-detail-inline {
    border-radius: 8px;
    background: #fff;
}

.home-detail-head {
    padding: 16px 18px;
}

.home-detail-head strong {
    font-size: 18px;
    font-weight: 550;
    letter-spacing: 0;
}

.home-detail-table th {
    font-weight: 650;
}

.home-detail-table td {
    font-weight: 600;
}

.home-loading-panel--inline,
.home-error-panel--inline {
    min-height: 180px;
    margin: 0;
}

.home-executive-band {
    display: grid;
    gap: 14px;
}

.home-executive-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.home-executive-card,
.home-goal-card,
.home-year-card,
.home-insights-panel,
.home-margin-action-panel,
.home-division-kpi-carousel,
.home-ranking-panel,
.home-abc-focus-card,
.home-abc-margin-card {
    --signal: #52607a;
    --signal-soft: rgba(82, 96, 122, 0.12);
    min-width: 0;
    border: 1px solid var(--home-line);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 18px 42px rgba(31, 38, 55, 0.06);
}

.home-executive-card {
    display: grid;
    gap: 8px;
    padding: 16px;
    border-left: 4px solid var(--signal);
    background: linear-gradient(135deg, var(--signal-soft), rgba(255, 255, 255, 0.92) 46%);
}

.home-executive-card--green,
.home-goal-card--green,
.home-year-card--green,
.home-insight-chip--green,
.home-margin-action--green,
.home-ranking-row--green,
.home-division-margin-row--green {
    --signal: #198754;
    --signal-soft: rgba(25, 135, 84, 0.13);
}

.home-executive-card--amber,
.home-goal-card--amber,
.home-year-card--amber,
.home-insight-chip--amber,
.home-margin-action--amber,
.home-ranking-row--amber,
.home-division-margin-row--amber {
    --signal: #ff9500;
    --signal-soft: rgba(255, 149, 0, 0.14);
}

.home-executive-card--red,
.home-goal-card--red,
.home-year-card--red,
.home-insight-chip--red,
.home-margin-action--red,
.home-ranking-row--red,
.home-division-margin-row--red {
    --signal: #dc3545;
    --signal-soft: rgba(220, 53, 69, 0.12);
}

.home-executive-card--neutral,
.home-year-card--neutral,
.home-insight-chip--neutral {
    --signal: #52607a;
    --signal-soft: rgba(82, 96, 122, 0.11);
}

.home-executive-card span,
.home-goal-card span,
.home-year-card > span,
.home-insights-panel header span,
.home-margin-action-panel header span,
.home-division-kpi-carousel header span,
.home-ranking-panel__header span,
.home-ranking-card > span,
.home-abc-focus-card header span,
.home-abc-margin-card header span {
    color: var(--signal);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.home-executive-card strong {
    overflow: hidden;
    color: var(--home-ink);
    font-size: clamp(22px, 2.3vw, 32px);
    font-weight: 800;
    letter-spacing: 0;
    line-height: 1.05;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.home-executive-card small,
.home-goal-card p,
.home-year-card p,
.home-insight-chip span,
.home-ranking-row small,
.home-muted-note {
    margin: 0;
    color: var(--home-muted);
    font-size: 13px;
    font-weight: 650;
    line-height: 1.45;
}

.home-executive-lower {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(280px, 0.55fr);
    gap: 12px;
}

.home-goal-card {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    gap: 14px;
    padding: 18px;
    background: linear-gradient(135deg, var(--signal-soft), #fff 55%);
}

.home-goal-card strong,
.home-year-card strong,
.home-insights-panel header strong,
.home-margin-action-panel header strong,
.home-division-kpi-carousel header strong,
.home-ranking-panel__header strong,
.home-abc-focus-card header strong,
.home-abc-margin-card header strong {
    display: block;
    margin-top: 6px;
    color: var(--home-ink);
    font-size: 18px;
    font-weight: 750;
    line-height: 1.25;
}

.home-goal-card__metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.home-goal-card__metrics div,
.home-year-card__grid div {
    min-width: 0;
    padding: 12px;
    border-radius: 7px;
    background: rgba(255, 255, 255, 0.72);
}

.home-goal-card__metrics span,
.home-year-card__grid small {
    color: var(--home-muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.home-goal-card__metrics strong,
.home-year-card__grid b {
    display: block;
    overflow: hidden;
    margin-top: 6px;
    color: var(--home-ink);
    font-size: 16px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.home-year-card {
    display: grid;
    align-content: start;
    gap: 10px;
    padding: 18px;
    border-left: 4px solid var(--signal);
    background: linear-gradient(135deg, var(--signal-soft), #fff 58%);
}

.home-year-card__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.home-insights-panel {
    padding: 18px;
}

.home-margin-action-panel {
    display: grid;
    gap: 14px;
    max-width: 900px;
    margin-top: 14px;
    padding: 18px;
}

.home-margin-action-list {
    display: grid;
    gap: 10px;
}

.home-margin-action {
    --signal: #52607a;
    --signal-soft: rgba(82, 96, 122, 0.11);
    display: grid;
    grid-template-columns: 76px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    min-width: 0;
    padding: 12px;
    border: 1px solid rgba(31, 38, 55, 0.06);
    border-left: 4px solid var(--signal);
    border-radius: 8px;
    background: var(--signal-soft);
}

.home-margin-action__percent {
    display: grid;
    width: 64px;
    height: 54px;
    place-items: center;
    border-radius: 8px;
    background: #fff;
    color: var(--signal);
    font-size: 17px;
    font-weight: 850;
    line-height: 1;
    box-shadow: inset 0 0 0 1px rgba(31, 38, 55, 0.06);
}

.home-margin-action__body {
    min-width: 0;
}

.home-margin-action__body strong {
    display: block;
    overflow: hidden;
    color: var(--home-ink);
    font-size: 15px;
    font-weight: 850;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.home-margin-action__body span {
    display: block;
    margin-top: 5px;
    color: var(--home-muted);
    font-size: 12px;
    font-weight: 650;
    line-height: 1.35;
}

.home-insights-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 14px;
}

.home-division-kpi-carousel {
    display: grid;
    gap: 14px;
    max-width: none;
    margin-top: 14px;
    padding: 18px;
}

.home-division-kpi-track {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    padding: 2px;
}

.home-division-kpi-card {
    --signal: #52607a;
    --signal-soft: rgba(82, 96, 122, 0.11);
    display: grid;
    gap: 8px;
    align-content: start;
    min-width: 0;
    min-height: 248px;
    padding: 12px;
    border: 1px solid rgba(31, 38, 55, 0.08);
    border-radius: 8px;
    background: linear-gradient(135deg, var(--signal-soft), #fff 60%);
}

.home-division-kpi-card--green {
    --signal: #198754;
    --signal-soft: rgba(25, 135, 84, 0.13);
}

.home-division-kpi-card--amber {
    --signal: #ff9500;
    --signal-soft: rgba(255, 149, 0, 0.14);
}

.home-division-kpi-card--red {
    --signal: #dc3545;
    --signal-soft: rgba(220, 53, 69, 0.12);
}

.home-division-kpi-card__gauge {
    display: grid;
    min-height: 138px;
    place-items: center;
}

.home-echart-gauge--mini {
    width: min(230px, 100%);
    height: 138px;
}

.home-division-kpi-card__badge {
    display: grid;
    width: 76px;
    height: 62px;
    place-items: center;
    border-radius: 8px;
    background: var(--signal);
    color: #fff;
    font-size: 18px;
    font-weight: 900;
    line-height: 1;
}

.home-division-kpi-card__body {
    display: grid;
    gap: 6px;
    min-width: 0;
}

.home-division-kpi-card__body strong {
    color: var(--home-ink);
    font-size: 16px;
    font-weight: 850;
    line-height: 1.25;
}

.home-division-kpi-card__body span {
    color: var(--home-ink);
    font-size: 16px;
    font-weight: 850;
    line-height: 1.1;
}

.home-division-kpi-card__body small {
    color: var(--home-muted);
    font-size: 12px;
    font-weight: 650;
    line-height: 1.35;
}

.home-insight-chip {
    --signal: #52607a;
    --signal-soft: rgba(82, 96, 122, 0.11);
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    min-width: 0;
    padding: 12px;
    border-radius: 8px;
    background: var(--signal-soft);
}

.home-insight-chip i {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border-radius: 7px;
    background: #fff;
    color: var(--signal);
}

.home-insight-chip strong {
    display: block;
    color: var(--home-ink);
    font-size: 14px;
    font-weight: 800;
    line-height: 1.25;
}

.home-ranking-panel {
    display: grid;
    gap: 14px;
    padding: 20px;
}

.home-ranking-panel__header {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: flex-start;
}

.home-ranking-panel__header small {
    color: var(--home-muted);
    font-size: 12px;
    font-weight: 700;
}

.home-ranking-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.home-ranking-card {
    display: grid;
    gap: 10px;
    min-width: 0;
    padding: 14px;
    border: 1px solid var(--home-line);
    border-radius: 8px;
    background: #f9fafb;
}

.home-ranking-row {
    --signal: #52607a;
    --signal-soft: rgba(82, 96, 122, 0.1);
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 4px 10px;
    min-width: 0;
    padding: 10px;
    border-left: 3px solid var(--signal);
    border-radius: 7px;
    background: var(--signal-soft);
}

.home-ranking-row strong {
    overflow: hidden;
    color: var(--home-ink);
    font-size: 14px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.home-ranking-row b {
    color: var(--signal);
    font-size: 14px;
    font-weight: 850;
}

.home-ranking-row small {
    grid-column: 1 / -1;
}

.home-abc-controls {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: flex-end;
    margin-bottom: 18px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--home-line);
}

.home-abc-filter-button,
.home-abc-filter-close {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border: 1px solid rgba(31, 38, 55, 0.12);
    border-radius: 8px;
    background: #fff;
    color: var(--home-ink);
    box-shadow: 0 12px 26px rgba(31, 38, 55, 0.08);
}

.home-abc-filter-button:hover,
.home-abc-filter-close:hover {
    color: var(--tab-accent);
    border-color: color-mix(in srgb, var(--tab-accent) 38%, rgba(31, 38, 55, 0.12));
}

.home-abc-filter-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: grid;
    place-items: center;
    width: auto;
    padding: 22px;
    background: rgba(18, 25, 38, 0.22);
    backdrop-filter: blur(6px);
    pointer-events: auto;
}

.home-abc-filter-modal {
    width: min(720px, calc(100vw - 44px));
    max-height: min(680px, calc(100dvh - 44px));
    overflow: auto;
    border: 1px solid rgba(31, 38, 55, 0.1);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 22px 52px rgba(18, 25, 38, 0.2);
    pointer-events: auto;
}

.home-abc-filter-modal__header {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
    padding: 18px 18px 12px;
    border-bottom: 1px solid var(--home-line);
}

.home-abc-filter-modal__header span {
    color: var(--home-muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.home-abc-filter-modal__header strong {
    display: block;
    margin-top: 4px;
    color: var(--home-ink);
    font-size: 20px;
    font-weight: 800;
}

.home-abc-filter-modal .home-abc-controls {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 0;
    padding: 18px;
    border-bottom: 0;
}

.home-abc-filter-modal .home-abc-control,
.home-abc-filter-modal .home-abc-control--view,
.home-abc-filter-modal .home-abc-type-filter {
    width: 100%;
    min-width: 0;
}

.home-abc-filter-modal .home-abc-type-filter {
    grid-column: 1 / -1;
}

.home-abc-filter-modal .home-dashboard-filter-controls {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.home-dashboard-modal-group {
    display: grid;
    min-width: 0;
    gap: 6px;
}

.home-dashboard-modal-group > span {
    color: var(--home-muted);
    font-size: 11px;
    font-weight: 750;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.home-dashboard-modal-group .home-igv-toggle {
    min-height: 36px;
    width: 100%;
    box-shadow: none;
}

.home-dashboard-modal-group .home-igv-toggle button {
    flex: 1 1 0;
    min-height: 28px;
    padding-inline: 8px;
}

.home-dashboard-filter-actions {
    grid-column: 1 / -1;
}

.home-abc-filter-actions {
    display: flex;
    justify-content: flex-end;
    padding: 0 18px 18px;
}

.home-abc-apply-button {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 0 16px;
    border: 1px solid rgba(31, 38, 55, 0.12);
    border-radius: 8px;
    background: #1f7aff;
    color: #fff;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0;
    cursor: pointer;
    box-shadow: 0 10px 22px rgba(31, 122, 255, 0.22);
}

.home-abc-apply-button:disabled {
    cursor: not-allowed;
    opacity: 0.62;
    box-shadow: none;
}

.home-kpi-margin-card--abc {
    width: 100%;
    max-width: none;
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "chart";
    justify-items: stretch;
    margin-bottom: 12px;
}

.home-kpi-margin-card--abc .home-kpi-margin-card__chart {
    width: 100%;
}

.home-abc-control {
    display: grid;
    min-width: 116px;
    gap: 6px;
}

.home-abc-control--view {
    min-width: 150px;
}

.home-abc-control span,
.home-abc-type-filter legend {
    color: var(--home-muted);
    font-size: 11px;
    font-weight: 750;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.home-abc-control select {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    height: 36px;
    padding: 0 12px;
    border: 1px solid rgba(31, 38, 55, 0.14);
    border-radius: 6px;
    background: #fff;
    color: var(--home-ink);
    font-size: 13px;
    font-weight: 650;
}

.home-abc-control input {
    height: 36px;
    padding: 0 12px;
    border: 1px solid rgba(31, 38, 55, 0.14);
    border-radius: 6px;
    background: #fff;
    color: var(--home-ink);
    font-size: 13px;
    font-weight: 650;
}

.home-abc-type-filter {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

.home-abc-type-filter legend {
    width: 100%;
    margin-bottom: 0;
}

.home-abc-type-filter label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 36px;
    color: var(--home-ink);
    font-size: 13px;
    font-weight: 650;
}

.home-abc-type-filter input {
    width: 16px;
    height: 16px;
    accent-color: #ff9500;
}

.home-abc-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 16px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--home-line);
}

.home-abc-summary > div {
    min-width: 0;
    padding: 0 12px 0 0;
    border-right: 1px solid var(--home-line);
}

.home-abc-summary > div:last-child {
    border-right: 0;
}

.home-abc-summary span {
    display: block;
    margin-bottom: 6px;
    color: var(--home-muted);
    font-size: 11px;
    font-weight: 750;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.home-abc-summary strong {
    display: block;
    overflow: hidden;
    color: var(--home-ink);
    font-size: 18px;
    font-weight: 650;
    letter-spacing: 0;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.home-abc-class-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.home-abc-class-card {
    --class-soft: rgba(82, 96, 122, 0.09);
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    min-width: 0;
    padding: 12px;
    border: 1px solid var(--home-line);
    border-radius: 8px;
    background: var(--class-soft);
}

.home-abc-class-card--a {
    --class-soft: rgba(25, 135, 84, 0.1);
}

.home-abc-class-card--b {
    --class-soft: rgba(13, 110, 253, 0.1);
}

.home-abc-class-card--c {
    --class-soft: rgba(178, 106, 0, 0.1);
}

.home-abc-class-card strong {
    display: block;
    overflow: hidden;
    color: var(--home-ink);
    font-size: 14px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.home-abc-class-card small {
    display: block;
    margin-top: 4px;
    color: var(--home-muted);
    font-size: 12px;
    font-weight: 650;
    white-space: normal;
}

.home-abc-manager-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 12px;
    margin-bottom: 16px;
}

.home-abc-table-card {
    min-width: 0;
    border: 1px solid var(--home-line);
    border-radius: 8px;
    background: #fff;
    overflow: hidden;
}

.home-abc-table-shell {
    width: 100%;
    overflow-x: auto;
}

.home-abc-manager-table {
    width: 100%;
    min-width: 760px;
    border-collapse: collapse;
    color: var(--home-ink);
    font-size: 11px;
    table-layout: fixed;
}

.home-abc-manager-table th:first-child {
    width: 40%;
}

.home-abc-manager-table th:nth-child(2),
.home-abc-manager-table th:nth-child(3) {
    width: 16%;
}

.home-abc-manager-table th:nth-child(4),
.home-abc-manager-table th:nth-child(5),
.home-abc-manager-table th:nth-child(6),
.home-abc-manager-table th:nth-child(7) {
    width: 10%;
}

.home-abc-manager-table__mobile-target {
    display: none;
}

.home-abc-manager-table th {
    position: sticky;
    top: 0;
    z-index: 1;
    padding: 8px 9px;
    border-bottom: 1px solid #cfd4dc;
    background: #f8fafc;
    color: #1f2637;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0;
    text-align: right;
    white-space: nowrap;
}

.home-abc-manager-table th:first-child {
    text-align: left;
}

.home-abc-manager-table td {
    overflow: hidden;
    padding: 5px 8px;
    border-right: 1px solid #d9dee7;
    border-bottom: 1px solid #d9dee7;
    text-align: right;
    vertical-align: middle;
    white-space: nowrap;
}

.home-abc-manager-table td:first-child {
    text-align: left;
}

.home-abc-manager-table td:last-child,
.home-abc-manager-table th:last-child {
    border-right: 0;
}

.home-abc-manager-table__division td {
    background: #fff;
    color: #c1121f;
    font-weight: 850;
}

.home-abc-manager-table__band td {
    background: #f7f9fc;
    color: #0d6efd;
    font-weight: 800;
}

.home-abc-manager-table__product td {
    background: #fff;
    color: #1f2637;
    font-weight: 650;
}

.home-abc-table-toggle {
    display: inline-grid;
    grid-template-columns: 16px auto auto;
    gap: 7px;
    align-items: center;
    max-width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.home-abc-table-toggle--nested {
    margin-left: 20px;
}

.home-abc-table-toggle i {
    color: #667085;
    font-size: 11px;
}

.home-abc-table-toggle strong {
    overflow: hidden;
    max-width: 36ch;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.home-abc-table-toggle small {
    color: var(--home-muted);
    font-size: 11px;
    font-weight: 650;
}

.home-abc-product-name {
    display: block;
    min-width: 0;
    padding-left: 36px;
}

.home-abc-product-name span {
    color: #1f2637;
    font-size: 11px;
    font-weight: 750;
}

.home-abc-product-name strong {
    overflow: hidden;
    color: #111827;
    font-size: 11px;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
}

.home-abc-margin-cell {
    color: #111827;
    font-weight: 850;
}

.home-abc-manager-table td.home-abc-margin-cell {
    text-align: center;
}

.home-abc-margin-cell--excellent,
.home-abc-margin-cell--strong,
.home-abc-margin-cell--good {
    background: #fff200 !important;
}

.home-abc-margin-cell--watch {
    background: #ffe699 !important;
}

.home-abc-margin-cell--low {
    background: #ffd7a8 !important;
}

.home-abc-margin-cell--critical {
    background: #ffb3b3 !important;
}

.home-abc-focus-card,
.home-abc-margin-card {
    display: grid;
    align-content: start;
    gap: 12px;
    padding: 16px;
}

.home-abc-focus-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto auto;
    gap: 10px;
    align-items: center;
    min-width: 0;
    padding: 10px;
    border-radius: 7px;
    background: rgba(220, 53, 69, 0.08);
}

.home-abc-focus-row strong {
    display: block;
    overflow: hidden;
    color: var(--home-ink);
    font-size: 13px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.home-abc-focus-row small {
    display: block;
    margin-top: 3px;
    color: var(--home-muted);
    font-size: 11px;
    font-weight: 650;
}

.home-abc-focus-row span,
.home-abc-focus-row b {
    color: var(--home-ink);
    font-size: 13px;
    font-weight: 800;
    white-space: nowrap;
}

.home-abc-focus-row b {
    color: #dc3545;
}

.home-division-margin-list {
    display: grid;
    gap: 8px;
}

.home-division-margin-row {
    --signal: #52607a;
    --signal-soft: rgba(82, 96, 122, 0.1);
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) repeat(3, minmax(72px, auto));
    gap: 10px;
    align-items: center;
    min-width: 0;
    padding: 10px;
    border-left: 3px solid var(--signal);
    border-radius: 7px;
    background: var(--signal-soft);
}

.home-division-margin-row strong {
    overflow: hidden;
    color: var(--home-ink);
    font-size: 13px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.home-division-margin-row span,
.home-division-margin-row b {
    color: var(--home-ink);
    font-size: 12px;
    font-weight: 800;
    text-align: right;
    white-space: nowrap;
}

.home-division-margin-row b {
    color: var(--signal);
}

.home-abc-table-wrap {
    max-height: 640px;
    overflow: auto;
    border: 1px solid var(--home-line);
    border-radius: 8px;
    background: #fff;
}

.home-abc-table {
    min-width: 1080px;
}

.home-abc-table thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: #f7f8fb;
}

.home-abc-product {
    min-width: 260px;
}

.home-abc-product strong {
    display: block;
    max-width: 360px;
    overflow: hidden;
    color: var(--home-ink);
    font-size: 13px;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.home-abc-product small {
    display: block;
    margin-top: 4px;
    color: var(--home-muted);
    font-size: 11px;
    font-weight: 650;
}

.home-abc-class {
    display: inline-flex;
    width: 28px;
    height: 28px;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    color: #fff;
    font-size: 12px;
    font-weight: 800;
}

.home-abc-class--a {
    background: #198754;
}

.home-abc-class--b {
    background: #0d6efd;
}

.home-abc-class--c {
    background: #b26a00;
}

.home-abc-bar-cell {
    min-width: 170px;
}

.home-abc-bar-cell span {
    display: block;
    margin-bottom: 6px;
    color: var(--home-ink);
    font-size: 12px;
    font-weight: 700;
}

.home-abc-bar-track {
    height: 7px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf0f5;
}

.home-abc-bar-fill {
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #ff9500, #30a46c);
}

.home-abc-tree {
    display: grid;
    gap: 8px;
}

.home-abc-tree-wrap {
    max-height: clamp(420px, 62vh, 760px);
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 4px;
    scrollbar-width: thin;
    scrollbar-color: rgba(31, 38, 55, 0.22) transparent;
}

.home-abc-tree-wrap::-webkit-scrollbar {
    width: 8px;
}

.home-abc-tree-wrap::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(31, 38, 55, 0.22);
}

.home-empty-panel {
    display: grid;
    gap: 6px;
    padding: 22px;
    border: 1px dashed rgba(31, 38, 55, 0.16);
    border-radius: 8px;
    background: #fafbfc;
}

.home-empty-panel strong {
    color: var(--home-ink);
    font-size: 15px;
    font-weight: 700;
}

.home-empty-panel span {
    color: var(--home-muted);
    font-size: 13px;
}

.home-abc-node {
    border: 1px solid var(--home-line);
    border-radius: 8px;
    background: #fff;
    overflow: hidden;
}

.home-abc-node--group {
    margin-top: 8px;
    margin-left: 12px;
    background: #fcfcfc;
}

.home-abc-node__toggle {
    width: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 10px 14px;
    border: 0;
    background: transparent;
    color: inherit;
    text-align: left;
    cursor: pointer;
}

.home-abc-node__main {
    min-width: 0;
}

.home-abc-node__eyebrow {
    display: block;
    margin-bottom: 2px;
    color: var(--home-muted);
    font-size: 10px;
    font-weight: 750;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.home-abc-node__main strong {
    display: block;
    overflow: hidden;
    color: var(--home-ink);
    font-size: 15px;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.home-abc-node__main small {
    display: block;
    margin-top: 2px;
    color: var(--home-muted);
    font-size: 11px;
    font-weight: 650;
}

.home-abc-node__metrics {
    display: inline-grid;
    grid-template-columns: repeat(4, auto);
    gap: 10px;
    align-items: center;
    color: var(--home-ink);
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}

.home-abc-node__metrics span {
    min-width: 78px;
    text-align: right;
}

.home-abc-node__metrics i {
    color: var(--home-muted);
    font-size: 13px;
}

.home-abc-node__children {
    padding: 0 10px 10px;
    border-top: 1px solid var(--home-line);
    background: #f8f9fa;
}

.home-abc-products {
    display: grid;
    gap: 10px;
    padding: 12px 0 0;
}

.home-abc-product-card {
    padding: 14px;
    border: 1px solid var(--home-line);
    border-radius: 8px;
    background: #fff;
    overflow: hidden;
}

.home-abc-product-card__head {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: flex-start;
}

.home-abc-product-card__title {
    min-width: 0;
    display: flex;
    gap: 10px;
    align-items: flex-start;
}

.home-abc-product-card__title > div {
    min-width: 0;
}

.home-abc-product-card__title strong {
    display: block;
    color: var(--home-ink);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.35;
    white-space: normal;
    word-break: break-word;
    overflow-wrap: anywhere;
}

.home-abc-product-card__title small,
.home-abc-product-card__share small {
    display: block;
    margin-top: 4px;
    color: var(--home-muted);
    font-size: 11px;
    font-weight: 650;
}

.home-abc-product-card__share {
    flex-shrink: 0;
    text-align: right;
}

.home-abc-product-card__share span {
    color: var(--home-ink);
    font-size: 14px;
    font-weight: 800;
}

.home-abc-product-card__body {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-top: 12px;
}

.home-abc-product-card__metric {
    min-width: 0;
    padding: 10px 12px;
    border-radius: 6px;
    background: #f6f7f8;
}

.home-abc-product-card__metric span {
    display: block;
    margin-bottom: 4px;
    color: var(--home-muted);
    font-size: 11px;
    font-weight: 750;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.home-abc-product-card__metric strong {
    display: block;
    color: var(--home-ink);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.3;
    white-space: normal;
    word-break: break-word;
    overflow-wrap: anywhere;
}

.home-abc-bar-cell--product {
    margin-top: 12px;
}

.home-kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.home-kpi-gauge-card {
    --kpi-color: #dc3545;
    --kpi-soft: rgba(220, 53, 69, 0.11);
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 14px;
    padding: 18px;
    border: 1px solid var(--home-line);
    border-radius: 8px;
    background: #fff;
}

.home-kpi-gauge-card--amber {
    --kpi-color: #ff9500;
    --kpi-soft: rgba(255, 149, 0, 0.13);
}

.home-kpi-gauge-card--orange {
    --kpi-color: #f97316;
    --kpi-soft: rgba(249, 115, 22, 0.13);
}

.home-kpi-gauge-card--green {
    --kpi-color: #198754;
    --kpi-soft: rgba(25, 135, 84, 0.12);
}

.home-kpi-gauge {
    position: relative;
    width: min(210px, 100%);
    height: 132px;
    align-self: center;
    overflow: visible;
}

.home-kpi-gauge--echarts {
    width: min(230px, 100%);
    height: 142px;
}

.home-kpi-gauge__fallback {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    color: var(--home-ink);
    font-size: 22px;
    font-weight: 850;
    line-height: 1;
    letter-spacing: 0;
}

.home-kpi-gauge--echarts.is-echarts-ready .home-kpi-gauge__fallback {
    display: none;
}

.home-kpi-gauge__arc {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    filter: drop-shadow(0 8px 16px rgba(31, 38, 55, 0.12));
}

.home-kpi-gauge__segment {
    fill: none;
    stroke-width: 22;
    stroke-linecap: butt;
}

.home-kpi-gauge__segment--deep-red {
    stroke: #a92d27;
    stroke-dasharray: 17 83;
    stroke-dashoffset: 0;
}

.home-kpi-gauge__segment--red {
    stroke: #e33813;
    stroke-dasharray: 17 83;
    stroke-dashoffset: -20;
}

.home-kpi-gauge__segment--orange {
    stroke: #ff982f;
    stroke-dasharray: 17 83;
    stroke-dashoffset: -40;
}

.home-kpi-gauge__segment--amber {
    stroke: #ffd231;
    stroke-dasharray: 17 83;
    stroke-dashoffset: -60;
}

.home-kpi-gauge__segment--green {
    stroke: #43b21d;
    stroke-dasharray: 17 83;
    stroke-dashoffset: -80;
}

.home-kpi-gauge__needle {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 20px;
    z-index: 2;
    width: 46%;
    height: 8px;
    border-radius: 999px;
    background: #4f5663;
    box-shadow: 0 5px 12px rgba(31, 38, 55, 0.22);
    transform: translateX(-8px) rotate(var(--kpi-angle));
    transform-origin: 8px 50%;
    transition: transform 260ms ease;
}

.home-kpi-gauge__inner {
    position: absolute;
    left: 50%;
    bottom: 16px;
    z-index: 3;
    width: 74px;
    height: 48px;
    transform: translateX(-50%);
    display: grid;
    place-content: center;
    border-radius: 999px;
    background: #fff;
    text-align: center;
    box-shadow: 0 1px 0 rgba(31, 38, 55, 0.08), 0 10px 22px rgba(31, 38, 55, 0.08);
}

.home-kpi-gauge__inner::before {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -7px;
    width: 16px;
    height: 16px;
    border-radius: 999px;
    background: #4f5663;
    transform: translateX(-50%);
    box-shadow: 0 2px 7px rgba(31, 38, 55, 0.2);
}

.home-kpi-gauge__inner strong {
    color: var(--home-ink);
    font-size: 18px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0;
}

.home-kpi-gauge-card__body {
    min-width: 0;
    display: grid;
    gap: 6px;
}

.home-kpi-gauge-card__body span {
    color: var(--kpi-color);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.home-kpi-gauge-card__body strong {
    color: var(--home-ink);
    font-size: 17px;
    font-weight: 750;
    line-height: 1.25;
}

.home-kpi-gauge-card__body p {
    margin: 0;
    color: var(--home-muted);
    font-size: 13px;
    line-height: 1.45;
}

.home-kpi-gauge-card__foot {
    display: grid;
    gap: 8px;
    margin-top: auto;
    padding: 12px;
    border-radius: 6px;
    background: var(--kpi-soft);
}

.home-kpi-gauge-card__foot span {
    color: var(--home-ink);
    font-size: 17px;
    font-weight: 800;
    line-height: 1.2;
}

.home-kpi-gauge-card__foot small {
    color: var(--home-muted);
    font-size: 12px;
    font-weight: 650;
    line-height: 1.35;
}

#dashboard-abc .home-kpi-margin-card.home-kpi-margin-card--abc {
    width: 100%;
    max-width: none;
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "chart";
    justify-items: stretch;
}

#dashboard-abc .home-kpi-margin-card.home-kpi-margin-card--abc .home-kpi-margin-card__chart {
    width: 100%;
}

.home-kpi-margin-card {
    --kpi-color: #dc3545;
    --kpi-soft: rgba(220, 53, 69, 0.11);
    display: grid;
  /*  grid-template-columns: minmax(320px, 430px) minmax(0, 1fr);
    grid-template-areas:
        "chart content"
        "chart foot";
    gap: 16px 22px;*/
    align-items: center;
    max-width: 900px;
    min-width: 0;
    padding: 18px;
    border: 1px solid var(--home-line);
    border-radius: 8px;
    background: #fff;
}

.home-kpi-margin-card--amber {
    --kpi-color: #ff9500;
    --kpi-soft: rgba(255, 149, 0, 0.13);
}

.home-kpi-margin-card--orange {
    --kpi-color: #f97316;
    --kpi-soft: rgba(249, 115, 22, 0.13);
}

.home-kpi-margin-card--green {
    --kpi-color: #198754;
    --kpi-soft: rgba(25, 135, 84, 0.12);
}

.home-kpi-margin-card__chart {
    grid-area: chart;
    display: grid;
    min-width: 0;
    min-height: 285px;
    place-items: center;
}

.home-echart-gauge {
    position: relative;
    width: min(420px, 100%);
    height: 285px;
}

#dashboard-abc .home-kpi-margin-card.home-kpi-margin-card--abc {
    gap: 6px;
    width: 100%;
    max-width: none;
    padding: 4px 8px 8px;
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
        "chart"
        "facts";
    justify-items: stretch;
}

#dashboard-abc .home-kpi-margin-card.home-kpi-margin-card--abc .home-kpi-margin-card__chart {
    width: 100%;
    min-height: 250px;
    padding: 0;
}

#dashboard-abc .home-kpi-margin-card.home-kpi-margin-card--abc .home-echart-gauge {
    width: min(1080px, 100%);
    height: 250px;
    margin-inline: auto;
}

.home-kpi-margin-card__abc-facts {
    grid-area: facts;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    border-top: 1px solid var(--home-line);
}

.home-kpi-margin-card__abc-facts div {
    min-width: 0;
    padding: 8px 10px 2px;
    border-right: 1px solid var(--home-line);
}

.home-kpi-margin-card__abc-facts div:last-child {
    border-right: 0;
}

.home-kpi-margin-card__abc-facts span {
    display: block;
    color: var(--home-muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.home-kpi-margin-card__abc-facts strong {
    display: block;
    overflow: hidden;
    margin-top: 7px;
    color: var(--home-ink);
    font-size: 18px;
    font-weight: 800;
    line-height: 1.15;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.home-echart-gauge.is-echarts-ready .home-kpi-gauge__fallback {
    display: none;
}

.home-kpi-margin-card__content {
    grid-area: content;
    min-width: 0;
    display: grid;
    gap: 7px;
    padding: 14px;
    border-left: 4px solid var(--kpi-color);
    border-radius: 8px;
    background: var(--kpi-soft);
}

.home-kpi-margin-card__content span {
    color: var(--kpi-color);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.home-kpi-margin-card__content strong {
    color: var(--home-ink);
    font-size: 22px;
    font-weight: 800;
    line-height: 1.18;
}

.home-kpi-margin-card__content p {
    max-width: 34ch;
    margin: 0;
    color: var(--home-muted);
    font-size: 14px;
    line-height: 1.45;
}

.home-kpi-margin-card__foot {
    grid-area: foot;
    display: grid;
    gap: 8px;
    align-self: end;
    padding: 13px 14px;
    border-radius: 6px;
    border-left: 4px solid var(--kpi-color);
    background: var(--kpi-soft);
}

.home-kpi-margin-card__foot span {
    color: var(--home-ink);
    font-size: 20px;
    font-weight: 850;
    line-height: 1.15;
}

.home-kpi-margin-card__foot small {
    color: var(--home-muted);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.35;
}

.home-board .apexcharts-bar-area,
.home-board .apexcharts-area,
.home-board .apexcharts-line {
    filter: none;
}

.home-tabbar {
    border-radius: 8px;
}

.home-tabbar__item {
    border-radius: 6px;
}

.home-tabbar__item:disabled,
.home-tabbar__item.is-disabled,
.home-tabbar__item.disabled {
    cursor: default;
    opacity: 0.38;
}

.home-tabbar__item:disabled span,
.home-tabbar__item:disabled small,
.home-tabbar__item.is-disabled span,
.home-tabbar__item.is-disabled small,
.home-tabbar__item.disabled span,
.home-tabbar__item.disabled small {
    color: rgba(255, 255, 255, 0.45);
}

@media (max-width: 760px) {
    .home-board {
        padding: 5px;
        padding-bottom : 50px;
        /*padding: 16px 12px 126px;*/
    }

    #dashboard-abc.home-chart-card {
        margin-left: -6px;
        margin-right: -6px;
    }

    #dashboard-abc .home-chart-card__header,
    #dashboard-abc .home-chart-card__body,
    #dashboard-abc .home-chart-card__footer {
        padding-left: 5px;
        padding-right: 5px;
    }

    #dashboard-abc .home-chart-card__header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 10px;
    }

    #dashboard-abc .home-chart-card__header > div {
        min-width: 0;
        flex: 1 1 auto;
    }

    #dashboard-abc .home-chart-card__header h2 {
        margin: 0;
    }

    #dashboard-abc .home-abc-filter-button {
        flex: 0 0 auto;
        margin: 0;
    }

    #dashboard-abc .home-chart-card__body {
        padding-top: 5px;
    }

    #dashboard-abc .home-kpi-margin-card--abc {
        margin-left: 0;
        margin-right: 0;
    }

    #dashboard-abc .home-kpi-margin-card.home-kpi-margin-card--abc {
        padding: 6px;
        grid-template-areas: "chart";
    }

    #dashboard-abc .home-kpi-margin-card.home-kpi-margin-card--abc .home-kpi-margin-card__chart {
        min-height: 220px;
    }

    #dashboard-abc .home-kpi-margin-card.home-kpi-margin-card--abc .home-echart-gauge {
        width: 100%;
        height: 220px;
    }

    #dashboard-abc .home-kpi-margin-card__abc-facts {
        display: none;
    }

    .home-abc-table-card {
        border-radius: 6px;
    }

    .home-abc-manager-table {
        min-width: 0;
        font-size: 10px;
    }

    .home-abc-manager-table th:first-child {
        width: 34%;
    }

    .home-abc-manager-table th:nth-child(2),
    .home-abc-manager-table th:nth-child(3) {
        width: 18%;
    }

    .home-abc-manager-table th:nth-child(4),
    .home-abc-manager-table th:nth-child(5) {
        width: 15%;
    }

    .home-abc-manager-table__mobile-target {
        display: table-cell;
    }

    .home-abc-manager-table th:nth-child(6),
    .home-abc-manager-table td:nth-child(6),
    .home-abc-manager-table th:nth-child(7),
    .home-abc-manager-table td:nth-child(7) {
        display: none;
    }

    .home-abc-manager-table th {
        padding: 6px 3px;
        font-size: 9px;
    }

    .home-abc-manager-table td {
        padding: 5px 3px;
    }

    .home-abc-table-toggle {
        grid-template-columns: 13px minmax(0, 1fr);
        gap: 5px;
    }

    .home-abc-table-toggle small {
        display: none;
    }

    .home-abc-product-name {
        padding-left: 20px;
    }

    .home-abc-product-name strong {
        font-size: 10px;
    }

    .home-abc-filter-backdrop {
        inset: 0;
        width: auto;
        padding: 10px;
    }

    .home-abc-filter-modal {
        width: min(100%, calc(100vw - 16px));
        max-height: calc(100dvh - 16px);
    }

    .home-abc-filter-modal__header {
        position: sticky;
        top: 0;
        z-index: 1;
        padding: 12px 12px 10px;
        background: #fff;
    }

    .home-abc-filter-modal__header strong {
        margin-top: 2px;
        font-size: 18px;
    }

    .home-abc-filter-modal .home-abc-filter-close {
        width: 36px;
        height: 36px;
    }

    .home-abc-filter-modal .home-abc-controls {
        grid-template-columns: 1fr;
        gap: 8px;
        padding: 10px 12px;
    }

    .home-abc-filter-modal .home-dashboard-filter-controls {
        grid-template-columns: 1fr;
    }

    .home-abc-filter-modal .home-abc-control {
        gap: 4px;
    }

    .home-abc-filter-modal .home-abc-control select,
    .home-abc-filter-modal .home-abc-control input {
        height: 34px;
    }

    .home-abc-filter-modal .home-abc-type-filter {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 2px 10px;
    }

    .home-abc-filter-modal .home-abc-type-filter legend {
        grid-column: 1 / -1;
    }

    .home-abc-filter-modal .home-abc-type-filter label {
        min-height: 28px;
        font-size: 12px;
    }

    .home-abc-filter-actions {
        padding: 0 12px 12px;
    }

    .home-abc-apply-button {
        width: 100%;
    }

    .home-topbar {
        gap: 10px;
        padding: 4px 8px;
    }

    .home-toolbar {
        align-items: flex-end;
    }

    .home-date-filters {
        display: flex;
        gap: 8px;
    }

    .home-igv-toggle {
        min-height: 42px;
    }

    .home-igv-toggle button {
        min-height: 32px;
        padding: 0 9px;
        font-size: 12px;
    }

    .home-chart-card {
        border-radius: 8px;
        scroll-margin-top: 132px;
    }

    .home-chart-card__header,
    .home-chart-card__body,
    .home-chart-card__footer {
        padding-left: 16px;
        padding-right: 16px;
    }

    .home-chart-card__body {
        padding-top: 12px;
        padding-bottom: 8px;
    }

    .home-chart-card__header {
        display: block;
    }

    .home-chart-card__header small {
        display: block;
        margin-top: 8px;
    }

    .home-chart-card .home-annual-shell.is-detail-open {
        grid-template-columns: 1fr;
    }

    .home-chart-card .home-annual-chart {
        min-height: 182px;
    }

    .home-chart-card .home-annual-visual-stack {
        gap: 8px;
    }

    .home-chart-card .home-secondary-chart--annual-monthly .home-annual-chart {
        min-height: 170px;
    }

    .home-chart-card .home-detail-inline {
        display: none;
    }

    .home-chart-card__footer {
        align-items: flex-start;
        flex-direction: column;
    }

    .home-chart-card__footer .home-annual-mobile-detail-button {
        display: inline-flex;
        margin: 0;
    }

    .home-chart-card__footer--ghost {
        min-height: 4px;
        padding-top: 4px;
        padding-bottom: 4px;
        align-items: center;
    }

.home-executive-grid,
.home-insights-grid,
.home-margin-action-list,
.home-ranking-grid,
.home-abc-manager-grid {
    grid-template-columns: 1fr;
}

    .home-executive-lower,
    .home-goal-card {
        grid-template-columns: 1fr;
    }

    .home-executive-card,
    .home-goal-card,
.home-year-card,
.home-insights-panel,
.home-margin-action-panel,
.home-ranking-panel,
.home-abc-focus-card,
.home-abc-margin-card {
    box-shadow: none;
}

    .home-goal-card__metrics {
        grid-template-columns: 1fr;
    }

    .home-ranking-panel__header {
        display: block;
    }

    .home-ranking-panel__header small {
        display: block;
        margin-top: 6px;
    }

    .home-abc-summary {
        grid-template-columns: 1fr;
        gap: 0;
        margin-bottom: 12px;
        padding-bottom: 8px;
    }

    .home-abc-summary > div {
        display: flex;
        justify-content: space-between;
        gap: 12px;
        align-items: baseline;
        padding: 9px 0;
        border-right: 0;
        border-bottom: 1px solid var(--home-line);
    }

    .home-abc-summary > div:last-child {
        border-bottom: 0;
    }

    .home-abc-summary span {
        margin-bottom: 0;
        flex: 0 0 auto;
    }

    .home-abc-summary strong {
        overflow: visible;
        min-width: 0;
        font-size: 15px;
        text-align: right;
        text-overflow: clip;
        white-space: normal;
        overflow-wrap: anywhere;
    }

    .home-abc-class-summary {
        grid-template-columns: 1fr;
    }

    .home-abc-focus-row {
        grid-template-columns: minmax(0, 1fr);
        align-items: start;
    }

    .home-division-margin-row {
        grid-template-columns: minmax(0, 1fr) repeat(3, minmax(0, 1fr));
    }

    .home-division-margin-row strong {
        grid-column: 1 / -1;
        white-space: normal;
        word-break: break-word;
        overflow-wrap: anywhere;
    }

    .home-abc-controls {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .home-abc-control,
    .home-abc-control--view,
    .home-abc-type-filter {
        min-width: 0;
    }

    .home-abc-type-filter {
        grid-column: 1 / -1;
    }

    .home-abc-node__toggle {
        grid-template-columns: 1fr;
        gap: 8px;
        padding: 10px 12px;
    }

    .home-abc-node__metrics {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 8px;
    }

    .home-abc-node__metrics span {
        min-width: 0;
        text-align: left;
    }

    .home-abc-node__metrics i {
        justify-self: end;
    }

    .home-abc-node--group {
        margin-left: 0;
    }

    .home-abc-product-card__head {
        flex-direction: column;
        gap: 10px;
    }

    .home-abc-product-card__share {
        text-align: left;
    }

    .home-abc-product-card__body {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .home-abc-tree-wrap {
        max-height: clamp(420px, 68vh, 820px);
        padding-right: 0;
    }

    .home-abc-product-card {
        padding: 12px;
    }

    .home-abc-product-card__title {
        gap: 8px;
    }

    .home-abc-product-card__title strong {
        font-size: 13px;
    }

    .home-abc-product-card__metric {
        padding: 9px 10px;
    }

    .home-abc-product-card__metric strong {
        font-size: 13px;
    }

.home-abc-bar-cell--product span {
    white-space: normal;
    word-break: break-word;
    overflow-wrap: anywhere;
}

.home-margin-action-panel {
    padding: 14px;
}

.home-margin-action {
    grid-template-columns: 66px minmax(0, 1fr);
    gap: 10px;
    padding: 10px;
}

.home-margin-action__percent {
    width: 66px;
    height: 56px;
    font-size: 15px;
}

.home-margin-action__body strong {
    white-space: normal;
    word-break: break-word;
    overflow-wrap: anywhere;
}

.home-division-kpi-carousel {
    padding: 14px;
}

.home-division-kpi-track {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.home-division-kpi-card {
    min-height: 214px;
    padding: 8px;
}

.home-division-kpi-card__gauge {
    min-height: 100px;
}

.home-echart-gauge--mini {
    height: 100px;
}

.home-division-kpi-card__body strong {
    font-size: 13px;
    word-break: break-word;
    overflow-wrap: anywhere;
}

.home-division-kpi-card__body span {
    font-size: 13px;
}

.home-division-kpi-card__body small {
    font-size: 11px;
}

.home-kpi-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .home-kpi-gauge-card {
        padding: 14px;
    }

    .home-kpi-gauge {
        width: min(170px, 100%);
        height: 104px;
    }

    .home-kpi-gauge--echarts {
        width: min(180px, 100%);
        height: 112px;
    }

    .home-kpi-gauge__inner strong {
        font-size: 16px;
    }

    .home-kpi-gauge-card__body strong,
    .home-kpi-gauge-card__foot span {
        font-size: 15px;
    }

    .home-kpi-margin-card {
        grid-template-columns: minmax(260px, 300px) minmax(0, 1fr);
        grid-template-areas:
            "chart content"
            "foot foot";
        gap: 0px 0px;
        padding: 0px;
    }

    .home-kpi-margin-card__chart {
        min-height: 220px;
    }

    .home-echart-gauge {
        width: min(300px, 100%);
        height: 220px;
    }

    .home-kpi-margin-card__content strong {
        font-size: 17px;
    }

    .home-kpi-margin-card__content p {
        font-size: 13px;
    }

    .home-kpi-margin-card__foot span {
        font-size: 17px;
    }
}

@media (max-width: 430px) {
    .home-division-kpi-track {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .home-division-kpi-card {
        min-height: 196px;
        padding: 8px;
    }

    .home-division-kpi-card__gauge {
        min-height: 92px;
    }

    .home-echart-gauge--mini {
        width: min(190px, 100%);
        height: 92px;
    }

    .home-division-kpi-card__body {
        gap: 4px;
    }

    .home-division-kpi-card__body strong {
        font-size: 12px;
    }

    .home-division-kpi-card__body span {
        font-size: 12px;
    }

    .home-division-kpi-card__body small {
        font-size: 10px;
    }

    .home-kpi-margin-card {
        grid-template-columns: 1fr;
        grid-template-areas:
            "chart"
            "content"
            "foot";
    }

    .home-kpi-margin-card__chart {
        min-height: 218px;
    }

    .home-echart-gauge {
        width: min(320px, 100%);
        height: 218px;
    }
}

@media (max-width: 390px) {
    .home-chart-card__header h2 {
        font-size: 22px;
    }

    .home-secondary-chart__head {
        display: block;
    }

    .home-secondary-chart__head small {
        display: block;
        margin-top: 6px;
    }

    .home-executive-card strong {
        font-size: 24px;
        white-space: normal;
        word-break: break-word;
    }

    .home-year-card__grid {
        grid-template-columns: 1fr;
    }

    .home-insight-chip {
        grid-template-columns: 30px minmax(0, 1fr);
    }

    .home-insight-chip i {
        width: 30px;
        height: 30px;
    }

    .home-ranking-row {
        grid-template-columns: 1fr;
    }

    .home-ranking-row strong,
    .home-abc-class-card strong,
    .home-abc-focus-row strong {
        white-space: normal;
        word-break: break-word;
        overflow-wrap: anywhere;
    }

    .home-division-margin-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .home-division-margin-row span,
    .home-division-margin-row b {
        text-align: left;
        white-space: normal;
        word-break: break-word;
    }

    .home-chart-card .home-annual-chart {
        min-height: 170px;
    }

    .home-chart-card .home-annual-chart-track {
        min-width: 340px;
    }

    .home-chart-card .home-annual-chart-track--monthly {
        min-width: 320px;
    }

    .home-chart-card .home-annual-chart-track--annual-overview {
        min-width: 460px;
    }

    .home-chart-card .home-annual-chart-track--monthly-overview,
    .home-chart-card .home-annual-chart-track--annual-monthly-bars {
        min-width: 560px;
    }

    .home-chart-card .home-annual-chart-track--division-bars {
        min-width: 420px;
    }

    .home-chart-card .home-annual-chart-track--kilos {
        min-width: 430px;
    }

    .home-chart-card .home-annual-chart-track--mix {
        min-width: 620px;
    }

    .home-chart-card .home-annual-chart-track--price-kg {
        min-width: 560px;
    }

    .home-tabbar__item small {
        font-size: 0.68rem;
    }

    .home-kpi-grid {
        grid-template-columns: 1fr;
    }

    .home-chart-card .home-secondary-chart {
        margin-top: 6px;
        padding-top: 6px;
    }

    .home-kpi-gauge-card {
        display: grid;
        grid-template-columns: 150px minmax(0, 1fr);
        align-items: center;
    }

    .home-kpi-gauge {
        width: 150px;
        height: 94px;
    }

    .home-kpi-gauge--echarts {
        width: 150px;
        height: 94px;
    }

    .home-kpi-gauge-card__foot {
        grid-column: 1 / -1;
    }

    .home-kpi-margin-card {
        grid-template-columns: 1fr;
        grid-template-areas:
            "chart"
            "content"
            "foot";
    }

    .home-kpi-margin-card__chart {
        min-height: 202px;
    }

    .home-echart-gauge {
        width: min(300px, 100%);
        height: 202px;
    }
}

.home-summary-board {
    padding-bottom: 96px;
}

.home-summary-topbar {
    margin-bottom: 14px;
}

.home-summary-topbar .home-kicker {
    margin-bottom: 10px;
}

.home-summary-topbar h1 {
    margin: 0 0 6px;
    font-size: clamp(38px, 4vw, 58px);
    line-height: 1;
}

.home-summary-topbar p {
    margin: 0;
    color: var(--home-ink);
    font-size: 17px;
    font-weight: 700;
}

.home-summary-grid {
    gap: 14px;
}

.home-summary-upper,
.home-summary-lower {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(320px, 0.95fr);
    gap: 14px;
}

.home-summary-upper__sales {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.home-summary-mini-card,
.home-summary-side-card,
.home-summary-main-card {
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.92);
}

.home-summary-mini-card__header,
.home-summary-side-card__header,
.home-summary-table-card__header {
    padding: 10px 12px 8px;
    border-bottom: 1px solid var(--home-line);
}

.home-summary-mini-card__header strong,
.home-summary-side-card__header strong,
.home-summary-table-card__header strong {
    font-size: 18px;
    font-weight: 780;
    line-height: 1.15;
}

.home-summary-mini-card__body {
    display: grid;
    gap: 8px;
    padding: 12px;
}

.home-summary-mini-card__headline {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    align-items: end;
}

.home-summary-mini-card__headline-main {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.home-summary-mini-card__headline-main > strong {
    font-size: clamp(34px, 4vw, 52px);
    font-weight: 850;
    line-height: 1;
}

.home-summary-mini-card__without-tax {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    min-width: 0;
    color: #64748b;
    font-size: clamp(16px, 1.8vw, 24px);
    font-weight: 750;
    line-height: 1.05;
}

.home-summary-mini-card__without-tax strong {
    color: #1f2937;
    font: inherit;
}

.home-summary-mini-card__without-tax span {
    color: inherit;
    font: inherit;
}

.home-summary-mini-card__headline > span {
    font-size: clamp(20px, 2.4vw, 28px);
    font-weight: 850;
    line-height: 1;
}

.home-summary-mini-card__line,
.home-summary-mini-card__row,
.home-summary-mini-card__meta {
    display: grid;
    grid-template-columns: auto auto 1fr;
    gap: 8px;
    align-items: center;
}

.home-summary-mini-card__row,
.home-summary-mini-card__meta {
    grid-template-columns: auto 1fr;
}

.home-summary-mini-card__line span,
.home-summary-mini-card__hint span,
.home-summary-mini-card__row span,
.home-summary-mini-card__meta span {
    color: var(--home-muted);
    font-size: 13px;
    font-weight: 700;
}

.home-summary-mini-card__line b {
    font-size: 17px;
    font-weight: 850;
}

.home-summary-mini-card__hint {
    display: flex;
    gap: 12px;
}

.home-summary-mini-card__split {
    height: 1px;
    background: var(--home-line);
}

.home-summary-mini-card__row strong,
.home-summary-mini-card__meta strong {
    justify-self: end;
    font-size: 17px;
    font-weight: 820;
}

.home-summary-side-card__body {
    display: grid;
    gap: 8px;
    padding: 12px;
}

.home-summary-kv {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: baseline;
}

.home-summary-kv span {
    color: var(--home-ink);
    font-size: 18px;
    font-weight: 500;
    line-height: 1.25;
}

.home-summary-kv strong {
    font-size: 18px;
    font-weight: 820;
    text-align: right;
}

.home-summary-kv.is-muted {
    padding-left: 40px;
}

.home-summary-kv.is-muted span,
.home-summary-kv.is-muted strong {
    color: var(--home-muted);
}

.home-summary-kv.is-positive strong,
.home-summary-mini-card__line b.is-positive {
    color: #0a8f5a;
}

.home-summary-kv.is-negative strong,
.home-summary-mini-card__line b.is-negative {
    color: #d94d3f;
}

.home-summary-mini-card__line b.is-warn {
    color: #1b56d8;
}

.home-summary-table-wrap {
    overflow-x: auto;
    padding: 0;
}

.home-summary-table {
    width: 100%;
    border-collapse: collapse;
    font-variant-numeric: tabular-nums;
    table-layout: fixed;
}

.home-summary-table th,
.home-summary-table td {
    padding: 6px 8px;
    border-bottom: 1px solid rgba(31, 38, 55, 0.08);
}

.home-summary-table thead th {
    background: rgba(82, 96, 122, 0.06);
    color: var(--home-ink);
    font-size: 15px;
    font-weight: 820;
    text-align: right;
}

.home-summary-table thead th:first-child {
    text-align: left;
}

.home-summary-table tbody td {
    font-size: 15px;
    font-weight: 700;
    text-align: right;
}

.home-summary-table tbody td:first-child {
    text-align: left;
}

.home-summary-table th:first-child,
.home-summary-table td:first-child {
    width: 34%;
}

.home-summary-table th:nth-child(2),
.home-summary-table td:nth-child(2),
.home-summary-table th:nth-child(4),
.home-summary-table td:nth-child(4) {
    width: 22%;
}

.home-summary-table th:nth-child(3),
.home-summary-table td:nth-child(3),
.home-summary-table th:nth-child(5),
.home-summary-table td:nth-child(5) {
    width: 11%;
}

.home-summary-table th:not(:first-child),
.home-summary-table td:not(:first-child) {
    text-align: center;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.home-summary-table tr.is-bold td {
    font-weight: 850;
}

.home-summary-table td.is-tab-1 {
    padding-left: 18px;
}

.home-summary-table td.is-tab-2 {
    padding-left: 42px;
    color: var(--home-muted);
    font-weight: 650;
}

.home-summary-table tr.is-detail td {
    color: var(--home-muted);
}

.home-summary-balance-list {
    display: grid;
    gap: 2px;
    padding: 10px 12px;
}

.home-summary-balance-list__row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 10px;
    align-items: baseline;
    padding: 4px 0;
}

.home-summary-balance-list__row span {
    font-size: 16px;
    line-height: 1.2;
}

.home-summary-balance-list__row strong,
.home-summary-balance-list__row b {
    font-size: 17px;
    font-weight: 780;
    text-align: right;
}

.home-summary-balance-list__row.is-bold span,
.home-summary-balance-list__row.is-bold strong,
.home-summary-balance-list__row.is-bold b {
    color: var(--home-ink);
    font-size: 18px;
    font-weight: 850;
}

.home-summary-balance-list__row.is-child {
    padding-left: 38px;
}

.home-summary-balance-list__row.is-child span,
.home-summary-balance-list__row.is-child strong,
.home-summary-balance-list__row.is-child b {
    color: var(--home-muted);
}

@media (max-width: 1080px) {
    .home-summary-upper,
    .home-summary-lower {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 720px) {
    .home-summary-board {
        padding: 14px 14px 92px;
    }

    .home-summary-topbar {
        margin-bottom: 10px;
    }

    .home-summary-topbar h1 {
        font-size: 30px;
    }

    .home-summary-topbar p {
        font-size: 14px;
    }

    .home-summary-upper__sales {
        grid-template-columns: 1fr;
    }

    .home-summary-mini-card__header,
    .home-summary-side-card__header,
    .home-summary-table-card__header {
        padding: 9px 10px 7px;
    }

    .home-summary-mini-card__body,
    .home-summary-side-card__body,
    .home-summary-balance-list {
        padding: 10px;
    }

    .home-summary-mini-card__headline strong {
        font-size: 28px;
    }

    .home-summary-mini-card__headline > span {
        font-size: 18px;
    }

    .home-summary-mini-card__without-tax {
        font-size: 14px;
    }

    .home-summary-mini-card__line,
    .home-summary-mini-card__row,
    .home-summary-mini-card__meta {
        gap: 6px;
    }

    .home-summary-mini-card__line span,
    .home-summary-mini-card__hint span,
    .home-summary-mini-card__row span,
    .home-summary-mini-card__meta span,
    .home-summary-mini-card__line b,
    .home-summary-mini-card__row strong,
    .home-summary-mini-card__meta strong {
        font-size: 13px;
    }

    .home-summary-kv {
        gap: 8px;
    }

    .home-summary-kv span,
    .home-summary-kv strong {
        font-size: 15px;
    }

    .home-summary-kv.is-muted {
        padding-left: 18px;
    }

    .home-summary-table {
        min-width: 100%;
    }

    .home-summary-table th,
    .home-summary-table td {
        padding: 5px 6px;
    }

    .home-summary-table thead th {
        font-size: 11px;
    }

    .home-summary-table tbody td {
        font-size: 10px;
    }

    .home-summary-table tr.is-bold td {
        font-size: 10px;
    }

    .home-summary-table th:first-child,
    .home-summary-table td:first-child {
        width: 30%;
    }

    .home-summary-table th:not(:first-child),
    .home-summary-table td:not(:first-child) {
        text-align: center;
        white-space: nowrap;
        font-variant-numeric: tabular-nums;
    }

    .home-summary-table th:nth-child(2),
    .home-summary-table td:nth-child(2),
    .home-summary-table th:nth-child(4),
    .home-summary-table td:nth-child(4) {
        width: 20%;
    }

    .home-summary-table th:nth-child(3),
    .home-summary-table td:nth-child(3),
    .home-summary-table th:nth-child(5),
    .home-summary-table td:nth-child(5) {
        width: 15%;
    }

    .home-summary-table td.is-tab-1 {
        padding-left: 12px;
    }

    .home-summary-table td.is-tab-2 {
        padding-left: 16px;
    }

    .home-summary-balance-list__row {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .home-summary-balance-list__row b {
        display: none;
    }

    .home-summary-balance-list__row span,
    .home-summary-balance-list__row strong {
        font-size: 14px;
    }

    .home-summary-balance-list__row.is-bold span,
    .home-summary-balance-list__row.is-bold strong {
        font-size: 15px;
    }

    .home-summary-balance-list__row.is-child {
        padding-left: 16px;
    }
}
