/* Yasal sayfalar doğrudan açılınca (privacy.html, terms.html, kvkk.html; Google'a verilen adresler): arayüzün dili
   (koyu mor zemin, mor çerçeveli kart, amber başlıklar). Oyunun içinde bu sayfalar panelde açılır (MenuUI.openLegal). */
:root {
    --bg: radial-gradient(120% 90% at 50% 0%, #24113a 0%, #110920 55%, #06030b 100%);
    --plate: linear-gradient(180deg, #4e1c78 0%, #36115a 100%);
    --ring: rgba(236, 214, 255, .35); --ink: #f3ecfb; --muted: rgba(243, 236, 251, .7); --amber: #FFB700;
    color-scheme: dark;
}
* { box-sizing: border-box; }
html { min-height: 100%; background: #06030b; }
body {
    margin: 0; min-height: 100vh; background: var(--bg); background-attachment: fixed; color: var(--ink);
    font: 16px/1.65 "Nunito", "Segoe UI", system-ui, sans-serif;
}
.legal {
    max-width: 780px; margin: 24px auto 48px; padding: 26px 24px 30px;
    background: var(--plate); box-shadow: inset 0 0 0 1.5px var(--ring), 0 18px 40px rgba(0, 0, 0, .45);
    clip-path: polygon(16px 0, calc(100% - 16px) 0, 100% 16px, 100% calc(100% - 16px), calc(100% - 16px) 100%, 16px 100%, 0 calc(100% - 16px), 0 16px);
}
@media (max-width: 820px) { .legal { margin: 0; min-height: 100vh; clip-path: none; box-shadow: none; } }
.legal h1 {
    display: inline-block; margin: 14px 0 12px; padding: 8px 28px; font: 800 clamp(20px, 4vw, 26px)/1.2 "Exo 2", "Segoe UI", sans-serif;
    text-transform: uppercase; letter-spacing: .05em; color: #2A0B40;
    background: linear-gradient(180deg, #FFD25A, #FFB700 60%, #E59A00); clip-path: polygon(14px 0, calc(100% - 14px) 0, 100% 100%, 0 100%);
}
.legal h2 { margin: 26px 0 8px; font: 700 17px "Exo 2", "Segoe UI", sans-serif; text-transform: uppercase; letter-spacing: .04em; color: var(--amber); }
.legal p, .legal ul { margin: 0 0 12px; }
.legal ul { padding-left: 1.3em; }
.legal li { margin-bottom: 4px; }
.legal .lead { color: var(--ink); font-weight: 700; font-size: 17px; }
.legal a { color: var(--amber); }
.legal .back {
    display: inline-block; text-decoration: none; color: #2A0B40; font-weight: 800; padding: 7px 16px;
    background: linear-gradient(180deg, #FFD25A, #FFB700); clip-path: polygon(6px 0, 100% 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 0 100%, 0 6px);
}
.legal .back:hover { filter: brightness(1.08); }
.legal .updated { margin-top: 30px; padding-top: 12px; border-top: 1px solid var(--ring); color: var(--muted); font-size: 14px; }