/* Scoped artwork rules intentionally override the portal's small icon sizing. */
.sb-art-scene{width:100%;overflow:hidden;border-radius:20px;background:#f4ead6;border:1px solid #cddbd2;isolation:isolate}
.sb-art-scene>.sb-art-svg{display:block;width:100%;height:auto;vertical-align:baseline;aspect-ratio:3/2}
.sb-art-scene>.sb-art-focus-svg{max-width:100%;shape-rendering:geometricPrecision}
.sb-art-scene.is-compact{max-width:270px;border-radius:14px}
.sb-art-preview{display:flex;align-items:center;justify-content:center;width:100%;min-width:0;aspect-ratio:1;overflow:hidden;border-radius:14px;background:#f9f6ed}
.sb-art-preview>svg{display:block;width:100%;height:auto;max-height:150px;vertical-align:baseline}
.sb-art-preview.is-room>svg{width:100%;height:auto;max-height:none}
.sb-art-scene.is-studying .sb-art-breathe{animation:sb-art-breathe 4.5s ease-in-out infinite}
.sb-art-scene.is-studying .sb-art-head{animation:sb-art-read 20s ease-in-out infinite;transform-box:fill-box;transform-origin:50% 100%}
.sb-art-scene.is-studying .sb-art-gaze{animation:sb-art-gaze 20s ease-in-out infinite}
.sb-art-scene.is-studying .sb-art-writing{animation:sb-art-writing-phase 20s linear infinite}
.sb-art-scene.is-studying .sb-art-write-gesture{animation:sb-art-write 20s ease-in-out infinite;transform-box:view-box;transform-origin:0 0}
.sb-art-scene.is-studying .sb-art-reading{animation:sb-art-reading-phase 20s linear infinite}
.sb-art-scene.is-studying .sb-art-page{animation:sb-art-page-turn 20s ease-in-out infinite;transform-box:fill-box;transform-origin:0% 100%}
.sb-art-scene.is-studying .sb-art-notes{animation:sb-art-notes 20s ease-in-out infinite;stroke-dasharray:20;stroke-dashoffset:0}
.sb-art-scene.is-studying .sb-art-eyes{animation:sb-art-blink 8s linear infinite;transform-box:fill-box;transform-origin:center}
.sb-art-scene.is-studying .sb-art-thought{animation:sb-art-thought 6s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
.sb-art-scene.is-studying .sb-art-tree{animation:sb-art-breeze-tree 26s ease-in-out infinite;transform-box:fill-box;transform-origin:50% 100%}
.sb-art-scene.is-studying .sb-art-wind{animation:sb-art-breeze 26s ease-in-out infinite}
.sb-art-scene.is-studying .sb-art-water{animation:sb-art-breeze-water 26s ease-in-out infinite}
@keyframes sb-art-breathe{0%,100%{translate:0 0}50%{translate:0 -3px}}
/* 0–9s writing, 9–10s rest, 10–19s reading/page turn, then return to writing. */
@keyframes sb-art-read{0%,100%{rotate:-2deg;translate:0 0}18%{rotate:2deg;translate:0 3px}40%,48%{rotate:0deg;translate:0 1px}55%{rotate:5deg;translate:0 7px}68%{rotate:1deg;translate:-2px 5px}79%{rotate:5deg;translate:1px 7px}90%,96%{rotate:2deg;translate:0 4px}}
@keyframes sb-art-gaze{0%,45%,100%{translate:0 0}53%,93%{translate:0 3px}97%{translate:0 0}}
@keyframes sb-art-writing-phase{0%,43%,100%{opacity:1}48%,95%{opacity:0}98%{opacity:1}}
@keyframes sb-art-reading-phase{0%,48%,98%,100%{opacity:0}52%,93%{opacity:1}96%{opacity:0}}
@keyframes sb-art-write{0%,100%{rotate:-4deg}5%,15%,25%,35%{rotate:4deg}10%,20%,30%,40%{rotate:-4deg}44%,98%{rotate:0deg}}
@keyframes sb-art-page-turn{0%,53%,71%,100%{scale:1 .15;rotate:0deg;opacity:0}57%,64%{scale:1 1;rotate:-8deg;opacity:1}68%{scale:1 .65;rotate:-3deg;opacity:.7}}
@keyframes sb-art-notes{0%{stroke-dashoffset:18}8%{stroke-dashoffset:12}18%{stroke-dashoffset:6}30%,100%{stroke-dashoffset:0}}
@keyframes sb-art-blink{0%,45%,48%,100%{scale:1 1}46.5%{scale:1 .12}}
@keyframes sb-art-thought{0%,100%{translate:0 0;opacity:.9}50%{translate:0 -3px;opacity:1}}
/* A few seconds of breeze after a long quiet interval; all scenery stays clipped. */
@keyframes sb-art-breeze-tree{0%,61%,84%,100%{rotate:0deg}66%{rotate:1.7deg}70%{rotate:-1deg}75%{rotate:1.4deg}80%{rotate:-.4deg}}
@keyframes sb-art-breeze{0%,61%,84%,100%{opacity:0;translate:-9px 0}65%{opacity:.35;translate:-5px 0}71%{opacity:.65;translate:4px 0}78%{opacity:.2;translate:14px 0}}
@keyframes sb-art-breeze-water{0%,61%,84%,100%{translate:0 0}69%{translate:4px 1px}76%{translate:-2px 0}}
@media(max-width:580px){.sb-art-scene{border-radius:14px}.sb-art-preview>svg{max-height:120px}}
@media(prefers-reduced-motion:reduce){.sb-art-scene svg *{animation:none!important}}
