/* Three object studies share the same sticker grid and page layout. */
.studio-comparison{width:100%;max-width:540px;justify-self:end;min-width:0}
.studio-scene{position:relative;--object-line:#29434a;--object-lid:#dce4e2;--board:#cbdad1;--board-edge:#71958a;--metal:#dfb352;--window:#deedf4}
.studio-drawing{display:block;width:100%;height:auto;overflow:visible}
.scene-laptop,.scene-window{display:none}
[data-scene="laptop"] .scene-laptop{display:initial}
[data-scene="laptop"] .scene-pinboard{display:none}
[data-scene="window"] .scene-window{display:initial}
.studio-laptop-lid{fill:var(--object-lid);stroke:var(--object-line);stroke-width:2.2}
.studio-laptop-base{fill:#bdceca;stroke:var(--object-line);stroke-width:2}
.studio-laptop-edge{fill:#9ab4ae;stroke:var(--object-line);stroke-width:2}
.studio-stroke,.studio-arm,.studio-cord{fill:none;stroke:var(--object-line);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.pinboard-frame{fill:var(--board-edge);stroke:var(--object-line);stroke-width:1.8}
.pinboard-surface{fill:var(--board)}.board-pin{fill:#e6aa86;stroke:var(--object-line);stroke-width:1}
.tile-edge{fill:#fff;stroke:#31464b;stroke-width:1.8}
.tile-icon{fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;color:#20383e}
.tile-label{fill:#20383e;font:700 12.5px Arial,sans-serif;text-anchor:middle;letter-spacing:0}
.tile-monogram{fill:#fff;font:700 28px "Trebuchet MS",Arial,sans-serif;text-anchor:middle;letter-spacing:-1px}
.studio-sticker{outline:none}.tile-art{transition:transform .16s ease;transform-origin:0 0}
.studio-sticker:hover .tile-art{transform:scale(1.045)}
.studio-sticker:focus-visible .tile-edge{stroke:#123f59;stroke-width:5}
.desk-rule{fill:none;stroke:var(--line);stroke-width:1.3}
.studio-gooseneck{fill:none;stroke:var(--object-line);stroke-width:6;stroke-linecap:round}
.lamp-metal{fill:var(--metal);stroke:var(--object-line);stroke-width:2;stroke-linejoin:round}
.lamp-joint{fill:var(--object-line)}.lamp-mouth{fill:#e4e9df;stroke:var(--object-line);stroke-width:1.8}
.studio-bulb{fill:#d7ded6;stroke:var(--object-line);stroke-width:1.5}.lamp-highlight{stroke:#f5d88e;stroke-width:2;fill:none;stroke-linecap:round}
.lamp-illumination,.board-illumination{opacity:0;pointer-events:none;transition:opacity .25s ease}
.studio-switch{left:94.46%;top:91.1%;width:44px;height:48px}.studio-switch .switch-casing{width:28px;height:36px;border-radius:10px}
.window-frame,.window-sill{fill:#d1ddd7;stroke:var(--object-line);stroke-width:1.6}
.window-sky{fill:var(--window)}.window-mullion{fill:none;stroke:#d1ddd7;stroke-width:7}
.window-night{display:none}.window-view .window-day{display:initial}
.scene-picker{display:flex;align-items:center;justify-content:center;gap:4px;margin-top:2px}
.scene-picker button{border:0;border-bottom:2px solid transparent;background:none;padding:7px 12px;color:var(--muted);font-size:12px;min-height:36px}
.scene-picker button[aria-pressed="true"]{border-bottom-color:var(--teal);color:var(--ink);font-weight:700}
.scene-picker button:hover{color:var(--ink);background:color-mix(in srgb,var(--teal) 7%,transparent)}
[data-theme="dark"] .studio-scene{--object-line:#9db3b1;--object-lid:#3d5856;--board:#344c49;--board-edge:#627c72;--metal:#e2b55a;--window:#213d54}
[data-theme="dark"] .studio-laptop-base{fill:#456460}[data-theme="dark"] .studio-laptop-edge{fill:#2f4c4c}
[data-theme="dark"] .lamp-mouth{fill:#ffe0a3}[data-theme="dark"] .studio-bulb{fill:#fff5d2}
[data-theme="dark"] .lamp-illumination,[data-theme="dark"] .board-illumination{opacity:1}
[data-theme="dark"] .window-frame,[data-theme="dark"] .window-sill{fill:#3b565b}
[data-theme="dark"] .window-mullion{stroke:#3b565b}
[data-theme="dark"] .window-day{display:none!important}[data-theme="dark"] .window-night{display:initial}
[data-theme="dark"] .studio-sticker:focus-visible .tile-edge{stroke:#f3c35f}
.home-map-link{display:block;cursor:pointer;text-decoration:none}.home-map-link .cell-map{pointer-events:none}
.home-map-link:hover{outline:2px solid var(--teal);outline-offset:3px}
.mail-drawing{width:27px;height:24px;display:block;stroke:var(--ink);stroke-width:1.6;stroke-linejoin:round;flex-shrink:0}
.contact-link:hover .mail-drawing{transform:translateY(-1px)}
.workshop-icon svg{width:44px;height:42px;display:block}.workshop-icon svg .workshop-code{fill:none;stroke-width:1.7}
.workshop-link:hover .workshop-icon svg{transform:translateY(-2px)}
.demo-dialog{border:1px solid var(--line);border-radius:6px;padding:0;width:min(960px,calc(100vw - 48px));max-height:calc(100dvh - 48px);overflow:auto;background:var(--paper);color:var(--ink)}
.demo-dialog::backdrop{background:#08131ac7;backdrop-filter:blur(3px)}
.demo-dialog-header{display:flex;align-items:center;gap:18px;justify-content:space-between;padding:14px 18px}
.demo-dialog h2{font-size:20px;letter-spacing:-.3px}.demo-dialog p{font-size:12px;color:var(--muted);margin-top:4px}
.demo-dialog-close{display:grid;place-items:center;width:44px;height:44px;flex-shrink:0;border:1px solid var(--line);border-radius:50%;background:transparent;color:var(--ink)}
.demo-dialog-close:hover{background:var(--line)}.demo-dialog-close svg{width:18px;height:18px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round}
.demo-dialog video{display:block;width:100%;max-height:calc(100dvh - 160px);background:#071014;object-fit:contain}
.demo-dialog-youtube{display:block;width:100%;aspect-ratio:16/9;max-height:calc(100dvh - 215px);border:0;background:#071014}
.demo-dialog-footer{padding:10px 18px;border-top:1px solid var(--line)}
.demo-dialog-footer a{display:inline-flex;align-items:center;min-height:44px;color:var(--teal);font-size:14px}
.demo-dialog-footer[hidden],.demo-dialog-meta[hidden]{display:none}
body:has(.demo-dialog[open]){overflow:hidden}
@media(max-width:680px){.studio-comparison{max-width:450px;align-self:center}.intro{gap:18px}.scene-picker button{min-height:40px;padding:7px 10px}.studio-switch .switch-casing{width:26px;height:34px}.demo-dialog{width:calc(100vw - 24px);max-height:calc(100dvh - 24px)}.demo-dialog-header{padding:11px 12px;gap:12px}.demo-dialog h2{font-size:18px}.demo-dialog video{max-height:calc(100dvh - 145px)}}
@media(prefers-reduced-motion:reduce){.tile-art,.lamp-illumination,.board-illumination{transition:none}}

/* The lamp cable also divides the homepage's two content columns. */
.home-with-cable{position:relative;isolation:isolate}
.home-with-cable>.intro,.home-with-cable>.home-content{position:relative;z-index:1}
.home-with-cable>.home-content{border-top:0;padding-top:26px}
.layout-cable{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:0;color:#718b88;visibility:hidden}
.layout-cable.is-positioned{visibility:visible}
.layout-cable path{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.layout-cable .cable-plug-body{fill:var(--paper)}
.home-with-cable .lamp-option-cord{stroke:#718b88}
[data-theme="dark"] .layout-cable{color:#789594}
[data-theme="dark"] .home-with-cable .lamp-option-cord{stroke:#789594}
@media(max-width:680px){.home-with-cable>.home-content{padding-top:26px}}
.home-footer{display:grid;grid-template-columns:1fr auto auto;border-top:0;gap:24px}
.home-footer .footer-power{position:relative;min-height:36px;padding:8px 12px;border:1.5px solid #718b88;border-radius:6px;background:var(--paper)}
.home-footer .footer-power:hover{border-color:var(--teal)}
.power-socket{position:absolute;left:11px;top:-3px;width:10px;height:4px;background:var(--paper);border:1.5px solid #718b88;border-radius:1px}
[data-theme="dark"] .home-footer .footer-power,[data-theme="dark"] .power-socket{border-color:#789594}
@media(max-width:680px){.home-footer{grid-template-columns:1fr auto;gap:16px}.home-footer>.footer-links{grid-column:1/-1;justify-self:end}.home-footer .footer-power{min-height:40px}}

/* A single pulse climbs from the footer plug before the lamp lights. */
.layout-cable .cable-power-pulse{stroke:#efb62e;stroke-width:3;opacity:0;fill:none;pointer-events:none}
[data-theme="dark"] .layout-cable .cable-power-pulse{stroke:#ffdb83}
.home-with-cable.is-charging .lamp-light{opacity:0;transition:none}
.home-with-cable.is-charging .lamp-mouth{fill:#d8e2df}
.home-with-cable.is-charging .studio-bulb{fill:#d8e2df}

/* A collected patch: shared edges, an irregular outline, and original event art. */
.sticker-grid-organic .tile-label{font-size:9.5px}
.sticker-grid-organic .tile-icon{stroke-width:2.2}
.sticker-grid-organic .tile-monogram{font-size:26px}
.tile-focus-ring{fill:none;stroke:transparent;stroke-width:3;pointer-events:none}
.studio-sticker:focus-visible .tile-focus-ring{stroke:var(--teal);stroke-width:4}
[data-theme="dark"] .studio-sticker:focus-visible .tile-focus-ring{stroke:#f3c35f}