@media (max-width: 1180px) {
    .summary-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .type-choice-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
    .dashboard-grid { grid-template-columns:1fr; }
    .filter-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .filter-button { align-self:end; }
}

@media (max-width: 900px) {
    :root { --header-height:72px; }
    .header-container { padding:9px 16px; }
    .menu-button { display:flex; }
    .user-text { display:none; }
    .app-sidebar {
        position:fixed; top:0; left:0; bottom:0; z-index:1100;
        width:min(325px,88vw); height:100vh; padding-top:17px;
        box-shadow:15px 0 35px rgba(15,48,80,.2);
        transform:translateX(-105%);
    }
    .app-sidebar.open { transform:translateX(0); }
    .sidebar-overlay.show { visibility:visible; opacity:1; }
    .sidebar-close { display:grid; place-items:center; }
    .main-content { width:100%; padding:23px 19px; }
    .profile-grid { grid-template-columns:1fr; }
    .password-card { position:static; }
    .auth-shell,.auth-shell-wide { grid-template-columns:1fr; }
    .auth-intro { min-height:330px; padding:32px; }
    .auth-copy { padding:45px 0 20px; }
    .auth-copy h1 { font-size:30px; }
    .auth-card { margin:32px auto; }
}

@media (max-width: 650px) {
    :root { --header-height:66px; }
    body { padding-bottom:68px; }
    .header-container { min-height:var(--header-height); padding:7px 11px; gap:8px; }
    .header-left { gap:7px; }
    .brand-logo-image { width:42px; height:42px; border-radius:12px; }
    .brand-text strong { max-width:145px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:14px; }
    .brand-text small { max-width:145px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:9px; }
    .user-info { display:none; }
    .logout-button { width:43px; min-width:43px; height:43px; padding:0; }
    .logout-text { display:none; }
    .main-content { padding:18px 12px 24px; }
    .page-header { align-items:flex-start; flex-direction:column; gap:12px; margin-bottom:17px; }
    .page-title h1 { font-size:23px; }
    .page-title p { font-size:12px; }
    .current-date { width:100%; min-width:0; align-items:flex-start; text-align:left; }
    .button-row,.page-actions { width:100%; }
    .button-row .btn,.page-actions .btn { flex:1; }
    .summary-grid,.summary-grid-three { grid-template-columns:1fr; gap:11px; }
    .summary-card { padding:15px; }
    .summary-icon { width:44px; height:44px; }
    .summary-content strong { font-size:19px; }
    .action-grid,.report-menu-grid,.report-mini-grid,.detail-grid,.balance-sheet-grid,.profile-grid { grid-template-columns:1fr; }
    .action-card { min-height:86px; padding:15px; }
    .panel-card,.form-card,.financial-report { padding:15px; border-radius:15px; }
    .panel-header { flex-direction:column; gap:7px; }
    .form-grid,.form-grid-two { grid-template-columns:1fr; gap:14px; }
    .form-span-two,.field-group.full { grid-column:auto; }
    .type-choice-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .type-choice { min-height:84px; padding:10px; }
    .type-choice strong { font-size:11px; }
    .choice-grid.two { grid-template-columns:1fr; }
    .form-actions { flex-direction:column-reverse; }
    .form-actions .btn,.btn-block-mobile { width:100%; }
    .filter-grid { grid-template-columns:1fr; }
    .filter-bar,.period-filter { align-items:stretch; flex-direction:column; }
    .field-group.compact { min-width:0; width:100%; }
    .period-filter .btn,.filter-bar .btn { width:100%; }
    .responsive-table { overflow:visible; }
    .data-table,.data-table tbody,.data-table tr,.data-table td { display:block; width:100%; }
    .data-table thead { display:none; }
    .data-table tr {
        margin-bottom:11px; padding:11px;
        background:#fff; border:1px solid var(--border); border-radius:13px;
    }
    .data-table td {
        min-height:37px; padding:7px 0; display:flex; align-items:center; justify-content:space-between; gap:13px;
        border-bottom:1px dashed #e2ebf3; text-align:right;
    }
    .data-table td:last-child { border-bottom:0; }
    .data-table td::before {
        content:attr(data-label); flex:0 0 38%; color:var(--muted);
        font-size:9px; font-weight:800; text-align:left; text-transform:uppercase;
    }
    .data-table td > * { max-width:60%; }
    .table-actions { justify-content:flex-end; }
    .transaction-item { align-items:flex-start; }
    .transaction-amount { font-size:11px; }
    .detail-list > div,.info-list > div { align-items:flex-start; }
    .financial-report-header { padding-bottom:16px; }
    .report-row { padding:8px 3px; font-size:10px; }
    .report-row > span:first-child { max-width:65%; }
    .report-result { font-size:13px; }
    .auth-intro { min-height:275px; padding:24px 19px; }
    .auth-copy { padding:36px 0 12px; }
    .auth-copy h1 { font-size:25px; }
    .auth-copy p { font-size:12px; }
    .auth-card { width:calc(100% - 24px); margin:18px auto; padding:21px 17px; border-radius:17px; }
    .auth-card-header h2 { font-size:21px; }
    .app-footer { display:none; }
    .mobile-navbar {
        position:fixed; left:0; right:0; bottom:0; z-index:1050;
        height:68px; padding:7px 8px max(7px,env(safe-area-inset-bottom));
        display:grid; grid-template-columns:repeat(4,1fr); align-items:center;
        background:rgba(255,255,255,.97); border-top:1px solid var(--border);
        box-shadow:0 -7px 22px rgba(24,83,141,.11); backdrop-filter:blur(10px);
    }
    .mobile-navbar a {
        height:52px; display:flex; flex-direction:column; align-items:center; justify-content:center;
        gap:2px; color:var(--muted); text-decoration:none;
    }
    .mobile-navbar a span { font-size:18px; }
    .mobile-navbar a small { font-size:8px; font-weight:700; }
    .mobile-navbar a.active { color:var(--primary); }
    .mobile-navbar .mobile-add span {
        width:37px; height:37px; display:grid; place-items:center; margin-top:-20px;
        color:#fff; background:linear-gradient(135deg,var(--primary),var(--primary-dark));
        border:4px solid #fff; border-radius:50%; box-shadow:0 7px 15px rgba(23,105,224,.3);
        font-size:24px;
    }
    .toast-stack { top:75px; right:10px; width:calc(100vw - 20px); }
}

