/* Workbench layout. Shared geometry and physical print styles live in styles.css. */
:root {
  --ink: #17212d; --ink-soft: #354354; --muted: #606d7d;
  --canvas: #eef1f5; --paper: #fff; --panel: #e8edf3; --panel-strong: #dce3ed;
  --line: #d5dce5; --line-strong: #8795a6;
  --blue: #126bba; --blue-soft: #e9f3ff; --orange: #ae4515; --orange-soft: #fff1e7;
  --green: #346552; --amber: #b66416; --shadow: 0 4px 18px #14203308;
  font-family: "Segoe UI", system-ui, sans-serif;
}
body { min-width: 0; background: var(--canvas); }
button, a, input, select, summary { touch-action: manipulation; }
button:disabled { cursor: not-allowed; opacity: .45; }
:focus-visible { outline: 3px solid #1a78c8; outline-offset: 3px; }
.facet-app { overflow: visible; }
h1,h2,h3 { letter-spacing: -.035em; }
.skip-link { position: absolute; top: 8px; left: 8px; z-index: 20; padding: 12px; background: white; transform: translateY(-160%); }
.skip-link:focus { transform: translateY(0); }
.bench-header { display: flex; align-items: center; gap: 30px; min-height: 86px; padding: 16px 28px; background: #171c24; color: #f5f7fa; border-bottom: 1px solid #333e4c; }
.bench-brand { display:flex; align-items:center; gap:12px; color:inherit; text-decoration:none; }
.bench-brand svg { color:#f9ad65; flex-shrink:0; }
.bench-brand strong { display:block; font-size:1.35rem; letter-spacing:-.035em; line-height:1.25; }
.bench-brand small { display:block; color:#acb7c6; font-size:.75rem; letter-spacing:.12em; margin-top:4px; }
.header-method { display:flex; gap:12px; color:#98a6b8; font: .75rem/1.4 Consolas,monospace; border-left:1px solid #3c4653; padding-left:24px; }
.project-actions { display:flex; gap:8px; margin-left:auto; }
.button { min-height:42px; padding:10px 16px; border-radius:6px; font-size:.875rem; font-weight:650; }
.bench-header .button--secondary { background:#232a35; border-color:#455063; color:#e3e9f1; }
.bench-header .button--secondary:hover { background:#303a48; }
.button--primary { border-color:#ec9850; background:#f6a45c; color:#241a13; }
.button--primary:hover { background:#ffb775; }
.project-message { padding:12px 28px; background:#e4f0fc; color:#234663; border-bottom:1px solid #bdd4ea; }
.project-message.is-error { background:#fff0ec; color:#962f20; }
.bench-layout { display:grid; grid-template-columns:350px minmax(0,1fr); max-width:1700px; margin:auto; }
.measure-panel { padding:26px 22px; background:white; border-right:1px solid var(--line); min-width:0; }
.panel-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.section-kicker { color:var(--muted); font:.75rem/1.5 Consolas,monospace; letter-spacing:.09em; margin-bottom:6px; }
.panel-heading h1 { font-size:1.5rem; margin:0; }
.panel-index { color:#8390a0; font: .9rem Consolas,monospace; border:1px solid var(--line); border-radius:4px; padding:6px; }
.panel-intro { color:var(--muted); font-size:.875rem; margin:12px 0 24px; }
.unit-picker, .reference-picker { width:100%; min-width:0; padding:0; margin:0 0 20px; border:0; }
legend { font-size:.875rem; font-weight:650; margin-bottom:8px; }
.unit-picker legend,.reference-picker legend { font-size:.875rem; text-transform:none; font-weight:650; }
.measurement-form { gap:0; }
.field > span { font-size:.875rem; font-weight:650; }
.field > span small { font-size:.75rem; font-weight:400; }
.field > small { font-size:.75rem; }
.segmented-control { gap:3px; padding:3px; background:#edf1f6; border:1px solid var(--line); border-radius:6px; }
.segmented-control label { min-width:0; }
.segmented-control span { min-height:38px; padding:7px 4px; border:0; border-radius:4px; font-size:.875rem; line-height:1.3; font-weight:600; color:var(--muted); background:transparent; }
.segmented-control input:checked + span { color:#1d2938; background:white; box-shadow:0 1px 4px #23314a20; border:0; }
.segmented-control label:has(input:disabled) { opacity:.5; cursor:not-allowed; }
.fraction-precision { font-size:.875rem; }
.fraction-precision select { min-width:0; padding:5px; }
.reference-picker p { color:var(--muted); font-size:.875rem; margin:8px 0 0; }
.scale-field { margin-bottom:18px; }
.field span { font-size:.875rem; font-weight:650; color:var(--ink-soft); }
.field small { font-size:.75rem; color:var(--muted); font-weight:400; }
.field input { height:42px; min-width:0; padding:8px 10px; border:1px solid #bec8d6; border-radius:5px; font-family:Consolas,"SFMono-Regular",monospace; font-size:1rem; background:white; color:var(--ink); }
.field input:focus { border-color:#126bba; }
.field input[aria-invalid=true] { border-color:#b9372b; background:#fff3f1; }
.sample-notice { display:block; padding:10px 12px; margin:0 0 16px; background:#fff6e7; border:1px solid #edd7ae; color:#795123; font-size:.875rem; border-radius:5px; }
.sample-notice strong { display:block; }
.location-grid { display:grid; grid-template-columns:1fr; gap:12px; }
.location-card { margin:0; padding:14px; border:1px solid var(--line); border-left:3px solid #9caabd; border-radius:6px; background:#f8fafc; min-width:0; box-shadow:none; }
.location-card--low { border-left-color:#176fb4; }
.location-card--high { border-left-color:#b0652e; }
.location-card--middle { border-left-color:#5c7b64; }
.location-card__header { display:flex; align-items:start; gap:8px; margin-bottom:12px; }
.location-card__header h3 { font-size:1.125rem; margin:2px 0 0; }
.location-card__tone { font-size:.75rem; letter-spacing:.03em; }
.location-card__header-actions { display:flex; flex-wrap:wrap; gap:4px; margin-left:auto; justify-content:flex-end; max-width:120px; }
.station-status { font-size:.75rem; padding:3px 6px; background:#e7edf4; color:#536578; white-space:normal; }
.location-card__help { min-height:0; font-size:.875rem; margin:0 0 12px; color:var(--muted); }
.location-card__fields { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.location-card__fields .field:first-child { grid-column:1 / -1; display:grid; grid-template-columns:1fr 76px; align-items:center; }
.location-card__fields .field:last-child { grid-column:auto; }
.location-card__fields .field small { display:block; }
.location-card__fields .field:first-child small { display:inline; }
.behind-nut-control { padding-top:12px; margin-top:12px; }
.check-row { align-items:start; font-size:.875rem; gap:8px; }
.field--compact { display:grid; grid-template-columns:1fr 90px; align-items:center; margin-top:8px; }
.small-button,.reset-estimate { font-size:.75rem; }
.form-actions { display:flex; flex-direction:column; align-items:stretch; gap:10px; margin:14px 0; }
.history-actions { justify-content:space-between; }
.text-button { min-height:36px; font-size:.875rem; }
.bench-help { margin-top:18px; padding-top:14px; border-top:1px solid var(--line); font-size:.875rem; }
.bench-help summary { min-height:36px; cursor:pointer; font-weight:650; }
.bench-help p { color:var(--muted); }
.validation-message { font-size:.875rem; padding:12px; }
.carve-panel { padding:26px 30px 34px; min-width:0; }
.workspace-heading { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:20px; }
.workspace-heading h2 { font-size:1.55rem; margin:0; }
.workspace-status { padding:5px 9px; border:1px solid #b9c5d3; border-radius:4px; color:#536578; font:.75rem/1.4 Consolas,monospace; }
.workspace-status.is-invalid { color:#a32c24; background:#fff0ec; border-color:#dcaaa4; }
.pass-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; margin:0 0 22px; border:1px solid #c8d2de; border-radius:7px; overflow:hidden; }
.pass-tab { display:flex; flex-direction:row; min-height:72px; justify-content:flex-start; gap:12px; text-align:left; padding:14px; border:0; border-right:1px solid #c8d2de; border-radius:0; background:#f9fbfd; }
.pass-tab:last-child { border-right:0; }
.pass-tab span { border:0; width:auto; height:auto; font: .875rem Consolas,monospace; color:#6e7c8e; }
.pass-tab strong { display:block; font-size:.875rem; font-weight:650; }
.pass-tab small { display:block; font-size:.75rem; margin-top:3px; color:#6e7c8e; }
.pass-tab.is-active { background:#202a37; color:#fff; }
.pass-tab.is-active span { color:#ffb26b; }
.pass-tab.is-active small { color:#b4c0ce; }
.canvas-toolbar { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:12px 16px; background:#1a2330; color:#d5deea; border-radius:8px 8px 0 0; border-bottom:1px solid #364151; }
.station-tabs { display:flex; gap:5px; flex-wrap:wrap; min-width:0; }
.station-tab { background:transparent; color:#a9b9cc; border:1px solid transparent; border-radius:4px; min-height:36px; padding:7px 12px; font-size:.875rem; cursor:pointer; }
.station-tab[aria-pressed=true] { background:#334258; color:#fff; border-color:#5b718a; }
.drawing-mode { display:flex; flex-shrink:0; border:1px solid #47566a; border-radius:5px; padding:2px; margin:0; }
.drawing-mode label { position:relative; }
.drawing-mode input { position:absolute; opacity:0; }
.drawing-mode span { display:block; padding:6px 8px; font-size:.875rem; color:#b9c8d9; border-radius:3px; cursor:pointer; }
.drawing-mode input:checked + span { background:#425269; color:#fff; }
.drawing-mode input:focus-visible + span { outline:2px solid #ffb16b; }
.diagram-grid { display:block; background:#18212d; }
.diagram-card { border:0; border-radius:0; box-shadow:none; color:#e5edf6; background:#18212d; }
.diagram-card__header { padding:16px 24px 0; }
.diagram-card__header p { color:#a4b3c6; font: .75rem Consolas,monospace; letter-spacing:.07em; }
.diagram-card__header h3 { font-size:1.2rem; color:#e5edf6; }
.angle-readout { border:1px solid #4a5d74; background:#233145; color:#bfcfe1; font:.75rem Consolas,monospace; }
.cross-section { aspect-ratio:720/340; min-height:0; max-height:370px; border:0; background:#18212d; }
.diagram-background { fill:#18212d; }
.blank-stage { fill:#314258; stroke:#c8d8eb; stroke-width:1.5; }
.blank-ghost { fill:none; stroke:#5e728b; stroke-dasharray:5 5; stroke-width:1.3; }
.waste-fill { fill:#604426; }
.waste-hatch,.waste-hatch-line { stroke:#efac60; }
.reference-line { stroke:#afc0d4; }
.center-line { stroke:#687e97; }
.active-cut-line { stroke:#f0f6ff; stroke-width:2.5; }
.smooth-guide { stroke:#8aaea3; stroke-width:2; }
.mark-segment--a { stroke:#67baff; }
.mark-segment--b { stroke:#ffb36b; }
.point-marker--a { fill:#67baff; }
.point-marker--b { fill:#ffb36b; }
.point-label--a { fill:#67baff; }
.point-label--b { fill:#ffb36b; }
.point-marker { stroke:#18212d; }
.dimension-line,.dimension-tick { stroke:#6d839f; }
.dimension-label,.center-label { fill:#bbc9da; font-family:Consolas,monospace; }
.reference-label { fill:#a3c2b7; }
.diagram-values { padding:0 24px 18px; gap:12px; grid-template-columns:1fr 1fr; }
.diagram-value { padding:14px 16px; border:1px solid #3a4c64; background:#202e40; }
.diagram-value--a { border-left:3px solid #67baff; }
.diagram-value--b { border-left:3px solid #ffb36b; }
.diagram-value dt { font-size:.875rem; font-weight:500; min-height:0; color:#b4c6db; margin-bottom:10px; }
.diagram-value dd { font:600 1.65rem/1.3 Consolas,"SFMono-Regular",monospace; color:#f2f7ff; }
.diagram-value dd small { display:block; color:#9fb2ca; font-size:.875rem; font-weight:400; margin-top:4px; }
.diagram-value .mark-symbol--a { background:#67baff; color:#142333; }
.diagram-value .mark-symbol--b { background:#ffb36b; color:#36200f; }
.diagram-card__note { padding:0 24px 14px; color:#99aec5; font-size:.75rem; }
.coordinate-details { border-top:1px solid #34445a; }
.coordinate-details summary { color:#abc3de; font-size:.875rem; }
.coordinate-details dl > div { border-color:#34445a; }
.coordinate-details dt { color:#9fb0c6; }
.coordinate-details dd { color:#e0eaf5; font-family:Consolas,monospace; font-size:.875rem; }
.canvas-footer { background:#202b3a; color:#b8c7d9; border-top:1px solid #34445a; border-radius:0 0 8px 8px; display:flex; gap:14px; flex-wrap:wrap; justify-content:space-between; align-items:center; padding:10px 18px; }
.canvas-footer .diagram-legend { font-size:.75rem; gap:12px; margin:0; color:inherit; }
.legend-swatch--mark-a { border-color:#67baff; }
.legend-swatch--mark-b { border-color:#ffb36b; }
.canvas-footer .view-controls { display:flex; flex-wrap:wrap; min-width:0; gap:16px; width:auto; }
.switch-row { min-height:32px; font-size:.875rem; gap:7px; }
.switch { width:30px; height:18px; background:#435369; border-color:#5d708a; }
.switch::after { width:12px; height:12px; top:2px; left:2px; }
.switch-row input:checked + .switch { background:#366b95; border-color:#5d9bc8; }
.switch-row input:checked + .switch::after { transform:translateX(12px); }
.pass-summary { margin-top:16px; padding:16px 18px; border:1px solid #d3dce6; background:white; border-radius:7px; display:block; }
.pass-summary__step { font:.75rem Consolas,monospace; color:#67798d; margin-bottom:6px; }
.pass-summary h3 { font-size:1rem; margin-bottom:6px; }
.pass-summary p { font-size:.875rem; color:var(--muted); }
.formula-pair { justify-content:flex-start; margin-top:12px; }
.formula-pair span { font: .875rem Consolas,monospace; padding:5px 8px; white-space:normal; }
.length-plan,.numbers-panel { margin-top:28px; }
.subsection-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; }
.subsection-heading h2 { font-size:1.15rem; margin:0; }
.secondary-label { font-size:.75rem; color:var(--muted); }
.length-map { width:100%; height:auto; display:block; background:#fff; border:1px solid var(--line); border-radius:6px; }
.length-map text { font:14px Consolas,monospace; fill:#536578; }
.length-map .neck-envelope { fill:#e4ebf3; stroke:#7c91aa; stroke-width:1.5; }
.length-map .plan-line { stroke:#126bba; stroke-width:2; fill:none; }
.length-map .station-line { stroke:#8b9cb0; stroke-dasharray:4 4; }
.length-map .plan-dot { fill:#126bba; }
.length-map .plan-line--b { stroke:#ae601a; stroke-dasharray:6 4; }
.length-note { font-size:.875rem; color:var(--muted); margin:10px 0 0; }
.mark-plan { box-shadow:none; overflow:hidden; }
.plan-key { padding:12px 14px; gap:12px; }
.plan-key span { font-size:.875rem; }
.plan-table { min-width:620px; }
.plan-table th,.plan-table td { padding:12px; }
.plan-table tbody th { min-width:100px; }
.plan-table strong { font:.875rem/1.5 Consolas,monospace; }
.plan-table small { font:.75rem/1.5 Consolas,monospace; }
.table-location { font-size:.875rem; }
.method-details { box-shadow:none; margin-top:24px; }
.method-details summary { font-size:.875rem; color:var(--ink-soft); }
.method-details__body { font-size:.875rem; }
.reference-links { display:flex; flex-wrap:wrap; gap:12px 22px; }
.bench-footer { max-width:1700px; margin:auto; display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; padding:20px 28px; border-top:1px solid var(--line); font-size:.75rem; color:var(--muted); }
.bench-footer b { font-weight:500; }
.noscript-notice { padding:20px; }
.empty-state { min-height:220px; border-radius:0; font-size:1rem; }
@media (min-width:1700px) { .bench-layout { border-inline:1px solid var(--line); } }
@media (max-width:1150px) { .bench-layout { grid-template-columns:310px minmax(0,1fr); } .carve-panel { padding:24px 20px; } .header-method { display:none; } .canvas-toolbar { align-items:stretch; flex-direction:column; } .drawing-mode { align-self:flex-start; } .pass-tab { gap:8px; padding:12px 10px; } .pass-tab strong { font-size:.875rem; } }
@media (max-width:850px) { .bench-layout { grid-template-columns:1fr; } .measure-panel { border-right:0; border-bottom:1px solid var(--line); padding:24px; } .measurement-form { display:grid; grid-template-columns:1fr 1fr; column-gap:20px; } .sample-notice,.location-grid,.form-actions,.validation-message { grid-column:1/-1; } .location-grid { grid-template-columns:1fr 1fr; } .unit-picker { max-width:360px; } .form-actions { flex-direction:row; align-items:center; justify-content:space-between; } .history-actions { gap:16px; } .bench-header { padding:16px 20px; flex-wrap:wrap; gap:14px; } .project-actions { margin-left:0; } .carve-panel { padding:24px; } .canvas-toolbar { flex-direction:row; align-items:center; } }
@media (max-width:560px) { .bench-header { padding:16px; } .bench-brand strong { font-size:1.25rem; } .project-actions { width:100%; display:grid; grid-template-columns:1fr 1fr 1.2fr; } .project-actions .button { padding:9px 5px; font-size:.875rem; } .measure-panel,.carve-panel { padding:22px 16px; } .measurement-form,.location-grid { grid-template-columns:1fr; } .scale-field { grid-column:1; } .location-card__fields { grid-template-columns:1fr 1fr; } .location-card__header { display:flex; } .location-card__fields .field:last-child { grid-column:auto; } .canvas-toolbar { flex-direction:column; align-items:stretch; padding:12px; } .workspace-heading { align-items:start; } .workspace-status { max-width:110px; } .pass-tab { flex-direction:column; align-items:flex-start; gap:5px; padding:12px 8px; } .pass-tab strong { line-height:1.3; } .diagram-card__header { padding:16px 14px 0; } .diagram-values { padding:0 14px 14px; gap:8px; grid-template-columns:1fr; } .diagram-value { padding:12px; } .diagram-value dd { font-size:1.5rem; } .cross-section { min-height:0; } .canvas-footer { padding:12px 14px; } .subsection-heading { align-items:start; } .bench-footer { padding:18px 16px; } .coordinate-details dl { grid-template-columns:1fr; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; } }
@media print { .facet-app,.skip-link { display:none!important; } .print-sheet { color:#111; } }