:root{--bg: #ebe6dc;--panel: #f7f4ef;--ink: #1c1917;--muted: #78716c;--line: #d6d0c4;--accent: #3f5d4a;--warn: #a16207;--error: #b91c1c;--info: #1d4ed8;--font: "IBM Plex Sans", "Segoe UI", system-ui, sans-serif;--mono: "IBM Plex Mono", "SF Mono", ui-monospace, monospace}*{box-sizing:border-box}html,body{margin:0;height:100%;font-family:var(--font);color:var(--ink);background:var(--bg)}#app{display:grid;grid-template-columns:minmax(300px,380px) 1fr;height:100%;min-height:100vh}#panel{overflow-x:hidden;overflow-y:auto;background:var(--panel);border-right:1px solid var(--line);padding:1.25rem 1.25rem 2rem}.panel-header h1{margin:0;font-size:1.35rem;font-weight:650;letter-spacing:-.02em}.tagline{margin:.35rem 0 1.25rem;color:var(--muted);font-size:.85rem}fieldset{border:1px solid var(--line);border-radius:6px;margin:0 0 .85rem;padding:.65rem .75rem .75rem}fieldset.collapsible{padding-top:.45rem}.collapse-toggle{display:flex;align-items:center;gap:.4rem;width:100%;margin:0;padding:.15rem 0;border:none;background:transparent;color:var(--accent);font:inherit;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;text-align:left;cursor:pointer}.collapse-toggle h2,.collapse-title{margin:0;font:inherit;font-size:inherit;font-weight:inherit;text-transform:inherit;letter-spacing:inherit;color:inherit}.output-block>.collapse-toggle,.section-heading>.collapse-toggle{width:auto;flex:1;min-width:0;color:var(--ink);font-size:.95rem;font-weight:650;text-transform:none;letter-spacing:-.01em}.chevron{display:inline-block;width:.55rem;height:.55rem;flex:0 0 auto;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg);transition:transform .15s ease;opacity:.75}.collapsible.is-open>.collapse-toggle .chevron,.collapsible.is-open>.section-heading .chevron{transform:rotate(45deg)}.collapse-body{display:none;padding-top:.55rem}.collapsible.is-open>.collapse-body{display:block}legend{padding:0 .35rem;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--accent)}.field input[type=number].is-locked,.field.is-locked input[type=number]{background:#ece8e1;color:#57534e;cursor:not-allowed}.field-select{grid-template-columns:1fr;gap:.35rem}.field-select select{width:100%;padding:.4rem .45rem;border:1px solid var(--line);border-radius:4px;font-size:.85rem;background:#fff}.bin-preset .preset-meta{margin:.35rem 0 .5rem;font-size:.78rem;line-height:1.35}.bin-preset-image{display:block;width:100%;max-height:160px;object-fit:contain;margin:.35rem 0 .5rem;border-radius:6px;border:1px solid var(--line);background:#fff}.preset-hint{margin:.25rem 0 0;font-size:.75rem;line-height:1.35}.rack-overview{margin:0 0 .75rem;padding:.55rem .65rem;border-radius:6px;border:1px solid var(--line);background:#fff;font-family:var(--mono);font-size:.82rem;font-weight:600;letter-spacing:-.01em;color:var(--ink)}.units-note{margin:0 0 .85rem;font-size:.8rem;color:var(--muted)}.field{display:grid;grid-template-columns:1fr auto;gap:.5rem;align-items:center;margin:.35rem 0;font-size:.88rem}.field-nested{margin-left:.85rem;padding-left:.65rem;border-left:2px solid var(--line)}.field-computed .computed-value{font-family:var(--mono);font-size:.85rem;min-width:4.5rem;text-align:right;color:var(--ink)}.field-computed .computed-value.is-low{color:var(--error);font-weight:650}.field-fyi .field-name .muted{font-weight:400;font-size:.85em}.field-fyi .computed-value-wide{min-width:0;max-width:11rem;white-space:normal;overflow-wrap:break-word;line-height:1.25}.field-toggle{align-items:start}.inline-toggle{display:flex;flex-wrap:wrap;gap:.3rem;justify-content:flex-end;max-width:14rem}.inline-toggle-btn{padding:.32rem .45rem;border:1px solid var(--line);border-radius:5px;background:#fff;color:var(--muted);font-size:.72rem;font-weight:650;cursor:pointer;white-space:nowrap}.inline-toggle-btn.is-active{background:var(--accent);border-color:var(--accent);color:#fff}.field-label{display:inline-flex;align-items:center;gap:.35rem;min-width:0}.field-name{line-height:1.25}.field-hint{color:var(--muted);font-weight:400;font-size:.82em}.field-warn{color:var(--error);font-weight:600;font-size:.78em}.tip{flex:0 0 auto;width:1.05rem;height:1.05rem;padding:0;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--muted);font-family:Georgia,Times New Roman,serif;font-size:.72rem;font-weight:700;font-style:italic;line-height:1;cursor:help}.tip:hover,.tip:focus-visible,.tip.is-tip-open{color:var(--accent);border-color:var(--accent);outline:none}#floating-tip{position:fixed;z-index:1000;width:max-content;max-width:min(240px,calc(100vw - 1.5rem));padding:.5rem .6rem;border-radius:6px;background:#1c1917;color:#fafaf9;font-size:.72rem;font-weight:400;line-height:1.35;text-align:left;white-space:normal;pointer-events:none;box-shadow:0 6px 18px #0000002e;opacity:0;visibility:hidden;transition:opacity .12s ease}#floating-tip.is-visible{opacity:1;visibility:visible}.field-control{display:inline-flex;align-items:center;gap:.3rem}.field input[type=number]{width:5.5rem;padding:.3rem .4rem;border:1px solid var(--line);border-radius:4px;font-family:var(--mono);font-size:.85rem;background:#fff}.unit{min-width:1.6rem;color:var(--muted);font-family:var(--mono);font-size:.72rem}.field input[type=checkbox]{width:1rem;height:1rem;justify-self:end}.field input[type=checkbox]:disabled{opacity:.45;cursor:not-allowed}.field:has(input[type=checkbox]:disabled){opacity:.55}.output-block{margin-top:1.25rem;padding-top:1rem;border-top:1px solid var(--line)}.output-block h2{margin:0;font-size:.95rem}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:0}.collapsible.is-open>.section-heading{margin-bottom:.6rem}.section-heading h2{margin:0}.dim-format{display:flex;gap:.25rem;flex:0 0 auto}.dim-fmt-btn{padding:.28rem .45rem;border:1px solid var(--line);border-radius:5px;background:#fff;color:var(--muted);font-size:.7rem;font-weight:650;cursor:pointer;white-space:nowrap}.dim-fmt-btn.is-active{background:var(--accent);border-color:var(--accent);color:#fff}dl{display:grid;grid-template-columns:1fr auto;gap:.35rem .75rem;margin:0;font-size:.86rem}dt{color:var(--muted)}dd{margin:0;text-align:right;font-family:var(--mono);font-size:.82rem}.purchase-hero{display:flex;align-items:center;flex-wrap:wrap;gap:.35rem;margin:0 0 .75rem;font-size:1.05rem}.purchase-hero.purchase-screws,.purchase-hero.purchase-weight{margin-top:-.35rem}.purchase-hero strong{font-size:1.6rem;color:var(--accent)}.purchase-hero.purchase-screws strong,.purchase-hero.purchase-weight strong{font-size:1.35rem}.purchase-stats{grid-template-columns:minmax(0,1fr) minmax(0,max-content);column-gap:.65rem;width:100%;max-width:100%}.purchase-stats dt{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.purchase-stats dd{min-width:0;max-width:11rem;white-space:normal;overflow-wrap:break-word;text-align:right;justify-self:end}.muted{color:var(--muted);font-size:.8rem}.warnings{margin:.75rem 0 0;padding-left:1.1rem;font-size:.8rem}.warn-warn{color:var(--warn)}.warn-error{color:var(--error)}.warn-info{color:var(--info)}.lumber-mode{display:flex;gap:.4rem;margin:.65rem 0 .45rem}.waste-summary{margin:0 0 .75rem;font-size:.82rem;color:var(--ink)}.board-price-row{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin:.15rem 0 .35rem;font-size:.86rem;color:var(--muted)}.board-price-row input{width:6.5rem;padding:.35rem .45rem;border:1px solid var(--line);border-radius:5px;font-family:var(--mono);font-size:.85rem;text-align:right;background:#fff;color:var(--ink)}.purchase-cost{margin:0 0 .75rem;font-size:.92rem}.purchase-cost strong{font-family:var(--mono);color:var(--accent)}.mode-btn{flex:1;padding:.4rem .5rem;border:1px solid var(--line);border-radius:5px;background:#fff;color:var(--muted);font-size:.8rem;font-weight:600;cursor:pointer}.mode-btn.is-active{background:var(--accent);border-color:var(--accent);color:#fff}.piece-legend{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.4rem}.piece-legend li{display:flex;gap:.5rem;align-items:flex-start;font-size:.78rem;line-height:1.35}.swatch{flex:0 0 auto;width:1.35rem;height:1.35rem;border-radius:4px;color:#fff;font-family:var(--mono);font-size:.7rem;font-weight:700;display:inline-flex;align-items:center;justify-content:center;box-shadow:inset 0 0 0 1px #0000001f}.waste-swatch{background:repeating-linear-gradient(-45deg,#fce7f3,#fce7f3 3px,#f9a8d4 3px,#f9a8d4 6px);color:transparent}.legend-body{min-width:0}.board-list,.piece-list{display:flex;flex-direction:column;gap:.65rem}.board-row,.piece-row{display:flex;flex-direction:column;gap:.2rem}.board-meta,.piece-meta{font-size:.7rem;color:var(--muted);font-family:var(--mono)}.board-bar{display:flex;width:100%;height:1.55rem;border-radius:4px;overflow:hidden;border:1px solid var(--line);background:#fff}.bar-seg{display:flex;align-items:center;justify-content:center;min-width:0;overflow:hidden;border-right:1px solid rgba(255,255,255,.35);flex-basis:0}.bar-seg:last-child{border-right:none}.bar-seg span{padding:0 .2rem;font-family:var(--mono);font-size:.62rem;font-weight:700;color:#fff;text-shadow:0 1px 1px rgba(0,0,0,.35);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bar-seg.waste{background:repeating-linear-gradient(-45deg,#fce7f3,#fce7f3 3px,#f9a8d4 3px,#f9a8d4 6px);border-right-color:#be185d26}.bar-seg.kerf{background:repeating-linear-gradient(-45deg,#fce7f3,#fce7f3 2px,#db2777 2px,#db2777 4px);min-width:3px;border-right-color:#9d174d59}.bar-seg.waste span{color:#9d174d;text-shadow:none;font-weight:600}.bar-seg.spacer{background:repeating-linear-gradient(90deg,transparent,transparent 6px,rgba(0,0,0,.04) 6px,rgba(0,0,0,.04) 7px);border-right:none}.piece-group{margin-bottom:.35rem}.piece-group-title{display:flex;align-items:center;gap:.4rem;flex-wrap:wrap;margin:0 0 .4rem;font-size:.8rem;font-weight:650}.piece-group .piece-row{margin-bottom:.3rem}#viewport-wrap{position:relative;min-width:0;background:radial-gradient(ellipse at 30% 20%,#fff9f0 0%,transparent 55%),linear-gradient(160deg,#e7e2d8,#d9d3c8)}#viewport-menu{position:absolute;top:.85rem;right:.85rem;z-index:5;display:flex;flex-direction:column;gap:.45rem;padding:.65rem .7rem;border-radius:8px;background:#f7f4efeb;border:1px solid var(--line);box-shadow:0 8px 24px #1c19171f;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);min-width:11.5rem}.vp-check{display:flex;align-items:center;gap:.4rem;font-size:.78rem;color:var(--ink);cursor:pointer;-webkit-user-select:none;user-select:none}.vp-check:has(input:disabled){opacity:.45;cursor:not-allowed}.vp-mode{display:flex;gap:.3rem}.vp-mode-btn{flex:1;padding:.35rem .4rem;border:1px solid var(--line);border-radius:5px;background:#fff;color:var(--muted);font-size:.72rem;font-weight:650;cursor:pointer;white-space:nowrap}.vp-mode-btn.is-active{background:var(--accent);border-color:var(--accent);color:#fff}#viewport{width:100%;height:100%}#viewport canvas{display:block;width:100%!important;height:100%!important}#viewport-hint{position:absolute;left:1rem;bottom:1rem;padding:.4rem .7rem;background:#1c19178c;color:#fafaf9;font-size:.75rem;border-radius:4px;pointer-events:none}@media(max-width:860px){#app{grid-template-columns:1fr;grid-template-rows:auto minmax(50vh,1fr)}#panel{border-right:none;border-bottom:1px solid var(--line);max-height:48vh}}