/* Legal pages use the same light/dark design tokens as the main games shell. */
.legal-body{min-height:100vh;display:flex;flex-direction:column;background:var(--canvas);color:var(--text)}
.legal-header,.legal-footer{width:100%;padding:22px clamp(20px,5vw,70px);display:flex;justify-content:space-between;align-items:center;gap:20px}
.legal-header{border-bottom:1px solid var(--line);background:var(--surface)}
.legal-brand{font-weight:750;font-size:20px;letter-spacing:-.7px;white-space:nowrap}
.legal-brand span{color:var(--muted)}
.legal-nav{display:flex;align-items:center;gap:16px}
.legal-nav a{font-size:13px;color:var(--muted)}
.legal-nav a:hover,.legal-footer a:hover{color:var(--text)}
#legal-theme-toggle{display:grid;place-items:center;background:var(--surface-soft);color:var(--text);border:1px solid var(--line);border-radius:10px;width:38px;height:38px;font-size:21px}
.legal-main{width:min(860px,100%);padding:66px 30px 90px;margin:auto;flex:1}
.legal-intro{border-bottom:1px solid var(--line);padding-bottom:36px;margin-bottom:42px}
.legal-intro .eyebrow{margin-bottom:16px}
.legal-intro h1{font-weight:710;letter-spacing:-2.2px;font-size:clamp(38px,5vw,60px);line-height:1.1;margin:0 0 14px}
.legal-subtitle{font-size:16px;line-height:1.6;color:var(--muted);margin:0 0 19px}
.legal-updated{font-size:12px;color:var(--muted)}
.legal-article{max-width:760px}
.legal-article section{margin:0 0 34px}
.legal-article h2{font-size:21px;letter-spacing:-.5px;margin:0 0 12px;font-weight:690}
.legal-article p,.legal-article li{font-size:14px;line-height:1.85;margin:0 0 12px;color:var(--text)}
.legal-article li{padding-left:3px;margin:0 0 8px}
.legal-article ul{padding-left:23px;margin:14px 0 20px}
.legal-article a{color:var(--accent);text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}
.legal-article strong{font-weight:700}
.legal-footer{border-top:1px solid var(--line);color:var(--muted);font-size:12px;flex-wrap:wrap}
.legal-footer nav{display:flex;gap:17px;flex-wrap:wrap}
@media(max-width:600px){.legal-header{padding:14px 18px}.legal-brand{font-size:17px}.legal-nav{gap:8px}.legal-nav a{font-size:12px}.legal-main{padding:42px 21px 72px}.legal-article h2{font-size:19px}.legal-footer{padding:19px 20px;align-items:flex-start;flex-direction:column;gap:12px}}

/* Same information-page shell across Support, Privacy and Terms. Pages stay
   standalone: game navigation would add distraction to account/legal tasks. */
.legal-header{
 display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
 padding-block:16px;min-height:75px
}
.legal-header .legal-nav{justify-self:end}
.legal-sections{display:flex;align-items:center;gap:3px;min-width:0;
 background:var(--surface-soft);border:1px solid var(--line);border-radius:11px;padding:4px}
.legal-sections a{padding:8px 14px;min-height:35px;display:grid;place-items:center;
 border-radius:8px;font-size:13px;font-weight:600;color:var(--muted);
 text-decoration:none;white-space:nowrap}
.legal-sections a[aria-current="page"]{background:var(--surface);color:var(--text);
 box-shadow:0 1px 4px #0000000b;border:1px solid var(--line);padding:7px 13px}
.legal-sections a:not([aria-current="page"]):hover{color:var(--text)}
.legal-main{width:min(880px,100%);padding-top:clamp(42px,5.8vw,72px)}
.legal-brand{font-size:19px;font-weight:780;letter-spacing:-.85px;color:var(--text)}
.legal-brand span{font-weight:630}
.legal-intro .eyebrow{font-size:11px;font-weight:750;letter-spacing:.115em;color:var(--muted)}
.legal-nav a{font-weight:600;white-space:nowrap}
#legal-theme-toggle{cursor:pointer;flex:none}
#legal-theme-toggle:focus-visible,.legal-sections a:focus-visible,.legal-nav a:focus-visible{
 outline:2px solid var(--accent);outline-offset:3px
}
.legal-footer{background:var(--surface);padding-block:19px}
.legal-footer nav a[aria-current="page"]{font-weight:750;color:var(--text)}
@media(max-width:700px){
 .legal-header{grid-template-columns:1fr auto;gap:12px;min-height:0}
 .legal-sections{grid-column:1/-1;grid-row:2;justify-self:stretch}
 .legal-sections a{flex:1}
 .legal-header .legal-nav{grid-column:2;grid-row:1}
 .legal-nav a{font-size:12px}
}
@media(max-width:400px){
 .legal-header{padding:12px 15px}
 .legal-sections a{font-size:12px;padding-inline:8px}
 .legal-sections a[aria-current="page"]{padding-inline:7px}
}

/* Privacy rights are discoverable on the public policy, including for guests. */
.tg-privacy-actions{padding:20px 22px;border:1px solid var(--line);border-radius:14px;background:var(--surface-soft)}
.tg-privacy-actions h2{margin-bottom:8px}
.tg-privacy-action-links{display:flex;gap:9px;flex-wrap:wrap;margin:16px 0}
.legal-article .tg-privacy-action-links a{
 display:inline-flex;align-items:center;justify-content:center;min-height:39px;padding:10px 13px;
 background:var(--surface);border:1px solid var(--line);border-radius:9px;
 color:var(--text);font-weight:690;font-size:12px;text-decoration:none}
.legal-article .tg-privacy-action-links a:hover{border-color:var(--muted)}
.legal-article .tg-privacy-action-links a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
@media(max-width:500px){.tg-privacy-actions{padding:16px}
.tg-privacy-action-links a{flex:1;min-width:100%}}

/* Consent controls stay discoverable to signed-out visitors via Privacy. */
.legal-article .tg-privacy-cookie-button{
 display:inline-flex;align-items:center;justify-content:center;
 padding:10px 16px;min-height:39px;background:var(--surface-soft);
 color:var(--text);border:1px solid var(--line);border-radius:9px;
 font:inherit;font-size:12px;font-weight:720;cursor:pointer}
.legal-article .tg-privacy-cookie-button:hover{border-color:var(--muted)}
.legal-article .tg-privacy-cookie-button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}