:root{--ink:#15333c;--blue:#075a72;--blue2:#0b7893;--pale:#e9f7f9;--cream:#fffaf1;--coral:#ed644d;--line:#bdd9de;--white:#fff;--shadow:0 14px 40px rgba(15,68,82,.13);font-size:18px}
*{box-sizing:border-box}body{margin:0;background:linear-gradient(180deg,#f5fcfd 0,#fffaf1 100%);color:var(--ink);font-family:ui-rounded,"Avenir Next",Avenir,system-ui,sans-serif;min-height:100vh}.large-text{font-size:21px}.topbar{height:82px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(18px,5vw,64px);border-bottom:1px solid var(--line);background:rgba(255,255,255,.9)}button{font:inherit}.brand{border:0;background:transparent;color:var(--blue);font-size:1.35rem;font-weight:800;display:flex;align-items:center;gap:10px;cursor:pointer}.brand-mark{width:42px;height:42px;border-radius:50% 50% 46% 54%;display:grid;place-items:center;background:var(--coral);color:white}.text-size{min-height:48px;border:2px solid var(--blue);border-radius:14px;padding:8px 16px;background:white;color:var(--blue);font-weight:750;cursor:pointer}.text-size span{font-size:1.2em}main{width:min(100% - 28px,960px);margin:auto;padding:clamp(28px,6vw,68px) 0 80px}.screen{animation:enter .28s ease-out}@keyframes enter{from{opacity:.2;transform:translateY(8px)}}.eyebrow{color:var(--blue2);font-weight:800;letter-spacing:.08em;text-transform:uppercase;font-size:.78rem}.progress{display:flex;gap:8px;margin:14px 0 36px}.progress i{height:7px;flex:1;background:#dbeaec;border-radius:9px}.progress i.on{background:var(--coral)}h1{font-size:clamp(2rem,6vw,3.45rem);line-height:1.06;letter-spacing:-.04em;margin:0 0 14px;max-width:780px}h2{font-size:clamp(1.45rem,4vw,2.25rem);margin:0 0 12px}p{line-height:1.55}.intro{font-size:1.15rem;max-width:660px;margin:0 0 32px;color:#3f5f67}.choices{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.choice{min-height:98px;text-align:left;border:3px solid transparent;border-radius:20px;background:white;box-shadow:var(--shadow);padding:22px;color:var(--ink);font-size:1.18rem;font-weight:800;cursor:pointer;transition:.15s}.choice small{display:block;font-size:.84rem;font-weight:550;margin-top:7px;color:#55747c}.choice:hover,.choice:focus-visible{border-color:var(--coral);transform:translateY(-2px)}.choice.selected{border-color:var(--blue);background:var(--pale)}.nav{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:34px}.primary,.secondary{min-height:60px;border-radius:16px;padding:14px 26px;font-weight:850;cursor:pointer}.primary{border:2px solid var(--coral);background:var(--coral);color:white}.secondary{border:2px solid var(--blue);background:white;color:var(--blue)}.primary:disabled{opacity:.45;cursor:not-allowed}.subject-box{width:100%;min-height:72px;border:3px solid var(--line);border-radius:18px;padding:16px 20px;font:inherit;background:white}.subject-box:focus{outline:3px solid #94dbe8;border-color:var(--blue)}.upload{display:block;border:3px dashed var(--line);background:white;border-radius:20px;padding:22px;margin-top:18px;text-align:center;font-weight:800;cursor:pointer}.upload input{display:none}.concepts{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.concept{border:3px solid transparent;border-radius:24px;background:white;padding:10px;box-shadow:var(--shadow);cursor:pointer;text-align:left}.concept:hover,.concept:focus-visible,.concept.selected{border-color:var(--coral)}.concept img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:16px;display:block}.concept strong{display:block;padding:14px 10px 4px;font-size:1.15rem}.concept small{display:block;padding:0 10px 12px;color:#59737a}.guide-hero{display:grid;grid-template-columns:minmax(240px,.8fr) 1.2fr;gap:34px;align-items:center}.guide-hero img{width:100%;max-height:500px;object-fit:cover;border-radius:28px;box-shadow:var(--shadow)}.badges{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0}.badge{background:var(--pale);padding:8px 13px;border-radius:999px;font-weight:800;color:var(--blue)}.actions{display:flex;flex-wrap:wrap;gap:12px}.guide-preview{margin-top:36px;border-top:2px solid var(--line);padding-top:26px}.steps{display:grid;gap:12px}.step-row{display:grid;grid-template-columns:52px 1fr;gap:14px;align-items:center;padding:14px;border-radius:16px;background:white}.step-num{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--blue);color:white;font-weight:900}.coach{display:grid;grid-template-columns:minmax(220px,.75fr) 1.25fr;gap:30px;align-items:start}.coach img{width:100%;max-height:490px;object-fit:cover;border-radius:24px}.coach-card{background:white;border-radius:24px;box-shadow:var(--shadow);padding:clamp(22px,4vw,38px)}.palette{display:flex;gap:10px;margin:18px 0}.swatch{width:45px;height:45px;border-radius:50%;border:3px solid white;box-shadow:0 0 0 1px #aac3c8}.callout{background:#fff1d6;border-left:7px solid #f3a92f;padding:18px;border-radius:10px;font-weight:850}.photo-check{margin-top:18px}.photo-result{background:var(--pale);border-radius:16px;padding:18px;margin-top:14px}.home{padding-top:7vh}.home .art-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:34px 0}.art-strip img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:20px}.home .primary{font-size:1.2rem;min-height:70px;padding-inline:34px}.note{font-size:.84rem;color:#5f7479;margin-top:18px}@media(max-width:700px){.topbar{height:72px}.text-size{font-size:.76rem;padding:6px 9px}.choices,.concepts{grid-template-columns:1fr}.concept{display:grid;grid-template-columns:120px 1fr;align-items:center}.concept img{height:145px}.guide-hero,.coach{grid-template-columns:1fr}.guide-hero img,.coach img{max-height:390px}.home .art-strip{gap:7px}.nav{position:sticky;bottom:12px;background:rgba(255,250,241,.94);padding:10px;border-radius:18px}.primary,.secondary{min-height:56px;padding:12px 18px}}
.screen{animation:none}
@media print{.topbar,.actions,.nav{display:none!important}body{background:white}main{width:100%;padding:0}.guide-hero{grid-template-columns:42% 58%}.guide-preview{break-before:page}}
.lesson-list{display:grid;gap:28px}.lesson{background:white;border-radius:24px;box-shadow:var(--shadow);padding:18px}.lesson-top{display:grid;grid-template-columns:1.5fr 1fr;gap:18px}.lesson-top>img{width:100%;height:420px;object-fit:cover;border-radius:16px}.lesson-palette{background:var(--pale);padding:18px;border-radius:16px}.lesson-palette h3{margin:0 0 18px;font-size:1.3rem}.paint-mix{display:grid;grid-template-columns:58px 1fr;gap:12px;align-items:center;margin:13px 0}.paint-mix>span{height:34px;border-radius:999px;border:2px solid white;box-shadow:0 0 0 1px #aac3c8}.paint-mix strong,.paint-mix small{display:block}.paint-mix small{color:#567179;margin-top:3px}.lesson-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:16px}.lesson-steps>div{display:grid;grid-template-columns:30px 1fr;gap:8px;align-items:start}.lesson-steps b{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--coral);color:white}.lesson-steps span{font-weight:700;line-height:1.3}.lesson-stop{margin:16px 0 0;padding:12px;background:#fff1d6;border-radius:10px;text-align:center;font-weight:900}.coach-palette{margin:18px 0}.coach-list{padding-left:27px}.coach-list li{margin:10px 0;line-height:1.4;font-weight:650}@media(max-width:700px){.lesson-top{grid-template-columns:1fr}.lesson-top>img{height:390px}.lesson-steps{grid-template-columns:1fr 1fr}.paint-mix{grid-template-columns:52px 1fr}}
.loading-art{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.loading-art span{display:block;aspect-ratio:4/5;border-radius:24px;background:linear-gradient(110deg,#ddecf0 8%,#fff 18%,#ddecf0 33%);background-size:200% 100%;animation:shimmer 1.3s linear infinite}.error-note{background:#fff1d6;border-left:6px solid var(--coral);padding:16px;border-radius:10px;font-weight:800}@keyframes shimmer{to{background-position-x:-200%}}@media(max-width:700px){.loading-art{grid-template-columns:1fr}.loading-art span{aspect-ratio:4/3}}