/* The legal pages (/terms/, /privacy/): one reading column in the application pages' tokens. */
@font-face{
  font-family:'Archivo Fallback';
  src:local('Arial'), local('ArialMT');
  ascent-override:85.79%; descent-override:20.52%; line-gap-override:0%; size-adjust:102.34%;
}
@font-face{
  font-family:'Archivo Black Fallback';
  src:local('Arial Black'), local('Arial-Black');
  ascent-override:87.81%; descent-override:21%; line-gap-override:0%; size-adjust:99.99%;
}
:root{
  --font-sans:'Archivo','Archivo Fallback',-apple-system,BlinkMacSystemFont,'Helvetica Neue',Arial,sans-serif;
  --font-display:'Archivo Black','Archivo Black Fallback','Arial Black',sans-serif;
  --pop-pink:#ff2fd6;
  --ink:#24363f;
  --ink-64:color-mix(in srgb, var(--ink) 64%, transparent);
  --ink-24:color-mix(in srgb, var(--ink) 24%, transparent);
  --pad:clamp(16px, 5vw, 48px);
}
*{ margin:0; padding:0; box-sizing:border-box }
html{ -webkit-text-size-adjust:100% }
body{
  background:#fff; color:var(--ink);
  font:400 17px/1.6 var(--font-sans); letter-spacing:-.01em;
  -webkit-font-smoothing:antialiased;
}
::selection{ background-color:var(--pop-pink); color:var(--ink) }
a{ color:inherit; text-underline-offset:3px; text-decoration-thickness:1px }
a:hover{ color:var(--ink-64) }
:focus-visible{ outline:2px solid var(--ink); outline-offset:3px }

.top{ padding:24px var(--pad) 0 }
/* the wordmark in Playball, the site's .brand recipe at a small size */
.mark{ font:400 44px/1 'Playball', cursive; letter-spacing:-.03em; text-decoration:none; color:var(--ink) }
.mark span{ font-size:1.06em; margin-right:.01em }

.doc{ max-width:68ch; margin:0 auto; padding:clamp(28px, 6vw, 64px) var(--pad) 48px }
.doc h1{ font:400 clamp(34px, 5vw, 52px)/1.02 var(--font-display); letter-spacing:-.03em; margin-bottom:10px }
.doc h2{ font:400 clamp(21px, 2.4vw, 26px)/1.1 var(--font-display); letter-spacing:-.02em; margin:40px 0 12px }
.doc h3{ font-size:17px; font-weight:600; margin:22px 0 6px }
.doc p, .doc ul{ margin-bottom:14px }
.doc ul{ padding-left:1.2em }
.doc li{ margin-bottom:6px }
.doc li::marker{ color:var(--pop-pink) }
.doc strong{ font-weight:600 }
.meta{ font-size:14px; color:var(--ink-64); margin-bottom:28px }
.aviso{ margin-top:56px; padding-top:8px; border-top:2px solid var(--ink) }
/* contents: a bordered box of section links, two columns once there is room */
.toc{ margin:8px 0 12px; padding:16px 20px; border:1px solid var(--ink-24); border-radius:14px; font-size:15px }
.toc ol{ padding-left:1.5em; columns:2 17ch; column-gap:32px }
.toc li{ margin-bottom:4px; break-inside:avoid }
.toc li::marker{ color:var(--ink-64) }
.toc a{ text-decoration:none }
.toc a:hover{ color:var(--ink); text-decoration:underline }
.doc h2[id]{ scroll-margin-top:16px }

.foot{
  display:flex; flex-wrap:wrap; gap:8px 22px; align-items:center;
  max-width:68ch; margin:0 auto; padding:20px var(--pad) 40px;
  border-top:1px solid var(--ink-24); font-size:14px;
}
.foot a[aria-current="page"]{ text-decoration:none; font-weight:600 }
