/* Shared by the three documents at /terms, /privacy and /accessibility.
   Deliberately plain: these are things people read, sometimes under stress
   and sometimes with a screen reader, so the priority is a comfortable
   measure, real heading structure and contrast well past AA. */
:root{
  --ink:#0D0B0A; --surface:#17130F; --raised:#221C17;
  --line:rgba(255,240,225,.09); --line2:rgba(255,240,225,.17);
  --cream:#F7EFE6; --dim:#A79684; --faint:#95816F;
  --hot:#FF5A1F; --sun:#FFC93C; --mint:#3ED598;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ink);color:var(--cream);
  font:16px/1.75 "Rubik",-apple-system,"SF Hebrew",system-ui,sans-serif}
.skipLink{position:absolute;inset-inline-start:-9999px;top:8px;z-index:100;
  padding:11px 18px;border-radius:12px;background:var(--hot);color:#1A0E06;
  font-weight:700;font-size:14px;text-decoration:none}
.skipLink:focus{inset-inline-start:12px}
:focus-visible{outline:2px solid var(--hot);outline-offset:3px;border-radius:4px}

.topbar{display:flex;align-items:center;gap:10px;padding:14px 20px;
  border-bottom:1px solid var(--line);background:rgba(13,11,10,.9);
  position:sticky;top:0;z-index:10;backdrop-filter:blur(18px)}
.topbar a{display:flex;align-items:center;gap:9px;color:var(--cream);
  text-decoration:none;font-family:"Secular One",sans-serif;font-size:17px}
.topbar img{height:24px;width:auto;display:block}
.topbar .back{margin-inline-start:auto;font-size:14px;color:var(--dim);
  font-family:inherit}
.topbar .back:hover{color:var(--cream)}

main{max-width:760px;margin:0 auto;padding:30px 20px 80px}
h1{font-family:"Secular One",sans-serif;font-weight:400;font-size:34px;
  line-height:1.2;margin:0 0 6px}
.updated{color:var(--faint);font-size:13.5px;margin:0 0 26px}
h2{font-family:"Secular One",sans-serif;font-weight:400;font-size:22px;
  margin:38px 0 10px;padding-top:10px;border-top:1px solid var(--line)}
h3{font-size:17px;font-weight:700;margin:22px 0 6px;color:var(--cream)}
p,li{color:#E4D9CD}
ul,ol{padding-inline-start:22px;margin:10px 0}
li{margin:6px 0}
strong{color:var(--cream)}
a{color:var(--sun)}
a:hover{color:var(--hot)}
code{font:13.5px/1.6 ui-monospace,SFMono-Regular,Menlo,monospace;
  background:var(--raised);padding:2px 6px;border-radius:6px;direction:ltr;
  display:inline-block}

/* A claim the reader should be able to check, or a limit they should know
   about, rather than a decorative aside. */
.note{background:var(--surface);border:1px solid var(--line);
  border-inline-start:3px solid var(--hot);border-radius:12px;
  padding:14px 16px;margin:18px 0}
.note.warn{border-inline-start-color:var(--sun)}
.note.good{border-inline-start-color:var(--mint)}
.note p{margin:0}
.note p + p{margin-top:8px}

table{width:100%;border-collapse:collapse;margin:14px 0;font-size:14.5px}
th,td{text-align:start;padding:10px 12px;border-bottom:1px solid var(--line);
  vertical-align:top}
th{color:var(--cream);font-weight:700;background:var(--surface)}
.wrapTable{overflow-x:auto;-webkit-overflow-scrolling:touch}

.contact{background:var(--surface);border:1px solid var(--line2);
  border-radius:16px;padding:18px 20px;margin:26px 0}
.contact h2{border:0;margin-top:0;padding-top:0}
footer{border-top:1px solid var(--line);margin-top:50px;padding-top:20px;
  color:var(--faint);font-size:13px}
footer a{color:var(--dim);margin-inline-end:16px}

@media(max-width:600px){
  body{font-size:15.5px}
  h1{font-size:27px}
  h2{font-size:19.5px}
  main{padding:22px 16px 60px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;
    transition-duration:.01ms!important;scroll-behavior:auto!important}
}
