/* Terms of Service + Fairness: long-form reading layout */
.legal-view { max-width: 1040px; }
.legal-view .page-sub { line-height: 1.6; }
.legal-intro {
  position: relative; overflow: hidden; padding: 32px 34px; margin-bottom: 16px;
  background: radial-gradient(ellipse 60% 120% at 100% 0%, rgba(231, 185, 100, .1), transparent 65%), linear-gradient(180deg, rgba(255, 255, 255, .02), transparent), var(--panel);
}
.legal-intro::before { content: ""; position: absolute; left: 10%; right: 40%; top: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(247, 220, 158, .45), transparent); }
.legal-intro h2 { margin: 12px 0 10px; font-size: 32px; font-weight: 600; letter-spacing: -.045em; line-height: 1.1; }
.legal-intro h2 em { font-family: var(--serif); font-style: italic; font-weight: 400; color: var(--accent-hi); letter-spacing: -.02em; }
.legal-view p { color: var(--text2); font-size: 14.5px; line-height: 1.75; max-width: 72ch; }
.legal-view p a, .legal-view li a { color: var(--accent-hi); text-decoration: underline; text-decoration-color: var(--accent-line); text-underline-offset: 3px; transition: text-decoration-color .2s; }
.legal-view p a:hover, .legal-view li a:hover { text-decoration-color: var(--accent); }
.legal-copy { padding: 10px 34px 32px; counter-reset: clause; }
.legal-copy h2 { margin: 30px 0 8px; font-size: 18px; font-weight: 600; letter-spacing: -.025em; }
.legal-copy p { margin: 0; }
.consent-card { margin-top: 16px; padding: 26px 34px; background: linear-gradient(90deg, rgba(231, 185, 100, .05), transparent 60%), var(--panel); box-shadow: inset 0 0 0 1px var(--accent-line), var(--hi); }
.consent-check { display: flex; gap: 14px; align-items: flex-start; font-size: 14.5px; line-height: 1.7; color: var(--text); cursor: pointer; }
.consent-check input {
  appearance: none; -webkit-appearance: none; flex-shrink: 0; width: 20px; height: 20px; margin: 3px 0 0; border-radius: 6px; cursor: pointer; display: grid; place-items: center;
  background: var(--bg2); box-shadow: inset 0 0 0 1px var(--line3); transition: background .2s, box-shadow .2s;
}
.consent-check input::after { content: ""; width: 10px; height: 6px; border: 2px solid var(--accent-ink); border-top: 0; border-right: 0; transform: rotate(-45deg) translate(1px, -1px) scale(0); transition: transform .3s var(--spring); }
.consent-check input:checked { background: var(--grad); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5); }
.consent-check input:checked::after { transform: rotate(-45deg) translate(1px, -1px) scale(1); }
.consent-check input:hover:not(:checked) { box-shadow: inset 0 0 0 1px var(--accent-line); }
.consent-submit { margin-top: 22px; }
.consent-note { font-size: 13px !important; margin: 14px 0 0; color: var(--muted) !important; }
.consent-saved > span { display: flex; align-items: center; gap: 10px; font-size: 15px; font-weight: 500; color: var(--green); }
.consent-saved > span .ic { width: 20px; height: 20px; }
.consent-saved .consent-date { font-family: var(--mono); font-size: 12.5px; margin: 8px 0 18px; }
.fairness-list { display: grid; gap: 12px; margin-top: 16px; }
.fairness-item { padding: 24px 28px; }
.fairness-item h2 { display: flex; align-items: center; gap: 12px; margin: 0; font-size: 19px; font-weight: 600; letter-spacing: -.03em; }
.fairness-item h2 .ic { width: 30px; height: 30px; }
.fairness-item p { margin: 10px 0 0; }
.fairness-item h3 { margin: 20px 0 4px; font-size: 14px; font-weight: 600; }
.fairness-item details { margin-top: 14px; border-top: 1px solid var(--line); padding-top: 12px; }
.fairness-item summary {
  display: inline-flex; align-items: center; gap: 8px; cursor: pointer; list-style: none; font-size: 13.5px; font-weight: 500; color: var(--accent-hi); transition: color .2s;
}
.fairness-item summary::-webkit-details-marker { display: none; }
.fairness-item summary::before { content: ""; width: 7px; height: 7px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(-45deg); transition: transform .3s var(--ease); }
.fairness-item details[open] summary::before { transform: rotate(45deg); }
.fairness-item summary:hover { color: var(--text); }
.fairness-item details[open] > :not(summary) { animation: fadeUp .4s var(--ease); }
.fairness-table-wrap { overflow-x: auto; margin-top: 12px; border-radius: 12px; box-shadow: inset 0 0 0 1px var(--line); }
.fairness-table { width: 100%; border-collapse: collapse; font-size: 13px; text-align: left; }
.fairness-table th, .fairness-table td { padding: 10px 14px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.fairness-table tr:last-child td { border-bottom: 0; }
.fairness-table th { font-size: 12px; font-weight: 500; color: var(--muted); background: rgba(255, 255, 255, .015); }
.fairness-table td { font-family: var(--mono); font-size: 12.5px; color: var(--text2); font-variant-numeric: tabular-nums; }
.fairness-table tbody tr:hover td { background: rgba(255, 255, 255, .02); }
.fairness-tag {
  display: inline-flex; gap: 6px; align-items: center; margin-top: 12px; height: 26px; padding: 0 10px; border-radius: 99px;
  font-family: var(--mono); font-size: 11.5px; color: var(--accent-hi); background: var(--accent-soft); box-shadow: inset 0 0 0 1px var(--accent-line);
}
.fairness-link { display: inline-flex; gap: 7px; align-items: center; color: var(--text2); transition: color .2s; }
.fairness-link .ic { color: var(--accent); }
.fairness-link:hover { color: var(--text); }
@media (max-width: 600px) {
  .legal-intro, .legal-copy, .consent-card { padding-left: 20px; padding-right: 20px; }
  .legal-intro { padding-top: 24px; padding-bottom: 24px; }
  .legal-intro h2 { font-size: 26px; }
  .fairness-item { padding: 20px; }
  .consent-submit { width: 100%; }
}