/* Scoped welcome and completion UX; approved global design tokens are reused. */
.avatar-picker{border:0;padding:0;margin:18px 0 6px;max-width:370px;min-width:0}.avatar-picker legend{font-size:14px;color:var(--muted);margin-bottom:8px}.avatar-choices{display:grid;grid-template-columns:1fr 1fr;gap:14px}.avatar-choice{background:transparent;border:1.5px solid transparent;border-radius:var(--radius);padding:6px 12px;color:var(--ink);min-width:0;display:flex;align-items:center;flex-direction:column}.avatar-choice img{width:110px;height:100px;object-fit:contain;mix-blend-mode:multiply}.avatar-choice>span{font:600 17px var(--ui);letter-spacing:.04em}.avatar-choice small{font-size:11px;min-height:18px;color:var(--violet)}.avatar-choice[aria-pressed="true"]{border-color:var(--violet);background:#eeebf540}.avatar-choice:hover{border-color:#b9adcd}#avatar-status{font-size:12px;margin:5px 0!important;color:var(--muted)}
.completion-panel{width:100%;max-width:600px;margin:14px auto 8px;padding:10px 0;scroll-margin-top:20px;scroll-margin-bottom:calc(110px + env(safe-area-inset-bottom));outline-offset:6px;text-align:center}.completion-panel:focus{outline:none}.completion-panel:focus-visible{outline:2px solid var(--turquoise)}.completion-panel .feedback,#assessment .completion-panel .feedback{min-height:0;padding:4px 0 10px}.completion-panel .feedback p{margin:4px 0}.completion-panel>.btn{width:100%;max-width:400px;margin:0;min-height:52px}#learning-pack .completion-panel{width:100%}
@media(max-width:650px){.avatar-picker{margin:12px auto 4px;max-width:320px;text-align:center}.avatar-picker legend{font-size:13px;float:none;width:100%}.avatar-choice img{height:80px;width:90px}.avatar-choice{padding:5px 10px}.avatar-choice>span{font-size:16px}.hero:has(.avatar-picker) .hero-art{height:125px}.completion-panel{margin:8px auto;padding:6px 0 10px}.completion-panel .feedback{font-size:13px}.completion-panel>.btn{max-width:none}}

@media(max-width:650px) and (max-height:780px){#assessment .picture{height:110px}#assessment .exercise-layout{padding-top:10px}#assessment .test-pattern{margin-top:14px}#assessment .assessment-numeral{font-size:68px;padding:8px 0}}
/* Compact welcome: the companions replace the redundant reading illustration. */
.hero:has(.avatar-picker){display:block;min-height:0}.hero:has(.avatar-picker) .hero-copy{display:grid;grid-template-columns:minmax(0,1fr) 320px;column-gap:48px;align-items:start}.hero:has(.avatar-picker) .hero-copy>.eyebrow,.hero:has(.avatar-picker) h1,.hero:has(.avatar-picker) .hero-copy>p,.hero:has(.avatar-picker) .actions,.hero:has(.avatar-picker) .home-progress{grid-column:1}.hero:has(.avatar-picker) .avatar-picker{grid-column:2;grid-row:1/6;margin:6px 0}.hero:has(.avatar-picker) .actions{margin:20px 0 16px}.hero:has(.avatar-picker) h1{margin-bottom:12px}.hero:has(.avatar-picker) .hero-copy>p{max-width:440px}
@media(max-width:650px){body[data-screen="home"] main{margin-top:16px}.hero:has(.avatar-picker) .hero-copy{display:block}.hero:has(.avatar-picker) .avatar-picker{margin:14px auto 4px}.hero:has(.avatar-picker) .actions{margin:14px 0}.hero:has(.avatar-picker) h1{margin-top:8px}.hero:has(.avatar-picker) .hero-copy>p{font-size:18px}}
/* Supplied video composition. No filters, masking, deformation or CSS animation. */
body[data-screen="home"]{background:#fff}body[data-screen="home"]:before{display:none}
.avatar-picker,.avatar-choices{background:#fff}.avatar-choices{gap:0;align-items:start}
.avatar-choice,.avatar-choice:hover,.avatar-choice[aria-pressed="true"]{border:0;border-radius:0;box-shadow:none;background:#fff;padding:0 4px;overflow:visible;transform:none;transition:none}
.avatar-choice>span.avatar-stage{display:flex;align-items:flex-end;justify-content:center;position:relative;aspect-ratio:488/480;width:100%;font:inherit;letter-spacing:normal}
.avatar-media{display:block;position:relative;width:100%;aspect-ratio:488/480;background:#fff}
.avatar-choice[data-avatar-id="max"] .avatar-media{width:64.2%;aspect-ratio:328/480}
.avatar-choice .avatar-media img,.avatar-choice .avatar-media video{display:block;width:100%;height:auto;max-width:none;object-fit:contain;mix-blend-mode:normal;animation:none!important;transform:none!important;pointer-events:none}
.avatar-choice .avatar-media video{position:absolute;inset:0;opacity:0}.avatar-choice .avatar-media.has-frame video{opacity:1}.avatar-choice .avatar-media.has-frame img{visibility:hidden}
.avatar-choice>span.avatar-name{margin-top:9px;min-height:28px;border-bottom:2px solid transparent;padding:0 12px}.avatar-choice[aria-pressed="true"]>span.avatar-name{border-color:var(--violet);color:var(--violet)}
.avatar-choice small{min-height:22px}.avatar-choice:focus-visible{outline-offset:3px}
@media(prefers-reduced-motion:reduce){.avatar-choice,.avatar-choice *{animation:none!important;transition:none!important}}

/* Final limited polish: keep source pigment/background intact; no video filters. */
body>nav{background:#fcfaf6;isolation:isolate}
@media(max-width:650px){
 body>nav span{font-size:12px;line-height:1.5}
 body>nav a{min-height:44px}
 body{padding-bottom:calc(104px + env(safe-area-inset-bottom))}
 .hero:has(.avatar-picker) .avatar-picker{max-width:300px;margin:8px auto 2px}
 .avatar-picker legend{margin-bottom:4px}
 .avatar-choice>span.avatar-name{margin-top:5px}
 .avatar-choice small{min-height:18px}
 .hero:has(.avatar-picker) .actions{margin:10px 0 14px}
}

/* One shared warm-paper surface; source video pixels remain untouched. */
.avatar-picker{width:100%;background:#f9f9f5}
.avatar-picker legend{background:#f9f9f5}
.avatar-picker .avatar-choices,.avatar-picker .avatar-choice,.avatar-picker .avatar-choice:hover,.avatar-picker .avatar-choice[aria-pressed="true"],.avatar-picker .avatar-media{background:transparent}

/* Matching only: success stays visible while native disabled blocks repeat taps. */
.match-options .option:disabled{opacity:1;background:#e7f3ec;color:#27634c;border:2px solid #43846a}
.match-options .option:disabled img{opacity:1}
.match-options .option.selected:not(:disabled){border:3px solid var(--violet-dark)}

.slots .word-gap{flex:0 0 12px;width:12px;min-width:12px;border:0;background:transparent}