:root{--bg:#eef0ee;--panel:#f9faf8;--ink:#1d2421;--muted:#5f6a65;--line:#d6dbd8;--accent:#2f6d5a;--accent-ink:#fff;--love:#c2364f;--glass:#f9faf8db;--display:"Familjen Grotesk", "Helvetica Neue", Arial, sans-serif;--body:"Figtree", system-ui, -apple-system, "Segoe UI", sans-serif;--mono:"IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root{--bg:#141816;--panel:#1b201e;--ink:#e6ebe8;--muted:#97a39e;--line:#2c3431;--accent:#6fbfa2;--accent-ink:#0f1513;--love:#f0718a;--glass:#1b201edb;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:var(--bg);color:var(--ink);font:15px/1.5 var(--body);-webkit-font-smoothing:antialiased}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.app{grid-template:"panel viewbar""panel stage"1fr/380px 1fr;height:100dvh;display:grid}.viewbar{background:var(--panel);border-bottom:1px solid var(--line);flex-wrap:wrap;grid-area:viewbar;align-items:center;gap:8px;min-width:0;padding:8px 12px;display:flex}.vtext{color:var(--muted);font-size:12px}.vtext.knote{color:var(--ink)}.stage{touch-action:none;background:#cfd3cf;grid-area:stage;min-width:0;position:relative;overflow:hidden}.stage canvas{width:100%;height:100%;display:block}.panel{background:var(--panel);border-right:1px solid var(--line);padding:20px max(18px, env(safe-area-inset-left,0px)) 24px 18px;flex-direction:column;grid-area:1/panel/-1;gap:22px;display:flex;overflow-y:auto}.overlay{pointer-events:none;align-items:center;gap:8px;display:flex;position:absolute;left:12px;right:12px}.overlay>*{pointer-events:auto}.overlay.top{top:max(12px, env(safe-area-inset-top,0px));flex-wrap:wrap;justify-content:space-between}.overlay.bottom{bottom:12px}.hint{color:#39413d;text-shadow:0 1px #fff9;font-size:12px}.seg{background:var(--glass);border:1px solid var(--line);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:999px;padding:3px;display:inline-flex}.seg button{background:0 0;border:0;border-radius:999px;padding:6px 12px;font-size:13px;font-weight:500}.seg button[aria-pressed=true]{background:var(--accent);color:var(--accent-ink)}.chip{border:1px solid var(--line);background:var(--glass);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:999px;padding:6px 12px;font-size:13px}.chip[aria-pressed=false]{color:var(--muted)}.stage-fallback{text-align:center;color:#333;place-items:center;padding:24px;display:grid;position:absolute;inset:0}.eyebrow,.label{font:500 11px/1.2 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.label{flex-wrap:wrap;align-items:baseline;gap:6px;margin:18px 0 8px;display:flex}.fname{text-transform:none;letter-spacing:0;font-family:var(--body);color:var(--ink);font-size:13px}.muted{color:var(--muted)}h1{font:700 30px/1.05 var(--display);letter-spacing:-.01em;text-wrap:balance;margin:6px 0}.blurb{max-width:40ch;margin:0}.dims{font:400 12px/1.4 var(--mono);color:var(--muted);font-variant-numeric:tabular-nums;margin:6px 0 0}.nav{grid-template-columns:auto 1fr auto;gap:8px;margin-top:16px;display:grid}.btn{border:1px solid var(--line);background:var(--bg);border-radius:10px;padding:10px 12px;font-size:14px;font-weight:600}.btn:hover{border-color:var(--accent)}.love[aria-pressed=true]{background:var(--love);border-color:var(--love);color:#fff}.swatches{flex-direction:column;gap:10px;display:flex}.swatch-line-name{color:var(--muted);margin-bottom:4px;font-size:12px}.swatch-row{flex-wrap:wrap;gap:8px;display:flex}.swatch{border:1px solid #0000002e;border-radius:50%;width:34px;height:34px;padding:0;box-shadow:inset 0 -3px 6px #0000001f}.swatch[aria-pressed=true]{outline:3px solid var(--accent);outline-offset:2px}.list{grid-template-columns:1fr 1fr;gap:4px;margin:0;padding:0;list-style:none;display:grid}.item{text-align:left;background:0 0;border:1px solid #0000;border-radius:8px;grid-template-columns:auto auto 1fr auto;align-items:center;gap:8px;width:100%;padding:7px 8px;font-size:13.5px;display:grid}.item:hover{background:var(--bg)}.item[aria-current=true]{border-color:var(--accent);background:var(--bg)}.num{font:400 11px var(--mono);color:var(--muted);font-variant-numeric:tabular-nums}.dot{border:1px solid #0003;border-radius:50%;width:12px;height:12px}.iname{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.heart{color:var(--love);visibility:hidden}.item.loved .heart{visibility:visible}.footnote{color:var(--muted);max-width:46ch;margin:auto 0 0;font-size:12px}@media (width<=760px){.app{grid-template:"viewbar""stage"44%"panel"1fr/1fr}.panel{grid-row:auto}.viewbar{padding:max(8px, env(safe-area-inset-top,0px)) 12px 8px;gap:6px}.seg button,.chip{padding:6px 10px;font-size:13px}.panel{border-right:0;border-top:1px solid var(--line);padding:16px max(16px, env(safe-area-inset-right,0px)) max(20px, env(safe-area-inset-bottom,0px)) max(16px, env(safe-area-inset-left,0px));gap:16px}h1{font-size:24px}.hint{display:none}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}[hidden]{display:none!important}.stage .kitchen-view{z-index:1;touch-action:none;background:#111;position:absolute;inset:0}.overlay{z-index:2}.stage .kitchen-view .ruler,.stage .kitchen-view .ruler-label{display:none!important}.pinned{z-index:3;background:var(--panel);border-bottom:1px solid var(--line);margin-top:-20px;padding:20px 0 12px;position:sticky;top:-20px}.pinned .nav{margin-top:10px}.current .blurb{margin-top:12px}@media (width<=760px){.pinned{margin-top:-16px;padding-top:16px;top:-16px}}.list .family{font:600 13px/1.2 var(--display);color:var(--muted);grid-column:1/-1;padding:12px 8px 4px}.list .family:first-child{padding-top:0}.vtext.steer{color:var(--accent-ink);background:var(--accent);border-radius:999px;padding:3px 8px;font-weight:600}.dnum{background:var(--accent);min-width:1.5em;height:1.5em;color:var(--accent-ink);font:700 .85em/1 var(--display);vertical-align:.08em;font-variant-numeric:tabular-nums;border-radius:.4em;place-items:center;margin-right:.25em;padding:0 .3em;display:inline-grid}.num{font:600 14px/1 var(--display);color:var(--ink);min-width:1.6em}.item[aria-current=true] .num{color:var(--accent)}.strip{scrollbar-width:none;-webkit-overflow-scrolling:touch;gap:6px;margin-top:6px;padding:8px 0 2px;display:flex;overflow-x:auto}.strip::-webkit-scrollbar{display:none}.pip{border:1px solid var(--line);background:var(--bg);min-width:34px;height:34px;color:var(--ink);font:600 14px/1 var(--display);font-variant-numeric:tabular-nums;border-radius:8px;flex:none;padding:0 6px;position:relative}.pip[aria-current=true]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.pip.loved:after{content:"♥";color:var(--love);font-size:11px;position:absolute;top:-6px;right:-3px}.sliders{gap:4px;display:grid}.sliders label{justify-content:space-between;margin-top:6px;font-size:13px;display:flex}.sliders output{font:500 13px var(--mono);font-variant-numeric:tabular-nums}.sliders input[type=range]{width:100%;accent-color:var(--accent)}.pinned{border-bottom:0}.seg button{place-items:center;padding:6px 12px;display:grid}.nav{grid-template-columns:1fr 1fr 1fr}.nav .btn{padding:8px;font-size:22px;line-height:1}.love[aria-pressed=true]{color:#fff}.sliders{grid-template-columns:auto 1fr;align-items:center;column-gap:10px}.sliders label.ico{color:var(--muted);margin:0;font-size:18px}.wg-stage{line-height:0;position:relative;overflow:hidden}.board{line-height:0;position:absolute}.photo{-webkit-user-select:none;user-select:none;-webkit-user-drag:none;display:block}.solids,.pieces,.chrome,.debug{position:absolute;inset:0}.solids,.debug,.pieces,.chrome{pointer-events:none}.debug{overflow:visible}.wg-stage.zoomed .photo{cursor:grab}.wg-stage.zoomed .photo:active{cursor:grabbing}.piece{transform-origin:0 0;pointer-events:auto;cursor:grab;position:absolute;top:0;left:0}.piece:active{cursor:grabbing}.front{width:100%;height:100%;position:absolute;inset:0;-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.outline{pointer-events:none;position:absolute;inset:0;overflow:visible}.outline polygon{fill:none;stroke:#ffffff9e;stroke-width:1.5px;vector-effect:non-scaling-stroke}.outline polygon.lead{stroke:#fffffff2}.guides line{stroke:var(--warm,#e8c98a);stroke-width:1px;vector-effect:non-scaling-stroke;opacity:.85}.guides line.gap{stroke-dasharray:3 3;stroke-width:1.5px}.band{pointer-events:none;z-index:9;background:#f3f1ed17;border:1px solid #f3f1edb3;border-radius:2px;position:absolute}.wg-stage.shoving .photo{cursor:grab}.wg-stage.shoving .photo:active{cursor:grabbing}.grip{cursor:nwse-resize;pointer-events:auto;touch-action:none;background:#fff;border:1.5px solid #141418cc;border-radius:3px;width:13px;height:13px;margin:-7px 0 0 -7px;padding:0;position:absolute}.grip:hover{background:var(--warm,#e8c98a)}.measuring .photo{cursor:crosshair}.ruler{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.ruler line{stroke:#ffd400;stroke-width:3px;vector-effect:non-scaling-stroke;stroke-dasharray:8 5;filter:drop-shadow(0 0 1.5px #000c)}.ruler.live line{stroke-dasharray:none}.ruler circle{fill:#ffd400;stroke:#0009;stroke-width:1px;vector-effect:non-scaling-stroke}.ruler-label{color:#fff;white-space:nowrap;pointer-events:none;background:#141414d1;border-radius:6px;padding:3px 8px;font-size:13px;font-weight:600;line-height:1.3;position:absolute;transform:translate(-50%,-150%)}