:root{--ink:#183b47;--muted:#5e767b;--paper:#e8eee8;--teal:#4e8588}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--paper)}body{font-family:Arial,Helvetica,sans-serif;color:var(--ink)}
.workshop-page{position:relative;isolation:isolate;width:100%;height:100svh;min-height:680px;overflow:hidden;background:#e4ebe7}
.scene{position:absolute;inset:0;z-index:-3;overflow:hidden;background:#d7e2df}
.artboard{position:absolute;left:50%;bottom:0;width:max(100vw,150svh);aspect-ratio:3/2;transform:translateX(-50%)}
.workshop-background{position:absolute;display:block;inset:0;width:100%;height:100%;object-fit:fill;image-rendering:pixelated}
#robot-layer{position:absolute;inset:0;width:100%;height:100%;image-rendering:pixelated}
.top-light{position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(245,247,234,.96) 0%,rgba(245,247,234,.55) 12%,rgba(245,247,234,.12) 35%,transparent 49%)}
.site-header{position:absolute;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:27px 42px;gap:20px}
.brand{display:block;line-height:0}.brand img{width:220px;height:auto}.header-status{display:flex;align-items:center;gap:9px;font:10px/1.5 'Courier New',monospace;letter-spacing:.1em;color:#3c6167}.header-status i{width:6px;height:6px;border-radius:50%;background:#628977;box-shadow:0 0 0 4px #638c7814}
.announcement{position:absolute;top:16%;left:0;right:0;text-align:center;pointer-events:none;padding:0 20px}.eyebrow{font:10px/1.5 'Courier New',monospace;letter-spacing:.2em;margin:0 0 16px;color:#516d71}
h1{font-size:clamp(58px,7.4vw,118px);font-weight:500;line-height:.94;letter-spacing:-.065em;margin:0;text-wrap:balance;text-shadow:0 2px 18px #eef1df75}.period{color:#4e8588}.subline{font-size:14px;letter-spacing:.015em;color:#406169;margin:21px 0 0}
.wall-sign{position:absolute;left:79%;top:18.8%;width:10.5%;text-align:center;font:bold 13px/1.2 'Courier New',monospace;letter-spacing:1px;color:#486c72;transform:rotate(-.2deg);text-shadow:1px 1px #edf0df}.wall-sign span{display:block;font-size:5px;letter-spacing:1.1px;margin-top:3px}
.workshop-controls{position:absolute;bottom:65px;left:42px;right:42px;display:flex;align-items:center;justify-content:space-between;color:#254c57}.workshop-label{font:10px/1.4 'Courier New',monospace;letter-spacing:.12em;background:#f3f4e7b8;padding:8px 11px}.workshop-label span{font-size:16px;margin-right:6px}
#pauseButton{display:flex;align-items:center;gap:9px;border:1px solid #31566140;background:#f3f4e7d9;backdrop-filter:blur(8px);color:var(--ink);border-radius:30px;padding:10px 16px;cursor:pointer;font:12px/1 Arial,sans-serif;min-width:89px;min-height:38px}#pauseButton:hover{background:#fffdf0}#pauseIcon{font-size:13px}a:focus-visible,button:focus-visible{outline:2px solid var(--ink);outline-offset:5px}
.site-footer{position:absolute;bottom:0;left:0;right:0;min-height:48px;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:15px 42px;background:#f2f3e8e8;border-top:1px solid #6b858322;backdrop-filter:blur(8px);font-size:10px;letter-spacing:.02em;color:#506b70}.site-footer strong{font-weight:600;color:#244b55}
@media(min-aspect-ratio:19/10){.announcement{top:17%}h1{font-size:clamp(68px,12svh,100px)}.artboard{bottom:-12vw}}
@media(max-width:700px){.workshop-page{min-height:640px}.site-header{padding:20px 22px}.brand img{width:180px}.header-status{font-size:8px;max-width:90px;letter-spacing:.04em;line-height:1.4}.header-status i{flex-shrink:0}.announcement{top:17%}.eyebrow{font-size:8px;letter-spacing:.12em}h1{font-size:clamp(51px,12.7vw,84px)}.subline{font-size:12px;margin-top:15px}.artboard{width:155vw;bottom:90px}.scene{background:linear-gradient(#f1f1e3 20%,#e5ebe4 56%,#c3d4d2 100%)}.top-light{background:linear-gradient(#f2f3e8 0%,#f2f3e8de 29%,#eef1e488 39%,transparent 55%)}.wall-sign{font-size:7px}.wall-sign span{font-size:3px}.workshop-controls{left:20px;right:20px;bottom:82px}.workshop-label{font-size:8px;letter-spacing:.04em;padding:6px 8px}.site-footer{padding:13px 20px;min-height:64px;align-items:flex-start;flex-direction:column;gap:6px;font-size:9px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important}}
@media(max-width:700px){.artboard{mask-image:linear-gradient(to bottom,transparent 0%,#000 20%);-webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 20%)}}
@media(min-width:701px){h1{font-size:clamp(58px,min(7.4vw,10svh),110px)}.announcement{top:14%}}

.wall-sign img{display:block;width:96%;height:auto;margin:auto;opacity:.8}

/* Temporary identity: workshop wall lettering only. */
.site-header{justify-content:flex-end}
.wall-sign{font-family:Arial,Helvetica,sans-serif;font-size:clamp(9px,1.2vw,20px);font-weight:700;letter-spacing:.07em;top:19.5%;color:#41463c;text-shadow:1px 1px #edf0df;opacity:.8}
@media(max-width:700px){.wall-sign{font-size:1.7vw}}
.wall-sign{left:65%;top:19%;width:15%;padding:.65% .4%;background:#e5e2cc;border:2px solid #bcb69c;box-shadow:2px 3px 0 #9e9f8933;font-size:clamp(10px,1.3vw,20px);opacity:1}
@media(max-width:700px){.wall-sign{font-size:1.7vw;border-width:1px}}

.workshop-controls{justify-content:flex-end}

/* Painted lettering on the open wall, above the drawing board. */
.wall-sign{left:63.8%;top:18.3%;width:14%;padding:0;background:none;border:0;box-shadow:none;color:#606459;opacity:.8;font-size:clamp(10px,1.35vw,21px);letter-spacing:.1em;transform:rotate(-.4deg);text-shadow:0 1px 0 #f4f1db70;mix-blend-mode:multiply}
@media(max-width:700px){.wall-sign{font-size:1.8vw}}

/* Lettering centered inside the original illustrated wall panel. */
.wall-sign{left:79%;top:19.45%;width:10.5%;font-size:clamp(9px,1.15vw,18px);letter-spacing:.07em;transform:rotate(-.2deg);opacity:.85}
@media(max-width:700px){.wall-sign{font-size:1.6vw}}
@media(min-width:701px){.wall-sign{left:79.4%;width:min(10%,calc(50vw - 29.4% - 10px));font-size:clamp(7px,.75vw,13px);letter-spacing:.025em;white-space:nowrap}}