* { box-sizing: border-box; }

:root {
  color-scheme: dark;
  --legal-bg: #050811;
  --legal-text: #edf5ff;
  --legal-muted: #afbccd;
  --legal-accent: #75e8ff;
  --legal-border: rgba(255,255,255,.13);
}

html { background: var(--legal-bg); }

body {
  margin: 0;
  color: var(--legal-text);
  background: radial-gradient(circle at 82% 0, rgba(0,210,255,.09), transparent 29%), var(--legal-bg);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.7;
}

a { color: var(--legal-accent); }

.legal-nav {
  padding: 1rem clamp(1rem, 4vw, 3rem);
  border-bottom: 1px solid var(--legal-border);
}

.legal-nav a {
  color: #fff;
  font-weight: 750;
  text-decoration: none;
}

.legal {
  width: min(900px, calc(100% - 2rem));
  margin: 0 auto;
  padding: clamp(3.5rem, 9vw, 7rem) 0;
}

.legal-kicker {
  color: var(--legal-accent);
  font: 700 .72rem ui-monospace, SFMono-Regular, Consolas, monospace;
  letter-spacing: .12em;
}

.legal h1 {
  margin: .7rem 0 1.2rem;
  font-size: clamp(2.45rem, 7vw, 5rem);
  line-height: 1;
  letter-spacing: -.055em;
}

.legal h2 {
  margin: 3rem 0 .7rem;
  font-size: clamp(1.3rem, 3vw, 1.55rem);
  line-height: 1.25;
}

.legal h3 { margin: 1.8rem 0 .5rem; }
.legal p,
.legal li,
.legal td { color: var(--legal-muted); }
.legal strong,
.legal th { color: #fff; }

.legal-note,
.legal-pending {
  padding: 1rem;
  border: 1px solid var(--legal-border);
  border-radius: 12px;
  background: rgba(255,255,255,.035);
}

.legal-pending {
  border-color: rgba(255,190,80,.5);
  color: #ffe2a8 !important;
}

.legal table {
  width: 100%;
  margin: 1.25rem 0;
  border-collapse: collapse;
}

.legal th,
.legal td {
  padding: .8rem;
  border: 1px solid var(--legal-border);
  text-align: left;
  vertical-align: top;
}

.legal-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  margin: 1.5rem 0;
}

.legal-button {
  border: 1px solid rgba(117,232,255,.5);
  border-radius: 999px;
  padding: .7rem 1rem;
  color: #fff;
  background: rgba(117,232,255,.08);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.legal-footer {
  padding: 1.5rem clamp(1rem, 4vw, 3rem);
  border-top: 1px solid var(--legal-border);
}

@media (max-width: 620px) {
  .legal table { display: block; overflow-x: auto; }
  .legal { width: min(100% - 1.25rem, 900px); }
}
