.fd-demo-section{position:relative;z-index:2}.fd-badge{background:linear-gradient(135deg,#6366f1,#8b5cf6)!important}.fd-phone{background:linear-gradient(135deg,#2b2b2b,#161616)!important}.fd-screen{background:#f7f7fb!important;display:flex;flex-direction:column;position:relative;color:#0f172a;font-size:13px}.fd-screen button{font-family:inherit;cursor:pointer}.fd-body{padding:34px 16px 16px;flex:1}.fd-body-scroll{overflow-y:auto;padding-bottom:96px}.fd-label{font-weight:700;letter-spacing:1px;margin:18px 0 10px}.fd-label,.fd-note{font-size:11px;color:#64748b}.fd-note{margin:12px 0 0}.fd-note i{color:#6366f1;margin-right:4px}.fd-appbar{display:flex;align-items:center;justify-content:center;position:relative;padding:34px 50px 14px;background:#fff;border-bottom:1px solid #eef0f6;flex-shrink:0}.fd-appbar span{font-size:15px;font-weight:700}.fd-appbar-back{position:absolute;left:12px;bottom:10px;background:none;border:none;width:32px;height:32px;font-size:16px;color:#0f172a}.fd-appbar+.fd-body{padding-top:16px}.fd-toast{position:absolute;bottom:86px;left:16px;right:16px;background:#10b981;color:#fff;padding:12px 16px;border-radius:12px;font-weight:600;z-index:30;box-shadow:0 8px 20px rgba(16,185,129,.35);animation:fdToastIn .3s ease}.fd-toast i{margin-right:8px}@keyframes fdToastIn{0%{transform:translateY(16px);opacity:0}to{transform:translateY(0);opacity:1}}.fd-progress{height:6px;border-radius:999px;background:#e5e7f2;overflow:hidden;margin:10px 0 6px}.fd-progress span{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#6366f1,#8b5cf6);transition:width .6s ease}.fd-chip{display:inline-block;font-weight:700;background:#eef0ff;color:#6366f1}.fd-chip,.fd-status{font-size:10px;padding:3px 9px;border-radius:999px}.fd-status{font-weight:800;white-space:nowrap}.fd-status.paid{background:#dcfce7;color:#059669}.fd-status.due{background:#fef3c7;color:#b45309}.fd-status.upcoming{background:#f1f5f9;color:#64748b}.fd-status.active{background:#eef0ff;color:#6366f1}.fd-primary-btn{width:100%;margin-top:14px;border:none;border-radius:14px;letter-spacing:.6px;box-shadow:0 8px 20px rgba(99,102,241,.3)}.fd-primary-btn,.fd-sticky-btn{padding:14px;background:linear-gradient(135deg,#6366f1,#8b5cf6);color:#fff;font-weight:800}.fd-sticky-btn{position:absolute;left:12px;right:12px;bottom:12px;border:none;border-radius:16px;box-shadow:0 8px 20px rgba(99,102,241,.35)}.fd-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.fd-hi{font-size:12px;color:#64748b}.fd-header h4{font-size:18px;font-weight:800;margin:0}.fd-avatar{width:42px;height:42px;border-radius:14px;background:#eef0ff;color:#6366f1;font-weight:800;display:flex;align-items:center;justify-content:center}.fd-balance-card{border-radius:22px;padding:18px;color:#fff;background:radial-gradient(circle at 90% 10%,hsla(0,0%,100%,.18) 0,transparent 40%),linear-gradient(135deg,#312e81,#6366f1 60%,#8b5cf6);box-shadow:0 12px 28px rgba(99,102,241,.35)}.fd-balance-card small{font-size:11px;opacity:.85}.fd-balance-card>strong{display:block;font-size:28px;font-weight:800;margin-top:2px}.fd-balance-card .fd-progress{background:hsla(0,0%,100%,.25)}.fd-balance-card .fd-progress span{background:#fff}.fd-balance-row{font-size:11px;opacity:.9}.fd-balance-row,.fd-due-card{display:flex;justify-content:space-between}.fd-due-card{align-items:center;gap:10px;background:#fff;border:1px solid #fde68a;border-left:4px solid #f59e0b;border-radius:16px;padding:12px 14px;margin-top:12px}.fd-due-card.done{border-color:#bbf7d0 #bbf7d0 #bbf7d0 #10b981}.fd-due-card>div{display:flex;flex-direction:column}.fd-due-card small{font-size:11px;color:#64748b}.fd-due-card strong{font-size:18px;font-weight:800}.fd-due-card span{font-size:11px;color:#b45309;font-weight:600}.fd-due-card button{border:none;border-radius:10px;background:#6366f1;color:#fff;font-weight:700;padding:9px 14px;white-space:nowrap}.fd-quick-row{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:14px}.fd-quick-row button{background:#fff;border:1px solid #eef0f6;border-radius:14px;padding:10px 4px;display:flex;flex-direction:column;align-items:center;gap:5px;color:#334155}.fd-quick-row i{width:32px;height:32px;border-radius:10px;background:#eef0ff;color:#6366f1;display:flex;align-items:center;justify-content:center;font-size:14px}.fd-quick-row span{font-size:10px;font-weight:600}.fd-section-title{display:flex;justify-content:space-between;align-items:center;margin:18px 0 10px}.fd-section-title h6{font-size:15px;font-weight:800;margin:0}.fd-section-title button{background:none;border:none;color:#6366f1;font-size:12px;font-weight:700}.fd-loan-card{width:100%;text-align:left;background:#fff;border:1px solid #eef0f6;border-radius:16px;padding:12px 14px;margin-bottom:10px;color:#0f172a;transition:transform .15s ease,box-shadow .15s ease}.fd-loan-card:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(15,23,42,.06)}.fd-loan-card.big{padding:14px}.fd-loan-card small{font-size:11px;color:#64748b}.fd-loan-top{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}.fd-loan-top strong{font-size:14px}.fd-loan-top>span:not(.fd-status){font-weight:800;color:#6366f1}.fd-loan-card .fd-detail-grid{margin:12px 0 0}.fd-page-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.fd-page-title h4{font-size:20px;font-weight:800;margin:0}.fd-page-title span{font-size:11px;color:#64748b}.fd-detail-card{background:#fff;border:1px solid #eef0f6;border-radius:20px;padding:16px}.fd-detail-card h5{font-size:17px;font-weight:800;margin:8px 0 12px}.fd-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.fd-detail-grid>div{background:#f8f9fd;border-radius:12px;padding:8px 10px;display:flex;flex-direction:column}.fd-detail-grid small{font-size:10px;color:#64748b}.fd-detail-grid strong{font-size:14px;font-weight:800}.fd-detail-grid strong.accent{color:#6366f1}.fd-progress-label{font-size:11px;color:#64748b}.fd-schedule{background:#fff;border:1px solid #eef0f6;border-radius:18px;overflow:hidden}.fd-schedule-row{display:grid;grid-template-columns:26px 1fr auto auto;gap:10px;align-items:center;padding:10px 12px;border-bottom:1px solid #f1f2f8}.fd-schedule-row:last-child{border-bottom:none}.fd-schedule-row.due{background:#fffbeb}.fd-schedule-num{width:24px;height:24px;border-radius:50%;background:#f1f5f9;color:#64748b;font-size:10px;font-weight:800;display:flex;align-items:center;justify-content:center}.fd-schedule-row.paid .fd-schedule-num{background:#dcfce7;color:#059669}.fd-schedule-date{color:#475569}.fd-pay-amount{text-align:center;background:#fff;border:1px solid #eef0f6;border-radius:20px;padding:20px 14px;display:flex;flex-direction:column;gap:4px}.fd-pay-amount small{font-size:11px;color:#64748b}.fd-pay-amount strong{font-size:32px;font-weight:800;color:#312e81}.fd-pay-amount span{font-size:11px;color:#b45309;font-weight:600}.fd-method{width:100%;display:flex;align-items:center;gap:12px;text-align:left;background:#fff;border:1.5px solid #eef0f6;border-radius:14px;padding:11px 12px;margin-bottom:8px;color:#0f172a}.fd-method.selected{border-color:#6366f1;background:#f5f6ff}.fd-method>div{flex:1;display:flex;flex-direction:column}.fd-method>div span{font-size:11px;color:#64748b}.fd-method-icon{width:36px;height:36px;border-radius:10px;background:#eef0ff;color:#6366f1;display:flex;align-items:center;justify-content:center}.fd-radio{width:18px;height:18px;border-radius:50%;border:2px solid #cbd5e1}.fd-method.selected .fd-radio{border:5px solid #6366f1}.fd-history-row{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid #eef0f6;border-radius:14px;padding:11px 12px;margin-bottom:8px}.fd-history-icon{width:34px;height:34px;border-radius:50%;background:#dcfce7;color:#059669;display:flex;align-items:center;justify-content:center;flex-shrink:0}.fd-history-row>div{flex:1;display:flex;flex-direction:column;min-width:0}.fd-history-row>div span{font-size:11px;color:#64748b}.fd-history-amt{font-weight:800}.fd-calc-card{background:#fff;border:1px solid #eef0f6;border-radius:20px;padding:14px 16px 6px}.fd-calc-card label{display:block;margin-bottom:12px}.fd-calc-card label span{display:flex;justify-content:space-between;font-size:12px;color:#475569;margin-bottom:6px}.fd-calc-card label strong{color:#6366f1}.fd-calc-card input[type=range]{width:100%;accent-color:#6366f1}.fd-calc-result{display:flex;align-items:center;gap:16px;background:#fff;border:1px solid #eef0f6;border-radius:20px;padding:16px;margin-top:12px}.fd-donut{width:112px;height:112px;flex-shrink:0}.fd-donut,.fd-donut>div{border-radius:50%;display:flex;align-items:center;justify-content:center}.fd-donut>div{width:80px;height:80px;background:#fff;flex-direction:column}.fd-donut small{font-size:10px;color:#64748b}.fd-donut strong{font-size:13px;font-weight:800}.fd-calc-legend{flex:1;display:flex;flex-direction:column;gap:8px;font-size:12px;color:#475569}.fd-calc-legend>div{display:flex;align-items:center;gap:6px}.fd-calc-legend strong{margin-left:auto;color:#0f172a}.fd-calc-legend .total{border-top:1px dashed #e2e8f0;padding-top:8px;font-weight:700}.fd-calc-legend .dot{width:10px;height:10px;border-radius:3px}.fd-calc-legend .dot.principal{background:#6366f1}.fd-calc-legend .dot.interest{background:#f59e0b}.fd-bottomnav{position:absolute;left:8px;right:8px;bottom:8px;height:64px;background:#fff;border:1px solid rgba(224,224,236,.8);border-radius:22px;box-shadow:0 2px 14px rgba(15,23,42,.07)}.fd-bottomnav,.fd-nav-btn{display:flex;align-items:center}.fd-nav-btn{flex:1;height:100%;background:none;border:none;flex-direction:column;justify-content:center;gap:3px;color:#94a3b8;font-size:17px}.fd-nav-btn span{font-size:10px;font-weight:700}.fd-nav-btn.active{color:#6366f1}