:root {
    --appku-bg: #eaf6ff;
    --appku-card: #ffffff;
    --appku-text: #0f172a;
    --appku-muted: #64748b;
    --appku-line: #d7e6f5;
    --appku-blue: #2563eb;
    --appku-cyan: #06b6d4;
    --appku-green: #16a34a;
    --appku-orange: #f59e0b;
    --appku-red: #dc2626;
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    min-height: 100vh;
    font-family: "Plus Jakarta Sans", "Segoe UI", sans-serif;
    background:
        radial-gradient(circle at 15% 10%, rgba(34, 197, 94, 0.14), transparent 28%),
        radial-gradient(circle at 88% 0%, rgba(37, 99, 235, 0.18), transparent 34%),
        linear-gradient(135deg, #dbeafe 0%, #eff6ff 48%, #ffffff 100%);
    color: var(--appku-text);
}

.project-main-menu {
    width: min(1320px, calc(100% - 32px));
    margin: 0 auto 0;
    position: sticky;
    top: 8px;
    z-index: 90;
}

.project-main-menu__card {
    display: grid;
    grid-template-columns: minmax(220px, auto) minmax(0, 1fr);
    gap: 18px;
    align-items: center;
    padding: 18px 20px;
    border-radius: 24px;
    border: 1px solid rgba(37, 99, 235, 0.5);
    background: #ffffff;
    box-shadow: 0 18px 40px rgba(42, 117, 214, 0.12);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    transition: box-shadow 0.24s ease, transform 0.24s ease, background 0.24s ease;
    position: relative;
    z-index: 95;
}

.project-main-menu__maulid-mark {
    display: block;
    position: absolute;
    left: -8px;
    top: calc(50% + 4px);
    z-index: 3;
    width: 252px;
    height: 176px;
    object-fit: contain;
    opacity: 0;
    pointer-events: none;
    transform: translate(-12px, -50%) scale(0.92);
    transition: opacity 0.2s ease, transform 0.24s ease;
    visibility: hidden;
}

.project-main-menu__profile {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 12px 14px;
    align-items: center;
}

.project-main-menu__avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border-radius: 18px;
    background: linear-gradient(135deg, #2d8cff, #7ac0ff);
    color: #fff;
    font-size: 22px;
    font-weight: 800;
    box-shadow: 0 16px 30px rgba(45, 140, 255, 0.24);
}

.project-main-menu__identity {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.project-main-menu__identity strong {
    color: #12304f;
    font-size: 17px;
}

.project-main-menu__identity span {
    color: #587596;
    font-size: 13px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-main-menu__meta {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.project-main-menu__pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(45, 140, 255, 0.14);
    color: #1566d8;
    font-size: 12px;
    font-weight: 700;
}

.project-main-menu__pill--active {
    gap: 8px;
    background: rgba(22, 163, 74, 0.12);
    color: #166534;
}

.project-main-menu__pill--soft {
    background: rgba(18, 48, 79, 0.08);
    color: #36506f;
}

.project-main-menu__meta-actions {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.project-main-menu__status-dot {
    width: 9px;
    height: 9px;
    border-radius: 999px;
    background: #22c55e;
    box-shadow: 0 0 0 4px rgba(34, 197, 94, 0.18);
    flex: 0 0 9px;
}

.project-main-menu__links {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
}

.project-main-menu__theme-toggle {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    padding: 11px 14px;
    border-radius: 16px;
    border: 1px solid rgba(37, 99, 235, 0.42);
    background: rgba(255, 255, 255, 0.94);
    color: #12304f;
    font-weight: 700;
    cursor: pointer;
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.project-main-menu__icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    min-height: 40px;
    padding: 0;
    border-radius: 12px;
    text-decoration: none;
    transition: transform 0.22s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.22s ease, background 0.22s ease, border-color 0.22s ease, color 0.22s ease;
}

.project-main-menu__icon-btn.is-active {
    color: #ffffff;
    border-color: transparent;
    background: linear-gradient(135deg, #2d8cff, #65b6ff);
    box-shadow: 0 18px 28px rgba(45, 140, 255, 0.24);
}

.project-main-menu__meta-actions .project-main-menu__logout-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 14px 24px rgba(45, 140, 255, 0.14);
}

.project-main-menu__theme-toggle:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 24px rgba(45, 140, 255, 0.14);
}

.project-main-menu__theme-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
}

.project-main-menu__theme-icon .theme-icon {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.project-main-menu__theme-icon .theme-icon--moon {
    display: none;
}

:root[data-theme="dark"] .project-main-menu__theme-icon .theme-icon--sun {
    display: none;
}

:root[data-theme="dark"] .project-main-menu__theme-icon .theme-icon--moon {
    display: inline;
}

.project-main-menu__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 44px;
    padding: 11px 16px;
    border-radius: 16px;
    border: 1px solid rgba(37, 99, 235, 0.42);
    background: rgba(255, 255, 255, 0.94);
    color: #12304f;
    text-decoration: none;
    font-weight: 700;
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.project-main-menu__link:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 24px rgba(45, 140, 255, 0.14);
    color: #0b2d54;
}

.project-main-menu__link.is-active {
    color: #ffffff;
    border-color: transparent;
    background: linear-gradient(135deg, #2d8cff, #65b6ff);
    box-shadow: 0 18px 32px rgba(45, 140, 255, 0.24);
}

.project-main-menu__item-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
}

.project-main-menu__item-icon svg {
    display: block;
    width: 20px;
    height: 20px;
}

.project-main-menu__item-label {
    display: inline-flex;
}

.project-main-menu__meta-actions .project-main-menu__item-label {
    display: none;
}

.project-main-menu-shortcut-wrap {
    width: min(1320px, calc(100% - 32px));
    margin: -6px auto 6px;
    position: relative;
    z-index: 80;
}

.project-main-menu__shortcut-card {
    margin: -6px auto 0;
    padding: 9px 14px;
    min-height: 52px;
    border-radius: 0 0 16px 16px;
    border: 1px solid rgba(37, 99, 235, 0.58);
    border-top: 0;
    background: linear-gradient(135deg, #1e40af 0%, #1d4ed8 42%, #0f172a 100%);
    box-shadow: 0 10px 20px rgba(15, 23, 42, 0.2);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    transition: transform 0.2s ease, box-shadow 0.2s ease, padding 0.2s ease;
    display: block;
    width: min(1280px, calc(100% - 8px));
    max-width: 100%;
    position: relative;
    z-index: 1;
}

.project-main-menu__shortcut-links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    justify-content: center;
}

.project-main-menu__shortcut-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 36px;
    padding: 6px 11px;
    border-radius: 10px;
    border: 1px solid rgba(147, 197, 253, 0.34);
    background: rgba(255, 255, 255, 0.12);
    color: #e0ecff;
    text-decoration: none;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease, background 0.2s ease, color 0.2s ease;
}

.project-main-menu__shortcut-link:hover {
    transform: translateY(-2px);
    color: #ffffff;
    border-color: rgba(191, 219, 254, 0.62);
    background: rgba(255, 255, 255, 0.2);
    box-shadow: 0 8px 16px rgba(2, 8, 23, 0.22);
}

.project-main-menu__shortcut-link.is-active {
    color: #ffffff;
    border-color: transparent;
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.96), rgba(96, 165, 250, 0.9));
    box-shadow: 0 10px 18px rgba(15, 23, 42, 0.22);
}

.project-main-menu__shortcut-link .project-main-menu__item-icon {
    width: 16px;
    height: 16px;
    flex: 0 0 16px;
}

.project-main-menu__shortcut-link .project-main-menu__item-icon svg {
    width: 16px;
    height: 16px;
}

.appku-main-menu,
.appku-main-menu-shortcut {
    width: min(1320px, calc(100% - 32px));
}

.project-main-menu__shortcut-link.is-disabled {
    opacity: 0.48;
    pointer-events: none;
}

