:root{--ink:#303c37;--paper:#fcfaf5;--green:#315b49;--muted:#66736a;--line:#dddcd2}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:ui-rounded,'Trebuchet MS',sans-serif}button,input{font:inherit}button{min-height:44px;cursor:pointer;border:1px solid var(--line);background:transparent;color:var(--ink);border-radius:9px;padding:9px 14px}button:hover{background:#eaece3}button:disabled{opacity:.35;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #bc7420;outline-offset:3px}button[aria-pressed=true]{background:var(--green);color:white;border-color:var(--green)}header{height:92px;max-width:1320px;margin:auto;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 38px}.brand{font-weight:900;font-size:29px;letter-spacing:-1px;text-decoration:none;color:var(--ink)}.brand-mark{display:inline-block;color:#cf7254;font-size:39px;vertical-align:middle;margin-right:10px}.brand-dot{color:#cf7254}.header-note{font-size:13px;color:var(--muted)}#saved-count{background:#e4e8dc;border-radius:20px;padding:2px 7px;margin-left:6px}main{max-width:1244px;margin:auto;padding:0 26px}.intro{display:flex;justify-content:space-between;align-items:center;min-height:300px;padding:35px 24px}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:800;color:#586e5e}h1{font-family:Georgia,serif;font-weight:500;font-size:53px;line-height:1.08;letter-spacing:-2px;margin:17px 0}h1 em{font-weight:400;color:#416650}p{font-size:14px;line-height:1.65;color:var(--muted)}.intro-art{width:330px;margin-right:70px;text-align:center;transform:rotate(-4deg)}.intro-art svg{width:100%;height:190px}.intro-art span{font:italic 17px Georgia,serif;color:#687563}.mode-nav{display:flex;gap:8px;padding-bottom:17px;border-bottom:1px solid var(--line)}.mode-nav button{min-width:160px;border:0;font-weight:bold}.workspace{display:grid;grid-template-columns:245px 1fr;gap:32px;padding:27px 0}.section-heading{display:flex;justify-content:space-between;align-items:center}.small-label{font-size:8px;letter-spacing:1px;color:#858b7b}h2{font:500 26px Georgia,serif;margin:17px 0 10px}aside>p{font-size:13px}#choices{display:grid;gap:9px;margin:18px 0}#choices button{text-align:left;background:#fffdfa}#choices button[aria-pressed=true]{border-color:var(--green);color:var(--green);background:#e8eddf;font-weight:bold}.step-info{padding:14px;border:1px solid var(--line);border-radius:10px}.step-info p{margin:7px 0;font-size:13px}.step-actions{display:flex;gap:6px}.tip{background:#eeeede;border-radius:12px;padding:17px;margin:23px 0}.tip span{font-size:9px;font-weight:bold;letter-spacing:1px}.tip p{font-size:13px;margin-bottom:0}.name-label{font-size:12px;font-weight:bold}#art-name{width:100%;border:1px solid var(--line);border-radius:8px;padding:12px;margin-top:8px;background:#fffdfa;font-size:12px}.privacy{font-size:11px}.studio{background:#f1eee6;border:1px solid var(--line);border-radius:13px;overflow:hidden;min-width:0}.studio-top{display:flex;justify-content:space-between;padding:16px 20px;font-size:11px;color:#657365}#status{font-size:10px;max-width:48%;text-align:right}.paper{position:relative;aspect-ratio:800/560;background:white;margin:0 18px;border:1px solid #e2dfd5;overflow:hidden}.paper svg,.paper canvas{position:absolute;width:100%;height:100%;inset:0}#paint{touch-action:none;cursor:crosshair}#guide{pointer-events:none;opacity:.3}#art{pointer-events:none}body.coloring #art{pointer-events:auto;z-index:2}body.coloring #paint{pointer-events:none}#art [data-region]{cursor:pointer;stroke:#303c37;stroke-width:5;stroke-linejoin:round}#art [data-region]:focus{outline:none;stroke:#a64b21;stroke-width:8}.tools{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 17px;border-bottom:1px solid var(--line)}.tools button{border:none;font-size:11px;padding:6px 10px}.tool-group{display:flex;gap:3px}.size{display:flex;align-items:center;gap:6px;font-size:11px}.size input{width:78px;accent-color:var(--green)}.bottom-bar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:14px 18px}.bottom-bar button{font-size:11px}#palette{display:flex;gap:5px;flex-wrap:wrap}#palette button{width:32px;height:44px;min-height:44px;border:0;padding:5px;background:transparent}#palette span{display:block;width:23px;height:23px;border-radius:50%;background:var(--swatch);border:1px solid #0003}#palette button[aria-pressed=true] span{outline:2px solid var(--ink);outline-offset:3px}.custom-color{font-size:10px;display:flex;align-items:center;gap:4px}.custom-color input{width:30px;height:32px;border:0;padding:0}.primary{background:var(--green)!important;color:white!important;border-color:var(--green)}.footer-strip{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding:14px 0 25px;gap:15px}.footer-strip span{font-size:9px;letter-spacing:1px}.footer-strip p{font:italic 16px Georgia,serif}dialog{border:1px solid var(--line);border-radius:16px;padding:28px;width:min(700px,92vw);max-height:85vh;background:var(--paper);color:var(--ink)}dialog::backdrop{background:#203b2f66}.dialog-heading,.dialog-actions{display:flex;align-items:center;justify-content:space-between;gap:10px}#gallery-items{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}.saved-item img{width:100%;background:white;border:1px solid var(--line)}.saved-item h3{font-size:14px;overflow-wrap:anywhere}.saved-item button{font-size:12px;margin-right:5px}.saved-item{border-bottom:1px solid var(--line);padding-bottom:15px}@media(max-width:900px){.header-note{display:none}.intro-art{margin-right:0;width:260px}.workspace{grid-template-columns:200px 1fr;gap:18px}.size{display:none}.bottom-bar{gap:5px}.footer-strip span:last-child{display:none}}@media(max-width:650px){header{height:75px;padding:0 18px}.brand{font-size:24px}header button{font-size:11px;padding:8px}.intro{min-height:245px;padding:25px 0}.intro-art{width:130px}.intro-art svg{height:auto}.intro-art span{font-size:12px}h1{font-size:37px}.intro p{font-size:12px}.eyebrow{font-size:8px}.mode-nav{gap:2px}.mode-nav button{min-width:0;flex:1;font-size:12px;padding:9px 5px}.workspace{display:flex;flex-direction:column;padding-top:15px}aside h2,aside>p,.tip,.section-heading,.name-label,#art-name{display:none}#choices{display:flex;flex-wrap:wrap;margin:0}#choices button{font-size:12px}.step-info{width:100%}.privacy{display:block!important;margin:8px 0 0;font-size:10px!important}.studio-top{padding:12px;font-size:10px}.paper{margin:0 8px}.tools{padding:6px}.bottom-bar{padding:10px}#palette{gap:2px}.footer-strip{display:block}.footer-strip p{margin:8px 0}main{padding:0 14px}#gallery-items{grid-template-columns:1fr}}
/* Little Artist: bright yellow, charcoal, and frosted glass. */
:root{--ink:#292d34;--paper:#fff8cb;--green:#353943;--muted:#565b64;--line:#ffffffb3}body{background:radial-gradient(ellipse at 6% 10%,#ffdd26 0,transparent 43%),radial-gradient(ellipse at 95% 65%,#ffe76a 0,transparent 45%),#f1f0e9;min-height:100vh}header{background:#ffffff6b;backdrop-filter:blur(22px);border:1px solid #ffffffab;border-radius:0 0 24px 24px}.brand-mark,.brand-dot{color:#8b6500}.brand-mark{background:#ffdc35;border-radius:13px;width:45px;height:45px;text-align:center;line-height:45px;font-size:32px}.intro{min-height:310px}h1 em{color:#545861}.eyebrow{color:#4d525b}.mode-nav{background:#ffffff70;backdrop-filter:blur(18px);border:1px solid #ffffffb8;border-radius:18px;padding:8px;box-shadow:0 8px 24px #34383e0a}.mode-nav button[aria-pressed=true]{background:#ffdc35;color:#292d34}.workspace{gap:24px}aside{background:#ffffff70;backdrop-filter:blur(20px);border:1px solid #ffffffb8;border-radius:20px;padding:20px}.studio{background:#ffffff80;backdrop-filter:blur(24px);border:1px solid #ffffffd6;border-radius:22px;box-shadow:0 16px 44px #3c3f4210}.paper{border-radius:12px;border-color:#e2e1db}.studio-top{color:#4f555e}.tip{background:#ffdf4b91}.tip p{color:#41464f}#art-name,#choices button{background:#ffffffa8;border-color:#d4d5d5}#choices button[aria-pressed=true]{background:#ffe358;border-color:#a58716;color:#292d34}button:hover{background:#fff1a0}button[aria-pressed=true],.primary{background:#353943;color:#fff}.bottom-bar .primary{background:#ffdc35!important;color:#292d34!important;border-color:#d4b422;font-weight:bold}#saved-count{background:#ffdc35}.intro-art{transform:none;background:#ffffff63;border:1px solid #ffffffb8;border-radius:36px;padding:18px;backdrop-filter:blur(18px)}.intro-art span{font:600 13px 'Trebuchet MS',sans-serif;color:#4e535d}.footer-strip{border-color:#ffffffb3}.custom-color{font-size:11px}dialog{background:#fffbe7ed;backdrop-filter:blur(24px);border-color:white}@media(max-width:650px){aside{padding:12px}.name-label{display:block;margin-top:8px}#art-name{display:block;margin-bottom:6px}.intro-art{width:135px;padding:10px;border-radius:22px}.intro-art span{font-size:10px}.intro{gap:12px}.mode-nav button{font-size:11px}.workspace{gap:14px}.size{display:flex}.size input{width:50px}}
@supports not (backdrop-filter:blur(1px)){header,.mode-nav,aside,.studio,.intro-art{background:#fffbe4}}@media(prefers-reduced-transparency:reduce){header,.mode-nav,aside,.studio,.intro-art{background:#fffbe4;backdrop-filter:none}}
[hidden]{display:none!important}.academy{background:#ffffff80;border:1px solid #fff;border-radius:24px;backdrop-filter:blur(22px);padding:26px}.learning-bar,.lesson-header,.optional-studio{display:flex;justify-content:space-between;align-items:center;gap:20px}.learning-bar h2{font-size:30px;margin:10px 0}.learning-bar label{font-size:13px;font-weight:bold;display:flex;gap:12px;align-items:center}select{font:inherit;padding:12px;border:1px solid #a5a6a0;border-radius:10px;background:#fffdf1;color:#292d34;min-height:44px}.lesson-catalog{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin:22px 0}.lesson-card{background:#fffefa;border:1px solid #d8d8ce;border-radius:17px;padding:16px;display:flex;flex-direction:column;gap:8px}.lesson-card svg{width:100%;height:110px}.lesson-card h3{font:500 22px Georgia,serif;margin:0}.lesson-card p{margin:0;font-size:12px}.lesson-card button{margin-top:auto;background:#ffdf35;font-weight:bold;border-color:#b69d2d}.lesson-card .lesson-meta{font-size:10px;font-weight:bold;letter-spacing:.6px;color:#535961}.supplies{font-size:12px;line-height:1.7;padding-top:18px;border-top:1px solid #d9d8cb;color:#4e535c}.optional-studio{padding:22px 0}.optional-studio h2{font-size:22px;margin:0}.optional-studio p{font-size:12px}.teaching-layout{display:grid;grid-template-columns:1.25fr 1fr;gap:24px;margin:20px 0}.teaching-picture{background:white;border:1px solid #e0dfd7;border-radius:18px;overflow:hidden}.teaching-picture svg{width:100%;display:block}.teaching-picture p{text-align:center;font-size:11px;padding:0 10px}.teaching-instruction{padding:15px 0}.teaching-instruction h3{font:500 29px Georgia,serif;margin:15px 0}.paper-prompt{background:#ffe785;padding:16px;border-radius:12px;font-size:13px;line-height:1.7}.step-navigation{display:flex;gap:8px;margin-top:20px}.step-navigation .primary{background:#ffdd35!important;color:#292d34!important;border-color:#b39b27}.lesson-header h2{font-size:30px}#practice-challenge{font-weight:bold;color:#414850}#learning-status{font-size:12px}#age-help{max-width:760px}#step-picture path,#step-picture circle,#step-picture ellipse,#step-picture rect{vector-effect:non-scaling-stroke}.completed-label{font-size:11px;color:#315b49;font-weight:bold}@media(max-width:800px){.lesson-catalog{grid-template-columns:repeat(2,1fr)}.teaching-layout{grid-template-columns:1fr}.learning-bar{align-items:flex-start}.learning-bar label{flex-direction:column;align-items:flex-start;gap:5px}}@media(max-width:480px){.academy{padding:16px}.learning-bar{flex-direction:column;gap:8px}.learning-bar label{flex-direction:row;align-items:center}.learning-bar h2{font-size:27px}.lesson-catalog{gap:10px}.lesson-card{padding:12px}.lesson-card h3{font-size:20px}.lesson-card button{font-size:12px}.optional-studio{align-items:flex-start}.optional-studio button{font-size:12px;min-width:105px}.lesson-header h2{font-size:25px}.lesson-header button{font-size:12px}}
.category-filters{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}.category-filters button{background:#fffdf1;border-color:#cecec3;font-size:12px}.category-filters button[aria-pressed=true]{background:#353943;color:white;border-color:#353943}.lesson-meta{line-height:1.6}.lesson-card svg{height:135px}
