@import "../../../assets/css/style.css";:root{--bg-dark:#050510;--bg-primary:#0a0b1e;--card:#0f1223eb;--card-elevated:#111427;--input-bg:#0c0e20;--input-border:#ffffff14;--border:#ffffff0f;--text-main:#fff;--text-dim:#88a;--text-muted:#557;--cyan:#00f3ff;--purple:#bc13fe;--accent:#0ea5e9;--accent-dim:#0ea5e926;--green:#10b981;--red:#f87171;--amber:#f59e0b;--font-body:"Inter", sans-serif;--font-mono:"JetBrains Mono", monospace;--font-heading:"Plus Jakarta Sans", sans-serif}[data-theme=light]{--bg-dark:#e8edf5;--bg-primary:#f1f5f9;--card:#fffffff2;--card-elevated:#fff;--input-bg:#e8eef4;--input-border:#0000001f;--border:#0000001a;--text-main:#0f172a;--text-dim:#334155;--text-muted:#64748b;--cyan:#0e7490;--purple:#7c3aed;--accent:#0284c7;--accent-dim:#0284c71f;--green:#065f46;--red:#dc2626;--amber:#a16207}body{background:var(--bg-dark);color:var(--text-main);font-family:var(--font-body);flex-direction:column;min-height:100vh;display:flex}.glass-navbar{z-index:1000;backdrop-filter:blur(14px);border-bottom:1px solid var(--border);background:#050510eb;padding:0 24px;position:sticky;top:0}[data-theme=light] .glass-navbar{background:#f8fafcf2;border-bottom-color:#00000014;box-shadow:0 1px 6px #0000000f}.nav-link.active{color:var(--accent)!important}.app-container{flex:1;max-width:1340px;margin:0 auto;padding:8px 20px 32px}.calc-header{text-align:center;margin-bottom:12px}.page-title{font-family:var(--font-heading);margin:0;font-size:1.35rem;font-weight:800}.page-subtitle{color:var(--text-muted);margin-top:2px;font-size:.75rem}.outer-tabs{border:1px solid var(--border);background:#ffffff08;border-radius:10px;gap:4px;margin-bottom:16px;padding:4px;display:flex}[data-theme=light] .outer-tabs{background:#f0f4f9;border-color:#0000001a}.tab-btn{color:var(--text-dim);font-family:var(--font-body);cursor:pointer;background:0 0;border:none;border-radius:8px;flex:1;padding:10px 16px;font-size:.82rem;font-weight:600;transition:all .2s}.tab-btn:hover{color:var(--text-main)}.tab-btn.active{background:var(--accent);color:#fff;box-shadow:0 2px 8px #0ea5e940}[data-theme=light] .tab-btn.active{background:var(--accent);color:#fff;box-shadow:0 2px 8px #0284c733}[data-theme=light] .tab-btn{color:var(--text-muted)}[data-theme=light] .tab-btn:hover{color:var(--text-main)}.tab-pane{display:none}.tab-pane.active{display:block}.calc-grid{grid-template-columns:1fr 1fr;align-items:start;gap:20px;display:grid}@media (width<=900px){.calc-grid{grid-template-columns:1fr}}.input-card{background:var(--card);border:1px solid var(--border);border-left:3px solid var(--cyan);border-radius:12px;margin-bottom:14px;padding:18px 20px}[data-theme=light] .input-card{border-color:#0000001a;border-left-color:var(--cyan);background:#fff;box-shadow:0 1px 6px #0000000f}.card-title{font-family:var(--font-heading);color:var(--text-main);align-items:center;gap:8px;margin:0 0 14px;font-size:.85rem;font-weight:700;display:flex}.card-icon{color:var(--accent);font-size:.7rem}.input-group{margin-bottom:12px}.input-group label{color:var(--text-dim);margin-bottom:5px;font-size:.78rem;font-weight:600;display:block}.label-hint{color:var(--text-muted);font-size:.7rem;font-weight:400}.input-wrap{background:var(--input-bg);border:1px solid var(--input-border);border-radius:8px;align-items:center;transition:border-color .2s;display:flex;overflow:hidden}.input-wrap:focus-within{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-dim)}[data-theme=light] .input-wrap{background:var(--input-bg);border-color:var(--input-border)}.input-wrap .prefix,.input-wrap .suffix{font-family:var(--font-mono);color:var(--text-muted);flex-shrink:0;padding:0 10px;font-size:.8rem}.input-wrap input{font-family:var(--font-mono);color:var(--text-main);background:0 0;border:none;outline:none;flex:1;min-width:0;padding:10px 8px;font-size:.88rem}.input-wrap input::placeholder{color:#ffffff4d}[data-theme=light] .input-wrap input::placeholder{color:#00000059}.input-row-2{grid-template-columns:1fr 1fr;gap:12px;display:grid}@media (width<=500px){.input-row-2{grid-template-columns:1fr}}.checkbox-row{color:var(--text-dim);cursor:pointer;align-items:center;gap:8px;margin-top:4px;font-size:.78rem;display:flex}.checkbox-row input[type=checkbox]{accent-color:var(--accent);width:16px;height:16px}.action-bar{gap:8px;margin-top:4px;display:flex}.action-btn{border:1px solid var(--border);color:var(--text-dim);cursor:pointer;background:#ffffff0a;border-radius:8px;flex:1;justify-content:center;align-items:center;gap:6px;padding:9px 12px;font-size:.78rem;font-weight:600;transition:all .2s;display:flex}.action-btn:hover{background:var(--accent-dim);color:var(--accent);border-color:var(--accent)}[data-theme=light] .action-btn{color:var(--text-dim);background:#f0f4f9;border-color:#0000001a}[data-theme=light] .action-btn:hover{color:var(--accent);border-color:var(--accent);background:#0284c714}.result-card{background:var(--card);border:1px solid var(--border);border-left:3px solid var(--purple);border-radius:12px;padding:20px;position:sticky;top:80px}[data-theme=light] .result-card{border-color:#0000001a;border-left-color:var(--purple);background:#fff;box-shadow:0 2px 12px #00000014}.result-title{margin:0 0 16px}.hero-stat{text-align:center;background:#0ea5e90f;border:1px solid #0ea5e926;border-radius:10px;margin-bottom:18px;padding:16px}[data-theme=light] .hero-stat{background:#eff9fb;border-color:#0284c733}.hero-label{text-transform:uppercase;letter-spacing:.8px;color:var(--text-muted);margin-bottom:4px;font-size:.72rem;font-weight:700;display:block}.hero-value{font-family:var(--font-mono);color:var(--accent);font-size:1.65rem;font-weight:800;display:block}.stat-grid{grid-template-columns:1fr 1fr;gap:10px;display:grid}.stat-cell{border:1px solid var(--border);background:#ffffff08;border-radius:8px;padding:10px 12px}[data-theme=light] .stat-cell{background:#edf2f9;border-color:#00000014}.stat-cell.full-width{grid-column:1/-1}.stat-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.4px;margin-bottom:3px;font-size:.68rem;font-weight:600;display:block}.stat-value{font-family:var(--font-mono);color:var(--text-main);font-size:.95rem;font-weight:700;display:block}.stat-value.accent{color:var(--accent)}.stat-value.green{color:var(--green)}.stat-value.red{color:var(--red)}.divider{border:none;border-top:1px solid var(--border);margin:14px 0}[data-theme=light] .divider{border-top-color:#00000014}#alertContainer{flex-direction:column;gap:8px;margin-top:14px;display:flex}.alert{border-radius:8px;align-items:center;gap:10px;padding:10px 14px;font-size:.78rem;font-weight:500;line-height:1.4;display:flex}.alert-success{color:var(--green);background:#10b98114;border:1px solid #10b98133}.alert-warning{color:var(--amber);background:#f59e0b14;border:1px solid #f59e0b33}.alert-danger{color:var(--red);background:#f8717114;border:1px solid #f8717133}.alert-info{color:var(--accent);background:#0ea5e914;border:1px solid #0ea5e933}[data-theme=light] .alert-success{background:#f0fdf4;border-color:#10b98140}[data-theme=light] .alert-warning{background:#fffbeb;border-color:#f59e0b40}[data-theme=light] .alert-danger{background:#fff1f2;border-color:#f8717140}[data-theme=light] .alert-info{background:#eff9fb;border-color:#0ea5e940}.alert-icon{flex-shrink:0;font-size:1rem}.scenario-intro{text-align:center;color:var(--text-dim);margin-bottom:20px;font-size:.85rem}.scenario-grid{grid-template-columns:repeat(3,1fr);gap:16px;display:grid}@media (width<=900px){.scenario-grid{grid-template-columns:1fr}}.scenario-card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:20px;transition:border-color .2s,box-shadow .2s;position:relative}[data-theme=light] .scenario-card{background:#fff;border-color:#0000001a;box-shadow:0 1px 6px #0000000f}.scenario-card.best{border-color:var(--green);box-shadow:0 0 20px #10b98114}[data-theme=light] .scenario-card.best{border-color:var(--green);box-shadow:0 2px 12px #10b9811a}.scenario-card.worst{border-color:var(--red);opacity:.85}.scenario-badge{background:var(--green);color:#fff;text-transform:uppercase;letter-spacing:.5px;border-radius:6px;padding:3px 10px;font-size:.68rem;font-weight:700;position:absolute;top:-10px;right:16px}.scenario-title{font-family:var(--font-heading);margin:0 0 4px;font-size:.95rem;font-weight:700}.scenario-desc{color:var(--text-muted);margin:0 0 16px;font-size:.75rem}.scenario-stats{flex-direction:column;gap:8px;display:flex}.scenario-row{color:var(--text-dim);background:#ffffff08;border-radius:6px;justify-content:space-between;align-items:center;padding:8px 12px;font-size:.8rem;display:flex}[data-theme=light] .scenario-row{color:var(--text-dim);background:#edf2f9}.scenario-val{font-family:var(--font-mono);color:var(--text-main);font-weight:700}.scenario-val.green{color:var(--green)}.scenario-val.amber{color:var(--amber)}.scenario-val.red{color:var(--red)}.scenario-summary{color:var(--text-dim);background:#0ea5e90f;border:1px solid #0ea5e926;border-radius:10px;margin-top:20px;padding:16px 20px;font-size:.82rem;line-height:1.6}[data-theme=light] .scenario-summary{background:#eff9fb;border-color:#0284c733}.page-sections-outer{max-width:1600px;margin:0 auto;padding:0 1.5rem 3rem}.section-title{font-family:var(--font-heading);color:var(--text-main);text-align:center;margin:0 0 20px;font-size:1.15rem;font-weight:800}.how-section{padding:40px 0 32px}.how-steps{flex-direction:column;gap:16px;max-width:780px;margin:0 auto;display:flex}.how-step{background:var(--card);border:1px solid var(--border);border-radius:12px;align-items:flex-start;gap:16px;padding:16px 20px;display:flex}[data-theme=light] .how-step{background:#fff;border-color:#0000001a;box-shadow:0 1px 4px #0000000f}.step-num{background:var(--accent);color:#fff;width:34px;height:34px;font-family:var(--font-mono);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:.85rem;font-weight:800;display:flex}.how-step strong{color:var(--text-main);margin-bottom:4px;font-size:.88rem;display:block}.how-step p{color:var(--text-dim);margin:0;font-size:.8rem;line-height:1.55}.faq-section{max-width:780px;margin:0 auto;padding:32px 0}.faq-list{flex-direction:column;display:flex}.faq-item{border-bottom:1px solid #ffffff0f}.faq-item__question{cursor:pointer;color:var(--text-main);user-select:none;justify-content:space-between;align-items:center;padding:14px 4px;font-size:.9rem;font-weight:600;list-style:none;transition:color .2s;display:flex}.faq-item__question::-webkit-details-marker{display:none}.faq-item__question:after{content:"+";font-family:var(--font-mono);color:var(--text-dim);flex-shrink:0;margin-left:16px;font-size:1.1rem;transition:color .2s}.faq-item[open] .faq-item__question:after{content:"−";color:var(--accent)}.faq-item__question:hover{color:var(--accent)}.faq-item__answer{color:var(--text-dim);padding:0 4px 14px;font-size:.85rem;line-height:1.75}[data-theme=light] .faq-list{gap:8px}[data-theme=light] .faq-item{background:#fff;border:1px solid #0000001a;border-radius:10px;transition:box-shadow .2s,border-color .2s;overflow:hidden;box-shadow:0 1px 4px #0000000f}[data-theme=light] .faq-item:hover{border-color:#0284c759;box-shadow:0 2px 10px #0284c714}[data-theme=light] .faq-item[open]{border-color:#0284c766;border-left:3px solid var(--accent);box-shadow:0 2px 12px #0284c71a}[data-theme=light] .faq-item__question{color:#0f172a;padding:14px 16px}[data-theme=light] .faq-item__question:after{color:#64748b}[data-theme=light] .faq-item[open] .faq-item__question:after,[data-theme=light] .faq-item__question:hover{color:var(--accent)}[data-theme=light] .faq-item__answer{color:#475569;border-top:1px solid #0000000f;padding:12px 16px 16px}.calc-related{padding:32px 0}.related-grid{grid-template-columns:repeat(4,1fr);gap:12px;max-width:780px;margin:0 auto;display:grid}@media (width<=700px){.related-grid{grid-template-columns:repeat(2,1fr)}}.related-card{background:var(--card);border:1px solid var(--border);border-radius:10px;flex-direction:column;align-items:center;gap:8px;padding:18px 12px;text-decoration:none;transition:all .2s;display:flex}.related-card:hover{border-color:var(--accent);box-shadow:0 0 16px var(--accent-dim);transform:translateY(-2px)}[data-theme=light] .related-card{background:#fff;border-color:#0000001a;box-shadow:0 1px 4px #0000000f}[data-theme=light] .related-card:hover{border-color:var(--accent);box-shadow:0 2px 12px #0284c71f}.related-icon{font-size:1.4rem}.related-name{color:var(--text-dim);text-align:center;font-size:.78rem;font-weight:600}.related-card:hover .related-name{color:var(--accent)}.toast{z-index:9999;border-radius:10px;max-width:360px;padding:12px 20px;font-size:.82rem;font-weight:500;animation:.3s toast-in;position:fixed;bottom:24px;right:24px;box-shadow:0 4px 20px #0000004d}.toast-success{color:#d1fae5;background:#065f46}.toast-warn{color:#fef3c7;background:#78350f}.toast-error{color:#fee2e2;background:#7f1d1d}[data-theme=light] .toast-success{color:#065f46;background:#d1fae5}[data-theme=light] .toast-warn{color:#78350f;background:#fef3c7}[data-theme=light] .toast-error{color:#7f1d1d;background:#fee2e2}@keyframes toast-in{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@media (width<=600px){.app-container{padding:8px 12px 24px}.input-card{padding:14px}.result-card{padding:16px 14px;position:static}.hero-value{font-size:1.3rem}.stat-grid,.scenario-grid{grid-template-columns:1fr}.related-grid{grid-template-columns:1fr 1fr}}