/* WorkMark — shared styling for the legal pages (privacy.html, terms.html,
   refunds.html). Standalone: these three files are hand-written and are NOT produced by
   build/build-site.js, so nothing regenerates them. Edit them directly. */
:root{
  --navy-950:#06101F; --navy-900:#0B1E3B; --navy-800:#0F2748;
  --line:rgba(255,255,255,.08); --line-strong:rgba(255,255,255,.16);
  --ink:#E7F1FF; --ink-dim:rgba(231,241,255,.70); --ink-mute:rgba(231,241,255,.46);
  --cyan:#3BB6F2; --green:#7ED957; --amber:#F5C451;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--navy-950); color:var(--ink);
  font-family:"Inter",ui-sans-serif,system-ui,-apple-system,"SF Pro Text",sans-serif;
  font-size:16px; line-height:1.7; -webkit-font-smoothing:antialiased;
  background-image:radial-gradient(1200px 600px at 50% -10%,rgba(59,182,242,.12),transparent 60%);
  background-repeat:no-repeat;
}
a{color:var(--cyan)}
a:hover{color:#7fd0ff}

.topbar{
  position:sticky; top:0; z-index:10; backdrop-filter:blur(10px);
  background:rgba(6,16,31,.84); border-bottom:1px solid var(--line);
  padding:12px 20px; display:flex; align-items:center; justify-content:space-between; gap:12px;
}
.topbar .brand{font-weight:800; letter-spacing:-.01em; font-size:15px}
.topbar .brand span{color:var(--cyan)}
.topbar a.back{font-size:13px; font-weight:600; text-decoration:none; white-space:nowrap}

.wrap{max-width:760px; margin:0 auto; padding:40px 20px 90px}
@media(min-width:760px){ .wrap{padding:56px 32px 110px} }

h1{font-size:clamp(28px,6vw,40px); line-height:1.15; letter-spacing:-.025em; margin:0 0 10px}
.dates{font-size:13px; color:var(--ink-mute); margin:0 0 28px}
.dates b{color:var(--ink-dim); font-weight:600}

h2{
  font-size:clamp(19px,3.6vw,23px); line-height:1.3; letter-spacing:-.015em;
  margin:44px 0 12px; padding-top:22px; border-top:1px solid var(--line); scroll-margin-top:70px;
}
h2 .num{color:var(--cyan); font-variant-numeric:tabular-nums; margin-right:8px}
h3{font-size:16px; margin:26px 0 8px; letter-spacing:-.01em}
p,li{color:var(--ink-dim)}
p{margin:0 0 14px}
ul,ol{margin:0 0 16px; padding-left:22px}
li{margin:0 0 8px}
strong{color:var(--ink); font-weight:600}
em{color:var(--ink)}

/* The plain-English summary at the top — not the agreement, and it says so. */
.summary{
  background:linear-gradient(135deg,rgba(59,182,242,.10),rgba(126,217,87,.07));
  border:1px solid var(--line-strong); border-radius:16px; padding:20px 22px; margin:0 0 34px;
}
.summary h2{border:none; margin:0 0 10px; padding:0; font-size:15px; letter-spacing:.08em; text-transform:uppercase; color:var(--ink)}
.summary ul{margin:0; padding-left:20px}
.summary li{margin-bottom:7px; font-size:15px}
.summary .fineprint{margin:12px 0 0; font-size:13px; color:var(--ink-mute)}

/* Anything a reader would be harmed by missing. */
.callout{
  border:1px solid var(--line-strong); border-left:3px solid var(--amber);
  background:rgba(245,196,81,.06); border-radius:0 12px 12px 0;
  padding:16px 18px; margin:0 0 18px;
}
.callout.cyan{border-left-color:var(--cyan); background:rgba(59,182,242,.07)}
.callout p:last-child{margin-bottom:0}
.callout .lbl{
  display:block; font-size:11px; font-weight:700; letter-spacing:.1em;
  text-transform:uppercase; color:var(--amber); margin-bottom:6px;
}
.callout.cyan .lbl{color:var(--cyan)}

/* Disclaimers that have to be conspicuous to do their job. */
.legalcaps{
  text-transform:uppercase; font-size:13.5px; line-height:1.65; letter-spacing:.01em;
  color:var(--ink); background:rgba(255,255,255,.035);
  border:1px solid var(--line-strong); border-radius:12px; padding:16px 18px; margin:0 0 16px;
}

nav.toc{border:1px solid var(--line); border-radius:14px; padding:18px 20px; margin:0 0 10px; background:rgba(255,255,255,.02)}
nav.toc h2{border:none; margin:0 0 10px; padding:0; font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-mute)}
nav.toc ol{margin:0; padding-left:20px; columns:1}
@media(min-width:660px){ nav.toc ol{columns:2; column-gap:28px} }
nav.toc li{margin-bottom:5px; font-size:14px; break-inside:avoid}
nav.toc a{text-decoration:none; color:var(--ink-dim)}
nav.toc a:hover{color:var(--cyan)}

.tablewrap{overflow-x:auto; margin:0 0 18px; -webkit-overflow-scrolling:touch}
table{border-collapse:collapse; width:100%; min-width:520px; font-size:14px}
th,td{text-align:left; vertical-align:top; padding:10px 12px; border-bottom:1px solid var(--line)}
th{color:var(--ink); font-weight:600; font-size:12px; letter-spacing:.06em; text-transform:uppercase; white-space:nowrap}
td{color:var(--ink-dim)}

.foot{margin-top:56px; padding-top:22px; border-top:1px solid var(--line); font-size:13px; color:var(--ink-mute)}
.foot a{margin-right:16px; white-space:nowrap; display:inline-block}