/* Shared chrome for the legal + support pages.
   Values are taken literally from cora-app/lib/theme.dart (CoraColors) — the
   product is the source of truth for the brand, never the other way round.
   These pages used to ship a purple #7c3aed accent inherited from the Laravel
   Blade views they were exported from, which belonged to no Cora surface. */
:root{
  --ground:#FFFFFF;
  --well:#F4F3F1;
  --ink:#1E1F22;
  --muted:#6C6F75;
  --hair:#E6E4E1;
  /* CoraColors.chrome — small masked shapes only, never a background wash. */
  --chrome:linear-gradient(115deg,#E9D3E4 0%,#BFD6EE 34%,#CBE8D6 68%,#F0E0C8 100%);
  --display:"Fraunces",Georgia,"Times New Roman",serif;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
}
@media (prefers-color-scheme:dark){
  :root{--ground:#0C0D0F;--well:#141518;--ink:#F2F1EF;--muted:#9A9DA3;--hair:#26272B}
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--ground);color:var(--ink);
  font:400 16.5px/1.68 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;padding:0 20px;
}
.wrap{max-width:720px;margin:0 auto;padding:34px 0 96px}

header{margin-bottom:44px}
.brand{
  font-family:var(--display);font-weight:300;font-size:24px;letter-spacing:.01em;
  color:var(--ink);text-decoration:none;display:inline-block;
  border-bottom:0;   /* the generic a{} rule underlines links; the wordmark is not one */
}
.brand .dot{
  display:inline-block;width:.26em;height:.26em;border-radius:50%;
  background:var(--chrome);margin-left:.06em;vertical-align:baseline;
}

h1{
  font-family:var(--display);font-weight:300;font-size:clamp(31px,5.5vw,42px);
  line-height:1.14;letter-spacing:-.015em;margin:0 0 6px;
}
h2{
  font-family:var(--display);font-weight:300;font-size:23px;line-height:1.25;
  letter-spacing:-.008em;margin:44px 0 12px;
}
h3{
  font-family:var(--display);font-weight:300;font-size:19px;line-height:1.3;
  margin:28px 0 8px;
}
p,li{color:var(--ink)}
/* Emphasis is weight-and-slope, never a tint — there is no second text colour
   in this identity, which is why links are underlined rather than coloured. */
em{font-style:italic}
.muted,time{color:var(--muted);font-size:14.5px}
time{
  font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;
  display:inline-block;margin-bottom:8px;
}
a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--hair)}
a:hover{border-bottom-color:var(--ink)}
ul{padding-left:22px}
li{margin:7px 0}
code{
  background:var(--well);border:1px solid var(--hair);
  border-radius:6px;padding:1px 6px;font-size:14px;
  font-family:var(--mono);word-break:break-all;
}
.card{
  background:var(--well);border:1px solid var(--hair);
  border-radius:16px;padding:20px 22px;margin:22px 0;
}
.card > :first-child{margin-top:0}
.card > :last-child{margin-bottom:0}
hr{border:0;border-top:1px solid var(--hair);margin:44px 0}
table{
  border-collapse:collapse;width:100%;margin:18px 0;font-size:15px;
  display:block;overflow-x:auto;
}
th,td{border:1px solid var(--hair);padding:9px 12px;text-align:left;vertical-align:top}
th{background:var(--well);font-weight:600}

nav.foot{
  margin-top:56px;padding-top:26px;border-top:1px solid var(--hair);
  display:flex;flex-wrap:wrap;gap:8px 22px;font-size:14.5px;
}
nav.foot a{color:var(--muted);border-bottom-color:transparent}
nav.foot a:hover{color:var(--ink);border-bottom-color:var(--hair)}
