/* Profit Margin Calculator — profit-margin.css */
.pm-wrap*,.pm-wrap *::before,.pm-wrap *::after{box-sizing:border-box;margin:0;padding:0}
.pm-wrap{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;color:#1e293b;max-width:960px;margin:0 auto;background:#fff;border-radius:16px;border:1px solid #e2e8f0;overflow:hidden}
.pm-header{display:flex;align-items:center;gap:14px;padding:20px 24px;background:#312e81}
.pm-header-icon{width:44px;height:44px;background:rgba(255,255,255,.12);border-radius:10px;display:flex;align-items:center;justify-content:center;color:#c4b5fd;flex-shrink:0}
.pm-title{font-size:19px;font-weight:700;color:#fff;margin-bottom:3px}
.pm-subtitle{font-size:12.5px;color:#c4b5fd}
.pm-body{display:flex;flex-direction:column}
@media(min-width:720px){.pm-body{flex-direction:row;align-items:flex-start}.pm-form{width:44%;border-right:1px solid #e2e8f0}.pm-results{width:56%;position:sticky;top:0;max-height:100vh;overflow-y:auto}}
.pm-form{padding:20px;display:flex;flex-direction:column;gap:14px}
.pm-field{display:flex;flex-direction:column;gap:5px}
.pm-section-label{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:#94a3b8;padding-bottom:4px;border-bottom:1px solid #f1f5f9}
.pm-label{font-size:12px;font-weight:700;color:#334155;text-transform:uppercase;letter-spacing:.04em}
.pm-hint{font-size:11.5px;color:#94a3b8;line-height:1.4}
.pm-select{width:100%;padding:10px 30px 10px 12px;height:44px;border:1.5px solid #cbd5e1;border-radius:10px;font-size:14px;color:#1e293b;background:#f8fafc;appearance:none;outline:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23718096' d='M6 8L1 3h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;transition:border-color .18s}
.pm-select:focus{border-color:#6d28d9;background-color:#fff}
.pm-prefix-wrap{display:flex;align-items:center;border:1.5px solid #cbd5e1;border-radius:10px;overflow:hidden;background:#f8fafc;transition:border-color .18s}
.pm-prefix-wrap:focus-within{border-color:#6d28d9;background:#fff}
.pm-prefix{padding:0 11px;font-size:13px;font-weight:600;color:#64748b;background:#f1f5f9;height:44px;display:flex;align-items:center;border-right:1px solid #e2e8f0;flex-shrink:0}
.pm-input{flex:1;border:none;background:transparent;padding:0 12px;height:44px;font-size:14px;color:#1e293b;outline:none;-moz-appearance:textfield;min-width:0}
.pm-input::-webkit-outer-spin-button,.pm-input::-webkit-inner-spin-button{-webkit-appearance:none}
.pm-disclaimer{display:flex;align-items:flex-start;gap:8px;background:#fefce8;border:1px solid #fde047;border-radius:9px;padding:10px 14px;font-size:12px;color:#854d0e;line-height:1.5}
.pm-disclaimer svg{flex-shrink:0;margin-top:1px;color:#ca8a04}
/* Results */
.pm-results{background:#f5f3ff;padding:20px}
.pm-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:280px;gap:14px;color:#94a3b8;text-align:center}
.pm-placeholder p{font-size:13.5px;line-height:1.6;max-width:220px}
/* 3 margin cards */
.pm-margin-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:14px}
.pm-margin-card{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:14px;text-align:center}
.pm-gross-card{border-color:#c4b5fd}
.pm-op-card{border-color:#818cf8;background:#eef2ff}
.pm-net-card{border-color:#6d28d9;background:#f5f3ff}
.pm-margin-label{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:#94a3b8;margin-bottom:5px}
.pm-margin-pct{font-size:26px;font-weight:800;color:#312e81;line-height:1}
.pm-net-card .pm-margin-pct{font-size:30px}
.pm-margin-amt{font-size:12px;color:#64748b;margin-top:3px;margin-bottom:4px}
.pm-margin-formula{font-size:10.5px;color:#94a3b8}
/* Waterfall */
.pm-waterfall{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:14px;margin-bottom:14px}
.pm-wf-title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:#94a3b8;margin-bottom:12px}
.pm-wf-row{display:flex;align-items:center;gap:10px;margin-bottom:9px;font-size:12.5px}
.pm-wf-label{min-width:90px;color:#475569}
.pm-wf-bar-wrap{flex:1;height:12px;background:#f1f5f9;border-radius:6px;overflow:hidden}
.pm-wf-bar{height:100%;border-radius:6px;transition:width .4s ease}
.pm-wf-cogs{background:#ef4444}
.pm-wf-opex{background:#f59e0b}
.pm-wf-tax{background:#94a3b8}
.pm-wf-profit{background:#22c55e}
.pm-wf-val{min-width:40px;text-align:right;font-weight:700;color:#1e293b;font-size:12.5px}
.pm-wf-profit-row .pm-wf-label{font-weight:700;color:#15803d}
.pm-wf-profit-row .pm-wf-val{color:#15803d}
/* Benchmarks */
.pm-benchmarks{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:14px;margin-bottom:14px}
.pm-bench-title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:#94a3b8;margin-bottom:12px}
.pm-bench-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
@media(max-width:500px){.pm-bench-grid{grid-template-columns:1fr}}
.pm-bench-header{font-size:11px;font-weight:700;color:#334155;margin-bottom:4px}
.pm-bench-yours{font-size:20px;font-weight:800;color:#312e81;margin-bottom:6px}
.pm-bench-bar-wrap{height:8px;background:#f1f5f9;border-radius:4px;position:relative;overflow:visible;margin-bottom:6px}
.pm-bench-bar{height:100%;border-radius:4px;background:#6d28d9;transition:width .4s ease}
.pm-bench-avg-line{position:absolute;top:-3px;width:2px;height:14px;background:#dc2626;border-radius:1px;transition:left .3s}
.pm-bench-avg-label{font-size:11px;color:#94a3b8;margin-bottom:4px}
.pm-bench-verdict{font-size:11px;font-weight:700;padding:3px 8px;border-radius:6px;display:inline-block}
/* Markup explainer */
.pm-markup{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:14px}
.pm-markup-title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:#94a3b8;margin-bottom:12px}
.pm-markup-row{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.pm-markup-item{flex:1;text-align:center;background:#f8fafc;border-radius:10px;padding:12px}
.pm-markup-label{font-size:11px;font-weight:700;color:#64748b;text-transform:uppercase;letter-spacing:.04em;margin-bottom:4px}
.pm-markup-val{font-size:22px;font-weight:800;color:#312e81}
.pm-markup-sub{font-size:11px;color:#94a3b8;margin-top:3px}
.pm-markup-vs{font-size:24px;font-weight:700;color:#dc2626;flex-shrink:0}
.pm-markup-note{font-size:12px;color:#64748b;background:#fef3c7;border-radius:8px;padding:8px 12px;line-height:1.5}
@media(max-width:480px){.pm-header,.pm-form,.pm-results{padding:14px}.pm-title{font-size:17px}.pm-margin-grid{grid-template-columns:1fr 1fr 1fr}.pm-margin-pct{font-size:20px}.pm-net-card .pm-margin-pct{font-size:22px}}