:root[data-theme="dark"] body {
    background:
        radial-gradient(circle at 15% 10%, rgba(34, 197, 94, 0.1), transparent 28%),
        radial-gradient(circle at 88% 0%, rgba(56, 189, 248, 0.14), transparent 34%),
        linear-gradient(135deg, #020617 0%, #0f172a 52%, #111827 100%);
    color: #e5eefb;
}

:root[data-theme="dark"] .project-main-menu__card {
    border-color: rgba(59, 130, 246, 0.66);
    background: #0f172a;
    box-shadow: 0 20px 44px rgba(2, 8, 23, 0.42);
}

:root[data-theme="dark"] .project-main-menu__shortcut-card {
    border-color: rgba(59, 130, 246, 0.66);
    background: linear-gradient(135deg, #020617 0%, #172554 45%, #020617 100%);
    box-shadow: 0 14px 30px rgba(2, 8, 23, 0.4);
}

:root[data-theme="dark"] .project-main-menu__identity strong {
    color: #f8fafc;
}

:root[data-theme="dark"] .project-main-menu__identity span {
    color: #cbd5e1;
}

:root[data-theme="dark"] .project-main-menu__pill {
    background: rgba(59, 130, 246, 0.2);
    color: #bfdbfe;
}

:root[data-theme="dark"] .project-main-menu__pill--active {
    background: rgba(34, 197, 94, 0.16);
    color: #bbf7d0;
}

:root[data-theme="dark"] .project-main-menu__status-dot {
    background: #4ade80;
    box-shadow: 0 0 0 4px rgba(74, 222, 128, 0.12);
}

:root[data-theme="dark"] .project-main-menu__pill--soft {
    background: rgba(148, 163, 184, 0.14);
    color: #cbd5e1;
}

:root[data-theme="dark"] .project-main-menu__theme-toggle,
:root[data-theme="dark"] .project-main-menu__link {
    border-color: rgba(59, 130, 246, 0.58);
    background: rgba(30, 41, 59, 0.88);
    color: #dbeafe;
}

:root[data-theme="dark"] .project-main-menu__theme-toggle:hover,
:root[data-theme="dark"] .project-main-menu__link:hover {
    color: #ffffff;
    border-color: rgba(96, 165, 250, 0.76);
    background: rgba(30, 41, 59, 0.96);
    box-shadow: 0 14px 24px rgba(2, 8, 23, 0.44);
}

:root[data-theme="dark"] .project-main-menu__icon-btn.is-active,
:root[data-theme="dark"] .project-main-menu__link.is-active {
    color: #ffffff;
    border-color: transparent;
    background: linear-gradient(135deg, #2563eb, #38bdf8);
    box-shadow: 0 18px 30px rgba(2, 8, 23, 0.5);
}

:root[data-theme="dark"] .project-main-menu__shortcut-link {
    border-color: rgba(59, 130, 246, 0.58);
    background: rgba(15, 23, 42, 0.48);
    color: #dbeafe;
}

:root[data-theme="dark"] .project-main-menu__shortcut-link:hover {
    color: #ffffff;
    border-color: rgba(96, 165, 250, 0.76);
    background: rgba(30, 41, 59, 0.98);
    box-shadow: 0 10px 22px rgba(2, 8, 23, 0.44);
}

:root[data-theme="dark"] .project-main-menu__shortcut-link.is-active {
    color: #ffffff;
    border-color: transparent;
    background: linear-gradient(135deg, #2563eb, #38bdf8);
    box-shadow: 0 14px 24px rgba(2, 8, 23, 0.48);
}

body.project-menu-compact .project-main-menu__card {
    grid-template-columns: 1fr;
    gap: 10px;
    padding: 10px 14px;
    border-radius: 16px;
    box-shadow: 0 14px 32px rgba(15, 23, 42, 0.2);
}

body.project-menu-compact .project-main-menu__maulid-mark {
    opacity: 1;
    transform: translate(0, -50%) scale(1);
    visibility: visible;
}

body.project-menu-compact .project-main-menu--hutri .project-main-menu__card {
    overflow: visible;
}

body.project-menu-compact .project-main-menu__profile {
    display: none;
}

body.project-menu-compact .project-main-menu__links {
    justify-content: center;
    gap: 8px;
}

body.project-menu-compact .project-main-menu__link {
    min-height: 38px;
    padding: 8px 12px;
    border-radius: 12px;
}

body.project-menu-compact .project-main-menu-shortcut-wrap {
    display: none;
}

.project-main-menu--hutri .project-main-menu__card {
    overflow: hidden;
    border-color: rgba(239, 68, 68, 0.38);
    background:
        radial-gradient(circle at 88% 18%, rgba(255, 255, 255, 0.52), transparent 24%),
        linear-gradient(135deg, rgba(185, 28, 28, 0.16) 0%, rgba(239, 68, 68, 0.1) 44%, rgba(255, 255, 255, 0.98) 44% 100%),
        #ffffff;
    box-shadow: 0 18px 42px rgba(185, 28, 28, 0.13);
}

.project-main-menu--hutri .project-main-menu__card::before {
    content: "";
    position: absolute;
    right: 22px;
    top: 50%;
    z-index: 0;
    width: clamp(82px, 8vw, 120px);
    height: clamp(82px, 8vw, 120px);
    background: url("ri81.png") center / contain no-repeat;
    opacity: 0.12;
    pointer-events: none;
    transform: translateY(-48%);
}

.project-main-menu--hutri .project-main-menu__card::after {
    content: "INDONESIA BERDAULAT";
    position: absolute;
    right: 34px;
    bottom: 14px;
    z-index: 0;
    color: rgba(185, 28, 28, 0.24);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.18em;
    pointer-events: none;
    text-transform: uppercase;
}

.project-main-menu--hutri .project-main-menu__profile,
.project-main-menu--hutri .project-main-menu__links {
    position: relative;
    z-index: 1;
}

.project-main-menu__name-row {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    flex-wrap: wrap;
}

.project-main-menu__hutri-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 22px;
    padding: 5px 10px;
    border-radius: 999px;
    border: 1px solid rgba(248, 113, 113, 0.42);
    background: linear-gradient(135deg, #ef4444 0 50%, #ffffff 50% 100%);
    color: #7f1d1d;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 0.11em;
    line-height: 1;
    text-transform: uppercase;
    white-space: nowrap;
    box-shadow: 0 8px 18px rgba(220, 38, 38, 0.18), 0 0 0 2px rgba(255, 255, 255, 0.58);
}

.project-main-menu--hutri .project-main-menu__link,
.project-main-menu--hutri + .project-main-menu-shortcut-wrap .project-main-menu__shortcut-link {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.project-main-menu--hutri .project-main-menu__link::after,
.project-main-menu--hutri + .project-main-menu-shortcut-wrap .project-main-menu__shortcut-link::after {
    content: "";
    position: absolute;
    right: -7px;
    top: 50%;
    z-index: -1;
    width: clamp(34px, 4.2vw, 44px);
    height: calc(100% - 6px);
    background: url("ri81.png") center / contain no-repeat;
    opacity: 0.2;
    pointer-events: none;
    transform: translateY(-50%);
}

.project-main-menu--hutri .project-main-menu__link.is-active::after,
.project-main-menu--hutri + .project-main-menu-shortcut-wrap .project-main-menu__shortcut-link.is-active::after,
.project-main-menu--hutri + .project-main-menu-shortcut-wrap .project-main-menu__shortcut-link:hover::after {
    opacity: 0.28;
    filter: brightness(0) invert(1);
}

.project-main-menu--hutri .project-main-menu__link .project-main-menu__item-icon,
.project-main-menu--hutri .project-main-menu__link .project-main-menu__item-label,
.project-main-menu--hutri + .project-main-menu-shortcut-wrap .project-main-menu__shortcut-link .project-main-menu__item-icon,
.project-main-menu--hutri + .project-main-menu-shortcut-wrap .project-main-menu__shortcut-link .project-main-menu__item-label {
    position: relative;
    z-index: 1;
}

.project-main-menu--hutri + .project-main-menu-shortcut-wrap .project-main-menu__shortcut-card {
    overflow: hidden;
    border-color: rgba(239, 68, 68, 0.48);
    background:
        radial-gradient(circle at 92% 50%, rgba(255, 255, 255, 0.26), transparent 18%),
        linear-gradient(135deg, rgba(185, 28, 28, 0.96), rgba(239, 68, 68, 0.88) 42%, rgba(15, 23, 42, 0.98) 100%);
    box-shadow: 0 12px 24px rgba(127, 29, 29, 0.2);
}

.project-main-menu--hutri + .project-main-menu-shortcut-wrap .project-main-menu__shortcut-card::after {
    content: "";
    position: absolute;
    right: 18px;
    top: 50%;
    width: 56px;
    height: 56px;
    background: url("ri81.png") center / contain no-repeat;
    opacity: 0.14;
    filter: brightness(0) invert(1);
    pointer-events: none;
    transform: translateY(-50%);
}

.project-main-menu--hutri + .project-main-menu-shortcut-wrap .project-main-menu__shortcut-links {
    position: relative;
    z-index: 1;
}

:root[data-theme="dark"] .project-main-menu--hutri .project-main-menu__card {
    border-color: rgba(248, 113, 113, 0.38);
    background:
        radial-gradient(circle at 88% 18%, rgba(248, 250, 252, 0.12), transparent 24%),
        linear-gradient(135deg, rgba(127, 29, 29, 0.4) 0%, rgba(185, 28, 28, 0.24) 44%, rgba(15, 23, 42, 0.98) 44% 100%),
        #0f172a;
    box-shadow: 0 20px 44px rgba(127, 29, 29, 0.22);
}

:root[data-theme="dark"] .project-main-menu--hutri .project-main-menu__card::before {
    opacity: 0.12;
    filter: brightness(0) invert(1);
}

:root[data-theme="dark"] .project-main-menu--hutri .project-main-menu__card::after {
    color: rgba(254, 226, 226, 0.18);
}

:root[data-theme="dark"] .project-main-menu--hutri + .project-main-menu-shortcut-wrap .project-main-menu__shortcut-card {
    border-color: rgba(248, 113, 113, 0.46);
    background:
        radial-gradient(circle at 92% 50%, rgba(248, 250, 252, 0.12), transparent 18%),
        linear-gradient(135deg, rgba(127, 29, 29, 0.96), rgba(185, 28, 28, 0.66) 42%, rgba(15, 23, 42, 0.98) 100%),
        #450a0a;
}

:root[data-theme="dark"] .project-main-menu__hutri-badge {
    border-color: rgba(248, 113, 113, 0.42);
    background: linear-gradient(135deg, #991b1b 0 50%, #f8fafc 50% 100%);
    color: #fee2e2;
    box-shadow: 0 8px 18px rgba(127, 29, 29, 0.28), 0 0 0 2px rgba(15, 23, 42, 0.5);
}

:root[data-theme="dark"] .appku-card {
    border-color: rgba(59, 130, 246, 0.3);
    background: rgba(15, 23, 42, 0.9);
    box-shadow: 0 22px 60px rgba(2, 8, 23, 0.34);
}

:root[data-theme="dark"] .appku-title {
    background: linear-gradient(135deg, #f8fafc 0%, #93c5fd 55%, #38bdf8 100%);
    -webkit-background-clip: text;
    background-clip: text;
}

:root[data-theme="dark"] .appku-text,
:root[data-theme="dark"] .appku-panel p {
    color: #cbd5e1;
}

:root[data-theme="dark"] .appku-code,
:root[data-theme="dark"] .appku-check {
    border-color: rgba(59, 130, 246, 0.28);
    background: rgba(2, 6, 23, 0.46);
    color: #dbeafe;
}

.appku-shell {
    width: min(1320px, calc(100% - 32px));
    margin: 0 auto;
    padding: 8px 0 32px;
}

.appku-card {
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid var(--appku-line);
    border-radius: 24px;
    box-shadow: 0 22px 60px rgba(15, 23, 42, 0.08);
}

.appku-hero {
    padding: 24px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 20px;
    align-items: center;
}

.appku-kicker {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 8px;
    color: var(--appku-blue);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.appku-kicker::before {
    content: "";
    width: 34px;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--appku-cyan), var(--appku-blue));
}

.appku-title {
    margin: 0;
    font-size: clamp(34px, 5vw, 56px);
    letter-spacing: -0.05em;
    line-height: 1;
    background: linear-gradient(135deg, #0f172a 0%, #1d4ed8 55%, #0ea5e9 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.appku-text {
    margin: 10px 0 0;
    color: var(--appku-muted);
    line-height: 1.6;
}

.appku-badge {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 9px 13px;
    background: #eff6ff;
    color: #1d4ed8;
    font-weight: 900;
}

.appku-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

.appku-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 11px 16px;
    border-radius: 16px;
    background: linear-gradient(135deg, #2563eb, #06b6d4);
    color: #fff;
    text-decoration: none;
    font-weight: 900;
    box-shadow: 0 12px 28px rgba(37, 99, 235, 0.22);
}

.appku-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin-top: 18px;
}

.appku-panel {
    padding: 20px;
}

.appku-panel h2 {
    margin: 0 0 10px;
    font-size: 18px;
}

.appku-panel p {
    margin: 0 0 10px;
    color: var(--appku-muted);
    line-height: 1.55;
}

.appku-code {
    display: block;
    overflow-wrap: anywhere;
    padding: 10px 12px;
    border-radius: 14px;
    background: #f8fafc;
    border: 1px solid var(--appku-line);
    color: #334155;
    font-family: "Cascadia Code", Consolas, monospace;
    font-size: 13px;
}

.appku-status-success {
    color: var(--appku-green);
}

.appku-status-warning {
    color: var(--appku-orange);
}

.appku-status-danger {
    color: var(--appku-red);
}

.appku-checks {
    display: grid;
    gap: 12px;
    margin-top: 22px;
}

.appku-check {
    display: grid;
    grid-template-columns: 170px minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    padding: 14px;
    border: 1px solid var(--appku-line);
    border-radius: 18px;
    background: #f8fbff;
}

.appku-check strong {
    font-size: 14px;
}

.appku-check .appku-code {
    padding: 0;
    border: 0;
    background: transparent;
}

.appku-status-badge {
    border-radius: 999px;
    padding: 7px 10px;
    font-size: 12px;
    font-weight: 900;
    white-space: nowrap;
}

.appku-status-badge--ok {
    background: #dcfce7;
    color: var(--appku-green);
}

.appku-status-badge--warn {
    background: #fff7ed;
    color: var(--appku-orange);
}

.appku-status-badge--danger {
    background: #fee2e2;
    color: var(--appku-red);
}

.appku-login-shell {
    display: grid;
    place-items: center;
    min-height: 100vh;
    padding-top: 32px;
}

.appku-login-card {
    width: min(520px, 100%);
    padding: 26px;
    display: grid;
    gap: 18px;
}

.appku-login-brand {
    display: flex;
    justify-content: center;
}

.appku-login-brand img {
    display: block;
    width: clamp(88px, 22vw, 112px);
    height: auto;
    filter: drop-shadow(0 14px 20px rgba(15, 63, 145, 0.2));
}

.appku-alert {
    padding: 12px 14px;
    border-radius: 16px;
    border: 1px solid rgba(248, 113, 113, 0.34);
    background: #fef2f2;
    color: #b91c1c;
    font-weight: 800;
}

.appku-login-form {
    display: grid;
    gap: 14px;
}

.appku-login-form label {
    display: grid;
    gap: 7px;
    color: #475569;
    font-size: 13px;
    font-weight: 900;
}

.appku-login-form input {
    width: 100%;
    min-height: 48px;
    padding: 11px 14px;
    border: 1px solid #cbd5e1;
    border-radius: 15px;
    background: #ffffff;
    color: #0f172a;
    font: inherit;
    font-weight: 700;
}

.appku-login-form input:focus {
    border-color: rgba(37, 99, 235, 0.86);
    box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.12);
    outline: 0;
}

.laporan-shell {
    display: grid;
    gap: 16px;
}

.laporan-content {
    display: grid;
    gap: 16px;
    transition: opacity 0.18s ease, filter 0.18s ease;
}

.laporan-content.is-loading {
    opacity: 0.58;
    filter: saturate(0.8);
    pointer-events: none;
}

.laporan-ready-panel {
    position: relative;
    display: flex;
    align-items: center;
    gap: 16px;
    min-height: 118px;
    padding: 20px 22px;
    overflow: hidden;
    border-color: rgba(34, 197, 94, 0.16);
    background:
        radial-gradient(circle at 95% 20%, rgba(34, 197, 94, 0.14), transparent 28%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(240, 253, 244, 0.82));
}

.laporan-ready-panel::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(180deg, #22c55e, #06b6d4);
}

.laporan-ready-panel__icon {
    width: 54px;
    height: 54px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border-radius: 18px;
    background: linear-gradient(135deg, #dcfce7, #e0f2fe);
    box-shadow: inset 0 0 0 1px rgba(34, 197, 94, 0.16);
}

.laporan-ready-panel__icon span {
    width: 24px;
    height: 24px;
    border: 4px solid rgba(22, 163, 74, 0.16);
    border-top-color: #16a34a;
    border-radius: 999px;
    animation: laporanSpin 0.85s linear infinite;
}

.laporan-ready-panel.is-idle .laporan-ready-panel__icon span {
    width: 18px;
    height: 18px;
    border: 0;
    background: #22c55e;
    box-shadow: 0 0 0 7px rgba(34, 197, 94, .13);
    animation: none;
}

.laporan-ready-panel__body {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.laporan-ready-panel h2 {
    margin: 0;
    color: #0f172a;
    font-size: clamp(22px, 2.2vw, 30px);
    line-height: 1.05;
    letter-spacing: -0.045em;
}

.laporan-ready-panel .appku-text {
    margin: 0;
    color: #64748b;
    font-weight: 800;
}

.laporan-ready-panel__bar {
    width: min(420px, 100%);
    height: 8px;
    margin-top: 8px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(148, 163, 184, 0.18);
}

.laporan-ready-panel__bar::after {
    content: "";
    display: block;
    width: 44%;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #22c55e, #06b6d4);
    animation: laporanReadyBar 1.2s ease-in-out infinite;
}

@keyframes laporanSpin {
    to {
        transform: rotate(360deg);
    }
}

@keyframes laporanReadyBar {
    0% {
        transform: translateX(-110%);
    }
    100% {
        transform: translateX(240%);
    }
}

.laporan-hero {
    padding: 24px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 16px;
    align-items: center;
    overflow: hidden;
    background:
        radial-gradient(circle at 92% 18%, rgba(14, 165, 233, 0.16), transparent 23%),
        linear-gradient(135deg, rgba(255,255,255,.98), rgba(239,246,255,.92));
}

.laporan-hero__mark {
    display: grid;
    place-items: center;
    width: 68px;
    height: 68px;
    border-radius: 22px;
    color: #fff;
    background: linear-gradient(135deg, #2563eb, #06b6d4);
    box-shadow: 0 20px 38px rgba(37, 99, 235, .22);
}

.laporan-hero__mark svg { width: 32px; height: 32px; }

.laporan-hero__filter {
    align-self: center;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.laporan-workspace {
    min-width: 0;
    min-height: 520px;
    padding: 12px;
    display: grid;
    grid-template-columns: 230px minmax(0, 1fr);
    gap: 14px;
}

.laporan-tabs {
    display: grid;
    align-content: start;
    gap: 8px;
    padding: 7px;
    border: 1px solid #d7e6f5;
    border-radius: 18px;
    background: linear-gradient(180deg, #eff6ff, #f8fbff);
}

.laporan-tab {
    width: 100%;
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr);
    gap: 1px 10px;
    align-items: center;
    padding: 11px 12px;
    border: 0;
    border-radius: 14px;
    background: transparent;
    color: #49627e;
    text-align: left;
    cursor: pointer;
}

.laporan-tab > span {
    position: relative;
    grid-row: 1 / 3;
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    border-radius: 10px;
    background: rgba(37, 99, 235, .08);
}

.laporan-tab svg { width: 17px; height: 17px; }
.laporan-tab__date {
    font-size: 13px;
    font-weight: 800;
    line-height: 1;
    font-variant-numeric: tabular-nums;
    letter-spacing: -.02em;
}
.laporan-tab strong { color: inherit; font-size: 14px; }
.laporan-tab small { opacity: .74; font-size: 11px; }
.laporan-tab.is-active {
    color: #fff;
    background: linear-gradient(135deg, #2563eb, #0ea5e9);
    box-shadow: 0 12px 24px rgba(37, 99, 235, .2);
}
.laporan-tab.is-active > span { background: rgba(255, 255, 255, .18); }
.laporan-tab:disabled { cursor: default; opacity: .58; }
.laporan-tab.is-loading { opacity: .82; cursor: wait; }
.laporan-tab.is-loading > span svg { display: none; }
.laporan-tab.is-loading > .laporan-tab__date {
    color: transparent;
    font-size: 0;
}
.laporan-tab.is-loading > span::after {
    content: "";
    position: absolute;
    inset: 0;
    margin: auto;
    box-sizing: border-box;
    width: 15px;
    height: 15px;
    border: 2px solid rgba(255, 255, 255, .38);
    border-top-color: #fff;
    border-radius: 999px;
    animation: laporanSpin .75s linear infinite;
}

.laporan-tab-panel {
    min-width: 0;
    padding: 10px 8px 8px;
    display: grid;
    align-content: start;
    gap: 14px;
}

.laporan-tab-panel[hidden] { display: none; }

.laporan-panel-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 18px;
    padding: 4px 4px 2px;
}

.laporan-panel-head h2 {
    margin: 0;
    color: #0f172a;
    font-size: 24px;
    letter-spacing: -.035em;
}

.laporan-panel-head p:not(.appku-kicker) {
    margin: 5px 0 0;
    color: #64748b;
    font-size: 13px;
}
.laporan-panel-head--daily { align-items: center; }
.laporan-daily-summary { flex: 0 1 405px; min-width: 285px; }
.laporan-daily-summary[hidden] { display: none; }
.laporan-daily-inline-controls { display: flex; align-items: end; justify-content: flex-end; gap: 7px; margin-left: auto; }
.laporan-daily-inline-controls .laporan-admin-direct { min-height: 29px; padding: 3px 8px; font-size: 10px; }
.laporan-daily-inline-controls .laporan-daily-all-stores input {
    appearance: none;
    width: 12px;
    min-width: 12px;
    height: 12px;
    min-height: 12px;
    margin: 0;
    padding: 0;
    border: 1.5px solid #3b82f6;
    border-radius: 4px;
    background: #fff;
    cursor: pointer;
}
.laporan-daily-head-intro { flex: 1 1 auto; min-width: 0; }
.laporan-daily-head-intro[hidden] { display: none; }
.laporan-note-head-intro { flex: 1 1 auto; min-width: 0; }
.laporan-note-head-intro[hidden],
.laporan-export-btn[hidden] { display: none; }

.laporan-daily-overview {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
    padding: 15px 17px;
    border: 1px solid #d9e7f4;
    border-radius: 17px;
    background: linear-gradient(135deg, #f8fbff, #ecfeff);
}

.laporan-daily-overview h3 { margin: 1px 0 0; color: #0f172a; font-size: 24px; }
.laporan-daily-overview p:not(.appku-kicker) { margin: 3px 0 0; color: #64748b; font-size: 12px; font-weight: 800; }
.laporan-daily-overview > span {
    padding: 8px 11px;
    border-radius: 12px;
    color: #0369a1;
    background: #e0f2fe;
    font-size: 12px;
    font-weight: 900;
}
.laporan-daily-overview__actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.laporan-daily-overview__actions > span {
    padding: 8px 11px;
    border-radius: 12px;
    color: #0369a1;
    background: #e0f2fe;
    font-size: 11px;
    font-weight: 900;
}
.laporan-daily-print-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 34px;
    padding: 7px 11px;
    border: 1px solid #86efac;
    border-radius: 12px;
    color: #166534;
    background: #f0fdf4;
    font: inherit;
    font-size: 11px;
    font-weight: 900;
    cursor: pointer;
}
.laporan-daily-print-btn:hover { color: #fff; background: #16a34a; border-color: #16a34a; }
.laporan-daily-print-btn.is-loading { cursor: wait; opacity: .68; }
.laporan-daily-print-btn svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; }

.laporan-daily-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 9px;
}

.laporan-daily-card {
    position: relative;
    overflow: hidden;
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 9px;
    padding: 10px;
    border: 1px solid #d9e7f4;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .045);
}
.laporan-daily-card::after { content: ""; position: absolute; right: -22px; bottom: -30px; z-index: 0; width: 86px; height: 86px; border-radius: 50%; opacity: .5; }
.laporan-daily-card > * { position: relative; z-index: 1; }
.laporan-daily-card.is-tone-blue { border-color: #d6e4ff; background: linear-gradient(135deg, #fff 52%, #edf4ff); }
.laporan-daily-card.is-tone-blue::after { background: #cfe0ff; }
.laporan-daily-card.is-tone-cyan { border-color: #ccecf2; background: linear-gradient(135deg, #fff 52%, #eafcff); }
.laporan-daily-card.is-tone-cyan::after { background: #bfeef5; }
.laporan-daily-card.is-tone-green { border-color: #d1ecd8; background: linear-gradient(135deg, #fff 52%, #effcf3); }
.laporan-daily-card.is-tone-green::after { background: #c9edd4; }
.laporan-daily-card.is-tone-orange { border-color: #f4dfb6; background: linear-gradient(135deg, #fff 52%, #fff8e8); }
.laporan-daily-card.is-tone-orange::after { background: #ffe4aa; }
.laporan-daily-card.is-tone-rose { border-color: #f2d3df; background: linear-gradient(135deg, #fff 52%, #fff0f5); }
.laporan-daily-card.is-tone-rose::after { background: #f9d3e2; }

.laporan-daily-card__rank {
    display: grid;
    place-items: center;
    width: 29px;
    height: 29px;
    border-radius: 9px;
    color: #1d4ed8;
    background: #dbeafe;
    font-size: 12px;
    font-weight: 900;
}

.laporan-daily-card.is-tone-blue .laporan-daily-card__rank { color: #1d4ed8; background: #dbeafe; }
.laporan-daily-card.is-tone-cyan .laporan-daily-card__rank { color: #0e7490; background: #cffafe; }
.laporan-daily-card.is-tone-green .laporan-daily-card__rank { color: #166534; background: #dcfce7; }
.laporan-daily-card.is-tone-orange .laporan-daily-card__rank { color: #b45309; background: #fef3c7; }
.laporan-daily-card.is-tone-rose .laporan-daily-card__rank { color: #be185d; background: #fce7f3; }
.laporan-daily-card div { min-width: 0; }
.laporan-daily-card div small { color: #64748b; font-size: 9px; font-weight: 900; text-transform: uppercase; letter-spacing: .07em; }
.laporan-daily-card h3 { margin: 1px 0; overflow: hidden; color: #0f172a; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.laporan-daily-card p { margin: 0; color: #64748b; font-size: 10px; font-weight: 800; }
.laporan-daily-card__identity { display: grid; min-width: 0; row-gap: 2px; }
.laporan-daily-card__identity h3 { width: 100%; max-width: 100%; }
.laporan-daily-card__shops {
    grid-column: 2 / -1;
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    padding-top: 6px;
    border-top: 1px solid #e2edf7;
}
.laporan-daily-card__shop-icon {
    position: relative;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 27px;
    height: 27px;
    border: 1px solid #c7e8f5;
    border-radius: 8px;
    background: #f5fdff;
    cursor: help;
}
.laporan-daily-card__shop-icon img { display: block; width: 17px; height: 17px; object-fit: contain; }
.laporan-daily-card__shop-icon i { display: none; color: #0e7490; font-size: 15px; font-style: normal; font-weight: 900; }
.laporan-daily-card__shop-icon.is-fallback i { display: block; }
.laporan-daily-card__shop-icon.is-canceled { border-color: #fecaca; background: #fff1f2; }
.laporan-daily-card__shop-icon.is-canceled i { color: #dc2626; font-size: 16px; line-height: 1; }
.laporan-daily-card__shop-icon.is-canceled small { color: #b91c1c; background: #fee2e2; }
.laporan-daily-card__shop-icon small {
    position: absolute;
    right: -6px;
    bottom: -6px;
    min-width: 14px;
    padding: 2px 3px;
    border: 1px solid #fff;
    border-radius: 999px;
    color: #075985;
    background: #bae6fd;
    font-size: 8px;
    font-weight: 900;
    line-height: 1;
}
.laporan-daily-card.is-tone-blue { --laporan-daily-tone: #1d4ed8; }
.laporan-daily-card.is-tone-cyan { --laporan-daily-tone: #0e7490; }
.laporan-daily-card.is-tone-green { --laporan-daily-tone: #166534; }
.laporan-daily-card.is-tone-orange { --laporan-daily-tone: #b45309; }
.laporan-daily-card.is-tone-rose { --laporan-daily-tone: #be185d; }
.laporan-daily-card__store-mark {
    position: relative;
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border: 1px solid color-mix(in srgb, var(--laporan-daily-tone, #1d4ed8) 25%, #fff);
    border-radius: 13px;
    background: linear-gradient(145deg, #fff, color-mix(in srgb, var(--laporan-daily-tone, #1d4ed8) 10%, #fff));
    box-shadow: 0 7px 16px color-mix(in srgb, var(--laporan-daily-tone, #1d4ed8) 14%, transparent);
    overflow: visible;
}
.laporan-daily-card__store-mark::after {
    content: "";
    position: absolute;
    inset: 4px;
    z-index: -1;
    border-radius: 9px;
    background: color-mix(in srgb, var(--laporan-daily-tone, #1d4ed8) 7%, #fff);
}
.laporan-daily-card__store-mark img { display: block; max-width: 32px; max-height: 32px; object-fit: contain; filter: drop-shadow(0 3px 4px rgba(15, 23, 42, .12)); }
.laporan-daily-card__store-fallback { display: none; color: var(--laporan-daily-tone, #1d4ed8); font-size: 12px; font-weight: 950; letter-spacing: .02em; }
.laporan-daily-card__store-mark.is-fallback .laporan-daily-card__store-fallback { display: block; }
.laporan-daily-card__store-mark b {
    position: absolute;
    right: -5px;
    bottom: -5px;
    display: grid;
    place-items: center;
    min-width: 17px;
    height: 17px;
    padding: 0 3px;
    border: 2px solid #fff;
    border-radius: 999px;
    color: #fff;
    background: var(--laporan-daily-tone, #1d4ed8);
    font-size: 8px;
    line-height: 1;
    box-shadow: 0 3px 8px rgba(15, 23, 42, .2);
}
.laporan-daily-card__metric { min-width: 0; text-align: right; }
.laporan-daily-card__metric strong { display: block; color: #0f766e; font-size: 19px; line-height: 1; }
.laporan-daily-card__metric small { display: block; margin-top: 4px; color: #64748b; font-size: 8px; font-weight: 900; text-transform: uppercase; }
.laporan-daily-empty { grid-column: 1 / -1; min-height: 190px; display: grid; place-items: center; align-content: center; gap: 5px; border: 1px dashed #bfdbfe; border-radius: 18px; color: #64748b; background: #f8fbff; text-align: center; }
.laporan-daily-empty strong { color: #1e3a5f; }
.laporan-daily-wrong-store-card { grid-column: 1 / -1; padding: 14px 16px; border: 1px solid #f5c2c7; border-radius: 16px; background: linear-gradient(135deg, #fff8f8, #fff1f2); box-shadow: 0 8px 20px rgba(190, 24, 93, .06); }
.laporan-daily-wrong-store-card__head { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.laporan-daily-wrong-store-card__head span { color: #be123c; font-size: 9px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.laporan-daily-wrong-store-card__head h3 { margin: 3px 0 0; color: #881337; font-size: 16px; }
.laporan-daily-wrong-store-card__head p { margin: 4px 0 0; color: #9f1239; font-size: 11px; font-weight: 700; }
.laporan-daily-wrong-store-card__head > strong { display: grid; place-items: center; min-width: 36px; height: 36px; border-radius: 12px; color: #fff; background: #e11d48; font-size: 16px; }
.laporan-daily-wrong-store-card__rows { display: grid; gap: 5px; margin-top: 11px; }
.laporan-daily-wrong-store-card__rows div { display: grid; grid-template-columns: minmax(130px, auto) minmax(0, 1fr) auto; gap: 9px; align-items: center; padding: 7px 9px; border: 1px solid #fbcad2; border-radius: 9px; background: rgba(255, 255, 255, .72); }
.laporan-daily-wrong-store-card__rows b { color: #9f1239; font-size: 11px; }
.laporan-daily-wrong-store-card__rows span { overflow: hidden; color: #6b3140; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.laporan-daily-wrong-store-card__rows em { color: #9f1239; font-size: 11px; font-style: normal; font-weight: 900; white-space: nowrap; }
.laporan-daily-wrong-store-card > small { display: block; margin-top: 8px; color: #9f1239; font-size: 10px; font-weight: 800; }
.laporan-daily-wrong-store-card__actions { display: flex; align-items: center; gap: 8px; }
.laporan-daily-wrong-store-card__actions button { height: 32px; padding: 0 11px; border: 1px solid #f3a8bb; border-radius: 10px; color: #9f1239; background: #fff; font: inherit; font-size: 10px; font-weight: 900; cursor: pointer; }
.laporan-daily-wrong-store-card__actions button:hover { color: #fff; background: #be123c; }
.laporan-daily-wrong-store-card__rows div { display: block; }
.laporan-daily-wrong-store-card__rows b { display: block; }
.laporan-daily-wrong-store-modal { width: min(760px, calc(100vw - 30px)); max-height: min(78vh, 720px); padding: 0; border: 0; border-radius: 20px; color: #13233d; background: #fff; box-shadow: 0 28px 80px rgba(15, 23, 42, .32); }
.laporan-daily-wrong-store-modal::backdrop { background: rgba(15, 23, 42, .5); backdrop-filter: blur(3px); }
.laporan-daily-wrong-store-modal__head, .laporan-daily-wrong-store-modal__foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 17px 20px; }
.laporan-daily-wrong-store-modal__head { border-bottom: 1px solid #dbe5f1; }.laporan-daily-wrong-store-modal__head .appku-kicker { margin: 0; }.laporan-daily-wrong-store-modal__head h2 { margin: 3px 0 0; font-size: 21px; }
.laporan-daily-wrong-store-modal__head button { display: grid; place-items: center; width: 34px; height: 34px; border: 0; border-radius: 10px; color: #25425f; background: #edf3f9; font: inherit; font-size: 20px; font-weight: 900; cursor: pointer; }
.laporan-daily-wrong-store-modal__body { max-height: calc(min(78vh, 720px) - 143px); padding: 17px 20px; overflow: auto; }.laporan-daily-wrong-store-modal__period { margin: 0 0 12px; color: #64748b; font-size: 12px; font-weight: 700; }
.laporan-daily-wrong-store-modal__list { display: grid; gap: 9px; }.laporan-daily-wrong-store-modal__list article { display: grid; grid-template-columns: 1fr auto; gap: 5px 14px; padding: 12px; border: 1px solid #f2c6d2; border-radius: 13px; background: #fff9fa; }.laporan-daily-wrong-store-modal__list article > div { display: flex; align-items: center; gap: 8px; }.laporan-daily-wrong-store-modal__list b { color: #9f1239; font-size: 13px; }.laporan-daily-wrong-store-modal__list span { padding: 3px 6px; border-radius: 999px; color: #9f1239; background: #ffe3ea; font-size: 9px; font-weight: 900; }.laporan-daily-wrong-store-modal__list p { grid-column: 1 / -1; margin: 0; color: #263b57; font-size: 12px; font-weight: 800; }.laporan-daily-wrong-store-modal__list small { color: #687990; font-size: 10px; }.laporan-daily-wrong-store-modal__list strong { align-self: end; color: #a42248; font-size: 12px; white-space: nowrap; }
.laporan-daily-wrong-store-modal__empty { padding: 28px; border: 1px dashed #d7e2ee; border-radius: 13px; color: #64748b; text-align: center; }.laporan-daily-wrong-store-modal__foot { justify-content: flex-end; border-top: 1px solid #dbe5f1; }.laporan-daily-wrong-store-modal__foot button { height: 34px; padding: 0 15px; border: 1px solid #b7cae0; border-radius: 10px; color: #244260; background: #fff; font: inherit; font-weight: 900; cursor: pointer; }
@media (max-width: 620px) { .laporan-daily-wrong-store-card__head { align-items: flex-start; }.laporan-daily-wrong-store-modal__head, .laporan-daily-wrong-store-modal__body, .laporan-daily-wrong-store-modal__foot { padding-left: 15px; padding-right: 15px; }.laporan-daily-wrong-store-modal__list article { grid-template-columns: 1fr; }.laporan-daily-wrong-store-modal__list strong { grid-column: 1; } }
.laporan-daily-wrong-store-card__rows { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; }
.laporan-daily-wrong-store-card__rows div { min-width: 0; padding: 7px 8px; border: 1px solid #fbcad2; border-radius: 9px; background: rgba(255, 255, 255, .72); }
.laporan-daily-wrong-store-card__rows b { overflow: hidden; color: #9f1239; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 980px) { .laporan-daily-wrong-store-card__rows { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 620px) { .laporan-daily-wrong-store-card__rows { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.laporan-export-btn,
.laporan-filter button {
    border: 0;
    border-radius: 16px;
    min-height: 46px;
    padding: 11px 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: linear-gradient(135deg, #16a34a, #06b6d4);
    color: #fff;
    font-weight: 900;
    text-decoration: none;
    box-shadow: 0 14px 28px rgba(22, 163, 74, 0.2);
    cursor: pointer;
}

.laporan-export-btn svg {
    width: 18px;
    height: 18px;
}

.laporan-export-btn__icon,
.laporan-export-btn__text,
.laporan-export-btn__timer {
    display: inline-flex;
    align-items: center;
}

.laporan-export-btn__spinner {
    display: none;
    width: 18px;
    height: 18px;
    border: 3px solid rgba(255, 255, 255, 0.34);
    border-top-color: #fff;
    border-radius: 999px;
    animation: laporanSpin 0.78s linear infinite;
}

.laporan-export-btn__timer {
    min-width: 56px;
    justify-content: flex-start;
    opacity: 0.9;
    font-size: 12px;
    font-weight: 900;
}

.laporan-export-btn.is-loading .laporan-export-btn__icon--download {
    display: none;
}

.laporan-export-btn.is-loading .laporan-export-btn__spinner {
    display: inline-flex;
}

.laporan-export-btn.is-loading,
.laporan-filter.is-loading button {
    opacity: 0.72;
    cursor: wait;
}

.laporan-filter {
    padding: 12px 14px;
    display: grid;
    grid-template-columns: minmax(145px, 185px) minmax(145px, 185px) minmax(180px, 250px);
    justify-content: end;
    gap: 9px 10px;
    align-items: end;
    border: 1px solid #d9e7f4;
    border-radius: 18px;
    background: linear-gradient(135deg, #f8fbff, #f0fdfa);
}

.laporan-period-filter {
    display: flex;
    grid-column: 1 / -1;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
    padding: 0 2px;
}

.laporan-period-filter__radios {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 14px;
    align-items: center;
    justify-content: flex-end;
    width: 100%;
}

.laporan-period-filter__radios label {
    display: inline-flex !important;
    flex-flow: row nowrap;
    align-items: center;
    gap: 4px;
    min-height: 20px;
    color: #12304f;
    font-size: 11px;
    font-weight: 500;
    cursor: pointer;
}

.laporan-filter .laporan-period-filter__radios input {
    appearance: none;
    width: 10px;
    height: 10px;
    min-height: 10px;
    min-width: 10px;
    padding: 0;
    margin: 0;
    border: 1.5px solid #94a3b8;
    border-radius: 50%;
    background: #ffffff;
    cursor: pointer;
    flex: 0 0 10px;
    order: 0;
}

.laporan-period-filter__radios label > span {
    white-space: nowrap;
    order: 1;
    font-weight: 400 !important;
}

.laporan-filter .laporan-period-filter__radios input:checked {
    border-color: #16a34a;
    background: radial-gradient(circle, #16a34a 0 42%, #ffffff 47% 100%);
}

.laporan-admin-direct {
    display: inline-flex !important;
    grid-auto-flow: column;
    align-items: center;
    gap: 6px !important;
    min-height: 26px;
    padding: 3px 9px;
    border-radius: 999px;
    color: #14532d !important;
    background: #dcfce7;
    cursor: pointer;
}

.laporan-export-options {
    grid-column: 1 / -1;
    justify-self: end;
    display: flex;
    align-items: center;
    gap: 7px;
}

.laporan-daily-options {
    display: flex;
    align-items: center;
}

.laporan-daily-options[hidden] {
    display: none !important;
}

.laporan-daily-wrong-store-options {
}

.laporan-daily-wrong-store-options[hidden] {
    display: none !important;
}

.laporan-daily-wrong-store-options label {
    display: grid;
    gap: 3px;
    color: #9f1239;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.laporan-daily-wrong-store-options select {
    min-height: 29px;
    padding: 0 9px;
    border: 1px solid #f5b7c3;
    border-radius: 9px;
    color: #9f1239;
    background: #fff7f8;
    font: inherit;
    font-size: 10px;
    font-weight: 800;
}

.laporan-daily-all-stores {
    color: #1e3a8a !important;
    background: #dbeafe;
}

.laporan-daily-inline-controls .laporan-daily-all-stores input {
    border-color: #3b82f6;
}

.laporan-daily-inline-controls .laporan-daily-all-stores input:checked {
    border-color: #2563eb;
    background: #2563eb;
    box-shadow: inset 0 0 0 2px #dbeafe;
}

.laporan-export-options[hidden] {
    display: none !important;
}

.laporan-rekap-special {
    color: #1e40af !important;
    background: #dbeafe;
}

.laporan-filter .laporan-rekap-special input {
    border-color: #3b82f6;
}

.laporan-filter .laporan-rekap-special input:checked {
    border-color: #2563eb;
    background: #2563eb;
    box-shadow: inset 0 0 0 2px #dbeafe;
}

.laporan-admin-direct[hidden] {
    display: none !important;
}

.laporan-filter .laporan-admin-direct input {
    appearance: none;
    width: 13px;
    min-width: 13px;
    height: 13px;
    min-height: 13px;
    margin: 0;
    padding: 0;
    border: 1.5px solid #22c55e;
    border-radius: 4px;
    background: #ffffff;
    cursor: pointer;
}

.laporan-filter .laporan-admin-direct input:checked {
    border-color: #16a34a;
    background: #16a34a;
    box-shadow: inset 0 0 0 2px #dcfce7;
}

.laporan-admin-direct span {
    white-space: nowrap;
    font-size: 11px;
    font-weight: 700;
}


.laporan-filter label {
    display: grid;
    gap: 4px;
    color: #475569;
    font-size: 13px;
    font-weight: 900;
}

.laporan-filter input,
.laporan-filter select {
    width: 100%;
    min-height: 38px;
    border: 1px solid #cbd5e1;
    border-radius: 14px;
    padding: 7px 10px;
    background: #fff;
    color: #0f172a;
    font: inherit;
    font-weight: 800;
}

.laporan-filter select:disabled {
    color: #334155;
    background: #eef4f8;
    cursor: not-allowed;
    opacity: 1;
}

.laporan-summary-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 12px;
}

.laporan-monthly-summary-card {
    padding: 18px;
    overflow: hidden;
}

.laporan-monthly-summary-card__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 14px;
}

.laporan-monthly-summary-card__head h2 {
    margin: 4px 0 0;
    color: #0f172a;
    font-size: 21px;
}

.laporan-monthly-summary-card__head > small {
    color: #64748b;
    font-size: 12px;
    font-weight: 800;
}

.laporan-monthly-summary-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr);
    gap: 16px;
}

.laporan-monthly-summary-list,
.laporan-monthly-summary-side {
    display: grid;
    align-content: start;
    gap: 7px;
}

.laporan-monthly-summary-row,
.laporan-monthly-summary-block > div {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    min-height: 32px;
    border-bottom: 1px solid #e2e8f0;
    padding: 5px 8px;
}

.laporan-monthly-summary-row span,
.laporan-monthly-summary-block span {
    color: #334155;
    font-size: 12px;
    font-weight: 700;
}

.laporan-monthly-summary-row strong,
.laporan-monthly-summary-block strong {
    color: #0f172a;
    font-size: 13px;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.laporan-monthly-summary-row.is-primary,
.laporan-monthly-summary-row.is-result {
    border-radius: 10px;
    background: rgba(37, 99, 235, .08);
}

.laporan-monthly-summary-row.is-result {
    border-bottom-color: rgba(22, 163, 74, .25);
    background: rgba(22, 163, 74, .1);
}

.laporan-monthly-summary-block {
    border: 1px solid #dbe7f3;
    border-radius: 14px;
    padding: 6px;
    background: #f8fbff;
}

.laporan-monthly-summary-block--commission > div {
    grid-template-columns: minmax(0, 1fr) 62px auto;
}

.laporan-monthly-summary-block small {
    color: #2563eb;
    font-size: 11px;
    font-weight: 900;
    text-align: right;
}

.laporan-monthly-summary-block > div.is-total {
    border-bottom: 0;
    border-top: 2px solid #0f172a;
}

.laporan-monthly-ku {
    border-radius: 12px;
    padding: 11px 12px;
    background: linear-gradient(135deg, rgba(37, 99, 235, .1), rgba(6, 182, 212, .09));
    color: #0f172a;
    font-size: 12px;
    font-weight: 900;
}

.laporan-belum-cair-card {
    padding: 16px 18px;
    border-color: #f4d68a;
    background:
        linear-gradient(135deg, rgba(255, 251, 235, .96), rgba(255, 255, 255, .98)),
        repeating-linear-gradient(135deg, transparent 0 18px, rgba(245, 158, 11, .05) 18px 19px);
}

.laporan-belum-cair-card__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 10px;
}

.laporan-belum-cair-card__head h2 {
    margin: 3px 0 0;
    color: #7c2d12;
    font-size: 18px;
}

.laporan-belum-cair-card__head > span {
    border-radius: 999px;
    padding: 5px 10px;
    background: #fef3c7;
    color: #92400e;
    font-size: 11px;
    font-weight: 900;
    white-space: nowrap;
}

.laporan-belum-cair-list {
    display: grid;
    gap: 5px;
}

.laporan-belum-cair-list article {
    display: grid;
    grid-template-columns: minmax(170px, .3fr) minmax(0, 1fr) auto;
    gap: 12px;
    align-items: start;
    border-top: 1px solid rgba(180, 83, 9, .15);
    padding: 8px 4px 3px;
}

.laporan-belum-cair-list strong {
    color: #0f172a;
    font-size: 12px;
    overflow-wrap: anywhere;
}

.laporan-belum-cair-list span {
    color: #475569;
    font-size: 12px;
    line-height: 1.45;
    white-space: pre-wrap;
}

.laporan-belum-cair-list__actions {
    align-self: center;
    flex-wrap: nowrap;
}

.laporan-belum-cair-list__actions button:disabled {
    cursor: not-allowed;
    opacity: .45;
}

.laporan-detail-launchers {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.laporan-detail-launcher {
    position: relative;
    display: grid;
    gap: 5px;
    min-width: 0;
    border: 1px solid rgba(37, 99, 235, .16);
    padding: 15px 16px;
    overflow: hidden;
    color: #0f172a;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.laporan-detail-launcher::after {
    content: "";
    position: absolute;
    right: -30px;
    bottom: -48px;
    width: 105px;
    height: 105px;
    border-radius: 50%;
    background: rgba(37, 99, 235, .1);
}

.laporan-detail-launcher--withdrawal::after { background: rgba(22, 163, 74, .13); }
.laporan-detail-launcher--admin::after { background: rgba(245, 158, 11, .14); }
.laporan-detail-launcher:hover { transform: translateY(-2px); border-color: rgba(37, 99, 235, .42); }
.laporan-detail-launcher span { color: #2563eb; font-size: 11px; font-weight: 900; letter-spacing: .08em; }
.laporan-detail-launcher strong { position: relative; z-index: 1; font-size: 20px; }
.laporan-detail-launcher small { position: relative; z-index: 1; color: #64748b; font-weight: 700; }

.laporan-monthly-modal {
    width: min(820px, calc(100vw - 28px));
    max-width: none;
    max-height: min(88vh, 820px);
    border: 0;
    border-radius: 22px;
    padding: 0;
    overflow: hidden;
    background: #ffffff;
    color: #0f172a;
    box-shadow: 0 28px 80px rgba(15, 23, 42, .28);
}

.laporan-monthly-modal[open] { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; }
.laporan-monthly-modal::backdrop { background: rgba(15, 23, 42, .62); }
.laporan-monthly-modal__head,
.laporan-monthly-modal__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    border-bottom: 1px solid #e2e8f0;
    padding: 15px 18px;
    background: #fff;
}

.laporan-monthly-modal__head h2 { margin: 3px 0 0; font-size: 21px; }
.laporan-monthly-modal__head > button {
    width: 38px;
    height: 38px;
    border: 1px solid #cbd5e1;
    border-radius: 12px;
    background: #f8fafc;
    color: #334155;
    font-size: 24px;
    cursor: pointer;
}

.laporan-monthly-modal__body { min-height: 0; overflow: auto; padding: 14px; }
.laporan-monthly-modal__body .laporan-panel { border: 0; padding: 4px; box-shadow: none; }
.laporan-monthly-modal__body .laporan-mini-list,
.laporan-monthly-modal__body .laporan-withdrawal-list { max-height: none; overflow: visible; }
.laporan-monthly-modal__foot { justify-content: flex-end; border-top: 1px solid #e2e8f0; border-bottom: 0; }
.laporan-monthly-modal__foot button {
    min-height: 38px;
    border: 0;
    border-radius: 12px;
    padding: 8px 16px;
    background: #2563eb;
    color: #fff;
    font: inherit;
    font-weight: 900;
    cursor: pointer;
}

.laporan-stat {
    min-height: 126px;
    padding: 13px 14px;
    display: grid;
    gap: 6px;
    overflow: hidden;
    position: relative;
}

.laporan-stat::after {
    content: "";
    position: absolute;
    inset: auto -28px -42px auto;
    width: 92px;
    height: 92px;
    border-radius: 999px;
    background: rgba(37, 99, 235, 0.08);
}

.laporan-stat span,
.laporan-panel__head span {
    color: #64748b;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.laporan-stat strong {
    color: #0f172a;
    font-size: clamp(22px, 2.2vw, 28px);
    line-height: 1;
    letter-spacing: -0.04em;
}

.laporan-stat small {
    color: #64748b;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.25;
}

.laporan-stat-breakdown {
    display: grid;
    gap: 5px;
    margin-top: 2px;
    position: relative;
    z-index: 1;
}

.laporan-stat-breakdown div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 5px 7px;
    border-radius: 10px;
    background: rgba(22, 163, 74, 0.08);
}

.laporan-stat-breakdown span {
    overflow: hidden;
    color: #166534;
    font-size: 11px;
    letter-spacing: 0;
    text-overflow: ellipsis;
    text-transform: none;
    white-space: nowrap;
}

.laporan-stat-breakdown strong {
    color: #166534;
    font-size: 12px;
    letter-spacing: 0;
    white-space: nowrap;
}

.laporan-stat--blue::after {
    background: rgba(37, 99, 235, 0.12);
}

.laporan-stat--cyan::after {
    background: rgba(6, 182, 212, 0.14);
}

.laporan-stat--green::after {
    background: rgba(22, 163, 74, 0.14);
}

.laporan-stat--orange::after {
    background: rgba(245, 158, 11, 0.16);
}

.laporan-stat--red::after {
    background: rgba(220, 38, 38, 0.14);
}

.laporan-stat--indigo::after {
    background: rgba(79, 70, 229, 0.14);
}

.laporan-stat--violet::after {
    background: rgba(147, 51, 234, 0.14);
}

.laporan-panels {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.laporan-panels--three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.laporan-panels--four {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.laporan-panels--single {
    grid-template-columns: minmax(0, 1fr);
}

.laporan-panel,
.laporan-table-card {
    padding: 18px;
}

.laporan-panel__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.laporan-panel__actions {
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
    align-items: center;
}

.laporan-mark-withdrawal-btn {
    min-height: 28px;
    border: 1px solid rgba(22, 163, 74, 0.34);
    border-radius: 999px;
    padding: 5px 9px;
    background: rgba(22, 163, 74, 0.1);
    color: #166534;
    font: inherit;
    font-size: 11px;
    font-weight: 900;
    cursor: pointer;
}

.laporan-mark-withdrawal-btn:hover {
    background: #16a34a;
    color: #ffffff;
}

.laporan-mark-withdrawal-btn.is-marked,
.laporan-mark-withdrawal-btn.is-marked:hover {
    border-color: #cbd5e1;
    background: #e2e8f0;
    color: #475569;
}

.laporan-mark-withdrawal-btn:disabled {
    opacity: 0.62;
    cursor: wait;
}

.laporan-mark-withdrawal-btn--row {
    justify-self: end;
    min-height: 24px;
    padding: 4px 8px;
    font-size: 10px;
}

.laporan-period-status {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: -4px 0 10px;
}

.laporan-period-status span {
    display: inline-flex;
    min-height: 24px;
    align-items: center;
    border-radius: 999px;
    padding: 5px 8px;
    background: #fff7ed;
    color: #b45309;
    font-size: 11px;
    font-weight: 900;
}

.laporan-period-status span.is-marked {
    background: #dcfce7;
    color: #166534;
}

.laporan-panel__head h2 {
    margin: 0;
    font-size: 18px;
}

.laporan-panel-note {
    margin: 4px 0 0;
    color: #64748b;
    font-weight: 800;
}

.laporan-mini-list {
    display: grid;
    gap: 8px;
    max-height: 360px;
    overflow: auto;
    padding-right: 4px;
}

.laporan-mini-row {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    padding: 10px 12px;
    border: 1px solid #d7e6f5;
    border-radius: 14px;
    background: #f8fbff;
}

.laporan-mini-row div {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.laporan-mini-row strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.laporan-mini-row small {
    color: #64748b;
    font-weight: 800;
}

.laporan-mini-row span {
    color: #0f172a;
    font-weight: 900;
    white-space: nowrap;
}

.laporan-payment-row {
    background:
        linear-gradient(90deg, rgba(22, 163, 74, 0.08), transparent 36%),
        #f8fbff;
}

.laporan-payment-amounts {
    display: grid;
    gap: 3px;
    justify-items: end;
    text-align: right;
}

.laporan-payment-amounts small {
    color: #b45309;
    font-size: 11px;
    font-weight: 900;
    white-space: nowrap;
}

.laporan-payment-row--danger {
    background:
        linear-gradient(90deg, rgba(220, 38, 38, 0.08), transparent 36%),
        #fffafa;
}

.laporan-payment-row--danger .laporan-payment-amounts span {
    color: #991b1b;
}

.laporan-payment-row--danger .laporan-payment-amounts small {
    color: #b91c1c;
}

.laporan-payment-row--warning {
    background:
        linear-gradient(90deg, rgba(245, 158, 11, 0.14), transparent 36%),
        #fffbeb;
}

.laporan-payment-row--warning .laporan-payment-amounts span {
    color: #b45309;
}

.laporan-payment-row--warning .laporan-payment-amounts small {
    color: #92400e;
}

.laporan-admin-row {
    background:
        linear-gradient(90deg, rgba(245, 158, 11, 0.1), transparent 38%),
        #f8fbff;
}

.laporan-admin-row span {
    color: #b45309;
}

.laporan-admin-list {
    max-height: none;
    overflow: visible;
    padding-right: 0;
}

.laporan-admin-total {
    background: rgba(245, 158, 11, 0.12);
    color: #92400e;
}

.laporan-withdrawal-panel {
    padding: 18px;
}

.laporan-withdrawal-list {
    display: grid;
    gap: 8px;
    max-height: 420px;
    overflow: auto;
    padding-right: 4px;
}

.laporan-withdrawal-row {
    display: grid;
    grid-template-columns: minmax(145px, 0.82fr) minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
    padding: 9px 10px;
    border: 1px solid #d7e6f5;
    border-radius: 14px;
    background:
        linear-gradient(90deg, rgba(22, 163, 74, 0.08), transparent 36%),
        #f8fbff;
}

.laporan-withdrawal-row.is-marked {
    border-color: rgba(22, 163, 74, 0.56);
    background:
        linear-gradient(90deg, rgba(22, 163, 74, 0.16), transparent 42%),
        #f0fdf4;
}

.laporan-withdrawal-date,
.laporan-withdrawal-store,
.laporan-withdrawal-amount {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.laporan-withdrawal-row span,
.laporan-withdrawal-row small {
    color: #64748b;
    font-size: 11px;
    font-weight: 900;
}

.laporan-withdrawal-row strong {
    overflow: hidden;
    color: #0f172a;
    font-size: 13px;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.laporan-withdrawal-amount {
    text-align: right;
    min-width: 112px;
}

.laporan-withdrawal-amount strong {
    color: #16a34a;
    font-size: 14px;
    font-variant-numeric: tabular-nums;
}

.laporan-withdrawal-total {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin-top: 10px;
    padding: 10px 12px;
    border-radius: 14px;
    background: rgba(22, 163, 74, 0.1);
    color: #166534;
    flex-wrap: wrap;
    font-weight: 900;
}

.laporan-withdrawal-total span {
    font-size: 12px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.laporan-withdrawal-total strong {
    font-size: 16px;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.laporan-withdrawal-total small {
    width: 100%;
    color: inherit;
    font-size: 12px;
    font-weight: 900;
    text-align: right;
}

.laporan-table-wrap {
    overflow: auto;
}

.laporan-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 8px;
    min-width: 980px;
}

.laporan-table th {
    padding: 0 12px 4px;
    color: #64748b;
    font-size: 12px;
    font-weight: 900;
    text-align: left;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.laporan-table td {
    padding: 12px;
    background: #f8fbff;
    border-top: 1px solid #d7e6f5;
    border-bottom: 1px solid #d7e6f5;
    font-weight: 800;
}

.laporan-table td:first-child {
    border-left: 1px solid #d7e6f5;
    border-radius: 14px 0 0 14px;
}

.laporan-table td:last-child {
    border-right: 1px solid #d7e6f5;
    border-radius: 0 14px 14px 0;
}

.laporan-table td:nth-child(4),
.laporan-table td:nth-child(5),
.laporan-table td:nth-child(6),
.laporan-table td:nth-child(7),
.laporan-table td:nth-child(8) {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.laporan-table .is-minus {
    color: #dc2626;
}

.laporan-table .is-plus {
    color: #16a34a;
}

.laporan-check-summary {
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 0;
}

.laporan-check-summary-groups { display: grid; gap: 12px; margin-bottom: 14px; }
.laporan-check-summary-group { display: grid; gap: 7px; }
.laporan-check-summary-group__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 3px; }
.laporan-check-summary-group__head strong { color: #183153; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
.laporan-check-summary-group__head span { color: #718096; font-size: 10px; }
.laporan-check-summary--result { grid-template-columns: repeat(5, minmax(0, 1fr)); width: 100%; max-width: none; }

.laporan-check-summary .laporan-stat--blue { background: linear-gradient(145deg, #fff 56%, #eff6ff); }
.laporan-check-summary .laporan-stat--green { background: linear-gradient(145deg, #fff 56%, #ecfdf5); }
.laporan-check-summary .laporan-stat--red { background: linear-gradient(145deg, #fff 56%, #fef2f2); }
.laporan-check-summary .laporan-stat--orange { background: linear-gradient(145deg, #fff 56%, #fff7ed); }
.laporan-check-summary .laporan-stat--indigo { background: linear-gradient(145deg, #fff 56%, #eef2ff); }
.laporan-check-summary .laporan-stat--cyan { background: linear-gradient(145deg, #fff 56%, #ecfeff); }
.laporan-check-summary .laporan-stat--violet { background: linear-gradient(145deg, #fff 56%, #faf5ff); }

.laporan-check-summary .laporan-stat {
    min-height: 68px;
    padding: 9px 11px;
    align-content: center;
    gap: 5px;
}

.laporan-check-summary .laporan-stat span {
    font-size: 10px;
}

.laporan-check-summary .laporan-stat strong {
    font-size: clamp(19px, 1.8vw, 24px);
    font-weight: 700;
}

.laporan-check-summary .laporan-stat small {
    font-size: 10px;
    font-weight: 500;
}

.laporan-check-summary__button {
    width: 100%;
    border: 1px solid #d7e6f5;
    text-align: left;
    cursor: pointer;
    font: inherit;
    transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.laporan-check-summary__button:hover {
    border-color: #60a5fa;
    transform: translateY(-1px);
}

.laporan-check-summary__button.is-selected {
    border-color: #2563eb;
    box-shadow: inset 0 0 0 1px #2563eb, 0 8px 18px rgba(37, 99, 235, 0.14);
}

.laporan-check-summary__button.is-processing::before {
    content: "";
    position: absolute;
    z-index: 2;
    top: 10px;
    right: 10px;
    width: 15px;
    height: 15px;
    border: 2px solid rgba(37, 99, 235, 0.2);
    border-top-color: #2563eb;
    border-radius: 50%;
    animation: laporan-card-processing-spin 700ms linear infinite;
}

@keyframes laporan-card-processing-spin {
    to { transform: rotate(360deg); }
}

.laporan-check-summary__button:focus-visible {
    outline: 3px solid rgba(37, 99, 235, 0.28);
    outline-offset: 2px;
}
.laporan-check-table .is-missing { color: #dc2626; font-weight: 600; }

.laporan-check-table-card {
    min-width: 0;
    overflow: hidden;
}

.laporan-check-table-card .laporan-table-wrap {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
    overflow-y: hidden;
    overscroll-behavior-inline: contain;
}

.laporan-check-toolbar {
    display: flex;
    justify-content: flex-end;
    padding: 0 14px 10px;
}

.laporan-check-search {
    display: flex;
    align-items: center;
    gap: 8px;
    width: min(390px, 100%);
    min-height: 38px;
    padding: 0 12px;
    border: 1px solid #cbdced;
    border-radius: 12px;
    background: #fff;
    color: #64748b;
    transition: border-color 140ms ease, box-shadow 140ms ease;
}

.laporan-check-search:focus-within {
    border-color: #60a5fa;
    box-shadow: 0 0 0 3px rgba(96, 165, 250, .16);
}

.laporan-check-search svg {
    width: 17px;
    height: 17px;
    flex: 0 0 auto;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
}

.laporan-check-search input {
    width: 100%;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: #1e293b;
    font: inherit;
    font-size: 12px;
}

.laporan-check-table {
    width: 100%;
    min-width: 0;
    table-layout: fixed;
}

.laporan-check-table th {
    padding: 0 8px 3px;
    font-size: 10px;
    font-weight: 700;
}

.laporan-check-table th:nth-child(1) { width: 18%; }
.laporan-check-table th:nth-child(2) { width: 22%; }
.laporan-check-table th:nth-child(3) { width: 18%; }
.laporan-check-table th:nth-child(4) { width: 13%; }
.laporan-check-table th:nth-child(5) { width: 12%; }
.laporan-check-table th:nth-child(6) { width: 17%; }

.laporan-check-table td {
    padding: 8px 9px;
    font-size: 12px;
    font-weight: 400;
    vertical-align: middle;
}

.laporan-check-table td:nth-child(3),
.laporan-check-table td:nth-child(4),
.laporan-check-table td:nth-child(5) {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.laporan-check-table tbody tr[data-laporan-check-row] {
    cursor: pointer;
}

.laporan-check-table tbody tr[data-laporan-check-row] > td {
    transition: background-color .18s ease, box-shadow .18s ease;
}

.laporan-check-table tbody tr[data-laporan-check-row].is-selected > td {
    background-color: rgba(34, 197, 94, .12) !important;
    box-shadow: inset 0 1px 0 rgba(22, 163, 74, .24), inset 0 -1px 0 rgba(22, 163, 74, .24);
}

.laporan-check-table tbody tr[data-laporan-check-row].is-selected > td:first-child {
    box-shadow: inset 4px 0 0 #22c55e, inset 0 1px 0 rgba(22, 163, 74, .24), inset 0 -1px 0 rgba(22, 163, 74, .24);
}

.laporan-check-table tr.has-recorded-note > td {
    border-top-color: #f59e0b;
    border-bottom-color: #f59e0b;
}

.laporan-check-table tr.has-recorded-note > td:first-child {
    border-left: 1px solid #f59e0b;
    border-radius: 10px 0 0 10px;
}

.laporan-check-table tr.has-recorded-note > td:last-child {
    border-right: 1px solid #f59e0b;
    border-radius: 0 10px 10px 0;
}

.laporan-check-stack {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.laporan-check-stack span {
    overflow: hidden;
    color: #1e293b;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.laporan-check-stack small {
    overflow: hidden;
    color: #64748b;
    font-size: 10px;
    font-weight: 400;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.laporan-check-nota-meta {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
}

.laporan-check-nota-meta > span {
    min-width: 0;
    overflow: hidden;
    color: #64748b;
    font-size: 10px;
    font-weight: 400;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.laporan-check-nota-status {
    flex: 0 1 auto;
    overflow: hidden;
    max-width: 44%;
    padding: 2px 6px;
    border-radius: 999px;
    background: #e0f2fe;
    color: #0369a1;
    font-size: 9px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.laporan-check-stack--number span { font-weight: 600; }
.laporan-check-stack--number small { font-variant-numeric: tabular-nums; }

.laporan-check-admin-values { gap: 4px; }
.laporan-check-admin-values > small { overflow: visible; text-overflow: clip; }
.laporan-check-admin-value { display: grid; grid-template-columns: 17px 58px minmax(66px, 1fr); align-items: center; gap: 4px; min-width: 0; overflow: visible !important; text-overflow: clip !important; }
.laporan-check-admin-value .laporan-admin-source-badge { margin-right: 0; }
.laporan-check-admin-date { color: #64748b; font-size: 9px; font-weight: 500 !important; white-space: nowrap; }
.laporan-check-admin-amount { justify-self: end; overflow: visible !important; font-variant-numeric: tabular-nums; text-overflow: clip !important; white-space: nowrap; }

.laporan-check-difference span,
.laporan-check-difference small {
    font-weight: 400;
}

.laporan-check-difference .is-emphasized {
    font-weight: 800;
}

.laporan-check-invoice {
    display: flex;
    align-items: center;
    gap: 6px;
}

.laporan-check-invoice > span {
    min-width: 0;
    flex: 1 1 auto;
    color: inherit;
    font-size: inherit;
    font-weight: inherit;
}

.laporan-copy-value {
    display: inline-block;
    max-width: 100%;
    border-radius: 5px;
    cursor: copy;
    transition: background-color 140ms ease, box-shadow 140ms ease, color 140ms ease;
}

.laporan-copy-value:hover {
    background: #dbeafe;
    box-shadow: 0 0 0 3px #dbeafe;
    color: #1d4ed8;
}

.laporan-copy-value.is-copied {
    background: #dcfce7;
    box-shadow: 0 0 0 3px #dcfce7;
    color: #15803d;
}

.laporan-check-status-ol {
    flex: 0 1 auto;
    overflow: hidden;
    max-width: 48%;
    padding: 2px 6px;
    border-radius: 999px;
    background: #dcfce7;
    color: #15803d;
    font-size: 9px;
    font-style: normal;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.laporan-check-status-ol.is-empty {
    background: #f1f5f9;
    color: #94a3b8;
}

.laporan-check-detail-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 31px;
    height: 31px;
    min-height: 31px;
    padding: 0;
    border: 1px solid #c4b5fd;
    border-radius: 9px;
    background: #f5f3ff;
    color: #6d28d9;
    font: inherit;
    font-size: 10px;
    font-weight: 700;
    cursor: pointer;
}

.laporan-check-detail-btn:hover {
    border-color: #8b5cf6;
    background: #ede9fe;
}

.laporan-check-detail-btn.is-loading {
    cursor: wait;
}

.laporan-check-detail-btn.is-loading svg {
    display: none;
}

.laporan-check-detail-btn.is-loading::before {
    content: "";
    width: 13px;
    height: 13px;
    border: 2px solid rgba(109, 40, 217, 0.2);
    border-top-color: #6d28d9;
    border-radius: 50%;
    animation: laporan-card-processing-spin 700ms linear infinite;
}

.laporan-check-row-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 3px;
    min-width: 0;
}

.laporan-check-row-actions button {
    flex: 0 0 auto;
    white-space: nowrap;
}

.laporan-check-action-tip {
    display: inline-flex;
}

.laporan-check-row-actions svg {
    width: 15px;
    height: 15px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.laporan-check-note-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 31px;
    height: 31px;
    min-height: 31px;
    padding: 0;
    border: 1px solid #bbf7d0;
    border-radius: 9px;
    background: #f0fdf4;
    color: #15803d;
    font: inherit;
    font-size: 10px;
    font-weight: 700;
    cursor: pointer;
}

.laporan-check-note-btn:hover {
    border-color: #4ade80;
    background: #dcfce7;
}

.laporan-check-manual-note-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 31px;
    height: 31px;
    min-height: 31px;
    padding: 0;
    border: 1px solid #bae6fd;
    border-radius: 9px;
    background: #fff;
    color: #64748b;
    cursor: pointer;
}

.laporan-check-manual-note-btn:hover {
    border-color: #38bdf8;
    background: #e0f2fe;
    color: #2563eb;
}

.laporan-check-manual-note-btn.has-content {
    color: #2563eb;
}

.laporan-check-manual-note-btn svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.laporan-check-manual-note-btn.has-content::after {
    content: "";
    position: absolute;
    top: -3px;
    right: -3px;
    width: 8px;
    height: 8px;
    border: 2px solid #fff;
    border-radius: 50%;
    background: #16a34a;
    box-shadow: 0 1px 3px rgba(15, 23, 42, .25);
}

.appku-nota-cancel-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    min-height: 32px;
    padding: 0;
    border: 1px solid #fecaca;
    border-radius: 9px;
    background: #fff1f2;
    color: #dc2626;
    cursor: pointer;
}

.appku-nota-cancel-btn:hover:not(:disabled) {
    border-color: #f87171;
    background: #fee2e2;
}

.appku-nota-cancel-btn.is-restore {
    border-color: #bbf7d0;
    background: #f0fdf4;
    color: #15803d;
}

.appku-nota-cancel-btn.is-restore:hover:not(:disabled) {
    border-color: #4ade80;
    background: #dcfce7;
}

.appku-nota-cancel-btn:disabled {
    border-color: #e2e8f0;
    background: #f1f5f9;
    color: #94a3b8;
    cursor: not-allowed;
}

.appku-nota-cancel-btn svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.appku-nota-cancel-icon {
    display: inline-flex;
}

.appku-nota-cancel-icon.is-restore,
.appku-nota-cancel-btn.is-restore .appku-nota-cancel-icon.is-cancel {
    display: none;
}

.appku-nota-cancel-btn.is-restore .appku-nota-cancel-icon.is-restore {
    display: inline-flex;
}

.appku-nota-cancel-spinner {
    width: 13px;
    height: 13px;
    border: 2px solid rgba(220, 38, 38, .22);
    border-top-color: currentColor;
    border-radius: 50%;
    animation: laporanSpin .75s linear infinite;
}

.laporan-check-row-actions button {
    width: 28px;
    height: 28px;
    min-height: 28px;
    border-radius: 8px;
}

.laporan-check-row-actions .appku-nota-cancel-btn {
    width: 32px;
    height: 32px;
    min-height: 32px;
    border-radius: 9px;
}

:root[data-theme="dark"] .laporan-check-search {
    border-color: #475569;
    background: #111827;
}

:root[data-theme="dark"] .laporan-check-search input { color: #e2e8f0; }

:root[data-theme="dark"] .appku-nota-cancel-btn {
    border-color: rgba(248, 113, 113, .38);
    background: rgba(220, 38, 38, .14);
    color: #fca5a5;
}

:root[data-theme="dark"] .appku-nota-cancel-btn.is-restore {
    border-color: rgba(74, 222, 128, .34);
    background: rgba(22, 163, 74, .16);
    color: #bbf7d0;
}

.laporan-check-note-btn:disabled {
    border-color: #e2e8f0;
    background: #f1f5f9;
    color: #94a3b8;
    cursor: not-allowed;
}

.laporan-check-action-tip.has-note .laporan-check-note-btn:disabled { opacity: 1; }

:root[data-theme="dark"] .laporan-check-note-btn {
    border-color: rgba(74, 222, 128, .34);
    background: rgba(22, 163, 74, .16);
    color: #bbf7d0;
}

:root[data-theme="dark"] .laporan-check-note-btn:disabled {
    border-color: #334155;
    background: rgba(51, 65, 85, .5);
    color: #94a3b8;
}

:root[data-theme="dark"] .laporan-check-action-tip.has-note .laporan-check-note-btn:disabled { opacity: 1; }

:root[data-theme="dark"] .laporan-check-table tr.has-recorded-note > td {
    border-top-color: #d97706;
    border-bottom-color: #d97706;
}

:root[data-theme="dark"] .laporan-check-table tr.has-recorded-note > td:first-child { border-left-color: #d97706; }
:root[data-theme="dark"] .laporan-check-table tr.has-recorded-note > td:last-child { border-right-color: #d97706; }

:root[data-theme="dark"] .laporan-check-table tbody tr[data-laporan-check-row].is-selected > td {
    background-color: rgba(34, 197, 94, .17) !important;
    box-shadow: inset 0 1px 0 rgba(74, 222, 128, .3), inset 0 -1px 0 rgba(74, 222, 128, .3);
}

:root[data-theme="dark"] .laporan-check-table tbody tr[data-laporan-check-row].is-selected > td:first-child {
    box-shadow: inset 4px 0 0 #4ade80, inset 0 1px 0 rgba(74, 222, 128, .3), inset 0 -1px 0 rgba(74, 222, 128, .3);
}

.laporan-check-manual-note-modal {
    width: min(620px, calc(100vw - 28px));
    max-width: none;
    padding: 0;
    border: 0;
    border-radius: 20px;
    background: #fff;
    color: #0f172a;
    box-shadow: 0 28px 80px rgba(15, 23, 42, .3);
    overflow: hidden;
}

.laporan-check-manual-note-modal::backdrop {
    background: rgba(15, 23, 42, .62);
    backdrop-filter: blur(4px);
}

.laporan-check-manual-note-modal__head,
.laporan-check-manual-note-modal__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 20px;
}

.laporan-check-manual-note-modal__head { border-bottom: 1px solid #e2e8f0; }
.laporan-check-manual-note-modal__head h2 { margin: 3px 0 0; font-size: 22px; }
.laporan-check-manual-note-modal__head > button {
    width: 38px;
    height: 38px;
    border: 1px solid #d8e3ef;
    border-radius: 12px;
    background: #fff;
    color: #334155;
    font-size: 24px;
    cursor: pointer;
}

.laporan-check-manual-note-modal__body { padding: 18px 20px; }
.laporan-check-manual-note-modal__body label { display: block; margin-bottom: 7px; font-size: 12px; font-weight: 700; }
.laporan-check-manual-note-modal__body textarea {
    width: 100%;
    min-height: 150px;
    padding: 12px 14px;
    border: 1px solid #cbd5e1;
    border-radius: 13px;
    color: #0f172a;
    font: inherit;
    resize: vertical;
}
.laporan-check-manual-note-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 10px;
}
.laporan-check-manual-note-badges button {
    min-height: 28px;
    padding: 4px 10px;
    border: 1px solid #bfdbfe;
    border-radius: 999px;
    background: #eff6ff;
    color: #1d4ed8;
    font: inherit;
    font-size: 10px;
    font-weight: 700;
    cursor: pointer;
    transition: border-color 140ms ease, background-color 140ms ease, transform 140ms ease;
}
.laporan-check-manual-note-badges button:hover {
    border-color: #60a5fa;
    background: #dbeafe;
    transform: translateY(-1px);
}
.laporan-check-manual-note-badges button:disabled {
    border-color: #e2e8f0;
    background: #f8fafc;
    color: #94a3b8;
    cursor: not-allowed;
    transform: none;
}
.laporan-check-manual-note-badges button:focus-visible {
    outline: 3px solid rgba(37, 99, 235, .18);
    outline-offset: 2px;
}
.laporan-check-manual-note-modal__body p { min-height: 18px; margin: 8px 0 0; color: #64748b; font-size: 11px; }
.laporan-check-manual-note-modal__body p.is-error { color: #dc2626; }
.laporan-check-manual-note-modal__footer { justify-content: flex-end; border-top: 1px solid #e2e8f0; background: #f8fafc; }
.laporan-check-manual-note-modal__footer button { min-height: 40px; padding: 0 16px; border-radius: 12px; font: inherit; font-weight: 700; cursor: pointer; }
.laporan-check-manual-note-modal__footer .is-secondary { border: 1px solid #bfdbfe; background: #eff6ff; color: #1d4ed8; }
.laporan-check-manual-note-modal__footer .is-primary { border: 0; background: linear-gradient(135deg, #2563eb, #06b6d4); color: #fff; }
.laporan-check-manual-note-modal__footer .is-primary:disabled { opacity: .65; cursor: wait; }

:root[data-theme="dark"] .laporan-check-manual-note-btn {
    background: #111827;
    color: #94a3b8;
}
:root[data-theme="dark"] .laporan-check-manual-note-btn.has-content { color: #60a5fa; }
:root[data-theme="dark"] .laporan-check-manual-note-btn.has-content::after { border-color: #1e293b; }
:root[data-theme="dark"] .laporan-check-manual-note-badges button {
    border-color: #334155;
    background: #1e293b;
    color: #93c5fd;
}
:root[data-theme="dark"] .laporan-check-manual-note-badges button:hover {
    border-color: #3b82f6;
    background: #1e3a5f;
}
:root[data-theme="dark"] .laporan-check-manual-note-badges button:disabled {
    border-color: #334155;
    background: #111827;
    color: #64748b;
}

.laporan-check-pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 11px 14px;
    border-top: 1px solid #dbe7f3;
    color: #64748b;
    font-size: 10px;
}

.laporan-check-pagination__actions,
.laporan-check-pagination__actions label,
.laporan-check-pagination__actions nav {
    display: flex;
    align-items: center;
}

.laporan-check-pagination__actions {
    gap: 12px;
}

.laporan-check-pagination__actions label {
    gap: 6px;
    white-space: nowrap;
}

.laporan-check-pagination select,
.laporan-check-pagination button {
    min-height: 30px;
    border: 1px solid #cbdced;
    border-radius: 8px;
    background: #fff;
    color: #334155;
    font: inherit;
    font-weight: 600;
}

.laporan-check-pagination select {
    padding: 4px 26px 4px 8px;
}

.laporan-check-pagination__actions nav {
    gap: 4px;
}

.laporan-check-pagination button {
    min-width: 31px;
    padding: 4px 9px;
    cursor: pointer;
}

.laporan-check-pagination button:hover:not(:disabled),
.laporan-check-pagination button.is-active {
    border-color: #2563eb;
    background: #2563eb;
    color: #fff;
}

.laporan-check-pagination button:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

.laporan-check-pagination nav i {
    padding: 0 2px;
    font-style: normal;
}

:root[data-theme="dark"] .laporan-check-pagination {
    border-color: #334155;
}

:root[data-theme="dark"] .laporan-check-pagination select,
:root[data-theme="dark"] .laporan-check-pagination button {
    border-color: #475569;
    background: #111827;
    color: #e2e8f0;
}

:root[data-theme="dark"] .laporan-check-pagination button:hover:not(:disabled),
:root[data-theme="dark"] .laporan-check-pagination button.is-active {
    border-color: #3b82f6;
    background: #2563eb;
    color: #fff;
}

@media (max-width: 760px) {
    .laporan-check-pagination,
    .laporan-check-pagination__actions {
        align-items: stretch;
        flex-direction: column;
    }

    .laporan-check-pagination__actions nav {
        max-width: 100%;
        overflow-x: auto;
    }
}

.appku-copy-toast {
    position: fixed;
    right: 22px;
    bottom: 22px;
    z-index: 12000;
    display: flex;
    align-items: center;
    gap: 11px;
    width: min(390px, calc(100vw - 32px));
    padding: 12px 15px;
    border: 1px solid rgba(55, 226, 255, 0.55);
    border-radius: 16px;
    background: linear-gradient(135deg, #061b55 0%, #075bd7 58%, #00bddd 100%);
    color: #fff;
    box-shadow: 0 18px 42px rgba(3, 38, 112, 0.32);
    opacity: 0;
    transform: translateY(14px) scale(0.98);
    pointer-events: none;
    transition: opacity 0.2s ease, transform 0.2s ease;
}
.appku-copy-toast.is-visible { opacity: 1; transform: none; }
.appku-copy-toast.is-error { border-color: rgba(255, 204, 214, 0.72); background: linear-gradient(135deg, #631233, #b91c4b); }
.appku-copy-toast__icon {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    border-radius: 11px;
    background: rgba(255, 255, 255, 0.18);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.22);
}
.appku-copy-toast__icon svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.appku-copy-toast__content { display: block; min-width: 0; }
.appku-copy-toast__content strong,.appku-copy-toast__content small { display: block; }
.appku-copy-toast__content strong { font-size: 13px; line-height: 1.25; }
.appku-copy-toast__content small { margin-top: 3px; overflow: hidden; color: rgba(255, 255, 255, 0.88); font-size: 11px; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 640px) { .appku-copy-toast { right: 16px; bottom: 16px; } }

.laporan-check-detail-modal {
    height: min(760px, calc(100vh - 32px));
    width: min(1080px, calc(100vw - 32px));
    max-width: none;
    max-height: calc(100vh - 32px);
    padding: 0;
    border: 0;
    border-radius: 20px;
    background: #fff;
    color: #0f172a;
    box-shadow: 0 28px 80px rgba(15, 23, 42, 0.3);
    overflow: hidden;
}

.laporan-check-detail-modal[open] {
    display: flex;
    flex-direction: column;
}

.laporan-check-detail-modal::backdrop {
    background: rgba(15, 23, 42, 0.62);
    backdrop-filter: blur(4px);
}

.laporan-check-detail-modal__head,
.laporan-check-detail-modal__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 18px;
    border-bottom: 1px solid #dbe7f3;
    flex: 0 0 auto;
}

.laporan-check-detail-modal__head h2 {
    margin: 2px 0 0;
    font-size: 20px;
}

.laporan-check-detail-modal__head .laporan-check-detail-close {
    width: 36px;
    height: 36px;
    border: 1px solid #cbd5e1;
    border-radius: 11px;
    background: #fff;
    color: #334155;
    font-size: 25px;
    line-height: 1;
    cursor: pointer;
}

.laporan-check-detail-modal__actions,
.laporan-check-detail-mode {
    display: flex;
    align-items: center;
}

.laporan-check-detail-modal__actions { gap: 10px; }

.laporan-check-detail-mode {
    gap: 3px;
    padding: 3px;
    border: 1px solid #cbd5e1;
    border-radius: 11px;
    background: #f1f5f9;
}

.laporan-check-detail-mode button {
    min-width: 66px;
    padding: 7px 10px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #64748b;
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
}

.laporan-check-detail-mode button.is-active {
    background: #2563eb;
    color: #fff;
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.2);
}

.laporan-check-detail-modal__body {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: minmax(0, 1fr);
    gap: 12px;
    min-height: 0;
    padding: 14px 18px;
    overflow: hidden;
    background: #f8fbff;
    flex: 1 1 auto;
}

.laporan-check-detail-modal__body > section {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    padding: 12px;
    border: 1px solid #dbe7f3;
    border-radius: 14px;
    background: #fff;
    overflow: hidden;
}

.laporan-check-detail-modal__body h3 {
    margin: 0 0 9px;
    color: #1e3a8a;
    font-size: 13px;
}

.laporan-check-detail-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
}

.laporan-check-detail-modal .is-detail-only { display: none; }
.laporan-check-detail-modal.is-detail-mode .is-detail-only { display: grid; }

.laporan-check-detail-modal__body > section > .laporan-check-detail-list,
.laporan-check-detail-modal__body > section > .laporan-check-detail-sales {
    min-height: 0;
    padding-right: 4px;
    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-gutter: stable;
}

.laporan-check-detail-field {
    min-width: 0;
    padding: 7px 8px;
    border-radius: 9px;
    background: #f8fafc;
}

.laporan-check-detail-field small,
.laporan-check-detail-field strong {
    display: block;
}

.laporan-check-detail-field small {
    margin-bottom: 2px;
    color: #64748b;
    font-size: 9px;
}

.laporan-check-detail-field strong {
    overflow-wrap: anywhere;
    color: #1e293b;
    font-size: 11px;
    font-weight: 600;
    white-space: pre-line;
}

.laporan-check-detail-sales {
    display: grid;
    gap: 9px;
}

.laporan-check-detail-products {
    display: flex;
    flex: 0 1 48%;
    flex-direction: column;
    min-height: 130px;
    margin-top: 12px;
    padding-top: 10px;
    border-top: 1px solid #dbe7f3;
}

.laporan-check-detail-products__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 7px;
}

.laporan-check-detail-products__head h3 { margin: 0; }

.laporan-check-detail-products__head span {
    padding: 3px 7px;
    border-radius: 999px;
    background: #dbeafe;
    color: #1d4ed8;
    font-size: 9px;
    font-weight: 700;
}

.laporan-check-detail-products__meta {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    min-width: 0;
}

.laporan-check-detail-products__meta strong {
    padding: 3px 7px;
    border-radius: 999px;
    background: #dcfce7;
    color: #047857;
    font-size: 9px;
    white-space: nowrap;
}

.laporan-check-detail-products__list {
    display: grid;
    gap: 7px;
    min-height: 0;
    padding-right: 4px;
    overflow-y: auto;
    scrollbar-gutter: stable;
}

.laporan-check-detail-product {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 6px 10px;
    padding: 9px;
    border: 1px solid #dbe7f3;
    border-radius: 11px;
    background: #f8fafc;
}

.laporan-check-detail-product b,
.laporan-check-detail-product small { display: block; }

.laporan-check-detail-product b {
    overflow-wrap: anywhere;
    font-size: 11px;
}

.laporan-check-detail-product small {
    margin-top: 2px;
    color: #64748b;
    font-size: 9px;
}

.laporan-check-detail-product > strong {
    align-self: center;
    color: #047857;
    font-size: 11px;
    white-space: nowrap;
}

.laporan-check-detail-product dl {
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 5px;
    margin: 2px 0 0;
    padding-top: 7px;
    border-top: 1px dashed #cbd5e1;
}

.laporan-check-detail-product dl div { min-width: 0; }
.laporan-check-detail-product dt { color: #64748b; font-size: 8px; }
.laporan-check-detail-product dd { margin: 1px 0 0; overflow-wrap: anywhere; font-size: 9px; }

.laporan-check-sale-products {
    display: grid;
    gap: 7px;
    margin-top: 9px;
    padding-top: 9px;
    border-top: 1px dashed #cbd5e1;
}

.laporan-check-sale-services {
    display: grid;
    gap: 7px;
    margin-top: 9px;
    padding-top: 9px;
    border-top: 1px dashed #bfdbfe;
}

.laporan-check-detail-product--sale { background: #f0fdf4; }
.laporan-check-detail-product--service { background: #eff6ff; }

.laporan-check-detail-empty--compact {
    margin-top: 8px;
    padding: 9px;
    font-size: 9px;
}

.laporan-check-detail-sale {
    padding: 9px;
    border: 1px solid #e2e8f0;
    border-radius: 11px;
}

.laporan-check-detail-sale > span {
    display: block;
    margin-bottom: 7px;
    color: #64748b;
    font-size: 9px;
    font-weight: 700;
}

.laporan-check-detail-empty {
    padding: 18px;
    border: 1px dashed #cbd5e1;
    border-radius: 11px;
    color: #64748b;
    text-align: center;
}

.laporan-check-detail-modal__footer {
    justify-content: flex-end;
    border-top: 1px solid #dbe7f3;
    border-bottom: 0;
}

.laporan-check-detail-modal__footer button {
    padding: 8px 16px;
    border: 0;
    border-radius: 10px;
    background: #2563eb;
    color: #fff;
    font-weight: 700;
    cursor: pointer;
}

:root[data-theme="dark"] .laporan-check-detail-modal,
:root[data-theme="dark"] .laporan-check-detail-modal__head .laporan-check-detail-close,
:root[data-theme="dark"] .laporan-check-detail-modal__body > section {
    background: #111827;
    color: #f8fafc;
}

:root[data-theme="dark"] .laporan-check-detail-modal__body {
    background: #0f172a;
}

:root[data-theme="dark"] .laporan-check-detail-modal__head,
:root[data-theme="dark"] .laporan-check-detail-modal__footer,
:root[data-theme="dark"] .laporan-check-detail-modal__body > section,
:root[data-theme="dark"] .laporan-check-detail-sale,
:root[data-theme="dark"] .laporan-check-detail-products,
:root[data-theme="dark"] .laporan-check-detail-product {
    border-color: #334155;
}

:root[data-theme="dark"] .laporan-check-detail-modal__body h3,
:root[data-theme="dark"] .laporan-check-detail-field strong {
    color: #e2e8f0;
}

:root[data-theme="dark"] .laporan-check-detail-field {
    background: #1e293b;
}

:root[data-theme="dark"] .laporan-check-detail-mode,
:root[data-theme="dark"] .laporan-check-detail-product { background: #1e293b; }
:root[data-theme="dark"] .laporan-check-sale-products,
:root[data-theme="dark"] .laporan-check-sale-services { border-color: #475569; }
:root[data-theme="dark"] .laporan-check-detail-mode { border-color: #334155; }
:root[data-theme="dark"] .laporan-check-detail-product b,
:root[data-theme="dark"] .laporan-check-detail-product dd { color: #e2e8f0; }

@media (max-width: 720px) {
    .laporan-check-detail-modal__body {
        grid-template-columns: 1fr;
        grid-template-rows: repeat(2, minmax(0, 1fr));
    }
    .laporan-check-detail-list { grid-template-columns: 1fr; }
    .laporan-check-detail-modal__head { align-items: flex-start; }
    .laporan-check-detail-modal__actions { align-items: flex-end; flex-direction: column-reverse; }
    .laporan-check-detail-mode button { min-width: 58px; }
}

.label-harian-card {
    display: grid;
    gap: 14px;
    padding: 16px;
    border: 1px solid #d7e6f5;
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(239, 246, 255, 0.9), rgba(255, 255, 255, 0.98));
}

.cek-excel-admin {
    display: grid;
    gap: 14px;
    padding: 16px;
    border: 1px solid #cfe4f5;
    border-radius: 20px;
    background:
        radial-gradient(circle at 92% 10%, rgba(45, 212, 191, .16), transparent 28%),
        linear-gradient(135deg, rgba(239, 246, 255, .96), rgba(255, 255, 255, .98));
}

.cek-excel-admin__form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: stretch;
    gap: 12px;
}

.cek-excel-admin__picker {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    min-width: 0;
    padding: 12px 14px;
    border: 1px dashed #7dd3fc;
    border-radius: 15px;
    background: rgba(255, 255, 255, .9);
    cursor: pointer;
}

.cek-excel-admin__picker-icon {
    display: grid;
    width: 44px;
    height: 44px;
    place-items: center;
    border-radius: 13px;
    background: linear-gradient(145deg, #dbeafe, #ccfbf1);
    color: #047857;
}

.cek-excel-admin__picker-icon svg { width: 21px; height: 21px; }
.cek-excel-admin__picker-copy { display: grid; gap: 2px; min-width: 0; color: #172033; }
.cek-excel-admin__picker-copy strong { font-size: 13px; }
.cek-excel-admin__picker-copy small { overflow: hidden; color: #64748b; font-size: 11px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.cek-excel-admin__picker input { grid-column: 1 / -1; width: 100%; color: #475569; font: inherit; font-size: 12px; }

.cek-excel-admin__option {
    grid-column: 1;
    grid-row: 2;
    display: flex;
    align-items: center;
    gap: 10px;
    width: fit-content;
    padding: 8px 11px;
    border: 1px solid #bae6fd;
    border-radius: 12px;
    background: rgba(255, 255, 255, .82);
    color: #172033;
    cursor: pointer;
}
.cek-excel-admin__option input { width: 17px; height: 17px; margin: 0; accent-color: #059669; }
.cek-excel-admin__option span { display: grid; gap: 1px; }
.cek-excel-admin__option strong { font-size: 12px; }
.cek-excel-admin__option small { color: #64748b; font-size: 10px; }
.cek-excel-admin__form > .cek-excel-admin__submit { grid-column: 2; grid-row: 1; }

.cek-excel-admin__submit,
.cek-excel-admin__download {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-width: 154px;
    min-height: 46px;
    padding: 0 17px;
    border: 0;
    border-radius: 13px;
    background: linear-gradient(135deg, #059669, #06b6d4);
    color: #fff;
    font: inherit;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
    cursor: pointer;
    box-shadow: 0 12px 24px rgba(5, 150, 105, .2);
}

.cek-excel-admin__submit:hover:not(:disabled),
.cek-excel-admin__download:hover { filter: brightness(1.05); transform: translateY(-1px); }
.cek-excel-admin__submit:disabled { cursor: wait; opacity: .7; }
.cek-excel-admin__submit-icon,
.cek-excel-admin__download svg { display: inline-flex; width: 18px; height: 18px; }
.cek-excel-admin__submit-icon svg { width: 18px; height: 18px; }
.cek-excel-admin__submit.is-loading .cek-excel-admin__submit-icon {
    width: 18px;
    height: 18px;
    border: 2px solid rgba(255, 255, 255, .4);
    border-right-color: #fff;
    border-radius: 999px;
    animation: label-harian-spin 700ms linear infinite;
}
.cek-excel-admin__submit.is-loading .cek-excel-admin__submit-icon svg { display: none; }

.cek-excel-admin__feedback:empty { display: none; }
.cek-excel-admin__withdrawal {
    display: grid;
    gap: 9px;
    padding: 11px 12px;
    border: 1px solid #bae6fd;
    border-radius: 14px;
    background: rgba(240, 249, 255, .82);
}
.cek-excel-admin__withdrawal-head { display: grid; gap: 2px; }
.cek-excel-admin__withdrawal-head span { color: #0369a1; font-size: 9px; font-weight: 900; letter-spacing: .11em; }
.cek-excel-admin__withdrawal-head strong { color: #172033; font-size: 13px; }
.cek-excel-admin__withdrawal-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 8px; }
.cek-excel-admin__withdrawal-grid article { display: grid; gap: 5px; padding: 9px 10px; border: 1px solid #bbf7d0; border-radius: 11px; background: #f0fdf4; }
.cek-excel-admin__withdrawal-grid article.is-warning { border-color: #fde68a; background: #fffbeb; }
.cek-excel-admin__withdrawal-grid article > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.cek-excel-admin__withdrawal-grid strong { color: #172033; font-size: 12px; }
.cek-excel-admin__withdrawal-grid span { color: #0f766e; font-size: 10px; font-weight: 750; }
.cek-excel-admin__withdrawal-grid small { color: #64748b; font-size: 9px; line-height: 1.35; }
.cek-excel-admin__feedback {
    padding: 10px 12px;
    border-radius: 11px;
    background: #eff6ff;
    color: #1d4ed8;
    font-size: 12px;
    font-weight: 650;
}
.cek-excel-admin__feedback.is-success { background: #dcfce7; color: #166534; }
.cek-excel-admin__feedback.is-error { background: #fee2e2; color: #b91c1c; }
.cek-excel-admin__feedback.is-loading { background: #ecfeff; color: #0e7490; }

.cek-excel-admin__result {
    padding: 14px;
    border: 1px solid #bbf7d0;
    border-radius: 16px;
    background: rgba(240, 253, 244, .84);
}
.cek-excel-admin__result-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.cek-excel-admin__result-head > div { display: grid; gap: 2px; }
.cek-excel-admin__result-head span { color: #15803d; font-size: 10px; font-weight: 900; letter-spacing: .11em; }
.cek-excel-admin__result-head strong { color: #172033; font-size: 17px; }
.cek-excel-admin__stats { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 9px; margin-top: 12px; }
.cek-excel-admin__stats > div { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 52px; padding: 10px 12px; border: 1px solid #dbeafe; border-radius: 12px; background: #fff; }
.cek-excel-admin__stats span { color: #64748b; font-size: 11px; font-weight: 650; }
.cek-excel-admin__stats strong { color: #172033; font-size: 19px; }
.cek-excel-admin__stats .is-match { border-color: #bbf7d0; background: #f0fdf4; }
.cek-excel-admin__stats .is-missing { border-color: #fde68a; background: #fffbeb; }
.cek-excel-admin__stats .is-duplicate { border-color: #fecaca; background: #fef2f2; }
.cek-excel-admin__income-list { margin-top: 12px; padding: 12px; border: 1px solid #fecaca; border-radius: 14px; background: rgba(255, 255, 255, .78); }
.cek-excel-admin__income-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.cek-excel-admin__income-head > div { display: grid; gap: 2px; }
.cek-excel-admin__income-head span { color: #b91c1c; font-size: 9px; font-weight: 850; letter-spacing: .1em; }
.cek-excel-admin__income-head strong { color: #172033; font-size: 14px; }
.cek-excel-admin__income-rows { display: grid; gap: 7px; max-height: 330px; overflow: auto; }
.cek-excel-admin__income-row { display: grid; grid-template-columns: minmax(190px, 1.5fr) repeat(5, minmax(100px, .75fr)) 72px; align-items: center; gap: 8px; padding: 9px 10px; border: 1px solid #e2e8f0; border-radius: 11px; background: #fff; }
.cek-excel-admin__income-row > div { display: grid; gap: 2px; min-width: 0; text-align: right; }
.cek-excel-admin__income-row > div > span { color: #64748b; font-size: 9px; font-weight: 650; }
.cek-excel-admin__income-row > div > strong { overflow: hidden; color: #172033; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.cek-excel-admin__income-row .cek-excel-admin__income-invoice { text-align: left; }
.cek-excel-admin__income-row .is-difference strong { color: #b91c1c; }
.cek-excel-admin__income-row .is-missing strong { color: #b45309; }
.cek-excel-admin__income-row .cek-excel-admin__income-action { display: flex; align-items: center; justify-content: center; gap: 5px; text-align: center; }
.cek-excel-admin__income-action button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border: 1px solid #c4b5fd;
    border-radius: 9px;
    background: #f5f3ff;
    color: #6d28d9;
    cursor: pointer;
}
.cek-excel-admin__income-action button:hover:not(:disabled) { border-color: #8b5cf6; background: #ede9fe; }
.cek-excel-admin__income-action button.is-note { border-color: #86efac; background: #f0fdf4; color: #15803d; }
.cek-excel-admin__income-action button.is-note:hover:not(:disabled) { border-color: #22c55e; background: #dcfce7; }
.cek-excel-admin__income-action button.is-note.has-note { border-color: #facc15; background: #fefce8; color: #a16207; opacity: 1; }
.cek-excel-admin__income-action button:disabled { cursor: not-allowed; opacity: .35; }
.cek-excel-admin__income-action button.is-loading { cursor: wait; }
.cek-excel-admin__income-action button.is-loading svg { display: none; }
.cek-excel-admin__income-action button.is-loading::before {
    width: 13px;
    height: 13px;
    border: 2px solid rgba(109, 40, 217, .2);
    border-right-color: #6d28d9;
    border-radius: 999px;
    animation: label-harian-spin 700ms linear infinite;
    content: "";
}
.cek-excel-admin__income-action svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.cek-excel-admin__note { margin: 10px 2px 0; color: #64748b; font-size: 11px; font-weight: 500; }

.cek-excel-admin__archive {
    display: grid;
    gap: 10px;
    padding: 14px;
    border: 1px solid #bfdbfe;
    border-radius: 16px;
    background: rgba(255, 255, 255, .76);
}
.cek-excel-admin__archive-head,
.cek-excel-admin__archive-item,
.cek-excel-admin__archive-actions { display: flex; align-items: center; }
.cek-excel-admin__archive-head { justify-content: space-between; gap: 12px; }
.cek-excel-admin__archive-head > div { display: grid; gap: 2px; }
.cek-excel-admin__archive-head span { color: #2563eb; font-size: 9px; font-weight: 900; letter-spacing: .12em; }
.cek-excel-admin__archive-head strong { color: #172033; font-size: 15px; }
.cek-excel-admin__archive-head button,
.cek-excel-admin__archive-actions a,
.cek-excel-admin__archive-actions button {
    min-height: 34px;
    padding: 0 12px;
    border: 1px solid #bfdbfe;
    border-radius: 10px;
    background: #fff;
    color: #1d4ed8;
    font: inherit;
    font-size: 10px;
    font-weight: 800;
    text-decoration: none;
    cursor: pointer;
}
.cek-excel-admin__archive-list { display: grid; gap: 8px; }
.cek-excel-admin__archive-item {
    gap: 11px;
    min-width: 0;
    padding: 10px;
    border: 1px solid #dbeafe;
    border-radius: 13px;
    background: #fff;
}
.cek-excel-admin__archive-badge {
    flex: 0 0 auto;
    padding: 6px 9px;
    border-radius: 9px;
    background: linear-gradient(135deg, #dbeafe, #ccfbf1);
    color: #0f766e;
    font-size: 10px;
    font-weight: 900;
}
.cek-excel-admin__archive-copy { display: grid; flex: 1 1 auto; gap: 2px; min-width: 0; }
.cek-excel-admin__archive-copy strong { overflow: hidden; color: #172033; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.cek-excel-admin__archive-copy span,
.cek-excel-admin__archive-copy small { color: #64748b; font-size: 9px; font-weight: 600; }
.cek-excel-admin__archive-actions { flex: 0 0 auto; gap: 7px; }
.cek-excel-admin__archive-actions a { display: inline-flex; align-items: center; background: #eff6ff; }
.cek-excel-admin__archive-actions button { border-color: #a7f3d0; background: #ecfdf5; color: #047857; }
.cek-excel-admin__archive-actions button.is-delete { border-color: #fecaca; background: #fff1f2; color: #be123c; }
.cek-excel-admin__button-spinner {
    display: none;
    width: 12px;
    height: 12px;
    margin-right: 6px;
    border: 2px solid rgba(5, 150, 105, .25);
    border-right-color: #059669;
    border-radius: 999px;
    animation: label-harian-spin 700ms linear infinite;
}
.cek-excel-admin__archive-actions button.is-loading .cek-excel-admin__button-spinner,
.cek-excel-admin__archive-head button.is-loading .cek-excel-admin__button-spinner { display: inline-block; }
.cek-excel-admin__archive-actions button.is-delete.is-loading .cek-excel-admin__button-spinner {
    border-color: rgba(190, 18, 60, .22);
    border-right-color: #be123c;
}
.cek-excel-admin__archive-head button { display: inline-flex; align-items: center; justify-content: center; }
.cek-excel-admin__archive-actions button:disabled { cursor: wait; opacity: .7; }

@media (max-width: 760px) {
    .cek-excel-admin__form { grid-template-columns: 1fr; }
    .cek-excel-admin__option,
    .cek-excel-admin__form > .cek-excel-admin__submit { grid-column: 1; grid-row: auto; width: 100%; }
    .cek-excel-admin__stats { grid-template-columns: 1fr 1fr; }
    .cek-excel-admin__result-head { align-items: stretch; flex-direction: column; }
    .cek-excel-admin__income-row { grid-template-columns: 1fr 1fr; }
    .cek-excel-admin__income-row .cek-excel-admin__income-invoice { grid-column: 1 / -1; }
    .cek-excel-admin__archive-item { align-items: stretch; flex-direction: column; }
    .cek-excel-admin__archive-actions { width: 100%; }
    .cek-excel-admin__archive-actions > * { flex: 1 1 0; justify-content: center; }
}

@media (min-width: 761px) and (max-width: 1100px) {
    .cek-excel-admin__stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

:root[data-theme="dark"] .cek-excel-admin {
    border-color: rgba(56, 189, 248, .3);
    background: linear-gradient(135deg, rgba(15, 23, 42, .96), rgba(30, 41, 59, .9));
}
:root[data-theme="dark"] .cek-excel-admin__picker,
:root[data-theme="dark"] .cek-excel-admin__option,
:root[data-theme="dark"] .cek-excel-admin__stats > div { border-color: #334155; background: rgba(15, 23, 42, .8); }
:root[data-theme="dark"] .cek-excel-admin__picker-copy,
:root[data-theme="dark"] .cek-excel-admin__option,
:root[data-theme="dark"] .cek-excel-admin__result-head strong,
:root[data-theme="dark"] .cek-excel-admin__stats strong { color: #e2e8f0; }
:root[data-theme="dark"] .cek-excel-admin__result { border-color: rgba(34, 197, 94, .35); background: rgba(20, 83, 45, .2); }
:root[data-theme="dark"] .cek-excel-admin__income-list,
:root[data-theme="dark"] .cek-excel-admin__income-row { border-color: #334155; background: rgba(15, 23, 42, .78); }
:root[data-theme="dark"] .cek-excel-admin__withdrawal,
:root[data-theme="dark"] .cek-excel-admin__withdrawal-grid article { border-color: #334155; background: rgba(15, 23, 42, .78); }
:root[data-theme="dark"] .cek-excel-admin__withdrawal-head strong,
:root[data-theme="dark"] .cek-excel-admin__withdrawal-grid strong { color: #e2e8f0; }
:root[data-theme="dark"] .cek-excel-admin__archive,
:root[data-theme="dark"] .cek-excel-admin__archive-item { border-color: #334155; background: rgba(15, 23, 42, .78); }
:root[data-theme="dark"] .cek-excel-admin__archive-head strong,
:root[data-theme="dark"] .cek-excel-admin__archive-copy strong { color: #e2e8f0; }
:root[data-theme="dark"] .cek-excel-admin__income-head strong,
:root[data-theme="dark"] .cek-excel-admin__income-row > div > strong { color: #e2e8f0; }

.label-harian-upload {
    display: flex;
    align-items: end;
    gap: 12px;
}

.label-harian-upload__input {
    display: grid;
    flex: 1;
    gap: 5px;
    min-width: 0;
    color: #334155;
    font-size: 12px;
    font-weight: 700;
}

.label-harian-upload__input input {
    width: 100%;
    padding: 9px;
    border: 1px dashed #93c5fd;
    border-radius: 11px;
    background: #fff;
    color: #334155;
    font: inherit;
    font-weight: 500;
}

.label-harian-upload__input small {
    color: #64748b;
    font-size: 11px;
    font-weight: 500;
}

.label-harian-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-width: 132px;
    min-height: 42px;
    padding: 0 15px;
    border: 0;
    border-radius: 12px;
    background: linear-gradient(135deg, #0ea5a4, #2563eb);
    color: #fff;
    font: inherit;
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
    cursor: pointer;
    box-shadow: 0 10px 22px rgba(14, 165, 164, 0.22);
}

.label-harian-submit:hover:not(:disabled) {
    filter: brightness(1.05);
    transform: translateY(-1px);
}

.label-harian-submit:disabled {
    cursor: wait;
    opacity: 0.72;
}

.label-harian-submit__icon {
    display: inline-flex;
    width: 17px;
    height: 17px;
}

.label-harian-submit__icon svg {
    width: 17px;
    height: 17px;
}

.label-harian-submit.is-loading .label-harian-submit__icon {
    border: 2px solid rgba(255, 255, 255, 0.4);
    border-right-color: #fff;
    border-radius: 999px;
    animation: label-harian-spin 700ms linear infinite;
}

.label-harian-submit.is-loading .label-harian-submit__icon svg {
    display: none;
}

@keyframes label-harian-spin {
    to { transform: rotate(360deg); }
}

.label-harian-records {
    min-width: 0;
}

.label-harian-records__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 3px 1px 8px;
    color: #1e293b;
    font-size: 13px;
}

.label-harian-records__head span {
    color: #64748b;
    font-size: 11px;
}

.label-harian-feedback__list {
    display: grid;
    gap: 4px;
    margin: 8px 0 0;
    padding-left: 18px;
    font-size: 12px;
    font-weight: 500;
}

.label-harian-table {
    min-width: 760px;
}

.label-harian-table td {
    font-weight: 500;
}

.label-harian-delete {
    min-height: 28px;
    padding: 0 10px;
    border: 1px solid #fecaca;
    border-radius: 8px;
    background: #fff;
    color: #dc2626;
    font: inherit;
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
}

.label-harian-delete:hover:not(:disabled) {
    border-color: #ef4444;
    background: #fef2f2;
}

.label-harian-delete:disabled {
    cursor: wait;
    opacity: .65;
}

.label-harian-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.label-harian-edit,
.label-harian-cancel,
.label-harian-open,
.label-harian-reprocess {
    min-height: 28px;
    padding: 0 10px;
    border: 1px solid #bfdbfe;
    border-radius: 8px;
    background: #eff6ff;
    color: #2563eb;
    font: inherit;
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
}

.label-harian-open { border-color: #99f6e4; background: #f0fdfa; color: #0f766e; }
.label-harian-reprocess { border-color: #fde68a; background: #fffbeb; color: #b45309; }

.label-harian-modal {
    width: min(560px, calc(100vw - 32px));
    padding: 0;
    border: 0;
    border-radius: 18px;
    color: #172033;
    box-shadow: 0 24px 70px rgba(15, 23, 42, .35);
}

.label-harian-modal::backdrop { background: rgba(15, 23, 42, .55); backdrop-filter: blur(3px); }
.label-harian-modal__form { display: grid; gap: 16px; padding: 20px; }
.label-harian-modal__head,
.label-harian-modal__foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.label-harian-modal__head h3 { margin: 3px 0 0; font-size: 21px; }
.label-harian-modal__close { width: 34px; height: 34px; border: 1px solid #cbd5e1; border-radius: 10px; background: #fff; color: #475569; font-size: 24px; line-height: 1; cursor: pointer; }
.label-harian-modal__fields { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.label-harian-modal__fields label { display: grid; gap: 6px; color: #475569; font-size: 12px; font-weight: 700; }
.label-harian-modal__fields input { width: 100%; min-height: 39px; border: 1px solid #cbd5e1; border-radius: 9px; padding: 0 10px; color: #172033; font: inherit; }
.label-harian-learn { color: #475569; font-size: 12px; font-weight: 600; }
.label-harian-modal__foot { justify-content: flex-end; padding-top: 14px; border-top: 1px solid #e2e8f0; }

@media (max-width: 560px) {
    .label-harian-modal__fields { grid-template-columns: 1fr; }
}

.label-harian-status {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 0 8px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
}

.label-harian-status.is-success {
    background: #dcfce7;
    color: #15803d;
}

.label-harian-status.is-review {
    background: #fef3c7;
    color: #b45309;
}

:root[data-theme="dark"] .label-harian-card {
    border-color: rgba(96, 165, 250, 0.3);
    background: linear-gradient(135deg, rgba(15, 23, 42, 0.96), rgba(30, 41, 59, 0.9));
}

:root[data-theme="dark"] .label-harian-upload__input,
:root[data-theme="dark"] .label-harian-records__head {
    color: #e2e8f0;
}

:root[data-theme="dark"] .label-harian-upload__input input {
    border-color: rgba(96, 165, 250, 0.55);
    background: rgba(15, 23, 42, 0.9);
    color: #e2e8f0;
}

:root[data-theme="dark"] .label-harian-delete {
    border-color: rgba(248, 113, 113, 0.45);
    background: rgba(127, 29, 29, 0.18);
    color: #fca5a5;
}

:root[data-theme="dark"] .label-harian-modal { background: #0f172a; color: #e2e8f0; }
:root[data-theme="dark"] .label-harian-modal__fields label,
:root[data-theme="dark"] .label-harian-learn { color: #cbd5e1; }
:root[data-theme="dark"] .label-harian-modal__fields input,
:root[data-theme="dark"] .label-harian-modal__close { border-color: #334155; background: #1e293b; color: #e2e8f0; }
:root[data-theme="dark"] .label-harian-modal__foot { border-color: #334155; }

.laporan-status {
    display: inline-flex;
    min-height: 26px;
    align-items: center;
    border-radius: 999px;
    padding: 5px 9px;
    background: #e0f2fe;
    color: #0369a1;
    font-size: 12px;
    font-weight: 900;
}

.laporan-empty {
    color: #64748b;
    font-weight: 800;
    text-align: center;
}

.laporan-alert {
    margin: 0;
}

:root[data-theme="dark"] .laporan-filter label,
:root[data-theme="dark"] .laporan-stat span,
:root[data-theme="dark"] .laporan-stat small,
:root[data-theme="dark"] .laporan-panel__head span,
:root[data-theme="dark"] .laporan-mini-row small,
:root[data-theme="dark"] .laporan-panel-note,
:root[data-theme="dark"] .laporan-withdrawal-row span,
:root[data-theme="dark"] .laporan-withdrawal-row small,
:root[data-theme="dark"] .laporan-table th,
:root[data-theme="dark"] .laporan-empty {
    color: #cbd5e1;
}

:root[data-theme="dark"] .laporan-hero {
    background:
        radial-gradient(circle at 92% 18%, rgba(14,165,233,.18), transparent 23%),
        linear-gradient(135deg, rgba(15,23,42,.98), rgba(17,34,62,.94));
}

:root[data-theme="dark"] .laporan-tabs,
:root[data-theme="dark"] .laporan-filter,
:root[data-theme="dark"] .laporan-daily-overview,
:root[data-theme="dark"] .laporan-daily-card,
:root[data-theme="dark"] .laporan-daily-empty {
    border-color: rgba(59,130,246,.25);
    background: rgba(2,6,23,.38);
}

:root[data-theme="dark"] .laporan-panel-head h2 { color: #e2e8f0; }
:root[data-theme="dark"] .laporan-panel-head p:not(.appku-kicker) { color: #94a3b8; }
:root[data-theme="dark"] .laporan-daily-overview h3,
:root[data-theme="dark"] .laporan-daily-card h3,
:root[data-theme="dark"] .laporan-daily-empty strong { color: #e2e8f0; }
:root[data-theme="dark"] .laporan-daily-card p,
:root[data-theme="dark"] .laporan-daily-card div small,
:root[data-theme="dark"] .laporan-daily-overview p:not(.appku-kicker) { color: #94a3b8; }
:root[data-theme="dark"] .laporan-daily-card__shops { border-color: rgba(59, 130, 246, .2); }
:root[data-theme="dark"] .laporan-daily-card__shop-icon { border-color: rgba(103, 232, 249, .24); background: rgba(8, 145, 178, .16); }
:root[data-theme="dark"] .laporan-daily-card__shop-icon small { border-color: #182335; color: #a5f3fc; background: #155e75; }
:root[data-theme="dark"] .laporan-daily-card__shop-icon.is-canceled { border-color: rgba(252, 165, 165, .4); background: rgba(127, 29, 29, .25); }
:root[data-theme="dark"] .laporan-daily-card__shop-icon.is-canceled small { color: #fecaca; background: #991b1b; }
:root[data-theme="dark"] .laporan-daily-card__store-mark { border-color: #3b5372; background: linear-gradient(145deg, #21334d, #17263e); }
:root[data-theme="dark"] .laporan-daily-card__store-mark::after { background: #1d304a; }
:root[data-theme="dark"] .laporan-daily-card__store-mark b { border-color: #17263e; }
:root[data-theme="dark"] .laporan-daily-print-btn { color: #bbf7d0; border-color: rgba(74, 222, 128, .45); background: rgba(22, 163, 74, .16); }

:root[data-theme="dark"] .laporan-filter input,
:root[data-theme="dark"] .laporan-filter select,
:root[data-theme="dark"] .laporan-period-filter,
:root[data-theme="dark"] .laporan-monthly-summary-block,
:root[data-theme="dark"] .laporan-mini-row,
:root[data-theme="dark"] .laporan-withdrawal-row,
:root[data-theme="dark"] .laporan-table td {
    border-color: rgba(59, 130, 246, 0.28);
    background: rgba(2, 6, 23, 0.46);
    color: #dbeafe;
}

:root[data-theme="dark"] .laporan-monthly-summary-card__head h2,
:root[data-theme="dark"] .laporan-monthly-summary-row strong,
:root[data-theme="dark"] .laporan-monthly-summary-block strong,
:root[data-theme="dark"] .laporan-monthly-ku,
:root[data-theme="dark"] .laporan-detail-launcher,
:root[data-theme="dark"] .laporan-monthly-modal { color: #e2e8f0; }
:root[data-theme="dark"] .laporan-monthly-summary-card__head > small,
:root[data-theme="dark"] .laporan-monthly-summary-row span,
:root[data-theme="dark"] .laporan-monthly-summary-block span,
:root[data-theme="dark"] .laporan-detail-launcher small { color: #94a3b8; }
:root[data-theme="dark"] .laporan-belum-cair-card { border-color: rgba(245, 158, 11, .35); background: rgba(69, 26, 3, .28); }
:root[data-theme="dark"] .laporan-belum-cair-card__head h2,
:root[data-theme="dark"] .laporan-belum-cair-list strong { color: #fef3c7; }
:root[data-theme="dark"] .laporan-belum-cair-card__head > span { background: rgba(180, 83, 9, .28); color: #fde68a; }
:root[data-theme="dark"] .laporan-belum-cair-list article { border-color: rgba(251, 191, 36, .18); }
:root[data-theme="dark"] .laporan-belum-cair-list span { color: #cbd5e1; }
:root[data-theme="dark"] .laporan-monthly-summary-row { border-color: #334155; }
:root[data-theme="dark"] .laporan-monthly-summary-row.is-primary { background: rgba(37, 99, 235, .18); }
:root[data-theme="dark"] .laporan-monthly-summary-row.is-result { background: rgba(22, 163, 74, .17); }
:root[data-theme="dark"] .laporan-monthly-ku { background: linear-gradient(135deg, rgba(37, 99, 235, .22), rgba(6, 182, 212, .13)); }
:root[data-theme="dark"] .laporan-detail-launcher { border-color: rgba(96, 165, 250, .28); background: #111827; }
:root[data-theme="dark"] .laporan-monthly-modal,
:root[data-theme="dark"] .laporan-monthly-modal__head,
:root[data-theme="dark"] .laporan-monthly-modal__foot { border-color: #334155; background: #0f172a; }
:root[data-theme="dark"] .laporan-monthly-modal__head > button { border-color: #334155; background: #1e293b; color: #e2e8f0; }

:root[data-theme="dark"] .laporan-period-filter__radios label {
    color: #dbeafe;
}

:root[data-theme="dark"] .laporan-admin-direct {
    color: #bbf7d0 !important;
    background: rgba(22, 163, 74, 0.2);
}

:root[data-theme="dark"] .laporan-rekap-special {
    color: #bfdbfe !important;
    background: rgba(37, 99, 235, 0.22);
}

:root[data-theme="dark"] .laporan-filter select:disabled {
    color: #94a3b8;
    background: rgba(15, 23, 42, 0.72);
}

:root[data-theme="dark"] .laporan-mark-withdrawal-btn {
    border-color: rgba(74, 222, 128, 0.34);
    background: rgba(34, 197, 94, 0.14);
    color: #bbf7d0;
}

:root[data-theme="dark"] .laporan-mark-withdrawal-btn:hover {
    background: #16a34a;
    color: #ffffff;
}

:root[data-theme="dark"] .laporan-mark-withdrawal-btn.is-marked,
:root[data-theme="dark"] .laporan-mark-withdrawal-btn.is-marked:hover {
    border-color: rgba(148, 163, 184, 0.42);
    background: rgba(100, 116, 139, 0.34);
    color: #cbd5e1;
}

:root[data-theme="dark"] .laporan-period-status span {
    background: rgba(245, 158, 11, 0.16);
    color: #fed7aa;
}

:root[data-theme="dark"] .laporan-period-status span.is-marked {
    background: rgba(34, 197, 94, 0.16);
    color: #bbf7d0;
}

:root[data-theme="dark"] .laporan-stat strong,
:root[data-theme="dark"] .laporan-mini-row span,
:root[data-theme="dark"] .laporan-withdrawal-row strong {
    color: #f8fafc;
}

:root[data-theme="dark"] .laporan-stat-breakdown div {
    background: rgba(34, 197, 94, 0.14);
}

:root[data-theme="dark"] .laporan-stat-breakdown span,
:root[data-theme="dark"] .laporan-stat-breakdown strong {
    color: #bbf7d0;
}

:root[data-theme="dark"] .laporan-withdrawal-amount strong {
    color: #86efac;
}

:root[data-theme="dark"] .laporan-withdrawal-row.is-marked {
    border-color: rgba(74, 222, 128, 0.52);
    background:
        linear-gradient(90deg, rgba(34, 197, 94, 0.2), transparent 42%),
        rgba(2, 6, 23, 0.62);
}

:root[data-theme="dark"] .laporan-withdrawal-total {
    background: rgba(22, 163, 74, 0.16);
    color: #bbf7d0;
}

.laporan-additional-head {
    align-items: center;
}

.laporan-additional-add {
    min-height: 40px;
    padding: 0 18px;
    border: 0;
    border-radius: 13px;
    background: linear-gradient(135deg, #2563eb, #06b6d4);
    box-shadow: 0 12px 26px rgba(37, 99, 235, 0.2);
    color: #fff;
    font: inherit;
    font-weight: 800;
    cursor: pointer;
}

.laporan-additional-add:disabled {
    opacity: 0.48;
    cursor: not-allowed;
}

.laporan-additional-feedback:empty {
    display: none;
}

.laporan-additional-search {
    display: grid;
    gap: 7px;
    width: min(100%, 560px);
    margin-top: 12px;
}

.laporan-additional-search > label:first-child {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 42px;
    padding: 0 13px;
    border: 1px solid #cbd9e8;
    border-radius: 13px;
    background: #fff;
    transition: border-color 160ms ease, box-shadow 160ms ease;
}

.laporan-additional-search > label:first-child:focus-within {
    border-color: #38bdf8;
    box-shadow: 0 0 0 3px rgba(56, 189, 248, .14);
}

.laporan-additional-search svg {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    fill: none;
    stroke: #64748b;
    stroke-linecap: round;
    stroke-width: 1.8;
}

.laporan-additional-search input[type="search"] {
    width: 100%;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: #0f172a;
    font: inherit;
    font-size: 12px;
}

.laporan-additional-all-periods {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    width: max-content;
    color: #475569;
    font-size: 11px;
    font-weight: 650;
    cursor: pointer;
}

.laporan-additional-all-periods input {
    width: 15px;
    height: 15px;
    margin: 0;
    accent-color: #2563eb;
}

.laporan-additional-summary {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 10px;
    margin: 12px 0;
}

.laporan-additional-summary article {
    min-width: 0;
    min-height: 116px;
    padding: 13px 14px;
    overflow: hidden;
    border: 1px solid #d7e5f4;
    border-radius: 16px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .98), rgba(244, 250, 255, .94));
}

.laporan-additional-summary article:nth-child(2) { background: linear-gradient(145deg, #fff, #eff6ff); }
.laporan-additional-summary article:nth-child(3) { background: linear-gradient(145deg, #fff, #ecfeff); }
.laporan-additional-summary article:nth-child(4) { background: linear-gradient(145deg, #fff, #f0fdf4); }
.laporan-additional-summary article:nth-child(5) { background: linear-gradient(145deg, #fff, #fff7ed); }
.laporan-additional-summary article:nth-child(6) { background: linear-gradient(145deg, #fff, #fef2f2); }

.laporan-additional-summary span,
.laporan-additional-summary small {
    display: block;
    overflow: hidden;
    color: #64748b;
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.laporan-additional-summary span {
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.laporan-additional-summary strong {
    display: block;
    margin: 5px 0 2px;
    overflow: hidden;
    color: #0f172a;
    font-size: 19px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.laporan-additional-summary .laporan-stat::after {
    width: 82px;
    height: 82px;
    right: -24px;
    bottom: -38px;
}

.laporan-additional-table th,
.laporan-additional-table td {
    padding: 9px 10px;
    vertical-align: middle;
}

.laporan-additional-table th:first-child,
.laporan-additional-table td:first-child {
    width: 142px;
    min-width: 142px;
    white-space: nowrap;
}

.laporan-additional-table td:first-child .laporan-check-stack span {
    overflow: visible;
    text-overflow: clip;
}

.laporan-additional-type {
    display: inline-flex;
    padding: 5px 8px;
    border-radius: 999px;
    background: #eaf2ff;
    color: #1d4ed8;
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
}

.laporan-additional-type.is-isi_iklan { background: #fff3d6; color: #b45309; }
.laporan-additional-type.is-admin_tambahan { background: #dcfce7; color: #15803d; }
.laporan-additional-type.is-komisi_iklan { background: #fce7f3; color: #be185d; }
.laporan-additional-type.is-koreksi { background: #f3e8ff; color: #7e22ce; }
.laporan-additional-type.is-voucher_toko { background: #fef3c7; color: #a16207; }
.laporan-additional-type.is-ongkir { background: #cffafe; color: #0e7490; }
.laporan-additional-type.is-admin_bulan_lalu { background: #dbeafe; color: #1d4ed8; }
.laporan-additional-type.is-belum_cair { background: #ffe4e6; color: #be123c; }
.laporan-additional-type.is-catatan { background: #e0e7ff; color: #4338ca; }
.laporan-additional-type.is-lainnya { background: #edf2f7; color: #475569; }

.laporan-additional-amount {
    color: #047857;
    font-weight: 800;
    text-align: right;
    white-space: nowrap;
}

.laporan-additional-amount.is-negative { color: #dc2626; }
.laporan-additional-note { min-width: 190px; max-width: 360px; white-space: normal; }

.laporan-additional-actions {
    display: flex;
    justify-content: flex-end;
    gap: 6px;
}

.laporan-additional-actions button {
    padding: 6px 9px;
    border: 1px solid #bfdbfe;
    border-radius: 9px;
    background: #eff6ff;
    color: #1d4ed8;
    font: inherit;
    font-size: 11px;
    font-weight: 800;
    cursor: pointer;
}

.laporan-additional-actions button.is-delete {
    border-color: #fecaca;
    background: #fff1f2;
    color: #be123c;
}

.laporan-additional-loading {
    display: grid;
    min-height: 180px;
    place-content: center;
    justify-items: center;
    color: #64748b;
}

.laporan-additional-loading span {
    width: 28px;
    height: 28px;
    border: 3px solid #dbeafe;
    border-top-color: #2563eb;
    border-radius: 50%;
    animation: laporanSpin .75s linear infinite;
}

.laporan-additional-modal {
    width: min(720px, calc(100vw - 28px));
    max-height: min(760px, calc(100vh - 28px));
    padding: 0;
    overflow: hidden;
    border: 0;
    border-radius: 24px;
    box-shadow: 0 28px 80px rgba(15, 23, 42, .32);
}

.laporan-additional-modal::backdrop { background: rgba(15, 23, 42, .58); backdrop-filter: blur(5px); }
.laporan-additional-form { display: grid; max-height: inherit; background: #fff; grid-template-rows: auto minmax(0, 1fr) auto; }
.laporan-additional-modal__head,
.laporan-additional-modal__foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 20px; }
.laporan-additional-modal__head { border-bottom: 1px solid #e2e8f0; }
.laporan-additional-modal__head h3 { margin: 3px 0 0; color: #0f172a; font-size: 22px; }
.laporan-additional-modal__head > button { width: 38px; height: 38px; border: 1px solid #d8e3ef; border-radius: 12px; background: #fff; color: #334155; font-size: 24px; cursor: pointer; }
.laporan-additional-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; padding: 18px 20px; overflow-y: auto; }
.laporan-additional-fields label { display: grid; gap: 6px; color: #334155; font-size: 12px; font-weight: 800; }
.laporan-additional-fields input,
.laporan-additional-fields select,
.laporan-additional-fields textarea { width: 100%; min-height: 42px; padding: 9px 11px; border: 1px solid #cbd9e8; border-radius: 12px; outline: 0; background: #fff; color: #0f172a; font: inherit; font-weight: 600; }
.laporan-additional-fields input:focus,
.laporan-additional-fields select:focus,
.laporan-additional-fields textarea:focus { border-color: #38bdf8; box-shadow: 0 0 0 3px rgba(56, 189, 248, .14); }
.laporan-additional-field--amount > div { display: flex; align-items: center; overflow: hidden; border: 1px solid #cbd9e8; border-radius: 12px; }
.laporan-additional-field--amount > div b { padding-left: 12px; color: #2563eb; }
.laporan-additional-field--amount > div input { border: 0; box-shadow: none; }
.laporan-additional-field--amount small { color: #64748b; font-weight: 500; }
.laporan-additional-type-info {
    min-height: 92px;
    padding: 12px 14px;
    border: 1px solid #bae6fd;
    border-radius: 14px;
    background:
        radial-gradient(circle at 100% 0, rgba(34, 197, 94, .12), transparent 42%),
        linear-gradient(135deg, #f0f9ff, #f0fdf4);
    color: #334155;
}

.laporan-additional-type-info strong {
    display: block;
    margin-bottom: 5px;
    color: #0369a1;
    font-size: 12px;
}

.laporan-additional-type-info p {
    margin: 0;
    color: #475569;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.45;
}
.laporan-additional-field--note { grid-column: 1 / -1; }
.laporan-additional-field--note textarea { min-height: 96px; resize: vertical; }
.laporan-additional-modal__foot { border-top: 1px solid #e2e8f0; background: #f8fafc; justify-content: flex-end; }
.laporan-additional-modal__foot button { min-height: 40px; padding: 0 16px; border-radius: 12px; font: inherit; font-weight: 800; cursor: pointer; }
.laporan-additional-modal__foot .is-secondary { border: 1px solid #bfdbfe; background: #eff6ff; color: #1d4ed8; }
.laporan-additional-modal__foot .is-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 0;
    background: linear-gradient(135deg, #2563eb, #06b6d4);
    color: #fff;
}

.laporan-additional-modal__foot .is-primary.is-loading {
    opacity: .82;
    cursor: wait;
    pointer-events: none;
}

.laporan-additional-modal__foot .is-primary.is-loading::before {
    content: "";
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
    border: 2px solid rgba(255, 255, 255, .42);
    border-top-color: #fff;
    border-radius: 50%;
    animation: laporanSpin .72s linear infinite;
}

:root[data-theme="dark"] .laporan-additional-summary article,
:root[data-theme="dark"] .laporan-additional-form { border-color: #334155; background: #0f172a; }
:root[data-theme="dark"] .laporan-additional-search > label:first-child { border-color: #334155; background: #111c31; }
:root[data-theme="dark"] .laporan-additional-search input[type="search"] { color: #f8fafc; }
:root[data-theme="dark"] .laporan-additional-all-periods { color: #cbd5e1; }
:root[data-theme="dark"] .laporan-additional-summary strong,
:root[data-theme="dark"] .laporan-additional-modal__head h3 { color: #f8fafc; }
:root[data-theme="dark"] .laporan-additional-fields input,
:root[data-theme="dark"] .laporan-additional-fields select,
:root[data-theme="dark"] .laporan-additional-fields textarea,
:root[data-theme="dark"] .laporan-additional-modal__head > button { border-color: #334155; background: #111c31; color: #e2e8f0; }
:root[data-theme="dark"] .laporan-additional-modal__head,
:root[data-theme="dark"] .laporan-additional-modal__foot { border-color: #334155; background: #111827; }
:root[data-theme="dark"] .laporan-additional-type-info { border-color: rgba(56, 189, 248, .28); background: linear-gradient(135deg, rgba(14, 116, 144, .18), rgba(22, 163, 74, .12)); }
:root[data-theme="dark"] .laporan-additional-type-info strong { color: #7dd3fc; }
:root[data-theme="dark"] .laporan-additional-type-info p { color: #cbd5e1; }

@media (max-width: 820px) {
    .project-main-menu__card {
        grid-template-columns: 1fr;
    }

    .project-main-menu__links {
        justify-content: flex-start;
    }

    .project-main-menu__meta-actions {
        margin-left: 0;
    }

    .appku-hero,
    .appku-grid,
    .appku-check,
    .laporan-hero,
    .laporan-filter,
    .laporan-summary-grid,
    .laporan-check-summary,
    .laporan-panels,
    .laporan-detail-launchers,
    .laporan-monthly-summary-layout,
    .laporan-withdrawal-row {
        grid-template-columns: 1fr;
    }

    .laporan-monthly-summary-card__head,
    .laporan-belum-cair-card__head { align-items: flex-start; flex-direction: column; }
    .laporan-belum-cair-list article { grid-template-columns: 1fr; gap: 3px; }

    .laporan-withdrawal-amount {
        text-align: left;
    }

    .appku-actions {
        justify-content: flex-start;
    }

    .laporan-workspace { grid-template-columns: 1fr; }
    .laporan-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .laporan-tab { grid-template-columns: 28px minmax(0, 1fr); padding: 9px; }
    .laporan-tab > span { width: 28px; height: 28px; }
    .laporan-panel-head { flex-direction: column; }
    .laporan-panel-head--daily { align-items: stretch; }
    .laporan-daily-summary { width: 100%; min-width: 0; }
    .label-harian-upload { align-items: stretch; flex-direction: column; }
    .label-harian-submit { width: 100%; }
    .laporan-additional-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
    .project-main-menu {
        margin-bottom: 14px;
        position: relative;
        top: auto;
        isolation: isolate;
        contain: paint;
    }

    .project-main-menu-shortcut-wrap {
        margin: -4px auto 8px;
        isolation: isolate;
        contain: paint;
    }

    .project-main-menu__card {
        padding: 16px;
        border-radius: 20px;
    }

    .laporan-tabs { grid-template-columns: 1fr; }
    .laporan-panel-head .laporan-export-btn { width: 100%; }
    .laporan-workspace { padding: 8px; }
    .laporan-tab-panel { padding: 8px 2px 2px; }
    .laporan-daily-overview { align-items: flex-start; }
    .laporan-daily-overview__actions { justify-content: flex-start; flex-wrap: wrap; }
    .laporan-daily-card { grid-template-columns: auto minmax(0, 1fr); }
    .laporan-daily-card__metric { grid-column: 2; text-align: left; }
    .laporan-daily-card__shops { grid-column: 1 / -1; }
    .laporan-additional-fields { grid-template-columns: 1fr; }
    .laporan-additional-field--note { grid-column: auto; }
}
.notif-universal {
    position: fixed;
    top: 24px;
    right: 24px;
    z-index: 9999;
    display: grid;
    grid-template-columns: 6px minmax(0, 1fr) auto;
    align-items: stretch;
    width: min(390px, calc(100vw - 32px));
    border: 1px solid rgba(203, 213, 225, .9);
    border-radius: 18px;
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 18px 45px rgba(15, 23, 42, .18);
    backdrop-filter: blur(16px);
    overflow: hidden;
    opacity: 0;
    transform: translate3d(0, -20px, 0) scale(.96);
    pointer-events: none;
    transition: opacity .32s ease, transform .38s cubic-bezier(.22, 1, .36, 1);
}

.notif-universal[hidden] { display: none; }
.notif-universal.is-visible { opacity: 1; transform: translate3d(0, 0, 0) scale(1); pointer-events: auto; }
.notif-universal__accent { background: linear-gradient(180deg, #60a5fa, #2563eb); }
.notif-universal__content { min-width: 0; padding: 14px 12px 14px 15px; }
.notif-universal__title { color: #0f172a; font-size: 14px; font-weight: 800; }
.notif-universal__message { margin-top: 3px; color: #475569; font-size: 12px; line-height: 1.45; white-space: pre-line; overflow-wrap: anywhere; }
.notif-universal__close {
    align-self: flex-start;
    width: 32px;
    height: 32px;
    margin: 9px 9px 0 0;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: #f8fafc;
    color: #475569;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
}
.notif-universal__close:hover { background: #e2e8f0; color: #0f172a; }
.notif-universal.is-success .notif-universal__accent { background: linear-gradient(180deg, #4ade80, #16a34a); }
.notif-universal.is-error .notif-universal__accent { background: linear-gradient(180deg, #f87171, #dc2626); }
.notif-universal.is-warning .notif-universal__accent { background: linear-gradient(180deg, #facc15, #ca8a04); }

:root[data-theme="dark"] .notif-universal { border-color: rgba(71, 85, 105, .85); background: rgba(15, 23, 42, .94); box-shadow: 0 20px 48px rgba(2, 8, 23, .5); }
:root[data-theme="dark"] .notif-universal__title { color: #f8fafc; }
:root[data-theme="dark"] .notif-universal__message { color: #cbd5e1; }
:root[data-theme="dark"] .notif-universal__close { background: #1e293b; color: #cbd5e1; }

@media (max-width: 560px) {
    .notif-universal { top: 12px; right: 12px; width: calc(100vw - 24px); }
}

.laporan-admin-match {
    display: grid;
    gap: 18px;
}

.laporan-admin-match__overview {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 20px 22px;
    border: 1px solid #cfe1f4;
    border-radius: 22px;
    background: linear-gradient(125deg, #f8fbff 0%, #eff8ff 58%, #edfdf5 100%);
}

.laporan-admin-match__overview > div:first-child { display: grid; gap: 4px; }
.laporan-admin-match__overview span { color: #2563eb; font-size: 11px; font-weight: 800; letter-spacing: .12em; }
.laporan-admin-match__overview strong { color: #0f172a; font-size: 24px; }
.laporan-admin-match__overview small { color: #64748b; font-size: 12px; }
.laporan-admin-match__health {
    display: grid;
    place-items: center;
    min-width: 118px;
    padding: 12px 16px;
    border-radius: 18px;
    background: #dcfce7;
    color: #15803d;
}
.laporan-admin-match__health.has-issue { background: #fff1d6; color: #b45309; }
.laporan-admin-match__health strong { color: inherit; font-size: 28px; line-height: 1; }
.laporan-admin-match__health span { color: inherit; letter-spacing: 0; }

.laporan-admin-match__cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
    gap: 12px;
}
.laporan-admin-match-card {
    padding: 16px;
    border: 1px solid #cfe1f4;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(30, 64, 175, .07);
}
.laporan-admin-match-card.has-issue { border-color: #f5c66d; background: linear-gradient(145deg, #fff, #fff9ec); }
.laporan-admin-match-card.is-ok { border-color: #a7e7c0; }
.laporan-admin-match-card header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.laporan-admin-match-card header div { display: grid; gap: 2px; }
.laporan-admin-match-card header span { color: #2563eb; font-size: 10px; font-weight: 800; letter-spacing: .12em; }
.laporan-admin-match-card header strong { color: #0f172a; font-size: 17px; }
.laporan-admin-match-card header b { padding: 5px 8px; border-radius: 999px; background: #dcfce7; color: #15803d; font-size: 10px; }
.laporan-admin-match-card.has-issue header b { background: #ffedbf; color: #a84b08; }
.laporan-admin-match-card__values { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 14px; }
.laporan-admin-match-card__values p { min-width: 0; margin: 0; padding: 10px; border-radius: 13px; background: #f6f9fd; }
.laporan-admin-match-card__values span,
.laporan-admin-match-card__values small { display: block; color: #64748b; font-size: 10px; }
.laporan-admin-match-card__values strong { display: block; margin: 3px 0; overflow: hidden; color: #0f172a; font-size: 15px; text-overflow: ellipsis; }
.laporan-admin-match-card footer { margin-top: 11px; overflow: hidden; color: #64748b; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }

.laporan-admin-match__toolbar {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 14px;
}
.laporan-admin-match__toolbar > div { display: grid; gap: 2px; }
.laporan-admin-match__toolbar strong { color: #0f172a; font-size: 17px; }
.laporan-admin-match__toolbar span { color: #64748b; font-size: 11px; }
.laporan-admin-match__toolbar label { display: grid; gap: 4px; width: min(360px, 100%); }
.laporan-admin-match__toolbar input {
    width: 100%;
    min-height: 42px;
    padding: 0 14px;
    border: 1px solid #cbdcf0;
    border-radius: 13px;
    background: #fff;
    color: #0f172a;
    font: inherit;
}
.laporan-admin-match__table-wrap { overflow: auto; border: 1px solid #d6e3f2; border-radius: 18px; }
.laporan-admin-match__table { width: 100%; min-width: 1050px; border-collapse: collapse; background: #fff; }
.laporan-admin-match__table th { padding: 11px 12px; background: #eff6ff; color: #51627a; font-size: 10px; letter-spacing: .06em; text-align: left; text-transform: uppercase; }
.laporan-admin-match__table td { padding: 10px 12px; border-top: 1px solid #e4edf7; color: #1e293b; font-size: 12px; }
.laporan-admin-match__table tr.has-issue { background: #fffaf0; }
.laporan-admin-match__table tr.is-ok { background: #fbfffd; }
.laporan-admin-match__table td button { display: block; max-width: 190px; overflow: hidden; padding: 0; border: 0; background: transparent; color: #0f3f91; font: inherit; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; cursor: copy; }
.laporan-admin-match__table td small { display: block; margin-top: 2px; color: #718096; font-size: 10px; }
.laporan-admin-match__table td.is-different { color: #dc2626; font-weight: 800; }
.laporan-admin-match-status { display: inline-flex; padding: 5px 8px; border-radius: 999px; background: #dcfce7; color: #15803d; font-size: 10px; font-weight: 800; white-space: nowrap; }
.laporan-admin-match-status:not(.status-sesuai) { background: #ffedbf; color: #a84b08; }
.laporan-admin-match-status.status-data_ganda,
.laporan-admin-match-status.status-laporan_berbeda,
.laporan-admin-match-status.status-excel_berbeda { background: #fee2e2; color: #b91c1c; }

.laporan-admin-match__comparisons { display: grid; gap: 14px; }
.laporan-admin-compare {
    overflow: hidden;
    border: 1px solid #cfe1f4;
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 14px 32px rgba(30, 64, 175, .07);
}
.laporan-admin-compare.has-issue { border-color: #f2bd60; }
.laporan-admin-compare.is-ok { border-color: #9cdeb7; }
.laporan-admin-compare > header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 15px 18px;
    background: linear-gradient(110deg, #edf6ff, #f3fff8);
}
.laporan-admin-compare > header > div:first-child { display: grid; gap: 2px; }
.laporan-admin-compare > header span { color: #2563eb; font-size: 10px; font-weight: 850; letter-spacing: .12em; }
.laporan-admin-compare > header strong { color: #0f172a; font-size: 17px; }
.laporan-admin-compare > header small { color: #64748b; font-size: 11px; }
.laporan-admin-compare__state { display: grid; justify-items: end; gap: 4px; }
.laporan-admin-compare__state b { padding: 5px 9px; border-radius: 999px; background: #dcfce7; color: #15803d; font-size: 10px; }
.laporan-admin-compare.has-issue .laporan-admin-compare__state b { background: #ffedbf; color: #a84b08; }
.laporan-admin-compare__state small { max-width: 230px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.laporan-admin-compare__sides { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.16fr); }
.laporan-admin-compare__sides > section { min-width: 0; padding: 14px 16px 16px; }
.laporan-admin-compare__sides > section + section { border-left: 1px solid #dce8f5; background: #fbfdff; }
.laporan-admin-compare__side-title { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.laporan-admin-compare__side-title strong { color: #0f172a; font-size: 14px; }
.laporan-admin-compare__side-title span { color: #58708d; font-size: 10px; }
.laporan-admin-compare__source { display: grid; min-width: 0; gap: 2px; }
.laporan-admin-compare__source small { max-width: 360px; overflow: hidden; color: #64748b; font-size: 10px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.laporan-shop-summary__basic { display: grid; gap: 2px; margin-bottom: 10px; }
.laporan-shop-summary__basic > div {
    display: grid;
    grid-template-columns: minmax(145px, 1fr) 105px 58px;
    align-items: center;
    gap: 7px;
    min-height: 30px;
    padding: 4px 8px;
    border-bottom: 1px solid #edf2f7;
    color: #334155;
    font-size: 10px;
}
.laporan-shop-summary__basic strong,
.laporan-shop-summary__basic b { text-align: right; }
.laporan-shop-summary__basic strong { color: #0f172a; font-size: 11px; }
.laporan-shop-summary__basic b { color: #718096; font-size: 9px; font-weight: 750; }
.laporan-shop-summary__section-title {
    display: grid;
    grid-template-columns: minmax(145px, 1fr) 105px;
    align-items: center;
    gap: 7px;
    min-height: 32px;
    margin-top: 8px;
    padding: 6px 9px;
    border-radius: 9px;
    background: #dceeff;
    color: #17365d;
    font-size: 9px;
}
.laporan-shop-summary__section-title span { text-align: right; font-weight: 800; }
.laporan-shop-summary__section-title.is-admin { grid-template-columns: minmax(145px, 1fr) 105px 58px; }
.laporan-shop-summary__section-title.is-asp { grid-template-columns: minmax(135px, 1fr) 86px 100px 58px; }
.laporan-shop-summary__withdrawals { display: grid; }
.laporan-shop-summary__withdrawals > div {
    display: grid;
    grid-template-columns: minmax(145px, 1fr) 105px;
    align-items: center;
    gap: 7px;
    min-height: 29px;
    padding: 4px 9px;
    border-bottom: 1px solid #edf2f7;
    color: #475569;
    font-size: 10px;
}
.laporan-shop-summary__withdrawals strong { color: #0f172a; text-align: right; }
.laporan-shop-summary__withdrawals .is-subtotal { margin-top: 2px; border: 0; border-radius: 9px; background: #eef9f2; color: #166534; font-weight: 850; }
.laporan-shop-summary__admin-row { grid-template-columns: minmax(145px, 1fr) 105px 58px; }
.laporan-shop-summary__asp-row { grid-template-columns: minmax(135px, 1fr) 86px 100px 58px; }
.laporan-shop-summary__uncleared {
    display: grid;
    grid-template-columns: minmax(145px, 1fr) 105px;
    align-items: center;
    gap: 7px;
    min-height: 34px;
    margin: 10px 0;
    padding: 7px 9px;
    border-radius: 10px;
    background: #fff6da;
    color: #854d0e;
    font-size: 10px;
    font-weight: 850;
}
.laporan-shop-summary__uncleared strong { display: inline-flex; align-items: center; justify-content: flex-end; gap: 6px; color: #713f12; text-align: right; }
.laporan-admin-match-check { display: inline-grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; background: #16a34a; color: #fff; font-size: 11px; font-style: normal; line-height: 1; cursor: help; box-shadow: 0 3px 8px rgba(22, 163, 74, .25); }
.laporan-admin-match-check.is-question { background: #f59e0b; box-shadow: 0 3px 8px rgba(245, 158, 11, .25); }
.laporan-admin-compare__group-row.is-check > strong,
.laporan-admin-compare__total.is-check > strong { display: inline-flex; align-items: center; justify-content: flex-end; gap: 6px; }
.laporan-admin-compare__group-head,
.laporan-admin-compare__group-row,
.laporan-admin-compare__total {
    display: grid;
    grid-template-columns: minmax(155px, 1fr) 54px 105px;
    align-items: center;
    gap: 8px;
    min-height: 34px;
    padding: 6px 9px;
}
.laporan-admin-compare__group-head.is-check,
.laporan-admin-compare__group-row.is-check,
.laporan-admin-compare__total.is-check { grid-template-columns: minmax(180px, 1fr) 50px 100px 100px; }
.laporan-admin-compare__group-head { border-radius: 9px; background: #e8f2ff; color: #52647b; font-size: 9px; font-weight: 850; letter-spacing: .05em; text-transform: uppercase; }
.laporan-admin-compare__group-row { border-bottom: 1px solid #edf2f7; color: #334155; font-size: 11px; }
.laporan-admin-compare__group-row b,
.laporan-admin-compare__group-row strong,
.laporan-admin-compare__total b,
.laporan-admin-compare__total strong { text-align: right; }
.laporan-admin-compare__group-row b { color: #64748b; font-size: 11px; }
.laporan-admin-compare__group-row strong { color: #0f172a; font-size: 11px; }
.laporan-admin-compare__group-row > strong { display: inline-flex; align-items: center; justify-content: flex-end; gap: 7px; }
.laporan-admin-compare__group-row.is-clickable { cursor: pointer; transition: background .18s ease, box-shadow .18s ease; }
.laporan-admin-compare__group-row.is-clickable:hover,
.laporan-admin-compare__group-row.is-clickable:focus-visible { outline: 0; background: #effaf3; box-shadow: inset 3px 0 #22a55a; }
.laporan-admin-compare__group-row em { display: inline-flex; margin-left: 6px; padding: 2px 6px; border-radius: 999px; background: #fee2e2; color: #b91c1c; font-size: 8px; font-style: normal; font-weight: 850; vertical-align: middle; cursor: pointer; }
.laporan-admin-compare__group-row em:hover,
.laporan-admin-compare__group-row em:focus-visible { outline: 2px solid rgba(220, 38, 38, .24); background: #fecaca; }
.laporan-admin-included-badge { display: inline-flex; margin-left: 6px; padding: 2px 6px; border: 0; border-radius: 999px; background: #dcfce7; color: #15803d; font: inherit; font-size: 8px; font-weight: 800; vertical-align: middle; cursor: pointer; }
.laporan-admin-included-badge:hover,
.laporan-admin-included-badge:focus-visible { outline: 2px solid rgba(22, 163, 74, .24); background: #bbf7d0; }
.laporan-admin-compare__group-name { display: grid; gap: 1px; min-width: 0; }
.laporan-admin-compare__group-name b { color: #334155; text-align: left; }
.laporan-admin-compare__group-name small { overflow: hidden; color: #718096; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.laporan-admin-period-tag { display: inline-flex; align-items: center; margin-left: 5px; padding: 2px 6px; border-radius: 999px; background: #dcfce7; color: #15803d; font-size: 8px; font-style: normal; font-weight: 800; line-height: 1.2; vertical-align: middle; white-space: nowrap; }
.laporan-admin-compare__total { margin-top: 5px; border-radius: 10px; background: #e9f8ee; color: #106b35; font-size: 11px; font-weight: 850; }
.laporan-admin-compare__expense { display: grid; grid-template-columns: minmax(170px, 1fr) 120px; align-items: center; gap: 10px; margin-top: 7px; padding: 8px 10px; border-radius: 10px; background: #f4f8fc; color: #24364d; }
.laporan-admin-compare__expense span { display: grid; gap: 1px; min-width: 0; }
.laporan-admin-compare__expense b { font-size: 11px; }
.laporan-admin-compare__expense small { color: #718198; font-size: 9px; font-weight: 500; }
.laporan-admin-compare__expense > strong { display: inline-flex; align-items: center; justify-content: flex-end; gap: 8px; text-align: right; font-size: 12px; }
.laporan-admin-compare__expense.is-difference.is-match { background: #eaf8ef; color: #106b35; }
.laporan-admin-compare__expense.is-difference.has-difference { background: #fff4e5; color: #a4490a; }
.laporan-admin-match__table { min-width: 1320px; }

.laporan-admin-pair-modal {
    width: min(1120px, calc(100vw - 28px));
    max-height: min(88vh, 860px);
    padding: 0;
    border: 0;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 28px 80px rgba(15, 23, 42, .28);
    overflow: hidden;
}
.laporan-admin-pair-modal::backdrop { background: rgba(15, 23, 42, .58); backdrop-filter: blur(5px); }
.laporan-admin-pair-modal__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; padding: 14px 17px; border-bottom: 1px solid #dce8f5; background: linear-gradient(120deg, #eef7ff, #effcf4); }
.laporan-admin-pair-modal__head > div { display: grid; gap: 3px; }
.laporan-admin-pair-modal__head span { color: #2563eb; font-size: 10px; font-weight: 850; letter-spacing: .12em; }
.laporan-admin-pair-modal__head h3 { margin: 0; color: #0f172a; font-size: 19px; }
.laporan-admin-pair-modal__head small { color: #64748b; font-size: 11px; }
.laporan-admin-pair-modal__head button { display: grid; place-items: center; width: 34px; height: 34px; padding: 0; border: 1px solid #cbdcf0; border-radius: 11px; background: #fff; color: #334155; font-size: 21px; cursor: pointer; }
.laporan-admin-pair-modal__body { display: grid; gap: 9px; max-height: calc(88vh - 132px); padding: 12px 14px; overflow: auto; background: #f8fbff; }
.laporan-admin-pair-item { overflow: hidden; border: 1px solid #f2c36f; border-radius: 17px; background: #fffdf8; }
.laporan-admin-pair-item > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 14px; border-bottom: 1px solid #f6dfb5; }
.laporan-admin-pair-item > header > div { display: grid; gap: 1px; }
.laporan-admin-pair-item > header strong { color: #0f3f91; font-size: 13px; }
.laporan-admin-pair-item > header small { color: #718096; font-size: 9px; }
.laporan-admin-pair-item > header b { padding: 5px 8px; border-radius: 999px; background: #fee2e2; color: #b91c1c; font-size: 10px; }
.laporan-admin-pair-item__sides { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.laporan-admin-pair-item__sides > section { min-width: 0; padding: 12px 14px 14px; }
.laporan-admin-pair-item__sides > section + section { border-left: 1px solid #e4edf7; background: #fbfdff; }
.laporan-admin-pair-item__sides > section.is-missing { background: #fff1f2; }
.laporan-admin-pair-item__sides > section > span { color: #2563eb; font-size: 9px; font-weight: 850; letter-spacing: .08em; }
.laporan-admin-pair-item__sides dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; margin: 9px 0 0; }
.laporan-admin-pair-item__sides dl div { min-width: 0; padding: 8px 9px; border-radius: 10px; background: #f4f8fc; }
.laporan-admin-pair-item__sides dt { color: #718096; font-size: 9px; }
.laporan-admin-pair-item__sides dd { margin: 2px 0 0; overflow-wrap: anywhere; color: #172033; font-size: 11px; font-weight: 750; }
.laporan-admin-pair-modal__foot { display: flex; justify-content: flex-end; padding: 9px 14px; border-top: 1px solid #dce8f5; background: #fff; }
.laporan-admin-pair-modal__foot button { min-height: 38px; padding: 0 17px; border: 1px solid #bed5f0; border-radius: 12px; background: #eef6ff; color: #1456b8; font-weight: 750; cursor: pointer; }
.laporan-admin-group-list { display: grid; gap: 6px; }
.laporan-admin-group-item { display: grid; grid-template-columns: minmax(175px, 1.25fr) repeat(3, minmax(112px, .8fr)); align-items: stretch; gap: 6px; min-height: 54px; padding: 7px 8px; border: 1px solid #dce8f5; border-radius: 12px; background: #fff; box-shadow: 0 4px 13px rgba(37, 99, 235, .04); }
.laporan-admin-group-item > div { min-width: 0; }
.laporan-admin-group-item__identity { display: grid; gap: 1px; }
.laporan-admin-group-item__identity strong { overflow: hidden; color: #0f3f91; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.laporan-admin-group-item__identity small { overflow: hidden; color: #718096; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.laporan-admin-group-item > div:not(.laporan-admin-group-item__identity) { display: grid; align-content: center; gap: 2px; padding: 5px 7px; border-radius: 8px; background: #f3f7fc; }
.laporan-admin-group-item span { color: #718096; font-size: 8px; }
.laporan-admin-group-item b { overflow: hidden; color: #172033; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.laporan-admin-compare__group-row.laporan-shop-summary__admin-row,
.laporan-admin-compare__total.laporan-shop-summary__admin-row { grid-template-columns: minmax(145px, 1fr) 105px 58px; }
.laporan-admin-compare__group-row.laporan-shop-summary__asp-row,
.laporan-admin-compare__total.laporan-shop-summary__asp-row { grid-template-columns: minmax(135px, 1fr) 86px 100px 58px; }
.laporan-admin-source-badge {
    display: inline-grid;
    place-items: center;
    width: 17px;
    height: 17px;
    margin-right: 4px;
    border-radius: 5px;
    background: #e2e8f0;
    color: #475569;
    font-size: 9px;
    font-style: normal;
    font-weight: 900;
    line-height: 1;
    vertical-align: middle;
}
.laporan-admin-source-badge.is-e { background: color-mix(in srgb, var(--appku-badge-e, #087748) 16%, white); color: var(--appku-badge-e, #087748); }
.laporan-admin-source-badge.is-n { background: color-mix(in srgb, var(--appku-badge-n, #c33232) 16%, white); color: var(--appku-badge-n, #c33232); }
.laporan-admin-source-badge.is-p { background: color-mix(in srgb, var(--appku-badge-p, #2059a8) 16%, white); color: var(--appku-badge-p, #2059a8); }
.laporan-admin-copy {
    max-width: 100%;
    overflow: hidden;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    font-weight: inherit;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: copy;
}
.laporan-admin-copy:hover,
.laporan-admin-copy:focus-visible { outline: 0; color: #2563eb; text-decoration: underline; text-underline-offset: 2px; }
.laporan-admin-data-status {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    padding: 3px 6px 3px 3px;
    border-radius: 999px;
    background: #edf9f1;
    color: #18733d;
    font-size: 8px;
    font-style: normal;
    font-weight: 800;
    white-space: nowrap;
}
.laporan-admin-data-status .laporan-admin-source-badge { width: 14px; height: 14px; margin-right: 3px; border-radius: 50%; font-size: 7px; }
.laporan-admin-value-with-status { display: flex; align-items: center; gap: 5px; min-width: 0; }
.laporan-admin-value-with-status .laporan-admin-copy { min-width: 0; }
.laporan-admin-group-item__identity { align-content: center; padding: 6px 7px; border-radius: 9px; background: #eef6ff; }
.laporan-admin-group-item__identity > span { display: flex; align-items: center; }
.laporan-admin-group-item__identity strong { display: block; min-width: 0; }
.laporan-admin-group-item__note { grid-column: 1 / -1; }
.laporan-admin-group-item__note b { overflow: visible; text-overflow: clip; white-space: normal; }
.laporan-admin-pair-item__sides dl div.is-wide { grid-column: 1 / -1; }
.laporan-admin-pair-item__sides dt { display: flex; align-items: center; }
.laporan-admin-pair-item__sides dd .laporan-admin-copy { color: #0f3f91; }

@media (max-width: 760px) {
    .laporan-admin-match__overview,
    .laporan-admin-match__toolbar { align-items: stretch; flex-direction: column; }
    .laporan-admin-match__health { width: 100%; }
    .laporan-admin-match-card__values { grid-template-columns: 1fr; }
    .laporan-admin-compare > header { flex-direction: column; }
    .laporan-admin-compare__state { justify-items: start; }
    .laporan-admin-compare__sides { grid-template-columns: 1fr; }
    .laporan-admin-compare__sides > section + section { border-top: 1px solid #dce8f5; border-left: 0; }
    .laporan-admin-pair-item__sides { grid-template-columns: 1fr; }
    .laporan-admin-pair-item__sides > section + section { border-top: 1px solid #e4edf7; border-left: 0; }
    .laporan-admin-pair-item__sides dl { grid-template-columns: 1fr; }
    .laporan-admin-group-item { grid-template-columns: 1fr; }
    .laporan-admin-group-item__note { grid-column: auto; }
    .laporan-shop-summary__section-title.is-admin,
    .laporan-admin-compare__group-row.laporan-shop-summary__admin-row,
    .laporan-admin-compare__total.laporan-shop-summary__admin-row { grid-template-columns: minmax(110px, 1fr) 82px 44px; gap: 4px; }
    .laporan-shop-summary__section-title.is-asp,
    .laporan-admin-compare__group-row.laporan-shop-summary__asp-row,
    .laporan-admin-compare__total.laporan-shop-summary__asp-row { grid-template-columns: minmax(105px, 1fr) 66px 76px 42px; gap: 4px; }
}