/* The sketch's full meadow and a table seen from above, with a wider front edge. */
.workshop{background:linear-gradient(#99e5fd 0 470px,#b9d49c 720px,#e1e5c1 100%)}
.garden{max-width:none;height:clamp(235px,29vw,420px);margin:0 auto}.garden-scenery{z-index:0}.village{width:100%;max-width:1500px;height:auto;left:50%;bottom:28px;transform:translateX(-50%);opacity:1}.distant-hill{width:100%;left:-22%;height:230px;bottom:-10px}.distant-hill.h2{width:100%;right:-24%;bottom:-25px;height:225px}.tiny-helmut{right:11%;bottom:clamp(96px,9vw,155px);width:clamp(30px,3.3vw,49px);z-index:1}.garden-tree{left:10%;z-index:2;bottom:36px}.garden-path{height:64px;z-index:2}.parade{z-index:3;top:auto;height:150px;bottom:0}.garden-note{position:static;max-width:none;margin:12px auto 0;padding:0 22px;text-align:center;background:none;border:0;box-shadow:none;font-size:10px;color:#536c4c}
.table-wrap{max-width:1200px;padding:0 20px;margin:-8px auto 45px;isolation:isolate}.playbench{padding:53px 76px 37px;gap:29px;grid-template-columns:145px minmax(0,520px) 148px;background:none;border:0;border-radius:0;box-shadow:none;isolation:isolate}.playbench:before{content:'';position:absolute;inset:0 -10px 0;z-index:-2;clip-path:polygon(7% 0,93% 0,100% 100%,0 100%);background:repeating-linear-gradient(0deg,transparent 0 118px,#815f3726 119px 121px,transparent 122px 124px),linear-gradient(105deg,#e7c691,#f3dbac 38%,#d4ac72);box-shadow:inset 0 3px #9d7749,inset 0 -3px #a97941}.playbench:after{content:'';position:absolute;left:-10px;right:-10px;bottom:-22px;height:23px;z-index:-1;background:linear-gradient(#aa7944,#c99c60 45%,#ab7b46);border:2px solid #85623c;border-top:0;border-radius:0 0 3px 3px;box-shadow:0 12px 16px #46583c26}.table-legs{top:calc(100% + 20px);height:86px;left:6%;right:6%;z-index:-3}.table-legs i{height:82px;width:30px;background:linear-gradient(90deg,#956e45,#c19a60 40%,#b78b54);border-color:#856742;transform:skewX(-6deg)}.table-legs i:last-child{transform:skewX(6deg)}.paper{transform:perspective(1000px) rotateX(9deg) rotateZ(-1deg);transform-origin:center bottom;box-shadow:3px 9px 0 #8064400e,7px 15px 14px #634b3433}.brush-jar{transform:rotate(-3deg);filter:drop-shadow(5px 8px 3px #68523926)}.palette{transform:perspective(900px) rotateX(11deg)}.swatch{height:52px;border-bottom-width:3px;box-shadow:inset -7px -8px #3b38302b,inset 5px 0 #fff9,4px 7px 4px #61493138}.swatch:before{height:25px;box-shadow:inset 0 3px #0002,0 2px #fff7}.reading-card{margin-top:30px}.paint-note{margin-top:23px!important}.read-button{transform:rotate(-3deg)}
@media(max-width:1000px)and(min-width:721px){.playbench{grid-template-columns:122px minmax(0,1fr) 119px;padding:44px 48px 32px;gap:23px}.table-wrap{padding:0 15px}.playbench:before{clip-path:polygon(5% 0,95% 0,100% 100%,0 100%)}}
@media(max-width:720px){.workshop{background:linear-gradient(#99e5fd 0 290px,#b9d49c 480px,#e1e5c1 100%)}.garden{height:210px}.village{width:140%;left:50%;max-width:none;bottom:32px}.tiny-helmut{right:8%;bottom:104px;width:31px}.garden-tree{left:5%;bottom:36px}.garden-path{height:49px}.parade{height:118px}.table-wrap{padding:0 17px;margin-bottom:57px}.playbench{grid-template-columns:minmax(0,1fr);gap:20px;padding:31px 20px 26px}.playbench:before{inset:0 -7px 0;clip-path:polygon(4% 0,96% 0,100% 100%,0 100%)}.playbench:after{left:-7px;right:-7px;height:18px;bottom:-17px}.paper{transform:perspective(850px) rotateX(6deg) rotateZ(-.6deg)}.table-legs{height:57px;top:calc(100% + 16px)}.table-legs i{height:57px;width:22px}.garden-note{font-size:9px;margin:8px auto 0}.colour-rail{grid-row:2}.palette{transform:none}.swatch{height:44px}.swatch:before{height:21px}.motif-rail{padding-right:88px}.reading-card{margin-top:24px}}
@media(max-width:390px){.playbench{padding:27px 14px 24px}.table-wrap{padding:0 14px}.motif-rail{padding-right:76px}.village{width:150%}.tiny-helmut{right:8%;bottom:100px}.garden{height:196px}}

/* Keep the distant tower tied to the panorama at every screen width. */
.garden-panorama{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);width:100%;max-width:1500px;aspect-ratio:3/1}
.garden-panorama .village{position:static;display:block;width:100%;height:auto;max-width:none;transform:none}
.garden-panorama .tiny-helmut{right:27%;bottom:35%;width:clamp(22px,2.5vw,36px);height:auto;z-index:1;filter:saturate(.84);mask-image:linear-gradient(#000 0 93%,transparent 100%)}
.read-station{min-width:0}.voice-control{display:grid;gap:4px;text-align:center;font-size:10px;margin:4px auto 0;max-width:145px}.voice-control label{line-height:1.4}.voice-control input{width:100%;min-height:32px;margin:0;accent-color:#365e49;cursor:pointer;touch-action:pan-y}.voice-control output{font-size:10px;font-variant-numeric:tabular-nums}.voice-control input:focus-visible{outline:2px solid #075779;outline-offset:2px;border-radius:4px}
@media(max-width:720px){.garden-panorama{width:140%;max-width:none;bottom:32px}.garden-panorama .tiny-helmut{right:27%;bottom:35%;width:24px}.motif-rail{min-height:185px}.read-station{position:absolute;right:0;top:-3px;width:82px}.read-station .read-button{position:static;width:100%;transform:none}.voice-control{font-size:8px;margin-top:8px;gap:1px}.voice-control input{min-height:35px}.voice-control output{font-size:9px}}
@media(max-width:390px){.garden-panorama{width:150%}.read-station{width:71px}.motif-rail{min-height:179px}}

.voice-service-note{font-size:10px;line-height:1.5;color:#63775d;margin:14px 0 0}