[x-cloak] { display: none !important; }
        .table-scroll::-webkit-scrollbar { height: 9px; width: 9px; }
        .table-scroll::-webkit-scrollbar-thumb { background: #b7c7bd; border-radius: 999px; }
        .table-scroll::-webkit-scrollbar-track { background: #eef3f0; }
        .sticky-col-action { position: sticky; right: 0; background: white; z-index: 5; }
        .sticky-head { position: sticky; top: 0; z-index: 10; }
        .master-data-table thead th { position: sticky; top: 0; z-index: 40; }
        .master-sticky-no { position: sticky; left: 0; z-index: 12; min-width: 68px; max-width: 68px; width: 68px; background: #fff; }
        .master-sticky-tanggal { position: sticky; left: 68px; z-index: 12; min-width: 142px; max-width: 142px; width: 142px; background: #fff; }
        .master-sticky-kode-perk { position: sticky; left: 210px; z-index: 12; min-width: 128px; max-width: 128px; width: 128px; background: #fff; }
        /* Freeze silang Data Master LR & NERACA.
           Header No, Tanggal, dan Kode Perk harus sticky vertikal + horizontal
           sehingga tidak hilang/ikut naik saat tabel discroll. */
        .master-data-table.master-freeze-left thead th {
            position: sticky !important;
            top: 0 !important;
            z-index: 80 !important;
            background: #343b40 !important;
            color: #fff !important;
            height: 40px !important;
            min-height: 40px !important;
            max-height: 40px !important;
            padding-top: 0 !important;
            padding-bottom: 0 !important;
            font-size: 12px !important;
            line-height: 1.15 !important;
            font-weight: 700 !important;
            vertical-align: middle !important;
            white-space: nowrap !important;
            box-sizing: border-box !important;
        }
        .master-data-table.master-freeze-left thead th.master-sticky-no,
        .master-data-table.master-freeze-left thead th.master-sticky-tanggal,
        .master-data-table.master-freeze-left thead th.master-sticky-kode-perk {
            position: sticky !important;
            top: 0 !important;
            z-index: 300 !important;
            background: #343b40 !important;
            color: #fff !important;
            box-shadow: 1px 0 0 #4b555b, 0 1px 0 #4b555b;
            background-clip: padding-box;
        }
        .master-data-table.master-freeze-left thead th.master-sticky-no { left: 0 !important; }
        .master-data-table.master-freeze-left thead th.master-sticky-tanggal { left: 68px !important; }
        .master-data-table.master-freeze-left thead th.master-sticky-kode-perk { left: 210px !important; }
        .master-data-table.master-freeze-left tbody .master-sticky-no,
        .master-data-table.master-freeze-left tbody .master-sticky-tanggal,
        .master-data-table.master-freeze-left tbody .master-sticky-kode-perk {
            position: sticky !important;
            z-index: 30 !important;
            background: #fff !important;
            background-clip: padding-box;
        }
        .master-data-table.master-freeze-left tbody .master-sticky-no { left: 0 !important; }
        .master-data-table.master-freeze-left tbody .master-sticky-tanggal { left: 68px !important; }
        .master-data-table.master-freeze-left tbody .master-sticky-kode-perk { left: 210px !important; }
        .master-data-table.master-freeze-left tbody tr:hover .master-sticky-no,
        .master-data-table.master-freeze-left tbody tr:hover .master-sticky-tanggal,
        .master-data-table.master-freeze-left tbody tr:hover .master-sticky-kode-perk { background: #f9fafb !important; }

        /* Overlay khusus header kiri Data Master LR & NERACA.
           Beberapa browser dapat menumpuk tbody sticky di atas th sticky ketika scroll vertikal
           dan horizontal dilakukan bersamaan. Overlay ini memastikan header NO, TANGGAL,
           dan KODE PERK selalu terlihat/freeze di pojok kiri atas tanpa mengubah data tabel. */
        .master-freeze-left-scroll { position: relative; }
        .master-left-header-overlay {
            position: sticky;
            top: 0;
            left: 0;
            width: 338px;
            height: 0;
            z-index: 1000;
            pointer-events: none;
        }
        .master-left-header-overlay-inner {
            display: flex;
            width: 338px;
            height: 40px;
            min-height: 40px;
            max-height: 40px;
            background: #343b40;
            color: #fff;
            text-transform: uppercase;
            letter-spacing: .05em;
            font-weight: 700;
            font-size: 12px;
            line-height: 1.15;
            box-shadow: 1px 0 0 #4b555b, 0 1px 0 #4b555b;
            overflow: hidden;
            box-sizing: border-box;
        }
        .master-left-header-overlay-cell {
            display: flex;
            align-items: center;
            height: 40px;
            min-height: 40px;
            max-height: 40px;
            padding: 0 12px;
            border-right: 1px solid #4b555b;
            white-space: nowrap;
            background: #343b40;
            color: #fff;
            font-size: 12px;
            line-height: 1.15;
            box-sizing: border-box;
        }
        .master-left-header-overlay-cell.no { justify-content: center; width: 68px; min-width: 68px; max-width: 68px; }
        .master-left-header-overlay-cell.tanggal { width: 142px; min-width: 142px; max-width: 142px; }
        .master-left-header-overlay-cell.kode-perk { width: 128px; min-width: 128px; max-width: 128px; }
        .rbb-sticky-no { position: sticky; left: 0; z-index: 9; min-width: 64px; max-width: 64px; width: 64px; text-align: center; }
        .rbb-sticky-coa { position: sticky; left: 64px; z-index: 8; min-width: 105px; max-width: 105px; }
        .rbb-sticky-ket { position: sticky; left: 169px; z-index: 8; min-width: 280px; max-width: 280px; }
        thead .rbb-sticky-no, thead .rbb-sticky-coa, thead .rbb-sticky-ket { z-index: 18; }
        .rbb-sheet-table thead th { height: 38px; line-height: 1.15; }
        .rbb-sheet-table .rbb-head-row-1 th { position: sticky; top: 0; z-index: 30; }
        .rbb-sheet-table .rbb-head-row-2 th { position: sticky; top: 38px; z-index: 30; }
        .rbb-sheet-table .rbb-head-row-1 th[rowspan="2"] { top: 0; z-index: 45; }
        .rbb-sheet-table .rbb-alpha-row th { position: sticky; top: 76px; z-index: 31; }
        .rbb-sheet-table thead .rbb-sticky-no,
        .rbb-sheet-table thead .rbb-sticky-coa,
        .rbb-sheet-table thead .rbb-sticky-ket { z-index: 50; }
        .rbb-sheet-table tbody .rbb-sticky-no,
        .rbb-sheet-table tbody .rbb-sticky-coa,
        .rbb-sheet-table tbody .rbb-sticky-ket { z-index: 12; }
        .rbb-input-td { text-align: right !important; }
        .rbb-edit-cell { display: flex !important; width: 100%; justify-content: flex-end !important; align-items: center; margin-left: auto !important; margin-right: 0 !important; text-align: right; position: relative; padding-right: 0; gap: 0 !important; }
        .rbb-edit-input { display: block; width: 122px; min-width: 122px; flex: 0 0 auto; margin-left: auto !important; margin-right: 0 !important; border: 1.5px solid #d97706; background: #fff7d6; border-radius: 8px; padding: 5px 7px; text-align: right !important; font-weight: 700; box-shadow: inset 0 0 0 1px rgba(251,191,36,.45); transition: border-color .12s ease, background-color .12s ease, box-shadow .12s ease, opacity .12s ease; }
        .rbb-input-td > .rbb-edit-cell { justify-content: flex-end !important; align-items: center; }
        .rbb-input-td .rbb-edited-dot { position: absolute; right: -11px; top: 50%; transform: translateY(-50%); margin: 0; }
        .rbb-input-td .rbb-cell-save-text { position: absolute; right: 0; bottom: -12px; min-width: 0; width: auto; display: none; }
        .rbb-subtitle-row td { background: #eef3f0 !important; border-top: 1px solid #d6e1e5; border-bottom: 1px solid #d6e1e5; }
        .rbb-ratio-orange-cell { background: #f97316 !important; background-color: #f97316 !important; color: #ffffff !important; border-top-color: #ea580c !important; border-bottom-color: #ea580c !important; }
        .rbb-ratio-heading-row td,
        .rbb-sheet-table tbody tr.rbb-ratio-heading-row > td { background: #f97316 !important; background-color: #f97316 !important; color: #ffffff !important; border-top: 1px solid #ea580c !important; border-bottom: 1px solid #ea580c !important; font-weight: 800 !important; }
        .rbb-ratio-heading-row .rbb-sticky-no,
        .rbb-ratio-heading-row .rbb-sticky-coa,
        .rbb-ratio-heading-row .rbb-sticky-ket { background: #f97316 !important; color: #ffffff !important; }
        .rbb-ratio-heading-row .rbb-ratio-badge { background: transparent !important; color: #ffffff !important; padding-left: 0 !important; padding-right: 0 !important; }
        .rbb-dpk-green-cell { background: #16a34a !important; background-color: #16a34a !important; color: #ffffff !important; border-top-color: #15803d !important; border-bottom-color: #15803d !important; }
        .rbb-dpk-heading-row td,
        .rbb-sheet-table tbody tr.rbb-dpk-heading-row > td { background: #16a34a !important; background-color: #16a34a !important; color: #ffffff !important; border-top: 1px solid #15803d !important; border-bottom: 1px solid #15803d !important; font-weight: 800 !important; }
        .rbb-dpk-heading-row .rbb-sticky-no,
        .rbb-dpk-heading-row .rbb-sticky-coa,
        .rbb-dpk-heading-row .rbb-sticky-ket { background: #16a34a !important; color: #ffffff !important; }
        .rbb-dpk-heading-row .rbb-dpk-badge { background: transparent !important; color: #ffffff !important; padding-left: 0 !important; padding-right: 0 !important; }
        .rbb-sdm-gray-cell { background: #374151 !important; background-color: #374151 !important; color: #ffffff !important; border-top-color: #1f2937 !important; border-bottom-color: #1f2937 !important; }
        .rbb-sdm-heading-row td,
        .rbb-sheet-table tbody tr.rbb-sdm-heading-row > td { background: #374151 !important; background-color: #374151 !important; color: #ffffff !important; border-top: 1px solid #1f2937 !important; border-bottom: 1px solid #1f2937 !important; font-weight: 800 !important; }
        .rbb-sdm-heading-row .rbb-sticky-no,
        .rbb-sdm-heading-row .rbb-sticky-coa,
        .rbb-sdm-heading-row .rbb-sticky-ket { background: #374151 !important; color: #ffffff !important; }
        .rbb-sdm-heading-row .rbb-sdm-badge { background: transparent !important; color: #ffffff !important; padding-left: 0 !important; padding-right: 0 !important; }
        .rbb-runoff-cell { width: 100%; min-width: 0; }
        .rbb-runoff-cell .rbb-edit-cell { width: auto; flex: 0 0 auto; }
        .rbb-runoff-percent-input { width: 86px; min-width: 86px; }
        .rbb-edit-input:hover { background: #fffbeb; border-color: #b45309; }
        .rbb-edit-input:focus { outline: 2px solid #f59e0b; outline-offset: 1px; background: #fff; }
        .rbb-edit-input.is-dirty { border-color: #ea580c; background: #fff7ed; }
        .rbb-edit-input.is-saving { opacity: .76; cursor: progress; background: #f8fafc; border-color: #94a3b8; box-shadow: inset 0 0 0 1px rgba(148,163,184,.28); }
        .rbb-edit-input.is-saved { border-color: #8cc70d; background: #f7fee7; box-shadow: 0 0 0 3px rgba(140,199,13,.14); }
        .rbb-edited-dot { display: inline-block; width: 6px; height: 6px; border-radius: 999px; background: #f59e0b; margin-left: 4px; vertical-align: middle; }
        .rbb-cell-save-text { min-width: 48px; font-size: 10px; font-weight: 700; color: #64748b; text-align: left; }
        .rbb-cell-save-text.ok { color: #65a30d; }
        .rbb-cell-save-text.error { color: #dc2626; }

        /* ============================================================
           SCORECARD THEME - terinspirasi tampilan pada gambar referensi
           ============================================================ */
        :root {
            --sc-bg: #eef2f4;
            --sc-sidebar: #30383d;
            --sc-sidebar-dark: #252b30;
            --sc-sidebar-darker: #20262b;
            --sc-panel: #ffffff;
            --sc-border: #dce3e7;
            --sc-text: #454d54;
            --sc-muted: #77838b;
            --sc-lime: #8cc70d;
            --sc-lime-dark: #77aa0a;
        }
        body { background: var(--sc-bg); color: var(--sc-text); }
        .scorecard-app { background: var(--sc-bg); }
        .scorecard-sidebar {
            background: var(--sc-sidebar) !important;
            box-shadow: inset -1px 0 0 var(--sc-sidebar-darker);
        }
        .scorecard-sidebar-header {
            background: var(--sc-sidebar-dark) !important;
            border-color: var(--sc-sidebar-darker) !important;
        }
        .scorecard-brand-title { color: #eef3f6; letter-spacing: .04em; }
        .scorecard-brand-subtitle { color: #8b979f !important; }
        .scorecard-sidebar nav button,
        .scorecard-sidebar nav a {
            border-radius: 2px !important;
        }
        .scorecard-sidebar nav button {
            color: #cbd4d9;
        }
        .scorecard-menu-icon {
            width: 20px;
            height: 20px;
            flex: 0 0 auto;
            color: #eef3f6;
            opacity: .9;
        }
        .scorecard-menu-arrow {
            color: #9aa6ad;
            flex: 0 0 auto;
        }
        .scorecard-sidebar nav button:hover .scorecard-menu-icon,
        .scorecard-sidebar nav a:hover .scorecard-menu-icon,
        .scorecard-sidebar nav button.bg-\[\#252b30\] .scorecard-menu-icon,
        .scorecard-sidebar nav a.bg-\[\#252b30\] .scorecard-menu-icon {
            color: var(--sc-lime);
            opacity: 1;
        }
        .scorecard-sidebar nav button:hover,
        .scorecard-sidebar nav button.bg-\[\#252b30\] {
            color: #ffffff;
        }
        .scorecard-subitem-active {
            background: var(--sc-sidebar-dark) !important;
            color: #ffffff !important;
            border-left: 3px solid var(--sc-lime);
            box-shadow: none !important;
        }
        .scorecard-sidebar-search input {
            box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
        }
        .scorecard-topbar {
            border-bottom: 1px solid var(--sc-border);
            box-shadow: none !important;
        }
        .scorecard-main {
            background: var(--sc-bg);
        }
        .scorecard-tabs {
            min-height: 44px;
        }
        .scorecard-tab {
            display: inline-flex;
            align-items: center;
            min-height: 42px;
            padding: 0 20px;
            background: #fff;
            border: 1px solid var(--sc-border);
            border-bottom-color: #cfd8dd;
            border-radius: 5px 5px 0 0;
            font-size: 13px;
            font-weight: 700;
            color: #6a767e;
            white-space: nowrap;
        }
        .scorecard-tab-active {
            color: #3f4a51;
            border-top: 3px solid var(--sc-lime);
            background: #fff;
        }
        a.scorecard-tab {
            text-decoration: none;
        }
        a.scorecard-tab:hover {
            color: #3f4a51;
            background: #f9fbfc;
            border-top-color: var(--sc-lime);
        }
        .scorecard-period {
            background: #fff;
            border: 1px solid var(--sc-border);
            color: #738087;
            border-radius: 4px;
            padding: 9px 12px;
            font-size: 13px;
            font-weight: 700;
        }
        .scorecard-main .bg-white {
            background: var(--sc-panel) !important;
        }
        .scorecard-main .shadow-sm,
        .scorecard-main .shadow-2xl {
            box-shadow: 0 1px 2px rgba(24, 33, 41, .06) !important;
        }
        .scorecard-main .rounded-lg,
        .scorecard-main .rounded-xl {
            border-radius: 5px !important;
        }
        .scorecard-main .border-gray-100,
        .scorecard-main .border-gray-200 {
            border-color: var(--sc-border) !important;
        }
        .scorecard-section-header {
            background: #ffffff !important;
            color: #6b7780 !important;
            border-top: 3px solid var(--sc-lime);
            border-bottom: 1px solid var(--sc-border);
        }
        .scorecard-section-header .text-lg,
        .scorecard-section-header .font-bold {
            color: #3f4a51;
        }
        .scorecard-section-header [class*="bg-white/10"] {
            background: #f4f7f8 !important;
            color: #5d6a72 !important;
            border: 1px solid var(--sc-border);
        }
        .scorecard-modal-header {
            background: var(--sc-sidebar) !important;
            border-top: 3px solid var(--sc-lime);
        }
        .table-scroll::-webkit-scrollbar-thumb { background: #aeb9bf; border-radius: 999px; }
        .table-scroll::-webkit-scrollbar-track { background: #e8edf0; }
        .sticky-head { box-shadow: 0 1px 0 var(--sc-border); }
        .rbb-sticky-no,
        .rbb-sticky-coa,
        .rbb-sticky-ket,
        .master-sticky-no,
        .master-sticky-tanggal,
        .master-sticky-kode-perk,
        .sticky-col-action {
            box-shadow: 1px 0 0 rgba(220, 227, 231, .9);
        }
        .scorecard-app input[type="text"],
        .scorecard-app input[type="file"],
        .scorecard-app input[type="date"],
        .scorecard-app select {
            border-color: var(--sc-border) !important;
        }
        .scorecard-app input:focus,
        .scorecard-app select:focus {
            outline: none;
            border-color: var(--sc-lime) !important;
            box-shadow: 0 0 0 3px rgba(140, 199, 13, .14) !important;
        }
        .scorecard-app button[class*="bg-[#8cc70d]"],
        .scorecard-app a[class*="bg-[#8cc70d]"] {
            background: var(--sc-lime) !important;
        }
        .scorecard-app button[class*="bg-[#8cc70d]"]:hover,
        .scorecard-app a[class*="bg-[#8cc70d]"]:hover {
            background: var(--sc-lime-dark) !important;
        }
        .scorecard-main {
            content-visibility: auto;
            contain-intrinsic-size: 700px;
        }
        .scorecard-tab.is-loading {
            pointer-events: none;
            opacity: .75;
        }
        .scorecard-tab.is-loading::after {
            content: '';
            width: 10px;
            height: 10px;
            margin-left: 8px;
            border: 2px solid #cbd5e1;
            border-top-color: var(--sc-lime);
            border-radius: 999px;
            animation: rbbSpin .6s linear infinite;
        }
        body.rbb-fast-loading .scorecard-main {
            cursor: progress;
        }
        .rbb-tab-content { min-height: 320px; }
        .js-rbb-tab-pane[hidden] { display: none !important; }
        .js-rbb-tab-pane { animation: rbbPaneFade .12s ease-out; }
        .js-rbb-tab-pane.is-refreshing { cursor: progress; }
        .js-rbb-tab-pane.is-refreshing .rbb-edit-input.is-saving { opacity: .85; }
        .rbb-tab-loading {
            background: #ffffff;
            border: 1px solid var(--sc-border);
            border-radius: 5px;
            padding: 28px;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 10px;
            color: #64748b;
            font-size: 13px;
            font-weight: 700;
        }
        .rbb-tab-loading::before {
            content: '';
            width: 16px;
            height: 16px;
            border: 2px solid #cbd5e1;
            border-top-color: var(--sc-lime);
            border-radius: 999px;
            animation: rbbSpin .6s linear infinite;
        }
        @keyframes rbbSpin { to { transform: rotate(360deg); } }
        @keyframes rbbPaneFade { from { opacity: .82; transform: translateY(2px); } to { opacity: 1; transform: translateY(0); } }
        @media (max-width: 1023px) {
            .scorecard-sidebar { position: relative; }
            .scorecard-tab { padding-inline: 14px; }
        }

/* Update performa & ikon permanen sidebar */
.scorecard-menu-icon-static {
    display: inline-flex;
    width: 1.15rem;
    height: 1.15rem;
    min-width: 1.15rem;
    align-items: center;
    justify-content: center;
    border-radius: .35rem;
    background: rgba(255,255,255,.10);
    color: #ffffff;
    font-size: .78rem;
    line-height: 1;
}
.scorecard-subitem-icon {
    display: inline-flex;
    width: .95rem;
    min-width: .95rem;
    align-items: center;
    justify-content: center;
    margin-right: .45rem;
    color: #8cc70d;
    font-weight: 900;
}
.scorecard-refresh-icon-btn .scorecard-refresh-fallback { display: none; font-weight: 800; line-height: 1; }
.scorecard-refresh-icon-btn svg + .scorecard-refresh-fallback { display: none; }
.scorecard-refresh-icon-btn:not(:has(svg)) .scorecard-refresh-fallback { display: inline-block; }
.scorecard-tab.is-prefetched::after {
    content: '';
    display: inline-block;
    width: .38rem;
    height: .38rem;
    margin-left: .35rem;
    border-radius: 999px;
    background: #8cc70d;
    vertical-align: middle;
}
.rbb-fast-loading #rbbTabContent { cursor: progress; }
.rbb-tab-loading {
    transition: opacity .12s ease-out;
}
