/* ---------------------------------------------------------------
   KidBD / legal.css
   One stylesheet for the three legal pages, so terms, privacy and
   refunds cannot drift apart visually. Same design language as the
   landing page, dialled down: these are documents, not a pitch.
   Borderless throughout.
   Nexus V22 / Kavalsia Inc.
   --------------------------------------------------------------- */
/* ---------------------------------------------------------------
   The two faces, served from this site. R14 (2026-09-03): these
   three pages used to pull Fredoka and Plus Jakarta Sans from
   Google's font host, which sent every reader's IP and user agent
   to two Google hosts on a page whose whole job is to say who gets
   your data (finding S1-16). The body face moves to Lexend, which
   DESIGN-R14.md already chose and self-hosted for start.html and
   app.html, so the product now has ONE body face rather than two.

   Each file is the VARIABLE instance, so one request covers 400
   through 700 and a bold heading fetches nothing extra. The
   latin-ext cut is a separate rule with its own unicode-range, so
   it is only fetched when a name actually needs it.
   --------------------------------------------------------------- */
@font-face{
  font-family:"Fredoka"; font-style:normal; font-weight:400 700; font-display:swap;
  src:url("fonts/fredoka-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Fredoka"; font-style:normal; font-weight:400 700; font-display:swap;
  src:url("fonts/fredoka-latin-ext.woff2") format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:"Lexend"; font-style:normal; font-weight:400 700; font-display:swap;
  src:url("fonts/lexend-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Lexend"; font-style:normal; font-weight:400 700; font-display:swap;
  src:url("fonts/lexend-latin-ext.woff2") format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

:root{
  --bg:#fff5d6; --su:#fffdf4; --ink:#2a2350; --mut:#544a8c; --ln:#f0e6bf;
  --grape:#6a49f2; --sun:#ffce3a; --red:#ff5a5f;
  --disp:"Fredoka",ui-rounded,"Segoe UI",system-ui,sans-serif;
  --body:"Lexend",system-ui,-apple-system,"Segoe UI",sans-serif;
  --r:26px; --pad:clamp(18px,5vw,60px);
  --shadow:6px 8px 0 var(--ink); --shadow-sm:4px 5px 0 var(--ink);
  color-scheme:light;
}
*{margin:0;padding:0;box-sizing:border-box;border:0}
html,body{max-width:100%;overflow-x:hidden}
html{-webkit-text-size-adjust:100%}
body{
  background:var(--bg); color:var(--ink);
  font-family:var(--body); line-height:1.72; font-size:16.5px;
  -webkit-font-smoothing:antialiased; position:relative;
  -webkit-tap-highlight-color:transparent;
}
body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background-image:radial-gradient(var(--ln) 1.4px,transparent 1.4px);background-size:26px 26px;opacity:.5}
a{color:inherit}
svg{display:block;max-width:100%}
:focus-visible{outline:3px solid var(--grape);outline-offset:3px;border-radius:12px}

.wrap{max-width:820px;margin:0 auto;padding:0 var(--pad);position:relative;z-index:2}

.topbar{padding:20px 0 0}
.back{display:inline-flex;align-items:center;gap:9px;background:var(--su);border-radius:999px;
  padding:11px 19px;font-weight:800;font-size:15px;box-shadow:var(--shadow-sm);min-height:46px;
  transition:transform .12s ease, box-shadow .12s ease}
.back:hover{transform:translate(-2px,-2px);box-shadow:7px 9px 0 var(--ink)}
.back svg{width:17px;height:17px;flex:none}

header.doc{padding:clamp(30px,5vw,52px) 0 clamp(20px,3vw,32px)}
header.doc h1{font-family:var(--disp);font-weight:700;font-size:clamp(30px,6vw,50px);line-height:1.06;letter-spacing:-.01em}
header.doc .upd{margin-top:14px;display:inline-flex;align-items:center;gap:9px;background:var(--sun);
  border-radius:999px;padding:7px 16px;font-weight:800;font-size:13.5px;box-shadow:var(--shadow-sm)}
header.doc .lede{margin-top:20px;font-size:clamp(16px,2vw,18.5px);color:var(--mut);max-width:56ch}

main.doc{padding-bottom:clamp(50px,8vw,90px)}
section.card{background:var(--su);border-radius:var(--r);padding:clamp(20px,3vw,34px);
  box-shadow:var(--shadow-sm);margin-bottom:16px}
section.card h2{font-family:var(--disp);font-weight:700;font-size:clamp(20px,2.8vw,26px);
  line-height:1.2;margin-bottom:12px;letter-spacing:-.005em}
section.card h3{font-family:var(--disp);font-weight:700;font-size:17.5px;margin:20px 0 8px}
section.card h3:first-of-type{margin-top:14px}
section.card p{color:var(--mut);margin-bottom:12px}
section.card p:last-child{margin-bottom:0}
section.card b, section.card strong{color:var(--ink);font-weight:800}
section.card ul, section.card ol{color:var(--mut);padding-inline-start:1.35em;margin-bottom:12px}
section.card li{margin-bottom:8px}
section.card li:last-child{margin-bottom:0}
section.card code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.92em;
  background:var(--bg);border-radius:8px;padding:2px 7px;color:var(--ink);font-weight:700}
section.card a{color:var(--grape);font-weight:700;text-decoration:underline;text-underline-offset:2px}
/* a link alone in a table cell is a standalone control, not a link inside a
   sentence, so it does not get the WCAG inline exemption */
table.facts a{display:inline-flex;align-items:center;min-height:44px}

/* a paragraph that has to be impossible to miss */
.callout{background:var(--bg);border-radius:18px;padding:clamp(16px,2.2vw,22px);margin:16px 0}
.callout p{color:var(--ink);margin:0}
.callout.warn{background:#ffe9e6}

table.facts{width:100%;border-collapse:collapse;margin:8px 0 4px;font-size:15.5px}
table.facts td{padding:9px 0;vertical-align:top;color:var(--mut)}
table.facts td:first-child{font-weight:800;color:var(--ink);width:38%;padding-inline-end:16px}
@media(max-width:520px){
  table.facts, table.facts tbody, table.facts tr, table.facts td{display:block;width:100%}
  table.facts td{padding:2px 0}
  table.facts td:first-child{padding-top:12px}
}

footer.doc{background:var(--ink);color:#cdc6ef;padding:clamp(30px,5vw,54px) 0;position:relative;z-index:2;font-size:14px;line-height:1.7}
footer.doc .wrap{max-width:820px}
footer.doc a{color:#fff;text-decoration:underline;text-underline-offset:2px;font-weight:700}
footer.doc .flinks{display:flex;flex-wrap:wrap;gap:6px 14px;margin-bottom:14px}
footer.doc .flinks a{min-height:44px;display:inline-flex;align-items:center;padding:0 6px}
footer.doc b{color:#fff}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms !important;transition-duration:.001ms !important}
}
