/* CUTSAPAY — Navy / Cyan / Gold. Screen only: printed receipts keep their format. */
@media screen {
html.cutsa-navy {color-scheme:dark;background:#041024;--navy-base:#041024;--navy-panel:#0a1d3c;--navy-ink:#f1f6ff;--navy-muted:#b0c3e0;--navy-cyan:#22d3ee;--navy-gold:#ffc638}
html.cutsa-navy body {background-color:#041024!important;background-image:radial-gradient(ellipse at 100% 0%,#0755a750 0%,transparent 42%),radial-gradient(ellipse at 0% 65%,#00bcd424 0%,transparent 40%),linear-gradient(155deg,#041127,#061a37 48%,#030d20)!important;background-attachment:fixed!important;color:var(--navy-ink)!important;min-height:100vh;min-height:100dvh}
html.cutsa-navy body::before {content:"";position:fixed;inset:0;pointer-events:none;z-index:0;background:repeating-radial-gradient(ellipse at 135% -20%,transparent 0px,transparent 178px,#27b8ff0b 179px,transparent 180px,transparent 220px)}
html.cutsa-navy .top-nav {position:relative;background:linear-gradient(110deg,#06142bf5,#0b2850f5)!important;border-bottom:1px solid #285b9170!important;box-shadow:0 6px 26px #00000020;z-index:2}
html.cutsa-navy .nav-wrapper {gap:12px}
html.cutsa-navy .brand {min-width:0;gap:10px}
html.cutsa-navy .brand-text h1 {font-size:clamp(15px,4.2vw,21px);white-space:nowrap}
html.cutsa-navy .brand-text p,html.cutsa-navy #user-name {color:#ffda71!important;font-size:12px!important;line-height:1.5;overflow-wrap:anywhere}
html.cutsa-navy .brand-text h1 span:first-child {color:#37a0ff!important}
html.cutsa-navy .brand-text h1 span:last-child {color:#ffd052!important}
html.cutsa-navy .header-actions,html.cutsa-navy .header-actions-fix {display:flex;align-items:center;gap:8px;flex-shrink:0}
html.cutsa-navy .header-actions .bell-wrapper,html.cutsa-navy .header-actions .bell-icon,html.cutsa-navy .header-actions-fix .bell-wrapper,html.cutsa-navy .header-actions-fix .bell-icon {position:relative!important;top:auto!important;right:auto!important;width:39px!important;height:39px!important;display:flex!important;align-items:center;justify-content:center;border-radius:12px!important;background:linear-gradient(145deg,#102f59,#091b37)!important;border:1px solid #305b90!important;color:#d3eaff!important;box-shadow:inset 0 1px #ffffff0b!important}
html.cutsa-navy .header-actions i,html.cutsa-navy .header-actions-fix i {color:#d3eaff!important}
html.cutsa-navy .theme-toggle-wrapper {display:none!important}
html.cutsa-navy .container {position:relative;padding-bottom:110px}
html.cutsa-navy .balance-card {display:grid!important;grid-template-columns:minmax(0,1fr) 104px;align-items:center;gap:18px 8px!important;padding:24px!important;border-radius:24px!important;border:1px solid transparent!important;background:radial-gradient(ellipse at 100% 0%,#ffd05215,transparent 48%),linear-gradient(135deg,#102c59,#071a36 65%,#092143) padding-box,linear-gradient(125deg,#278bda,#265079 45%,#d2a238 100%) border-box!important;box-shadow:0 16px 38px #00000035,inset 0 1px #64ccff26!important;overflow:hidden}
html.cutsa-navy .balance-left {grid-column:1;grid-row:1;min-width:0}
html.cutsa-navy .balance-title {color:#b7ccef!important;font-size:11px!important;letter-spacing:1px!important;font-weight:700!important;margin-bottom:12px!important}
html.cutsa-navy .balance-amount,html.cutsa-navy .balance-amount span {color:#f5f8ff!important;font-size:clamp(25px,7vw,44px)!important;font-weight:800!important;letter-spacing:-.8px;line-height:1.25;overflow-wrap:anywhere}
html.cutsa-navy .balance-amount span:first-child {font-size:.65em!important;letter-spacing:0}
html.cutsa-navy .navy-wallet {grid-column:2;grid-row:1;width:112px;height:112px;max-width:100%;object-fit:contain;justify-self:center;filter:drop-shadow(0 0 14px #0dbdff25);pointer-events:none}
html.cutsa-navy .balance-card-actions {grid-column:1/-1;grid-row:2;min-width:0!important;width:100%}
html.cutsa-navy .action-buttons {gap:10px}
html.cutsa-navy .btn-action {min-width:0;min-height:48px;padding:12px 9px!important;border-radius:13px!important;font-weight:700!important}
html.cutsa-navy .btn-topup {background:linear-gradient(125deg,#ffda25,#ffb000)!important;border:1px solid #ffe375!important;color:#111d2c!important;box-shadow:0 5px 18px #ffbd001e}
html.cutsa-navy .btn-bantuan {background:linear-gradient(135deg,#f1f7ff,#dce7f7)!important;border:1px solid #bfd6f5!important;color:#08172d!important}
html.cutsa-navy .btn-admin {background:linear-gradient(120deg,#ec3545,#c91e31)!important;color:white!important;min-height:46px;border:1px solid #ff69706b!important;border-radius:13px!important}
html.cutsa-navy .section-title-wrap h2 {color:#f4f8ff!important;font-weight:700;font-size:18px}
html.cutsa-navy .section-title-wrap p {color:#afc2df!important;line-height:1.65;font-size:12px!important}
html.cutsa-navy .badge-ppob {background:#073e333f!important;color:#42e4ab!important;border-color:#22ad795c!important}
html.cutsa-navy .badge-vpn {background:#063f573f!important;color:#68e5f6!important;border-color:#24acc768!important}
html.cutsa-navy .vpn-grid {max-width:none!important;gap:12px}
html.cutsa-navy .vpn-item {padding:18px 10px!important;background:linear-gradient(145deg,#0c2548,#071831)!important;border:1px solid #264a73!important;border-radius:19px!important;box-shadow:0 7px 22px #0000001a!important;min-width:0}
html.cutsa-navy .menu-icon-box {background:#0c3858!important;border:1px solid #216684!important;color:#46dcf6!important;border-radius:16px!important}
html.cutsa-navy .menu-title {color:#e8f2ff!important;font-weight:700!important}
html.cutsa-navy .menu-subtitle {display:block!important;color:#a9bfdb!important;font-size:11px!important;overflow-wrap:anywhere}
html.cutsa-navy .bottom-nav {background:linear-gradient(110deg,#06152bf5,#0b2344f5)!important;border-top:1px solid #225c88!important;box-shadow:0 -8px 28px #00000025!important;backdrop-filter:blur(16px);padding-bottom:max(8px,env(safe-area-inset-bottom))!important}
html.cutsa-navy .bottom-nav-item i,html.cutsa-navy .bottom-nav-item span {color:#9cb2d1!important}
html.cutsa-navy .bottom-nav-item.active i,html.cutsa-navy .bottom-nav-item.active span {color:#24d8ee!important}
html.cutsa-navy .bottom-nav-item.active {position:relative;background:linear-gradient(180deg,#0b719e22,transparent);border-radius:14px}
html.cutsa-navy .bottom-nav-item.active::after {content:"";position:absolute;bottom:0;left:30%;right:30%;height:3px;border-radius:8px;background:#26daf0;box-shadow:0 0 12px #26daf070}
html.cutsa-navy .modal-content,html.cutsa-navy .modal-box,html.cutsa-navy .prod-box,html.cutsa-navy .axis-folder,html.cutsa-navy .axis-back {background:#0a1e3c!important;border-color:#2a4b73!important;color:#edf4ff!important}
html.cutsa-navy .form-control,html.cutsa-navy .input-box,html.cutsa-navy .input-tujuan {background:#06152b!important;border-color:#294d75!important;color:#edf4ff!important}
html.cutsa-navy input::placeholder {color:#91a7c4!important}
html.cutsa-navy a:focus-visible,html.cutsa-navy button:focus-visible,html.cutsa-navy input:focus-visible {outline:2px solid #4ddff6;outline-offset:3px}
html.cutsa-navy .navy-otp-link a {font-size:12px!important;color:#6edff1!important}
@media(min-width:768px){html.cutsa-navy .balance-card {grid-template-columns:minmax(0,1fr) 150px;padding:30px!important}html.cutsa-navy .navy-wallet {width:144px;height:144px}html.cutsa-navy .vpn-grid {grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:360px){html.cutsa-navy .top-nav {padding:12px}html.cutsa-navy .container {padding-left:12px;padding-right:12px}html.cutsa-navy .brand img {width:34px!important;height:34px!important}html.cutsa-navy .balance-card {padding:18px!important;grid-template-columns:minmax(0,1fr) 80px}html.cutsa-navy .navy-wallet {width:86px;height:86px}html.cutsa-navy .brand-text p {font-size:10px!important}}
@media(prefers-reduced-motion:reduce){html.cutsa-navy *,html.cutsa-navy *::before,html.cutsa-navy *::after {scroll-behavior:auto!important;transition:none!important;animation:none!important}}
}