:root{--fr-primary:#2563eb;--fr-secondary:#0ea5e9;--fr-success:#16a34a;--fr-warning:#f59e0b;--fr-danger:#dc2626;--fr-dark:#0f172a;--fr-bg:#f1f5f9;--fr-card:#ffffff;--fr-border:#e2e8f0;--fr-text:#0f172a;--fr-muted:#64748b;--fr-gradient:linear-gradient(135deg, #2563eb 0%, #26dee7 100%)}body{background:var(--fr-bg)}.fr-page-title{font-size:2rem;font-weight:800;color:var(--fr-dark);margin-bottom:4px}.fr-page-subtitle{color:var(--fr-muted);font-size:1rem}.fr-card{background:var(--fr-card);border:none;border-radius:24px;box-shadow:0 10px 35px rgba(15,23,42,.08);overflow:hidden}.sidebar-card{position:sticky;top:20px;max-height:calc(100vh - 40px);overflow:auto}.sidebar-header{padding:22px;background:var(--fr-gradient);color:#fff}.sidebar-header h4{font-weight:800;margin-bottom:6px}.sidebar-section{padding:18px;border-bottom:1px solid #edf2f7}.sidebar-section:last-child{border-bottom:none}.sidebar-title{font-size:.82rem;font-weight:800;text-transform:uppercase;color:#64748b;margin-bottom:12px;letter-spacing:.5px}.ratio-link{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-radius:14px;margin-bottom:8px;cursor:pointer;transition:.2s;border:1px solid transparent}.ratio-link:hover{background:#eff6ff;border-color:#bfdbfe}.ratio-link.active{background:#2563eb;color:#fff}.ratio-link.active .ratio-desc{color:#dbeafe}.ratio-name{font-weight:700;font-size:.95rem}.ratio-desc{font-size:.76rem;color:#64748b}.main-card-body{padding:28px}.hero-box{background:var(--fr-gradient);border-radius:22px;padding:30px;color:#fff;margin-bottom:26px}.hero-title{font-size:2rem;font-weight:800;margin-bottom:10px}.hero-description{opacity:.9;line-height:1.7;font-size:1rem}.formula-card{background:#f8fafc;border:1px solid #e2e8f0;border-radius:20px;padding:24px;margin-bottom:24px}.section-heading{display:flex;align-items:center;gap:10px;margin-bottom:18px}.section-heading-icon{width:42px;height:42px;border-radius:12px;background:#dbeafe;color:#2563eb;display:flex;align-items:center;justify-content:center;font-size:1rem}.section-heading h5{font-weight:800;margin:0;color:#0f172a}.formula-display{background:#fff;border:2px dashed #bfdbfe;border-radius:16px;padding:22px;text-align:center;font-size:1.35rem;font-weight:800;color:#2563eb;margin-bottom:18px}.input-card{background:#fff;border-radius:20px;border:1px solid #e2e8f0;padding:24px;margin-bottom:24px}.form-label{font-size:.82rem;font-weight:800;color:#334155;margin-bottom:8px}.input-group-text{background:#f8fafc;border-right:none;font-weight:700;color:#475569}.form-control{border-left:none;height:50px;font-weight:700;font-size:1rem}.result-box{background:linear-gradient(135deg,#eff6ff 0,#dbeafe 100%);border-radius:22px;padding:28px;text-align:center;border:2px solid #bfdbfe}.result-title{font-size:.85rem;text-transform:uppercase;letter-spacing:.5px;font-weight:800;color:#64748b;margin-bottom:10px}.result-value{font-size:3rem;font-weight:900;color:#2563eb;line-height:1}.result-badge{display:inline-flex;align-items:center;gap:8px;background:#fff;padding:10px 16px;border-radius:50px;margin-top:16px;font-size:.82rem;font-weight:700;color:#0f172a}.insight-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:24px}.insight-card{background:#fff;border-radius:18px;padding:20px;border:1px solid #e2e8f0}.insight-label{font-size:.76rem;text-transform:uppercase;color:#64748b;font-weight:800;margin-bottom:10px}.insight-value{font-size:1.2rem;font-weight:800;color:#0f172a}.description-card{background:#fff;border-radius:20px;padding:26px;border:1px solid #e2e8f0}.description-card p{color:#475569;line-height:1.8;margin-bottom:16px}.description-list{margin:0;padding-left:20px}.description-list li{margin-bottom:10px;color:#475569}.comparison-table{width:100%}.comparison-table th{background:#f8fafc;padding:14px;font-size:.82rem;text-transform:uppercase;color:#64748b;font-weight:800}.comparison-table td{padding:16px 14px;border-top:1px solid #edf2f7;font-weight:700}.health-good{color:#16a34a}.health-medium{color:#f59e0b}.health-bad{color:#dc2626}@media(max-width:991px){.sidebar-card{position:relative;top:auto;max-height:none;margin-bottom:20px}.insight-grid{grid-template-columns:1fr}.hero-title{font-size:1.5rem}.result-value{font-size:2.2rem}}