/* Optional illustrations belong to the shell, never to the lesson canvas. */
.children-theme-preview{display:block;width:100%;height:77px;overflow:hidden;border-radius:7px;background:#dfedf3}
.children-theme-preview[data-child-preview="dollhouse"]{background:#f4e6ee}
.children-theme-preview svg{display:block;width:100%;height:100%;object-fit:cover}
.appearance-preset-child .appearance-preset-copy small{max-width:none}
.children-theme-playground{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:22px;align-items:center;margin:0 0 22px;padding:18px;background:var(--ui-panel);border:1px solid var(--ui-line);border-radius:14px;overflow:hidden}
.children-theme-playground[hidden],.children-theme-mascot[hidden]{display:none!important}
.children-theme-art{min-width:0;align-self:center;overflow:hidden;border-radius:11px}
.children-theme-art svg{display:block;width:100%;height:auto}
.children-theme-eyebrow{font-size:9px;letter-spacing:1.4px;font-weight:650;color:var(--ui-secondary)}
.children-theme-copy h3{font-size:17px;line-height:1.4;font-weight:600;letter-spacing:-.25px;color:var(--ui-text);margin:7px 0}
.children-theme-copy p{font-size:12px;line-height:1.65;color:var(--ui-secondary);min-height:40px;margin:8px 0 12px}
.children-theme-copy .button{font-size:11px;min-height:42px;max-width:100%}
.children-theme-note{display:block;font-size:10px;line-height:1.6;color:var(--ui-secondary);margin-top:8px}
.children-theme-toys{grid-column:1/-1;display:flex;align-items:flex-start;gap:10px;border-top:1px solid var(--ui-line);padding-top:13px;cursor:pointer;color:var(--ui-text);font-size:12px;line-height:1.6}
.children-theme-toys input{flex:0 0 18px;width:18px;height:18px;margin:1px 0 0;accent-color:var(--ui-accent-ink)}
.children-theme-toys strong{display:block;font-weight:600}.children-theme-toys small{display:block;color:var(--ui-secondary);font-size:10px}
.children-theme-mascot{display:grid;place-items:center;flex:0 0 54px;width:54px;height:54px;padding:4px;border:1px solid var(--ui-line-strong);border-radius:14px;background:var(--ui-accent-soft);cursor:pointer;box-shadow:0 2px 0 var(--ui-line);overflow:hidden}
.children-theme-mascot svg{display:block;width:100%;height:100%;overflow:visible}
.children-theme-mascot:hover{border-color:var(--ui-accent-ink)}
.children-theme-mascot:focus-visible,.children-theme-toys input:focus-visible{outline:2px solid var(--ui-focus);outline-offset:3px}
html:is([data-appearance="racing"],[data-appearance="dollhouse"])[data-children-toys="on"] #workspace .panel-decoration{display:none}
html:is([data-appearance="racing"],[data-appearance="dollhouse"]) #workspace .panel-heading{position:relative;gap:12px}
html:is([data-appearance="racing"],[data-appearance="dollhouse"]) #workspace .panel-heading h2{font-weight:550}
html[data-appearance="racing"][data-children-toys="on"] #workspace .workspace-header{box-shadow:inset 0 -3px var(--ui-accent-soft)}
html[data-appearance="racing"][data-children-toys="on"] #workspace .panel-heading{background-image:linear-gradient(90deg,transparent 49%,var(--ui-line) 49%,var(--ui-line) 51%,transparent 51%);background-size:18px 2px;background-repeat:repeat-x;background-position:bottom}
html[data-appearance="racing"][data-children-toys="on"] #workspace .tool-rail{background-image:repeating-linear-gradient(to bottom,transparent 0 10px,var(--ui-line-strong) 10px 18px,transparent 18px 28px);background-size:2px 100%;background-repeat:no-repeat;background-position:3px top}
html[data-appearance="racing"][data-children-toys="on"] #workspace .tool-button.is-active{border-radius:10px 10px 13px 13px;box-shadow:inset 0 -3px var(--ui-line-strong)}
html[data-appearance="dollhouse"][data-children-toys="on"] #workspace .workspace-header{box-shadow:inset 0 -3px var(--ui-accent-soft)}
html[data-appearance="dollhouse"][data-children-toys="on"] #workspace .panel-heading{background-image:radial-gradient(circle,var(--ui-line-strong) 1.5px,transparent 2px);background-size:12px 4px;background-repeat:repeat-x;background-position:bottom}
html[data-appearance="dollhouse"][data-children-toys="on"] #workspace .tool-rail{background-image:radial-gradient(circle,var(--ui-line-strong) 1.5px,transparent 2px);background-size:6px 16px;background-repeat:repeat-y;background-position:1px top}
html[data-appearance="dollhouse"][data-children-toys="on"] #workspace .tool-button.is-active{border-radius:14px;box-shadow:inset 0 -3px var(--ui-line-strong)}
.children-hero{transform-box:fill-box;transform-origin:center bottom}
.children-spark{transform-box:fill-box;transform-origin:center}
.is-celebrating .children-hero{animation:children-hello .8s ease-in-out 1}
.is-celebrating .children-spark{animation:children-sparkle .8s ease-out 1}
@keyframes children-hello{0%,100%{transform:translateY(0) rotate(0)}25%{transform:translateY(-5px) rotate(-5deg)}55%{transform:translateY(-2px) rotate(4deg)}75%{transform:translateY(-3px) rotate(-2deg)}}
@keyframes children-sparkle{0%,100%{transform:scale(1);opacity:1}40%{transform:scale(1.5) rotate(18deg);opacity:.6}70%{transform:scale(.9);opacity:1}}
@media(max-width:760px){
  .children-theme-preview{height:67px}
  .children-theme-playground{grid-template-columns:minmax(0,1fr);gap:14px;padding:13px}
  .children-theme-art{width:min(100%,240px);justify-self:center}
  .children-theme-copy h3{font-size:16px}.children-theme-copy p{min-height:0}
  .children-theme-mascot{width:50px;height:50px;flex-basis:50px}
  html[data-appearance="racing"][data-children-toys="on"] #workspace .tool-rail{background-image:repeating-linear-gradient(to right,transparent 0 10px,var(--ui-line-strong) 10px 18px,transparent 18px 28px);background-size:100% 2px;background-position:left bottom}
  html[data-appearance="dollhouse"][data-children-toys="on"] #workspace .tool-rail{background-size:16px 5px;background-repeat:repeat-x;background-position:left bottom}
}
@media(prefers-reduced-motion:reduce){.is-celebrating .children-hero,.is-celebrating .children-spark{animation:none!important;transform:none!important}}