@media (max-width: 390px) {
    .brand-text strong,.brand-text small { max-width:108px; }
    .type-choice-grid { grid-template-columns:1fr; }
    .transaction-item { flex-wrap:wrap; }
    .transaction-amount { width:100%; padding-left:52px; }
}

@media print {
    @page { size:A4; margin:16mm; }
    body { padding:0 !important; background:#fff; color:#000; }
    .app-header,.app-sidebar,.app-footer,.mobile-navbar,.no-print,.toast-stack,.help-modal { display:none !important; }
    .app-layout,.main-content,.page-container,.report-container { display:block; width:100%; max-width:none; padding:0; margin:0; }
    .print-only { display:block; }
    .financial-report,.panel-card,.summary-card { box-shadow:none; border-color:#bbb; break-inside:avoid; }
    .financial-report { padding:0; border:0; }
    .summary-grid { grid-template-columns:repeat(2,1fr); }
    .summary-card-highlight,.summary-card-danger { color:#000; background:#fff; border:1px solid #bbb; }
    .summary-card-highlight .summary-content strong,.summary-card-danger .summary-content strong,
    .summary-card-highlight .summary-content span,.summary-card-danger .summary-content span,
    .summary-card-highlight .summary-content small,.summary-card-danger .summary-content small { color:#000; }
    a { text-decoration:none; }
}

/* ==================================================
   AUTH LOGIN & PEMULIHAN RESPONSIVE
================================================== */

@media (max-width: 900px) {
    .auth-shell-login {
        grid-template-columns: minmax(250px, .72fr) minmax(400px, 1.28fr);
    }

    .auth-intro-login {
        min-height: 100vh;
        padding: 30px;
    }

    .auth-copy-login {
        padding: 58px 0 20px;
    }

    .auth-copy-login h1 {
        font-size: 30px;
    }

    .auth-feature-list small {
        display: none;
    }

    .auth-card-login {
        margin: 0;
    }
}

@media (max-width: 760px) {
    .auth-login-body {
        padding-bottom: 0;
    }

    .auth-shell-login {
        display: flex;
        flex-direction: column;
        min-height: 100vh;
    }

    .auth-intro-login {
        min-height: 184px;
        padding: 21px 20px 30px;
        justify-content: flex-start;
    }

    .auth-intro-login::before {
        width: 190px;
        height: 190px;
        right: -95px;
        bottom: -82px;
    }

    .auth-intro-login::after {
        display: none;
    }

    .auth-intro-login .auth-brand img {
        width: 44px;
        height: 44px;
        border-radius: 13px;
    }

    .auth-copy-login {
        padding: 26px 0 0;
    }

    .auth-copy-login h1 {
        max-width: 460px;
        font-size: 25px;
    }

    .auth-copy-login p {
        max-width: 480px;
        margin-top: 9px;
        font-size: 11px;
        line-height: 1.65;
    }

    .auth-feature-list,
    .auth-intro-login .auth-watermark {
        display: none;
    }

    .auth-form-side {
        flex: 1;
        justify-content: flex-start;
        padding: 0 12px 24px;
    }

    .auth-card-login,
    .auth-card-recovery {
        width: min(440px, 100%);
        margin-top: -18px;
        padding: 24px 18px 21px;
        border-radius: 18px;
    }

    .auth-card-mark {
        width: 46px;
        height: 46px;
        margin-bottom: 12px;
    }

    .auth-card-header-center {
        margin-bottom: 17px;
    }

    .auth-card-header-center h2 {
        font-size: 21px;
    }

    .auth-security-note {
        margin-bottom: 0;
    }
}

@media (max-width: 390px) {
    .auth-intro-login {
        min-height: 172px;
        padding: 18px 16px 27px;
    }

    .auth-copy-login {
        padding-top: 21px;
    }

    .auth-copy-login h1 {
        font-size: 22px;
    }

    .auth-copy-login p {
        display: none;
    }

    .auth-card-login,
    .auth-card-recovery {
        padding-right: 15px;
        padding-left: 15px;
    }

    .form-label-row {
        align-items: flex-start;
    }
}