*{box-sizing:border-box}:root{color:#10233f;background:#f4f7fb;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}body{margin:0}button,input{font:inherit}button{cursor:pointer}.page-shell{background:radial-gradient(circle at 100% 0,#dbeafe,#0000 32%),linear-gradient(135deg,#eef5ff,#f8fafc);place-items:center;min-height:100vh;padding:24px;display:grid}.auth-card,.loading-card{background:#fff;border:1px solid #e3eaf4;border-radius:24px;width:min(100%,440px);padding:32px;box-shadow:0 20px 60px #0f23411c}.brand{align-items:center;gap:12px;display:flex}.brand-mark{color:#fff;background:#1467d8;border-radius:13px;place-items:center;width:44px;height:44px;font-size:22px;font-weight:800;display:grid}.brand h1{margin:0;font-size:22px}.brand p{color:#6b7c93;margin:3px 0 0;font-size:13px}.auth-heading{margin:34px 0 24px}.auth-heading h2{margin:0 0 8px;font-size:28px}.auth-heading p{color:#667892;margin:0;line-height:1.55}.auth-form{gap:10px;display:grid}.auth-form label{margin-top:8px;font-size:14px;font-weight:700}.input-wrap{background:#fbfdff;border:1px solid #ced9e8;border-radius:12px;align-items:center;gap:10px;min-height:52px;padding:0 14px;display:flex}.input-wrap:focus-within{border-color:#1467d8;box-shadow:0 0 0 3px #1467d81a}.input-wrap input{color:#10233f;background:0 0;border:0;outline:0;flex:1;min-width:0}.eye-button{color:#60738d;background:0 0;border:0;padding:5px}.primary-button,.recharge-button{color:#fff;background:#1467d8;border:0;border-radius:12px;min-height:52px;font-weight:800}.primary-button{margin-top:18px}.primary-button:disabled{opacity:.55;cursor:not-allowed}.first-login-note{color:#536984;background:#f0f6ff;border-radius:12px;gap:4px;margin-top:22px;padding:15px;font-size:13px;display:grid}.alert{border-radius:11px;margin-bottom:16px;padding:13px 15px;font-size:14px}.alert.error{color:#b42318;background:#fef3f2;border:1px solid #fecdca}.alert.success{color:#027a48;background:#ecfdf3;border:1px solid #abefc6}.customer-mini{background:#f6f8fb;border-radius:12px;gap:3px;margin-bottom:16px;padding:14px;display:grid}.customer-mini span{color:#667892;font-size:13px}.dashboard-shell{background:#f4f7fb;min-height:100vh}.topbar{background:#fff;border-bottom:1px solid #e3eaf4;justify-content:space-between;align-items:center;height:76px;padding:0 5vw;display:flex}.brand.compact .brand-mark{border-radius:11px;width:38px;height:38px;font-size:19px}.brand.compact h1{font-size:19px}.logout-button{color:#314663;background:#fff;border:1px solid #d7e0eb;border-radius:10px;align-items:center;gap:7px;padding:10px 14px;font-weight:700;display:flex}.dashboard{width:min(1050px,90vw);margin:0 auto;padding:46px 0 80px}.welcome{margin-bottom:28px}.welcome span,.welcome p{color:#718199}.welcome h2{margin:4px 0;font-size:30px}.welcome p{margin:0}.service-list{gap:20px;display:grid}.service-card{background:#fff;border:1px solid #e0e8f2;border-radius:20px;padding:24px;box-shadow:0 10px 30px #1a324f0f}.service-title{grid-template-columns:auto 1fr auto;align-items:center;gap:13px;display:grid}.service-icon{color:#1467d8;background:#edf5ff;border-radius:14px;place-items:center;width:48px;height:48px;display:grid}.service-title span{color:#6c7f99;font-size:13px}.service-title h3{margin:3px 0 0;font-size:20px}.status{border-radius:999px;padding:6px 10px;font-weight:800;font-size:12px!important}.status.active{color:#087443;background:#e9f9ef}.status.inactive{color:#a62d2d;background:#fdecec}.service-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:25px 0;display:grid}.service-grid div{border:1px solid #e2e9f2;border-radius:12px;padding:14px}.service-grid label{color:#718199;margin-bottom:6px;font-size:12px;font-weight:700;display:block}.service-grid strong{word-break:break-word}.recharge-button{width:100%}.empty-card{background:#fff;border:1px solid #e2e9f2;border-radius:16px;padding:30px}@media (width<=650px){.auth-card{padding:24px 20px}.topbar{padding:0 18px}.dashboard{width:calc(100% - 28px);padding-top:28px}.service-grid{grid-template-columns:1fr}.service-title{grid-template-columns:auto 1fr}.status{grid-column:1/-1;justify-self:start}}.recharge-backdrop{z-index:1000;background:#08182d94;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.recharge-modal{background:#fff;border-radius:22px;width:min(680px,100%);max-height:90vh;padding:28px;overflow-y:auto;box-shadow:0 24px 80px #0000003d}.recharge-header{border-bottom:1px solid #e4eaf2;justify-content:space-between;align-items:flex-start;gap:20px;padding-bottom:20px;display:flex}.recharge-header h2{margin:5px 0 0;font-size:25px}.recharge-kicker{color:#1467d8;letter-spacing:.08em;font-size:12px;font-weight:900}.modal-close{color:#455b76;background:#fff;border:1px solid #d9e2ee;border-radius:11px;width:42px;height:42px;font-size:28px;line-height:1}.recharge-loading{text-align:center;color:#60738d;padding:35px 5px}.recharge-success{color:#027a48;background:#ecfdf3;border:1px solid #abefc6;border-radius:12px;margin:20px 0;padding:14px 16px;font-weight:700}.recharge-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;display:grid}.recharge-grid>div{border:1px solid #dfe7f1;border-radius:12px;padding:14px 16px}.recharge-grid label,.result-details label{color:#718199;margin-bottom:6px;font-size:12px;font-weight:700;display:block}.recharge-grid strong{word-break:break-word;font-size:16px;display:block}.recharge-grid .amount-box{background:#f0f6ff;border-color:#bfd7fb;grid-column:1/-1}.recharge-grid .amount-box strong{color:#115fcb;font-size:28px}.recharge-warning{color:#725b1d;background:#fff8e8;border:1px solid #f4dda4;border-radius:11px;margin:18px 0;padding:13px 15px;font-size:13px;line-height:1.5}.recharge-result{text-align:center;padding-top:25px}.result-check{color:#067647;background:#e8f8ef;border-radius:50%;place-items:center;width:62px;height:62px;margin:0 auto 15px;font-size:31px;font-weight:900;display:grid}.recharge-result h2{margin:0 0 8px}.recharge-result>p{color:#60738d;margin:0 0 22px}.result-details{text-align:left;gap:11px;margin-bottom:20px;display:grid}.result-details>div{border:1px solid #e0e8f2;border-radius:11px;padding:13px 15px}.result-details strong{word-break:break-word}@media (width<=600px){.recharge-modal{padding:21px 17px}.recharge-grid{grid-template-columns:1fr}.recharge-grid .amount-box{grid-column:auto}}