/* Styles for legal.html, kept in a file so the page's content security policy can stay strict. Same look as the calculator. */
:root{color-scheme:dark;--night:#0f1012;--dash:#18191c;--rule:#2f3136;--sign:#f5c400;--sign-ink:#151200;--text:#ecebe6;--muted:#9a9890;--f-display:"Big Shoulders Display","Arial Narrow",Impact,sans-serif;--f-body:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--night);color:var(--text);font-family:var(--f-body);font-size:16px;line-height:1.6}
a{color:var(--sign)}
a:focus-visible{outline:2px solid var(--sign);outline-offset:2px}
.sign{background:var(--sign);color:var(--sign-ink);padding-block:14px}
.sign a{color:var(--sign-ink);text-decoration:none;font-family:var(--f-display);font-weight:900;font-size:1.8rem;text-transform:uppercase;letter-spacing:.02em}
.wrap{max-width:680px;margin:0 auto;padding:0 max(16px,env(safe-area-inset-left,0px))}
main{padding-block:8px 48px}
h1{font-family:var(--f-display);font-weight:900;font-size:2.4rem;line-height:1.05;margin:24px 0 4px;text-wrap:balance}
h2{font-family:var(--f-display);font-weight:700;font-size:1.6rem;line-height:1.1;margin:36px 0 8px;color:var(--sign)}
p,li{color:var(--text)}
ul{padding-left:1.2rem}
li{margin:6px 0}
.muted{color:var(--muted);font-size:.9rem}
.co{background:var(--dash);border:1px solid var(--rule);border-left:3px solid var(--sign);border-radius:8px;padding:12px 16px;margin:18px 0}
.co p{margin:4px 0}
table{border-collapse:collapse;width:100%;font-size:.9rem;margin:8px 0}
th,td{border-bottom:1px solid var(--rule);padding:8px 10px;text-align:left;vertical-align:top}
th{color:var(--muted);font-weight:600;font-size:.75rem;letter-spacing:.06em;text-transform:uppercase}