:root{color:#162033;background:#fff;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{background:#fff}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed}.app-shell{min-height:100vh;max-width:430px;margin:0 auto;padding:calc(env(safe-area-inset-top) + 12px) 16px calc(env(safe-area-inset-bottom) + 24px);background:#f5f7fb;position:relative;overflow:hidden}.app-shell:before{content:"";position:absolute;inset:0 0 auto;height:258px;background:radial-gradient(circle at 82% 22%,rgba(255,255,255,.24),transparent 28%),linear-gradient(155deg,#1f56d8,#3978ee,#65b4f4);border-bottom-left-radius:30px;border-bottom-right-radius:30px}.nav-bar,.login-hero,.top-summary,.bill-card,.tabs,.plan-list,.settle-button,.calculator-form,.repay-summary,.empty-state,.muted-text,.error-text{position:relative;z-index:1}.nav-bar{height:44px;display:grid;grid-template-columns:44px 1fr 44px;align-items:center;color:#fff}.nav-bar h1{margin:0;font-size:17px;font-weight:800;text-align:center}.nav-bar.left-title{grid-template-columns:auto minmax(0,1fr) auto;column-gap:10px}.nav-bar.left-title h1{text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.icon-button{width:36px;height:36px;border:0;border-radius:18px;background:#ffffff2e;color:currentColor;display:inline-flex;align-items:center;justify-content:center;padding:0 2px 3px 0;font-size:34px;line-height:1}.hidden{visibility:hidden}.nav-left,.nav-right{display:flex;align-items:center}.nav-left{justify-content:flex-start}.nav-right{justify-content:flex-end}.home-logo{width:34px;height:34px;border-radius:8px;object-fit:contain;display:block;background:#ffffffeb;box-shadow:0 6px 16px #14347d2e}.text-button{border:0;background:transparent;color:currentColor;font-size:13px;font-weight:700}.logout-icon-button{width:38px;height:38px;border:0;border-radius:8px;background:#ffffff1f;display:inline-flex;align-items:center;justify-content:center;padding:0}.logout-icon-button img{width:22px;height:22px;object-fit:contain;display:block}.dialog-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:24px;background:#0a12208a;animation:dialog-fade-in .16s ease-out}.logout-dialog{position:relative;width:min(310px,100%);min-height:232px;padding:82px 22px 22px;border-radius:14px;background:#fff;box-shadow:0 28px 70px #0a122047;animation:dialog-pop-in .18s ease-out}.logout-dialog:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;background:linear-gradient(180deg,#2563eb14,#2563eb00);pointer-events:none}.logout-dialog-icon{position:absolute;top:-33px;left:50%;width:66px;height:66px;object-fit:contain;transform:translate(-50%)}.logout-dialog p{position:relative;margin:0;color:#111827;font-size:16px;font-weight:750;line-height:1.45;text-align:center}.logout-dialog-actions{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:42px}.dialog-button{min-height:46px;border-radius:8px;font-weight:850;border:1px solid #2563eb}.dialog-button.outline{color:#2563eb;background:#fff}.dialog-button.solid{color:#fff;background:#2563eb}.customer-service-fab{position:fixed;right:max(18px,calc((100vw - 430px)/2 + 18px));bottom:calc(env(safe-area-inset-bottom) + 22px);z-index:30;width:58px;height:58px;border:0;border-radius:18px;background:#fff;box-shadow:0 18px 38px #1a2d4e38;display:inline-flex;align-items:center;justify-content:center;padding:0}.customer-service-fab img{width:32px;height:32px;object-fit:contain}.service-sheet-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:60;display:flex;align-items:flex-end;justify-content:center;background:#0a12208a;animation:dialog-fade-in .16s ease-out}.service-sheet{position:relative;width:min(430px,100%);max-height:min(76vh,560px);overflow:auto;padding:22px 16px calc(env(safe-area-inset-bottom) + 18px);border-top-left-radius:22px;border-top-right-radius:22px;background:linear-gradient(180deg,#2563eb,#4d8af2 120px,#fff 121px);box-shadow:0 -28px 60px #0a122038;animation:sheet-slide-up .19s ease-out}.sheet-close{position:absolute;top:12px;right:14px;width:34px;height:34px;border:0;border-radius:17px;color:#fff;background:#ffffff29;font-size:24px;line-height:1}.service-logo{position:absolute;top:20px;right:56px;width:78px;height:56px;object-fit:contain}.service-sheet h2{position:relative;margin:6px 112px 22px 0;color:#fff;font-size:22px;line-height:1.2}.service-warning{position:relative;display:flex;align-items:flex-start;gap:10px;margin-bottom:14px;padding:12px;border-radius:8px;background:#ffffffeb}.service-warning img{width:24px;height:24px;flex:0 0 auto}.service-warning p{margin:0;color:#bd6500;font-size:12px;font-weight:750;line-height:1.38}.service-contact{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:10px;padding:12px;border-radius:8px;border:1px solid #e5edf6;background:#fff}.service-contact div{min-width:0}.service-contact span,.service-time span{display:block;color:#7a8596;font-size:12px;font-weight:750}.service-contact strong,.service-time strong{display:block;margin-top:6px;color:#172033;font-size:15px;line-height:1.25;overflow-wrap:anywhere}.service-contact button{min-width:76px;height:36px;border:0;border-radius:8px;color:#fff;background:#2563eb;display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:12px;font-weight:850}.service-contact button img{width:15px;height:15px}.service-time{margin-top:12px;padding:12px;border-radius:8px;background:#f7f9fc}.service-loading,.service-empty{margin:14px 0 0;color:#6f7b8e;text-align:center;font-weight:750}.service-toast{position:fixed;left:50%;bottom:calc(env(safe-area-inset-bottom) + 28px);transform:translate(-50%);z-index:70;padding:9px 14px;border-radius:999px;color:#fff;background:#111827e6;font-size:13px;font-weight:750}@keyframes dialog-fade-in{0%{opacity:0}to{opacity:1}}@keyframes dialog-pop-in{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}@keyframes sheet-slide-up{0%{transform:translateY(24px)}to{transform:translateY(0)}}.login-hero{min-height:150px;display:flex;align-items:center;justify-content:space-between;color:#fff}.login-hero p{margin:0 0 10px;color:#d8e7ff;font-weight:700}.login-hero h2{margin:0;font-size:28px;line-height:1.08}.login-hero img{width:104px;height:114px;object-fit:contain}.login-panel,.calculator-form{position:relative;z-index:1;margin-top:10px;padding:18px;background:#fff;border-radius:8px;box-shadow:0 20px 50px #1f305014}.login-panel label,.calculator-form label{display:block;color:#687385;font-size:14px;font-weight:700;margin-bottom:12px}.region-select{width:100%;min-height:56px;border:1px solid #d8e0ea;border-radius:8px;background:#fff;padding:0 36px 0 14px;color:#162033;font-size:15px;font-weight:700;-moz-appearance:none;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23687385' d='M1.41 0L6 4.58 10.59 0 12 1.41l-6 6-6-6z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center}.region-select:focus{outline:none;border-color:#2563eb;box-shadow:0 0 0 3px #2563eb1f}.login-panel label[for=region]{margin-bottom:12px}.login-panel label[for=region]+.region-select{margin-bottom:16px}.phone-input,.calculator-form input{width:100%;min-height:56px;border:1px solid #d8e0ea;border-radius:8px;background:#fff}.phone-input{display:flex;align-items:center;padding:0 14px;gap:12px}.phone-input span{font-weight:800}.phone-input input,.calculator-form input{border:0;outline:0;flex:1;min-width:0;color:#162033}.calculator-form input{padding:0 16px;border:3px solid #2563eb;color:#2563eb;font-size:24px;font-weight:900}.calculator-panel{margin-top:28px;padding:16px}.calculator-input-wrap{border:1px solid #dfe7f2;border-radius:8px;background:#f7f9fc;padding:12px}.calculator-input-wrap span{display:block;color:#6f7b8e;font-size:12px;font-weight:800;margin-bottom:8px}.calculator-input-wrap input{min-height:58px;border:0;border-radius:6px;background:#fff;color:#172033;font-size:32px;box-shadow:inset 0 0 0 2px #d7e6ff}.calculator-input-wrap input:focus{box-shadow:inset 0 0 0 2px #2563eb,0 8px 20px #2563eb1f}.calculator-card{padding:16px}.fee-card .section-title{text-align:left}.fee-grid{display:grid;gap:10px}.fee-grid div,.repayment-summary-card div{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:48px;padding:12px;border-radius:8px;background:#f7f9fc}.fee-grid span,.repayment-summary-card span{color:#6f7b8e;font-size:14px;font-weight:750;line-height:1.3}.fee-grid strong,.repayment-summary-card strong{color:#172033;font-size:18px;font-weight:900;text-align:right;overflow-wrap:anywhere}.repayment-summary-card{display:grid;grid-template-columns:1fr 1fr;gap:10px}.repayment-summary-card div{display:block;min-width:0}.repayment-summary-card strong{display:block;margin-top:8px;color:#1f56d8;text-align:left;font-size:24px}.primary-button,.settle-button{width:100%;min-height:50px;border:0;border-radius:8px;background:#2563eb;color:#fff;font-weight:900;margin-top:18px;display:flex;align-items:center;justify-content:center;gap:6px}.primary-button:disabled{background:#c8d2df}.button-spinner{width:16px;height:16px;border-radius:50%;border:2px solid rgba(255,255,255,.52);border-top-color:#fff;animation:spin .7s linear infinite}.primary-button.small{min-height:42px;margin-top:12px}.ghost-link{display:block;margin:16px auto 0;border:0;background:transparent;color:#2563eb;font-weight:800}.top-summary{min-height:142px;color:#fff;display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding-top:20px}.top-summary span,.repay-summary span{display:block;color:#ffffffc7;font-size:12px;font-weight:700}.summary-copy{flex:1;min-width:0}.top-summary strong{display:block;margin-top:8px;font-size:42px;font-weight:900;line-height:1;letter-spacing:0}.summary-copy small{display:block;max-width:210px;margin-top:12px;color:#ffffffc7;font-size:12px;font-weight:750;line-height:1.35;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.customer-chip{max-width:38%;text-align:right;padding:10px 12px;border:1px solid rgba(255,255,255,.22);border-radius:8px;background:#ffffff1f;box-shadow:inset 0 1px #ffffff1f}.customer-chip b{display:block;color:#fff;font-size:14px;line-height:1.2}.customer-chip span{display:block;margin-top:6px;color:#ffffffc7;font-size:12px;line-height:1.2}.customer-chip b,.customer-chip span{overflow-wrap:anywhere}.bill-card{background:#fff;border-radius:8px;padding:14px;margin-top:12px;border:1px solid rgba(218,226,238,.86);box-shadow:0 18px 45px #22365814}.home-detail-card{margin-top:-10px;padding:16px}.details-first-card{margin-top:32px}.details-product-block{padding:4px 0 10px}.mini-card{display:flex;justify-content:space-between;align-items:center;gap:12px}.mini-card strong{color:#2563eb;font-size:22px}.bill-row,.row-button{width:100%;min-height:36px;display:flex;align-items:center;justify-content:space-between;gap:12px}.bill-row span,.row-button{color:#697386;font-size:14px}.bill-row strong{text-align:right;color:#162033;font-size:15px;overflow-wrap:anywhere}.bill-row .accent,.accent{color:#2563eb}.row-button{border:0;background:transparent;padding:0;font-weight:800}.row-button span{color:#2563eb;font-size:22px}.metric-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.metric-item{min-width:0;padding:14px 12px;border-radius:8px;background:#f3f7fc;border:1px solid #e6edf6}.metric-item span,.product-block span,.date-block span{display:block;color:#6f7b8e;font-size:12px;font-weight:750;line-height:1.3}.metric-item strong{display:block;margin-top:8px;color:#1f56d8;font-size:22px;line-height:1.05;overflow-wrap:anywhere}.product-block{padding:14px 2px 0}.product-block strong{display:-webkit-box;margin-top:8px;color:#182235;font-size:16px;font-weight:850;line-height:1.32;overflow:hidden;overflow-wrap:anywhere;-webkit-box-orient:vertical;-webkit-line-clamp:2}.date-block{margin-top:12px;padding:12px;border-radius:8px;background:#f7f9fc;border:1px solid #edf2f8}.date-block strong{display:block;margin-top:7px;color:#182235;font-size:15px;font-weight:850;line-height:1.25;overflow-wrap:anywhere}.details-link{width:100%;min-height:44px;margin-top:14px;border:0;border-top:1px solid #eef2f7;background:transparent;color:#1f56d8;display:flex;align-items:flex-end;justify-content:space-between;padding:12px 0 0;font-weight:850}.details-link span{color:#1f56d8}.details-link b{font-size:24px;line-height:1}.tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:14px;padding:4px;background:#e9eef6;border-radius:8px;border:1px solid #dde6f2}.tabs button{min-height:40px;border:0;border-radius:6px;background:transparent;color:#6b7688;font-size:14px;font-weight:850}.tabs .active{background:#fff;color:#1f56d8;box-shadow:0 8px 16px #16203314}.plan-list{display:grid;gap:10px;margin-top:10px}.plan-card{background:#fff;border-radius:8px;padding:14px;border:1px solid rgba(218,226,238,.86);box-shadow:0 14px 36px #22365812}.plan-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.plan-card-head strong{display:block;margin-top:4px;color:#172033;font-size:20px;line-height:1}.period-label{display:block;color:#7a8596;font-size:11px;font-weight:800;text-transform:uppercase}.plan-main{display:grid;grid-template-columns:1fr 1fr;gap:10px}.plan-main div{min-width:0;padding:12px;border-radius:8px;background:#f7f9fc}.plan-main span{display:block;color:#7a8596;font-size:12px;font-weight:750}.plan-main strong{display:block;margin-top:8px;color:#182235;font-size:16px;line-height:1.15;overflow-wrap:anywhere}.status-pill{display:flex;justify-content:center;align-items:center;height:30px;place-items:center;border-radius:999px;padding:0 14px;font-size:11px;font-weight:850;line-height:1}.inline-note{display:inline-flex;min-height:28px;align-items:center;border-radius:999px;padding:0 11px;font-size:11px;font-weight:850;white-space:nowrap}.status-pill.danger{color:#b42318;background:#fff0ed;border:1px solid #ffd2ca}.status-pill.warning{color:#b05b00;background:#fff6e5;border:1px solid #ffdf9b}.status-pill.neutral{color:#1f56d8;background:#edf4ff;border:1px solid #d7e6ff}.status-pill.calm{color:#067647;background:#ecfdf3;border:1px solid #b7efcf}.inline-note{margin-top:10px;color:#1f56d8;background:#edf4ff;border:1px solid #d7e6ff}.settle-button{min-height:46px;margin-top:12px;background:#182235;color:#fff;box-shadow:0 14px 34px #1620331f}.repay-button{width:100%;min-height:42px;border:0;border-radius:8px;margin-top:12px;color:#fff;background:#1f56d8;font-weight:850;box-shadow:0 12px 24px #1f56d833}.repay-button:disabled{color:#7a8596;background:#e8eef6;box-shadow:none}.repay-summary{color:#fff;min-height:170px;display:grid;grid-template-columns:1fr 1fr;gap:12px;align-content:center}.repay-status-row{grid-column:1 / -1;display:flex;justify-content:center}.repay-summary .status-pill{justify-self:center;background:#fff}.repay-summary-item{min-width:0;padding:14px 12px;border-radius:8px;background:#ffffff1f;border:1px solid rgba(255,255,255,.22)}.repay-summary strong{display:block;margin-top:10px;font-size:26px;line-height:1.08;overflow-wrap:anywhere}.section-title{margin:0 0 10px;color:#2563eb;font-size:16px;text-align:center}.sub-panel{margin-top:12px;padding:12px;border-radius:8px;background:#f1f4f7}.settle-card{text-align:center;padding:28px 16px}.settle-card span{color:#8a95a6;font-weight:800}.settle-card strong{display:block;margin-top:12px;color:#2563eb;font-size:34px}.settle-card.muted strong{color:#b8c0cc;text-decoration:line-through}.fixed-action{position:sticky;bottom:calc(env(safe-area-inset-bottom) + 14px);z-index:2}.empty-state,.muted-text{text-align:center;color:#99a3b2;font-weight:800;padding:26px 0}.error-text{color:#d92d20;font-size:13px;font-weight:700;line-height:1.45}.loading-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;display:flex;align-items:center;justify-content:center}.loading-box{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:28px 40px;background:#fff;border-radius:12px;box-shadow:0 12px 40px #1620332e}.loading-spinner{width:36px;height:36px;border-radius:50%;border:3px solid #e0e7f2;border-top-color:#2563eb;animation:spin .7s linear infinite}.loading-text{color:#6f7b8e;font-size:14px;font-weight:700;margin:0}@keyframes spin{to{transform:rotate(360deg)}}@media(min-width:720px){body{padding:24px 0}.app-shell{min-height:calc(100vh - 48px);border-radius:24px;box-shadow:0 30px 80px #16203338}}