.legal-dialog { width: min(720px, calc(100vw - 32px)); max-width: none; max-height: min(820px, calc(100dvh - 48px)); padding: 0; margin: auto; border: 1px solid #49404f; border-radius: 16px; background: #1c1921; color: #f5f0fa; box-shadow: 0 24px 80px #0008; font-family: var(--font-ios, sans-serif); overflow: hidden; }
.legal-dialog[open] { display: flex; flex-direction: column; }
.legal-dialog::backdrop { background: #08060dbd; }
.legal-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; padding: 28px 28px 22px; }
.legal-header h2 { margin: 0 0 8px; font: 700 clamp(1.5rem, 4vw, 2rem)/1.2 var(--font-ios, sans-serif); letter-spacing: -.025em; color: #fff; }
.legal-header p { margin: 0; color: #bdb3c7; font-size: .9rem; }
.legal-close { display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; margin-top: -6px; border: 0; border-radius: 8px; background: #302936; color: #f5f0fa; cursor: pointer; }
.legal-close:hover { background: #44384e; }
.legal-tabs { display: flex; gap: 8px; margin: 0 28px; padding-bottom: 18px; border-bottom: 1px solid #443b4b; }
.legal-tabs button { flex: 1; min-height: 44px; padding: 10px 12px; font: 600 .9rem var(--font-ios, sans-serif); color: #c7bdcf; border: 0; border-radius: 8px; background: transparent; cursor: pointer; }
.legal-tabs button:hover { background: #302936; }
.legal-tabs button[aria-selected="true"] { background: #ffd479; color: #241b0c; }
.legal-body { overflow-y: auto; overscroll-behavior: contain; padding: 24px 28px 30px; scrollbar-width: thin; scrollbar-color: #756183 #1c1921; }
.legal-body section[hidden] { display: none; }
.legal-body .legal-intro { margin: 0 0 28px; color: #f0e7f7; font-size: 1.05rem; }
.legal-body h3 { margin: 26px 0 10px; color: #fff; font: 600 1rem/1.4 var(--font-ios, sans-serif); }
.legal-body p { margin: 0; color: #cfc5d8; font-size: .95rem; line-height: 1.75; max-width: 72ch; }
.legal-dialog a { color: #ffd479; text-underline-offset: 3px; }
.legal-dialog a:hover { color: #ffe8b7; }
.legal-footer { display: flex; justify-content: space-between; align-items: center; gap: 18px; padding: 18px 28px; border-top: 1px solid #443b4b; }
.legal-footer a { font-size: .85rem; line-height: 1.5; }
.legal-done { min-width: 92px; min-height: 44px; padding: 10px 20px; border: 0; border-radius: 8px; background: #ffd479; color: #241b0c; font: 600 .95rem var(--font-ios, sans-serif); cursor: pointer; }
.legal-done:hover { background: #ffe8b7; }
.legal-dialog :focus-visible { outline: 2px solid #ffd479; outline-offset: 3px; }
.legal-dialog ::selection { background: #ffd479; color: #241b0c; }
@media (max-width: 480px) { .legal-dialog { max-height: calc(100dvh - 24px); width: calc(100vw - 24px); border-radius: 12px; } .legal-header { padding: 22px 18px 18px; } .legal-tabs { margin-inline: 18px; } .legal-body { padding: 22px 18px; } .legal-footer { padding: 16px 18px; } .legal-tabs button { font-size: .8rem; } }