.calculator-page { max-width: 1360px; margin-inline: auto; --calc-accent: var(--green); }
.calc-page-head { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:28px; }
.calc-page-head h1 { margin:0 0 8px; font-size:32px; letter-spacing:.03em; }
.calc-page-head p { margin:0; color:var(--muted); }
.calc-independent { font-size:12px; color:var(--muted); border-left:2px solid var(--calc-accent); padding-left:12px; white-space:nowrap; }
.calc-tabs { display:flex; border-bottom:1px solid var(--line); gap:28px; }
.calc-tabs button { border:0; border-bottom:3px solid transparent; background:none; color:var(--muted); padding:12px 2px; font:inherit; font-weight:600; cursor:pointer; }
.calc-tabs button[aria-pressed=true] { color:var(--text); border-bottom-color:var(--calc-accent); }
.calc-tool-picker { display:flex; gap:8px; flex-wrap:wrap; padding:18px 0 22px; }
.calc-tool-picker button { padding:8px 16px; border:1px solid var(--line); border-radius:6px; background:transparent; color:var(--muted); cursor:pointer; font:inherit; }
.calc-tool-picker button[aria-pressed=true] { background:var(--soft); color:var(--text); border-color:var(--muted); }
.calculator-page button:focus-visible, .calculator-page summary:focus-visible { outline:2px solid var(--blue); outline-offset:4px; }
.calculator-page button:disabled { opacity:.45; cursor:default; }
.calc-workspace { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); border:1px solid var(--line); border-radius:10px; overflow:hidden; background:var(--panel); }
.calc-inputs { min-width:0; padding:26px; border-right:1px solid var(--line); }
.calc-section-head { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:24px; }
.calculator-page h2 { font-size:19px; margin:0; }
.calc-input-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:19px 16px; }
.calc-input-grid .field { margin:0; min-width:0; display:flex; flex-direction:column; gap:8px; }
.calc-input-grid .field span { font-size:13px; font-weight:600; }
.calc-input-grid .field small { color:var(--muted); font-weight:400; margin-left:4px; }
.calc-input-grid .input { width:100%; min-width:0; height:46px; font-variant-numeric:tabular-nums; }
.calc-input-grid .calc-wide { grid-column:1/-1; }
.calc-help { font-size:12px; color:var(--muted); line-height:1.8; margin:18px 0 0; }
.calc-form-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; }
.calc-output { min-width:0; padding:22px 26px 26px; }
.calc-output-units { display:flex; flex-wrap:wrap; gap:12px 16px; margin:0 0 20px; }
.calc-output-units .field { flex:1 1 170px; min-width:0; margin:0; display:flex; flex-direction:column; gap:8px; }
.calc-output-units .field span { font-size:13px; color:var(--muted); }
.calc-output-units .input { width:100%; min-width:0; height:42px; }
.calc-sketch { margin:0 auto 18px; width:min(100%,290px); }
.calc-sketch svg { display:block; width:100%; overflow:visible; }
.calc-shape { fill:color-mix(in srgb,var(--calc-accent) 9%,transparent); stroke:var(--calc-accent); stroke-width:1.6; }
.calc-shape .calc-dimension { stroke:var(--muted); stroke-dasharray:4 3; fill:none; }
.calc-shape .calc-boards { stroke:var(--calc-accent); opacity:.5; }
.calc-labels { fill:var(--muted); text-anchor:middle; font-size:12px; font-family:inherit; }
.calc-empty-result { border-top:1px solid var(--line); padding:20px 0; }
.calc-empty-result span { font-size:13px; color:var(--muted); }
.calc-empty-result p { margin:10px 0; line-height:1.8; }
.calc-metrics { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 22px; }
.calc-metric { padding:16px 0; border-top:1px solid var(--line); min-width:0; }
.calc-metric > span { display:block; color:var(--muted); font-size:12px; margin-bottom:7px; }
.calc-metric strong { display:block; font-size:23px; font-weight:600; line-height:1.35; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.calc-metric.is-primary strong { color:var(--calc-accent); font-size:30px; }
.calc-metric strong small { font-size:13px; color:var(--muted); font-weight:400; white-space:nowrap; }
.calc-warning,.calc-rule-note,.calc-stale { font-size:13px; line-height:1.8; padding:10px 13px; background:color-mix(in srgb,var(--amber) 9%,transparent); border-left:2px solid var(--amber); margin:16px 0 0; color:var(--text); overflow-wrap:anywhere; }
.calc-notice { font-size:13px; color:var(--calc-accent); margin:16px 0 0; line-height:1.8; }
.calc-rules { border-top:1px solid var(--line); margin-top:18px; }
.calc-rules > summary { cursor:pointer; padding:15px 0; font-size:13px; color:var(--muted); }
.calc-rule-body { font-size:12px; line-height:1.8; overflow-wrap:anywhere; }
.calc-rule-body ul { padding-left:19px; }
.calc-rule-body li { margin:10px 0; }
.calc-table-wrap { overflow-x:auto; }
.calc-table-wrap table { font-size:12px; min-width:400px; width:100%; border-collapse:collapse; }
.calc-table-wrap th,.calc-table-wrap td { padding:8px; text-align:left; border-bottom:1px solid var(--line); }
.calc-table-wrap td:last-child { font-variant-numeric:tabular-nums; white-space:nowrap; }
.calc-history { margin-top:30px; padding-top:26px; border-top:1px solid var(--line); }
.calc-history-head h2 span,.calc-total-head h3 span { color:var(--muted); font-size:12px; font-weight:400; margin-left:8px; }
.calc-history-head p { margin:9px 0 20px; font-size:12px; line-height:1.8; }
.calc-totals { border:1px solid var(--line); border-radius:8px; background:var(--panel); padding:18px 22px; margin-bottom:16px; }
.calc-total-head { display:flex; justify-content:space-between; align-items:center; gap:15px; }
.calc-total-head h3 { margin:0; font-size:15px; }
.calc-total-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:14px 28px; margin-top:20px; }
.calc-total-grid > div { display:flex; justify-content:space-between; align-items:center; gap:15px; padding-bottom:9px; border-bottom:1px solid var(--line); min-width:0; }
.calc-total-grid span { font-size:12px; overflow-wrap:anywhere; }
.calc-total-grid small { display:block; color:var(--muted); font-weight:400; font-size:11px; margin-top:4px; }
.calc-total-grid strong { font-size:23px; color:var(--calc-accent); font-variant-numeric:tabular-nums; text-align:right; }
.calc-total-grid strong small { display:inline; }
.calc-history-list { max-height:600px; overflow:auto; overscroll-behavior:contain; border-bottom:1px solid var(--line); }
.calc-history-row { display:grid; grid-template-columns:26px minmax(0,1fr) auto; gap:12px; padding:18px 6px; border-top:1px solid var(--line); align-items:start; }
.calc-history-select { padding-top:3px; }
.calc-history-select input { width:17px; height:17px; accent-color:var(--green); cursor:pointer; }
.calc-history-title { display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; }
.calc-history-title strong { overflow-wrap:anywhere; }
.calc-history-title span { color:var(--muted); font-size:12px; }
.calc-history-content { min-width:0; }
.calc-history-content > p { font-size:13px; margin:8px 0; color:var(--text); line-height:1.7; }
.calc-history-actions { display:flex; gap:8px; }
.calc-history-details > summary { color:var(--muted); font-size:12px; padding-top:6px; cursor:pointer; }
.calc-history-details > p { font-size:12px; line-height:1.9; color:var(--muted); }
.calc-history-empty { text-align:center; color:var(--muted); padding:40px 15px; border:1px dashed var(--line); border-radius:8px; }
.calc-metrics.is-compact .calc-metric strong { font-size:20px; }
@media (max-width:1100px) {
  .calc-inputs,.calc-output { padding:20px; }
  .calc-page-head { align-items:flex-start; flex-direction:column; gap:13px; }
  .calc-workspace { grid-template-columns:1fr; }
  .calc-inputs { border-right:0; border-bottom:1px solid var(--line); }
  .calc-sketch { max-width:230px; }
}
@media (max-width:600px) {
  .calc-page-head h1 { font-size:27px; }
  .calc-tabs { gap:20px; }
  .calc-inputs,.calc-output { padding:18px 16px; }
  .calc-input-grid { grid-template-columns:1fr; }
  .calc-section-head { align-items:flex-start; flex-wrap:wrap; }
  .calc-tool-picker button { padding:8px 12px; font-size:13px; }
  .calc-metric.is-primary strong { font-size:25px; }
  .calc-history-row { grid-template-columns:24px minmax(0,1fr); gap:8px; }
  .calc-history-actions { grid-column:2; }
  .calc-totals { padding:16px; }
  .calc-independent { white-space:normal; }
}