/* Unit 4 uses the park's existing typography, cards and interaction positions. */
.unit-02 [hidden]{display:none!important}
body.unit-02{--gap:4px}
body.unit-02 main{gap:4px}
body.unit-02 .sentence-steps{width:min(720px,100%);gap:6px}
body.unit-02 .sentence-step{min-height:44px;padding:3px 8px;font-size:18px;gap:5px}
body.unit-02 .sentence-step img{width:28px;height:28px}
body.unit-02 .sentence-panel{min-height:58px;padding:3px 10px}
body.unit-02 #sentence-text{font-size:clamp(21px,2.3vw,28px)}
body.unit-02 .lesson-focus{color:#c85616;font:inherit;font-weight:800}
.unit-tools{display:flex;flex:none;justify-content:space-between;align-items:center;gap:8px;min-height:44px}
.unit-groups,.unit-recordings{display:flex;align-items:center;gap:8px}
.unit-tools button{min-height:44px;min-width:48px;padding:5px 12px;border:2px solid #e9dfc9;border-radius:16px;background:#fff9e9;color:#425c77;font:700 17px/1.2 "Leo Rounded Latin","Leo Rounded Chinese",sans-serif;cursor:pointer;touch-action:manipulation}
.unit-tools button[aria-pressed="true"]{background:#e3f3ff;border-color:#3397ed;color:#153f6b}
.unit-02.quiz .unit-recordings{display:none}
body.unit-02 .grid{grid-template-columns:repeat(3,minmax(0,1fr));min-height:120px}
body.unit-02 .grid[data-count="2"]{grid-template-columns:repeat(2,minmax(0,1fr))}
body.unit-02 .grid[data-count="1"]{grid-template-columns:minmax(0,360px);justify-content:center}
body.unit-02 .photo{overflow:hidden;mix-blend-mode:multiply}
body.unit-02 .name{white-space:normal;text-align:center;font-size:clamp(21px,2.4vw,30px)}
body.unit-02 .cn{font-size:17px}
.color-palette{display:none;flex:none;justify-content:center;gap:12px}
body.unit-02.coloring .color-palette{display:flex}
.color-palette button{display:grid;place-items:center;width:52px;height:52px;padding:3px;border:3px solid white;border-radius:50%;background:var(--paint);box-shadow:0 2px 4px #52647955;cursor:pointer;touch-action:manipulation}
.color-palette button:focus-visible{outline:4px solid #173e71;outline-offset:3px}
body.unit-02.coloring .modes,body.unit-02.coloring .unit-tools{display:none}
body.unit-02.coloring .card{grid-template-rows:minmax(0,1fr)}
body.unit-02.coloring .card .name,body.unit-02.coloring .card .cn{display:none}
.unit-02 .unpainted .photo{filter:grayscale(1) brightness(1.3);opacity:.65}
@media(orientation:portrait){
 body.unit-02 .grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));min-height:300px}
 body.unit-02 .grid[data-count="3"] .card:not([hidden]):last-of-type{grid-column:auto}
 body.unit-02 .grid[data-count="2"]{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:minmax(0,1fr)}
 body.unit-02 .grid[data-count="1"]{grid-template-columns:minmax(0,480px);grid-template-rows:minmax(0,1fr)}
 body.unit-02 #sentence-text{font-size:24px}
}
@media(max-width:560px){.unit-tools button{padding:4px 7px;font-size:14px}.unit-02 .sentence-step{font-size:15px;padding:3px 4px}.unit-02 .sentence-step img{display:none}.color-palette{gap:6px}.color-palette button{width:44px;height:44px}}