/* ============================================================
   LLOS UX SYNC + MOBILE-FIRST  (appended 2026-06-16)
   Site-wide baseline. Studios / Grammar Academy / admin are
   already excluded from llos.css by the shell, so this never
   touches them. Design tokens + safe mobile-first essentials.
   ============================================================ */
:root{
  --llos-bg:#faf6ef; --llos-card:#ffffff; --llos-ink:#27211b; --llos-muted:#857a6c;
  --llos-line:#ece3d4; --llos-accent:#c2410c; --llos-accent-soft:#fdeee6;
  --llos-ok:#1f7a4d; --llos-radius:14px; --llos-maxw:1160px;
  --llos-font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,system-ui,sans-serif;
}
/* media never overflows a phone screen */
img,video,iframe,canvas,embed,object{max-width:100%;height:auto;}
/* wide tables scroll inside their box instead of stretching the page */
table{max-width:100%;}
pre,code{white-space:pre-wrap;word-break:break-word;}
/* long words / URLs wrap instead of forcing horizontal scroll */
p,li,h1,h2,h3,h4,a,span,div{overflow-wrap:break-word;}

@media (max-width:640px){
  /* 16px form fields stop iOS from auto-zooming on focus */
  input,select,textarea{font-size:16px;}
  /* comfortable tap targets */
  a,button,.btn,[role=button],input[type=button],input[type=submit]{min-height:42px;}
  /* keep oversized desktop headings readable on phones */
  h1{font-size:clamp(22px,6.2vw,30px);line-height:1.22;}
  h2{font-size:clamp(19px,5.2vw,25px);line-height:1.25;}
  /* tame fixed desktop widths that cause sideways scroll */
  .container,.wrap,.content,main,section{max-width:100%;}
}


/* === section skins: unify CBSE / Dictionary / Games to the LLOS palette (2026-06-16) ===
   Re-maps each section's OWN css variables to the canonical LLOS tokens.
   Scoped to a body class so no other page is affected. No layout changes. */
body.llos-skin-dict{
  --primary:#c2410c; --primary-hover:#a8380a; --bg:#faf6ef; --surface:#ffffff;
  --border:#ece3d4; --accent-soft:#fdeee6;
  --text-primary:#27211b; --text-secondary:#6b6052; --text-muted:#857a6c;
}
body.llos-skin-games{
  --primary-green:#c2410c; --light-green:#fdeee6; --border-green:#f0d9c8;
  --primary-gradient:linear-gradient(135deg,#c2410c 0%,#ea580c 100%);
}
body.llos-skin-cbse{ --accent:#c2410c; background:#faf6ef; }

/* games: hardcoded green accents not covered by the vars */
body.llos-skin-games .cat-card-count{ color:#c2410c; }
body.llos-skin-games .cat-card:hover .cat-card-cta{ color:#a8380a; }