/* KNOL family: shared proportions with KNOL PRINT, sky-blue ART identity. */
@media screen{
  :root{background:#f8fcff;--ink:#211f25;--muted:#6c747e;--line:#d5e4ed;--soft:#eaf5fc;--rose:#26769e}
  body{line-height:1.6}
  .topbar{height:76px;padding:0 max(24px,calc((100vw - 1456px)/2));justify-content:space-between;gap:20px;background:#fff;backdrop-filter:none}
  .brand-family{display:flex;align-items:center;gap:32px;min-width:0}
  .brand{gap:9px;flex-shrink:0}.brand>span{font-size:27px;letter-spacing:-1.1px;font-weight:800}.brand small{font-size:9px;letter-spacing:3.5px;margin-top:5px}
  .topbar nav{padding-left:24px;gap:14px;align-items:center}
  .topbar nav .service-brand{border:0;background:transparent;color:var(--muted);font-weight:600;text-decoration:none;display:flex;align-items:center;gap:6px;padding:5px 3px;border-radius:8px;font-size:12px;white-space:nowrap}
  .topbar nav .service-brand:hover{background:var(--soft)}.topbar nav span{margin:0}.service-brand img{width:32px;height:32px;object-fit:contain}
  .private{margin:0;display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted);white-space:nowrap}.private>span{font-size:10px;color:var(--rose)}
  main{max-width:1504px;padding:0 24px;margin:auto}
  .intro{min-height:0;margin:0;padding:24px 0 20px;border:0;border-radius:0;background:transparent;display:flex;justify-content:space-between;gap:24px;overflow:visible}
  .intro h1{font-size:28px;font-weight:750;letter-spacing:-1px;line-height:1.4;margin:0 0 5px}.intro .lede{font-size:14px;line-height:1.7}.intro-help{font-size:12px;color:var(--muted);text-decoration:none;white-space:nowrap}
  .lizard-lesson{background:transparent;border:0;border-radius:0;padding:0;margin:0}
  .lesson-heading{margin:0 0 16px;gap:20px}.lesson-heading h2{font-size:20px;letter-spacing:-.6px}.lesson-heading .eyebrow{display:none}.lesson-heading>div>p:last-child{font-size:12px;margin:6px 0 0;color:var(--muted)}
  .lesson-layout{gap:20px}.original-card,.lesson-construction{padding:20px;border-radius:14px}.original-top h3{font-size:16px}
  .original-frame>img{height:350px}.original-frame{min-height:300px}.lesson-scene{height:260px}
  .lesson-paper{padding:18px 20px;margin-top:16px;border-radius:14px;background:#fff}.lesson-paper h3{font-size:15px}
  .panel{border-radius:14px;padding:20px;box-shadow:none}.section-heading{margin:28px 0 16px}h2{font-size:22px}.tiny-tag{background:var(--soft);border:0;padding:5px 9px}.step{width:24px;height:24px;border-radius:7px;font-size:12px}
  .primary,.secondary{min-height:42px;border-radius:8px;font-size:12px}.primary{background:var(--ink);border-color:var(--ink)}.primary:hover{background:#403d46}.tools .save-artwork{background:var(--ink)}.tools .save-artwork:hover{background:#403d46}
  select{min-height:42px;border-color:#aac5d5;border-radius:8px}.tools{background:var(--soft)}.tools button.active{box-shadow:none;background:white}.tile-canvas{background-color:#f1f7fb;border-color:var(--line)}
  .site-footer{max-width:1456px;margin:24px auto 0;padding:20px 0 26px;border-top:1px solid var(--line);display:flex;align-items:center;gap:16px;font-size:12px;color:var(--muted)}
  .site-footer .footer-brand{gap:6px}.site-footer .footer-brand>span{font-size:16px;letter-spacing:-.5px}.site-footer>span{width:auto;margin:0;font-size:12px}.privacy-link{margin-left:auto;padding:8px 12px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink);text-decoration:none;font-size:12px}.privacy-link:hover{background:var(--soft)}
  .privacy-page{max-width:928px}.privacy-page .intro{align-items:flex-start}.privacy-card{background:white;border:1px solid var(--line);border-radius:14px;padding:24px;margin-bottom:16px}.privacy-card h2{font-size:18px}.privacy-card p{font-size:14px;color:var(--muted);line-height:1.9}.privacy-card a{color:var(--rose)}
}
@media screen and (max-width:1504px){.site-footer{margin-left:24px;margin-right:24px}}
@media screen and (max-width:1000px){.lesson-layout{gap:16px}.original-frame>img{height:320px}.private{font-size:11px}.intro h1{font-size:26px}}
@media screen and (max-width:760px){
  main{padding:0 16px}.topbar{height:68px;padding:0 16px;gap:12px}.brand-family{gap:20px}.brand>img{width:46px;height:46px}.brand>span{font-size:23px}.brand small{font-size:8px;letter-spacing:2.8px}
  .topbar nav{padding-left:16px;gap:10px}.topbar nav .service-brand{flex-direction:column;gap:1px;font-size:10px;padding:3px}.service-brand img{width:28px;height:28px}.private{display:none}
  .intro{padding:18px 0 16px;gap:10px}.intro h1{font-size:22px;letter-spacing:-.7px}.intro .lede{font-size:13px}.intro-help{display:none}
  .lizard-lesson{padding:0;margin:0}.lesson-heading{gap:10px}.lesson-heading h2{font-size:19px}.lesson-layout{gap:14px}.original-card,.lesson-construction{padding:16px}.original-frame>img{height:300px}.lesson-scene{height:280px}.lesson-paper{padding:16px}.panel{padding:18px}
  .site-footer{margin:24px 16px 0;gap:10px;flex-wrap:wrap}.site-footer>span{font-size:11px}.privacy-link{font-size:11px;padding:8px 10px}.privacy-card{padding:18px}
}
@media screen and (max-width:360px){.brand-family{gap:12px}.topbar nav{padding-left:12px;gap:6px}.brand>span{font-size:21px}}
