/* M.B. Parks — Maker's Workbench, v1.0.4 */
:root{color-scheme:dark;--ink:#f0ece2;--muted:#bdb8aa;--green:#bce18f;--wood:#765235;--atlas-a:url('assets/tools-a.webp');--atlas-b:url('assets/tools-b.webp');--bench-image:url('assets/workbench.jpg');--tool-lite:url('assets/multimeter.webp');font-family:Arial,Helvetica,sans-serif;font-size:16px}
*{box-sizing:border-box}body{margin:0;background:#211e19;color:var(--ink)}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}button:focus-visible,a:focus-visible{outline:3px solid #d9ff82;outline-offset:5px}button{cursor:pointer}a{color:inherit}button:disabled{cursor:default;opacity:.5}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.masthead{min-height:100px;padding:22px 3.2vw 19px;display:flex;align-items:center;justify-content:space-between;gap:24px;background:#25251f;box-shadow:0 5px 16px #0005;position:relative;z-index:20;border-bottom:1px solid #626151}
.identity{display:flex;align-items:center;gap:15px}.artist-mark{width:51px;height:51px;fill:#e7e5d6;flex-shrink:0}.identity h1{font-family:Georgia,serif;font-weight:400;font-size:clamp(1.6rem,2.2vw,2rem);letter-spacing:.01em;margin:0 0 5px}.identity p{font:12px/1.5 'Courier New',monospace;letter-spacing:.18em;text-transform:uppercase;margin:0;color:#bbb9ab}
.bench-controls{display:flex;gap:8px;flex-wrap:wrap}.control{border:1px solid #777969;background:#ffffff05;color:#eeeddf;padding:11px 14px;min-height:44px;border-radius:3px;font-size:14px;line-height:1.2}.control:hover{background:#45473b}.control[aria-pressed=true]{background:#c6d2b9;color:#222b1b;border-color:#c6d2b9}
.bench-wrap{position:relative;isolation:isolate;background:var(--wood)}.bench{height:clamp(710px,55vw,930px);position:relative;overflow:hidden;background-color:var(--wood);background-image:linear-gradient(90deg,#0002,transparent 10%,transparent 90%,#0002),var(--bench-image);background-size:100% 100%,cover;background-position:center;box-shadow:inset 0 8px 24px #0005,inset 0 -15px 22px #0004;outline:none}
.bench-instructions{position:absolute;top:12px;left:0;right:0;margin:0;text-align:center;z-index:1;pointer-events:none;color:#f8eee0;text-shadow:0 1px 4px #251407;font:13px/1.5 'Courier New',monospace;letter-spacing:.035em}.bench-instructions strong{font-weight:400}.touch-hint{display:none}
.tool{--size:clamp(145px,14vw,215px);width:var(--size);height:calc(var(--size) + 20px);position:absolute;left:0;top:0;display:block;border:0;background:transparent;color:#211d15;text-decoration:none;cursor:grab;padding:0;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;outline-offset:0;will-change:transform}
.tool.big{--size:clamp(165px,16.5vw,258px)}.tool.notebook{--size:clamp(200px,19vw,300px)}.tool .sprite{display:block;width:100%;aspect-ratio:1;background-image:var(--atlas-a);background-size:300% 300%;background-repeat:no-repeat;background-position:calc(var(--col)*50%) calc(var(--row)*50%);transform:rotate(var(--angle,0deg));filter:drop-shadow(3px 9px 5px #160c046b);transition:filter .16s,scale .16s;pointer-events:none}
.tool .sprite.b{background-image:var(--atlas-b)}.tool:hover .sprite,.tool:focus-visible .sprite{filter:drop-shadow(5px 14px 7px #160c0480);scale:1.035}.tool.dragging{cursor:grabbing;z-index:10000!important}.tool.dragging .sprite{scale:1.07;filter:drop-shadow(12px 21px 10px #130a0088);transition:filter .13s,scale .13s}.tool.dragging .destination{display:none}
.tool-label{position:absolute;left:50%;bottom:4px;transform:translateX(-50%) rotate(var(--label-angle,-2deg));background:#e3d5af;color:#272015;padding:7px 13px 8px;white-space:nowrap;font:700 14px/1.1 'Courier New',monospace;box-shadow:1px 3px 4px #21120555;border:1px solid #bca87a99;max-width:125%;text-align:center;transition:opacity .15s;pointer-events:none}
.tool-label small{display:block;font-size:12px;letter-spacing:.08em;line-height:1.5}.tool[data-id=mbparks] .tool-label{background:#a3232e;color:#fff0e3;border:1px solid #6b1922;letter-spacing:.04em}.tool[data-id=statement] .tool-label{font-size:14px;background:#e8dfc4;bottom:24px;padding:9px 15px;line-height:1.3}.tool[data-id=statement] .tool-label small{font:italic 15px Georgia,serif;letter-spacing:0}
.labels-hidden .tool-label{opacity:0}.labels-hidden .tool:hover .tool-label,.labels-hidden .tool:focus-visible .tool-label,.labels-hidden .tool.dragging .tool-label{opacity:1}
.destination{display:none;position:absolute;bottom:100%;left:50%;transform:translateX(-50%);background:#23291f;color:#fbf9ef;padding:8px 10px;border:1px solid #a7b497;border-radius:2px;white-space:nowrap;font:12px/1.3 'Courier New',monospace;box-shadow:0 4px 8px #0004;pointer-events:none}.tool:hover .destination,.tool:focus-visible .destination{display:block}.tool .destination:empty{display:none}
.bench-footer{background:#24251f;border-top:1px solid #6c6352;padding:15px 3.2vw;display:flex;gap:16px;justify-content:space-between;align-items:center;color:#c5c6b8;font:12px/1.7 'Courier New',monospace}.bench-footer p{margin:0}.bench-footer .aside{color:#909886}.bench-footer button{border:0;border-bottom:1px dotted currentColor;background:none;color:inherit;font:inherit;padding:0}.saving-note{color:#d3dbbd;min-height:18px}.toast{position:fixed;bottom:26px;left:50%;transform:translateX(-50%);max-width:calc(100vw - 32px);background:#eff1dc;color:#283120;border:1px solid #aeb39b;padding:12px 20px;font-size:14px;border-radius:3px;z-index:11000;box-shadow:0 5px 26px #0006;opacity:0;pointer-events:none;transition:opacity .15s}.toast.visible{opacity:1}
dialog{border:1px solid #837b60;border-radius:4px;padding:0;background:#f0ead8;color:#302b22;max-width:760px;width:calc(100% - 32px);max-height:calc(100dvh - 48px);box-shadow:0 22px 90px #0009}dialog::backdrop{background:#131610ba;backdrop-filter:blur(4px)}.dialog-header{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:20px 27px;position:sticky;top:0;background:#f0ead8;z-index:2;border-bottom:1px solid #cbc1a6}.dialog-header h2{margin:0;font:400 24px Georgia,serif}.close-dialog{width:42px;height:42px;background:transparent;color:#302b22;border:1px solid #b3aa92;font-size:27px;border-radius:50%;flex-shrink:0}.close-dialog:hover{background:#ded5bd}.dialog-body{padding:18px 35px 35px}.statement-copy h2{display:none}.statement-copy{font:18px/1.75 Georgia,serif}.statement-copy p:first-of-type{font-size:28px;line-height:1.3}.making-lines{font:16px/1.7 'Courier New',monospace;padding:8px 0}.making-lines .letter{color:#527535;font-weight:bold}.statement-signoff{font:italic 25px Georgia,serif;padding-top:15px;border-top:1px solid #c6baa0}.dialog-help p{font-size:16px;line-height:1.65}.dialog-help dt{font-weight:700;margin-top:20px}.dialog-help dd{margin:5px 0 0;line-height:1.5}.link-index{display:grid;grid-template-columns:1fr 1fr;gap:8px 18px;margin:0;padding:0;list-style:none}.link-index a{display:block;border-bottom:1px solid #c6bda6;padding:13px 0;font-size:16px;color:#38472a;text-underline-offset:4px}.link-index a small{display:block;margin-top:4px;color:#6a685e;font-size:12px;overflow-wrap:anywhere}.dialog-note{font:14px/1.6 Arial,sans-serif;color:#5b5c4f}
@media(min-width:1700px){.bench{background-size:100% 100%,100% auto}}@media(max-width:1050px) and (min-width:701px){.tool{--size:135px}.tool.big{--size:160px}.tool.notebook{--size:180px}.tool-label{font-size:14px;padding-inline:8px}.bench{height:720px}}
@media(max-width:700px){.masthead{padding:19px 18px 14px;gap:17px;align-items:flex-start;flex-direction:column}.identity h1{font-size:27px}.identity p{font-size:11px;letter-spacing:.12em}.artist-mark{width:43px;height:43px}.bench-controls{width:100%;gap:7px}.control{padding:10px 12px;flex:1}.bench{height:1940px;background-size:auto,auto 1050px;background-repeat:repeat;background-position:center top;box-shadow:inset 0 10px 18px #0003}.tool{--size:clamp(140px,39vw,200px)}.tool.big{--size:clamp(150px,43vw,220px)}.tool.notebook{--size:clamp(160px,44vw,230px)}.tool-label{font-size:14px;max-width:112%;white-space:normal;min-width:100px;padding:7px 8px;line-height:1.25}.tool[data-id=statement] .tool-label{font-size:12px;padding:7px 10px;bottom:12px}.tool[data-id=statement] .tool-label small{font-size:13px}.bench-instructions{top:13px;font-size:12px;padding:0 10px}.touch-hint{display:inline}.desktop-hint{display:none}.bench-footer{padding:18px;align-items:flex-start;flex-direction:column;gap:7px}.destination{display:none!important}.dialog-header{padding:14px 18px}.dialog-body{padding:12px 22px 26px}.link-index{grid-template-columns:1fr}.making-lines{font-size:14px}.statement-copy{font-size:17px}dialog{max-height:calc(100dvh - 24px)} }
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}
@media(forced-colors:active){.tool-label{background:Canvas;color:CanvasText;border:2px solid ButtonText}.control{border:1px solid ButtonText}.tool:focus-visible{outline:3px solid Highlight}.bench-instructions{background:Canvas;color:CanvasText;text-shadow:none}}

.tool .sprite{position:relative;background-image:none!important}.cutout{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background-repeat:no-repeat;pointer-events:none}

.evening .bench{background-image:linear-gradient(#10150c70,#10150c70),var(--bench-image)}.evening .sprite{filter:brightness(.8) drop-shadow(3px 9px 5px #0009)}