.legal-page { width: min(1040px, calc(100% - 32px)); }
.legal-layout { display: grid; grid-template-columns: 235px minmax(0, 1fr); gap: 22px; align-items: start; }
.legal-nav { position: sticky; top: 18px; padding: 15px; }
.legal-nav strong { display: block; margin-bottom: 10px; color: var(--keyrof-subtle); font-size: .72rem; }
.legal-nav a { display: block; padding: 8px 9px; border-radius: 9px; color: var(--keyrof-muted); font-size: .69rem; text-decoration: none; }
.legal-nav a:hover, .legal-nav a[aria-current="page"] { color: var(--keyrof-text); background: rgba(31,44,68,.62); }
.legal-document { padding: clamp(22px, 5vw, 48px); }
.legal-document-header { padding-bottom: 24px; margin-bottom: 27px; border-bottom: 1px solid var(--keyrof-border); }
.legal-document-header h1 { margin: 5px 0 8px; font-size: clamp(1.65rem, 4vw, 2.45rem); line-height: 1.3; }
.legal-document-header > p { margin: 0; color: var(--keyrof-subtle); font-size: .82rem; }
.legal-version { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.legal-section { scroll-margin-top: 20px; padding: 3px 0 25px; }
.legal-section + .legal-section { padding-top: 24px; border-top: 1px solid rgba(148,163,184,.08); }
.legal-section h2 { margin: 0 0 12px; font-size: 1.02rem; }
.legal-section h3 { margin: 20px 0 8px; font-size: .84rem; }
.legal-section p { margin: 0 0 11px; color: #b5c0d1; font-size: .78rem; }
.legal-section ul { display: grid; gap: 7px; margin: 10px 0 13px; padding: 0 21px 0 0; color: #b5c0d1; }
.legal-section li { padding-right: 3px; font-size: .77rem; }
.legal-section li::marker { color: var(--keyrof-gold); }
.legal-callout { margin: 15px 0; padding: 14px 15px; border: 1px solid rgba(245,196,81,.2); border-radius: 12px; color: #f3dfaa; background: rgba(120,83,18,.1); font-size: .76rem; }
.legal-contact { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 14px; }
.legal-contact a { padding: 8px 11px; border: 1px solid var(--keyrof-border); border-radius: 10px; color: var(--keyrof-subtle); background: rgba(5,9,16,.36); font-size: .7rem; text-decoration: none; }
.legal-contact a:hover { color: var(--keyrof-text); border-color: var(--keyrof-border-strong); }

@media (max-width: 760px) {
    .legal-layout { grid-template-columns: 1fr; }
    .legal-nav { position: static; display: flex; gap: 5px; overflow-x: auto; white-space: nowrap; }
    .legal-nav strong { display: none; }
    .legal-nav a { flex: 0 0 auto; }
    .legal-document { padding: 21px 17px; }
}