﻿ :root{--cph-accent:#3b82f6;--cph-accent-dim:#3b82f626;--cph-cyan:#06b6d4;--cph-purple:#a855f7;--cph-amber:#f59e0b;--cph-green:#22c55e}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background:var(--calc-bg-page);color:var(--calc-text-primary);min-height:100vh;font-family:Inter,sans-serif;font-size:14px;line-height:1.5}.main-container{max-width:1140px;margin:0 auto;padding:0 1rem 4rem}.page-header{text-align:center;padding:1.5rem 1rem 0}.page-title{background:linear-gradient(135deg, var(--cph-accent) 0%, var(--cph-cyan) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:.4rem;font-size:1.75rem;font-weight:800}.page-subtitle{color:var(--calc-text-dim);margin-bottom:1.5rem;font-size:.9rem}.cph-tabs{background:#ffffff0a;border-radius:12px;gap:4px;margin-bottom:1.25rem;padding:4px;display:flex}.cph-tab-btn{color:var(--calc-text-dim);cursor:pointer;background:0 0;border:none;border-radius:8px;flex:1;padding:10px 12px;font-family:Inter,sans-serif;font-size:.82rem;font-weight:600;transition:all .2s}.cph-tab-btn:hover{color:var(--calc-text-primary)}.cph-tab-btn.active{background:var(--cph-accent-dim);color:#fff;box-shadow:0 0 12px #3b82f64d}.cph-tab-panel{display:none}.cph-tab-panel.active{display:block}.cph-grid{grid-template-columns:1fr 1.35fr;gap:16px;display:grid}@media (width<=860px){.cph-grid{grid-template-columns:1fr}}.input-card,.result-card{background:var(--calc-bg-card);border-left:3px solid var(--cph-accent);border-radius:12px;margin-bottom:12px;padding:18px}.card-label{letter-spacing:1.5px;text-transform:uppercase;color:var(--calc-text-dim);margin-bottom:12px;font-size:.7rem;font-weight:700}.cph-chips{flex-wrap:wrap;gap:6px;margin-bottom:14px;display:flex}.cph-chip{color:var(--calc-text-dim);cursor:pointer;background:#ffffff0a;border:1px solid #ffffff1f;border-radius:20px;padding:6px 14px;font-family:Inter,sans-serif;font-size:.78rem;font-weight:600;transition:all .2s}.cph-chip:hover,.cph-chip--active{background:var(--cph-accent-dim);border-color:var(--cph-accent);color:#fff}.input-group{margin-bottom:12px}.input-group label{color:var(--calc-text-dim);margin-bottom:5px;font-size:.78rem;font-weight:500;display:block}.input-row-2{grid-template-columns:1fr 1fr;gap:10px;display:grid}.input-with-unit{background:var(--calc-bg-input,#00000040);border:1px solid var(--calc-border-default);border-radius:8px;align-items:center;display:flex;overflow:hidden}.input-prefix{color:var(--calc-text-dim);flex-shrink:0;padding:0 8px;font-size:.82rem}.input-unit{color:var(--calc-text-dim);white-space:nowrap;flex-shrink:0;padding:0 10px;font-size:.8rem}.glass-input{border:1px solid var(--calc-border-default);width:100%;color:var(--calc-text-primary);background:0 0;border-radius:8px;padding:9px 10px;font-family:Inter,sans-serif;font-size:.88rem;transition:border-color .2s}.input-with-unit .glass-input{border:none;border-radius:0;padding:9px 8px}.glass-input:focus{border-color:var(--cph-accent);outline:none}.input-with-unit:focus-within{border-color:var(--cph-accent);box-shadow:0 0 0 2px #3b82f626}.hero-cph{color:var(--cph-accent);text-shadow:0 0 20px #3b82f666;text-align:center;margin:8px 0 4px;font-size:2.8rem;font-weight:800}.hero-label{text-align:center;color:var(--calc-text-dim);margin-bottom:12px;font-size:.82rem}.cph-metrics{grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px;display:grid}@media (width<=480px){.cph-metrics{grid-template-columns:repeat(2,1fr)}}.cph-metric{background:#ffffff08;border:1px solid #ffffff0f;border-radius:8px;padding:10px 12px}.cph-metric-label{color:var(--calc-text-dim);text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px;font-size:.68rem}.cph-metric-val{color:var(--cph-accent);font-size:.95rem;font-weight:700}.cph-metric-val.cyan{color:var(--cph-cyan)}.cph-metric-val.purple{color:var(--cph-purple)}.cph-metric-val.amber{color:var(--cph-amber)}.cph-metric-val.green{color:var(--cph-green)}.cph-waterfall{border-radius:6px;gap:2px;height:32px;margin-bottom:8px;display:flex;overflow:hidden}.cph-wf-seg{flex-direction:column;justify-content:center;align-items:center;min-width:0;transition:width .4s;display:flex;overflow:hidden}.cph-wf-seg span{color:#fff;white-space:nowrap;text-overflow:ellipsis;padding:0 4px;font-size:.62rem;font-weight:700;line-height:1.2;overflow:hidden}.cph-wf-seg small{color:#fffc;font-size:.58rem}.cph-wf-legend{flex-wrap:wrap;gap:6px 14px;margin-top:6px;display:flex}.cph-wf-litem{color:var(--calc-text-dim);align-items:center;gap:5px;font-size:.72rem;display:flex}.cph-wf-dot{border-radius:2px;flex-shrink:0;width:8px;height:8px}.alert-item{border-radius:8px;margin-bottom:7px;padding:9px 13px;font-size:.8rem;line-height:1.45}.alert-success{color:#4ade80;background:#22c55e1a;border:1px solid #22c55e40}.alert-warn{color:#fbbf24;background:#f59e0b1a;border:1px solid #f59e0b40}.alert-info{color:#60a5fa;background:#3b82f61a;border:1px solid #3b82f640}.alert-error{color:#fca5a5;background:#ef44441a;border:1px solid #ef444440}.action-bar{flex-wrap:wrap;gap:8px;margin-top:12px;display:flex}.btn-action{color:#fff;cursor:pointer;background:#ffffff0d;border:1px solid #ffffff26;border-radius:8px;padding:9px 16px;font-family:Inter,sans-serif;font-size:.8rem;font-weight:600;transition:all .2s}.btn-action:hover{background:var(--cph-accent-dim);border-color:var(--cph-accent)}.chart-block{background:#ffffff08;border-radius:10px;min-width:0;margin-bottom:12px;padding:14px;overflow:hidden}.chart-wrap{height:var(--chart-height,240px);position:relative}.breakdown-table{border-collapse:collapse;width:100%;margin-top:10px;font-size:.82rem}.breakdown-table th{text-align:left;letter-spacing:.5px;text-transform:uppercase;color:var(--calc-text-dim);border-bottom:1px solid #ffffff14;padding:8px 10px;font-size:.7rem;font-weight:700}.breakdown-table td{color:var(--calc-text-dim);border-bottom:1px solid #ffffff0a;padding:7px 10px}.breakdown-table .bd-cat{color:var(--cph-accent);vertical-align:top;font-weight:600}.breakdown-table .bd-val{color:var(--calc-text-primary);text-align:right;font-weight:600}.breakdown-table .bd-pct{color:var(--calc-text-dim);text-align:right;font-size:.76rem}.breakdown-table .bd-subtotal td{color:var(--cph-accent);background:#3b82f60f;border-bottom:1px solid #3b82f626;font-weight:600}.breakdown-table .bd-total td{color:var(--calc-text-primary);border-top:2px solid #ffffff1f;border-bottom:none;font-size:.9rem;font-weight:700}.breakdown-table .bd-total .bd-val{color:var(--cph-accent);font-size:1rem}.bench-row{border-bottom:1px solid #ffffff0d;justify-content:space-between;align-items:center;padding:8px 0;display:flex}.bench-label{color:var(--calc-text-dim);font-size:.82rem}.bench-val{color:var(--calc-text-primary);font-size:.88rem;font-weight:700}.bench-note{color:var(--calc-text-dim);margin-top:10px;font-size:.8rem;line-height:1.5}.bp-grid{grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px;display:grid}@media (width<=640px){.bp-grid{grid-template-columns:1fr}}.bp-stat{border-bottom:1px solid #ffffff0d;justify-content:space-between;align-items:center;padding:8px 0;display:flex}.bp-stat-label{color:var(--calc-text-dim);font-size:.82rem}.bp-stat-val{color:var(--cph-accent);font-size:.92rem;font-weight:700}.bp-breakdown{margin-top:12px}.bp-breakdown-row{border-bottom:1px solid #ffffff0a;justify-content:space-between;align-items:center;padding:6px 0;font-size:.82rem;display:flex}.bp-breakdown-row span:first-child{color:var(--calc-text-dim)}.bp-breakdown-row span:last-child{color:var(--calc-text-primary);font-weight:600}.page-sections-outer{max-width:1140px;margin:0 auto;padding:0 1rem 3rem}.faq-list{flex-direction:column;display:flex}.faq-item{border-bottom:1px solid #ffffff0f}.faq-item__question{cursor:pointer;color:var(--calc-text-primary);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(--calc-font-mono,monospace);color:var(--calc-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(--cph-accent)}.faq-item__question:hover{color:var(--cph-accent)}.faq-item__answer{color:var(--calc-text-dim);padding:0 4px 14px;font-size:.85rem;line-height:1.75}[data-theme=light]{--cph-accent:#2563eb;--cph-accent-dim:#2563eb1a;--cph-cyan:#0891b2;--cph-purple:#7c3aed;--cph-amber:#b45309;--cph-green:#047857}[data-theme=light] body{background:var(--calc-bg-page);color:var(--calc-text-primary)}[data-theme=light] .input-card,[data-theme=light] .result-card,[data-theme=light] .chart-block{background:#fff;border-color:#0000001f;box-shadow:0 2px 10px #00000012}[data-theme=light] .glass-input{color:#0f172a;background:#f8fafc;border-color:#00000026}[data-theme=light] .input-with-unit{background:#f8fafc;border-color:#00000026}[data-theme=light] .input-with-unit:focus-within{border-color:#2563eb;box-shadow:0 0 0 2px #2563eb1f}[data-theme=light] .glass-input:focus{border-color:#2563eb}[data-theme=light] .cph-tabs{background:#0000000a}[data-theme=light] .cph-tab-btn{color:#64748b}[data-theme=light] .cph-tab-btn:hover{color:#0f172a}[data-theme=light] .cph-tab-btn.active{color:#1e3a8a;box-shadow:none;background:#2563eb1a}[data-theme=light] .cph-chip{color:#475569;background:#f1f5f9;border-color:#0000001f}[data-theme=light] .cph-chip:hover,[data-theme=light] .cph-chip--active{color:#1e3a8a;background:#2563eb1a;border-color:#2563eb}[data-theme=light] .cph-metric{background:#f0f4f9;border-color:#00000014}[data-theme=light] .hero-cph{color:#2563eb;text-shadow:none}[data-theme=light] .alert-success{color:#14532d;background:#f0fdf4;border-color:#16a34a59}[data-theme=light] .alert-warn{color:#78350f;background:#fffbeb;border-color:#d9770659}[data-theme=light] .alert-info{color:#1e3a5f;background:#eff6ff;border-color:#3b82f659}[data-theme=light] .alert-error{color:#7f1d1d;background:#fff1f2;border-color:#ef444459}[data-theme=light] .btn-action{color:#334155;background:#f1f5f9;border-color:#0000001f}[data-theme=light] .btn-action:hover{color:#1e3a8a;background:#2563eb1a;border-color:#2563eb}[data-theme=light] .breakdown-table th{color:#64748b;border-color:#0000001a}[data-theme=light] .breakdown-table td{color:#475569;border-color:#0000000d}[data-theme=light] .breakdown-table .bd-cat{color:#2563eb}[data-theme=light] .breakdown-table .bd-val{color:#0f172a}[data-theme=light] .breakdown-table .bd-subtotal td{color:#2563eb;background:#2563eb0f;border-color:#2563eb33}[data-theme=light] .breakdown-table .bd-total td{color:#0f172a;border-color:#00000026}[data-theme=light] .breakdown-table .bd-total .bd-val{color:#2563eb}[data-theme=light] .bench-row{border-color:#0000000f}[data-theme=light] .bench-label{color:#64748b}[data-theme=light] .bench-val{color:#0f172a}[data-theme=light] .bench-note{color:#475569}[data-theme=light] .bp-stat{border-color:#0000000f}[data-theme=light] .bp-stat-label{color:#64748b}[data-theme=light] .bp-stat-val{color:#2563eb}[data-theme=light] .bp-breakdown-row{border-color:#0000000d}[data-theme=light] .bp-breakdown-row span:first-child{color:#64748b}[data-theme=light] .bp-breakdown-row span:last-child{color:#0f172a}[data-theme=light] .cph-wf-litem{color:#64748b}[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:#2563eb4d;box-shadow:0 2px 10px #2563eb14}[data-theme=light] .faq-item[open]{border-color:#2563eb66 #2563eb66 #2563eb66 #2563eb;border-left-style:solid;border-left-width:3px;box-shadow:0 2px 12px #2563eb1a}[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:#2563eb}[data-theme=light] .faq-item__answer{color:#475569;border-top:1px solid #0000000f;padding:12px 16px 16px}