/* Ex & Oh support pages — the toy-board palette, trimmed for reading. */
:root{
  --cream:#FFF1C9; --card:#FFF8E4; --cocoa:#4A2E1F; --dim:#7A5A45;
  --rule:#E8D3A0; --line:#4A2E1F;
  --x:#F07A2B; --o:#2F8FD8; --grass:#3F9B4A;
  --display:"Baloo 2",-apple-system,BlinkMacSystemFont,sans-serif;
  --sans:"Nunito",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
@media (prefers-color-scheme:dark){
  :root{--cream:#16203A; --card:#1E2A4A; --cocoa:#FFF1C9; --dim:#C7BFA8; --rule:#2C3A60; --line:#0B1022; --o:#6FB8F0}
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--cream);color:var(--cocoa);
  font-family:var(--sans);font-weight:400;line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:44rem;margin:0 auto;padding:clamp(2.5rem,7vw,5rem) clamp(1.25rem,5vw,2rem) 5rem}
a{color:var(--o);font-weight:700;text-decoration-thickness:2px;text-underline-offset:.2em}
a:hover{color:var(--x)}

.crumb{font-size:.78rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);margin:0 0 2.5rem}
.crumb a{color:var(--dim);text-decoration:none}
.crumb a:hover{color:var(--x)}

h1{font-family:var(--display);font-weight:800;font-size:clamp(2rem,6vw,2.8rem);line-height:1.1;margin:0 0 .5rem}
h1 .x{color:var(--x)} h1 .o{color:var(--o)}
.lede{font-size:clamp(1.05rem,2.6vw,1.2rem);margin:0 0 .75rem}
.stamp{font-size:.8rem;font-weight:700;color:var(--dim);margin:0 0 3rem}

h2{font-family:var(--display);font-weight:800;font-size:1.3rem;margin:2.75rem 0 .6rem;padding-top:1.6rem;border-top:2px dashed var(--rule)}
h2:first-of-type{border-top:0;padding-top:0}
h3{font-weight:800;font-size:1.02rem;margin:1.8rem 0 .35rem}
p{margin:0 0 1rem;color:var(--dim)}
p strong,li strong{color:var(--cocoa);font-weight:800}
ul{margin:0 0 1rem;padding-left:1.2rem;color:var(--dim)}
li{margin:.3rem 0}

.card{background:var(--card);border:2.5px solid var(--line);border-radius:18px;box-shadow:0 5px 0 var(--line);padding:1.2rem 1.4rem;margin:0 0 2.5rem}
.card p{margin:0;color:var(--cocoa)}
.card .k{font-size:.75rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--grass);display:block;margin-bottom:.35rem}

footer{margin-top:4rem;padding-top:1.5rem;border-top:2px dashed var(--rule);font-size:.8rem;font-weight:700;color:var(--dim);display:flex;flex-wrap:wrap;gap:.6rem 1.5rem;justify-content:space-between}
footer a{color:var(--dim);text-decoration:none}
footer a:hover{color:var(--x)}