/* Terms & Privacy pages: same look as the app (light gold by default, dark when the app's theme says so). */
:root {
  --bg: #F8F3E7; --panel: rgba(255, 255, 255, 0.72); --text: #1A1D23; --body: #2A2E36; --muted: #5E626B;
  --line: rgba(20, 23, 29, 0.10); --bronze: #B06C28; --link: #9A5A1C; --head: rgba(248, 243, 231, 0.86);
  --bz-blade: #5A616D; --bz-spark: #C98A2E; color-scheme: light;
}
:root[data-theme="dark"] {
  --bg: #14171D; --panel: #1D2129; --text: #EFECE5; --body: #DCD8D0; --muted: #A9ADB5;
  --line: rgba(255, 255, 255, 0.08); --bronze: #E0A868; --link: #E8B577; --head: rgba(20, 23, 29, 0.88);
  --bz-blade: #E3E6EB; --bz-spark: #EDB25A; color-scheme: dark;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #14171D; --panel: #1D2129; --text: #EFECE5; --body: #DCD8D0; --muted: #A9ADB5;
    --line: rgba(255, 255, 255, 0.08); --bronze: #E0A868; --link: #E8B577; --head: rgba(20, 23, 29, 0.88);
    --bz-blade: #E3E6EB; --bz-spark: #EDB25A; color-scheme: dark;
  }
}
* { box-sizing: border-box; }
body {
  margin: 0; color: var(--text); font: 16.5px/1.75 "Google Sans", "Segoe UI", system-ui, sans-serif;
  background:
    radial-gradient(1000px 560px at 82% -14%, rgba(232, 168, 82, 0.30), transparent 62%),
    radial-gradient(900px 560px at -6% 108%, rgba(255, 222, 140, 0.34), transparent 62%),
    linear-gradient(180deg, #F8F3E7, #F3EBDA);
  background-attachment: fixed;
}
:root[data-theme="dark"] body { background: radial-gradient(1000px 560px at 82% -14%, rgba(224, 160, 79, 0.16), transparent 62%), #14171D; background-attachment: fixed; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) body { background: radial-gradient(1000px 560px at 82% -14%, rgba(224, 160, 79, 0.16), transparent 62%), #14171D; background-attachment: fixed; }
}
a { color: var(--link); text-underline-offset: 3px; }
header {
  position: sticky; top: 0; z-index: 2; display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 20px;
  background: var(--head); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-bottom: 1px solid var(--line);
}
.brand { display: flex; align-items: center; color: var(--text); text-decoration: none; font-size: 26px; line-height: 1; }
.back { color: var(--muted); text-decoration: none; font-size: 14.5px; font-weight: 500; white-space: nowrap; }
.back:hover { color: var(--bronze); }
main { max-width: 760px; margin: 0 auto; padding: 40px 20px 60px; }
h1 { font: 800 40px/1.2 "Plus Jakarta Sans", "Google Sans", sans-serif; letter-spacing: -0.02em; margin: 0 0 6px; }
h2 { font: 700 22px/1.35 "Google Sans", sans-serif; margin: 38px 0 10px; padding-top: 14px; border-top: 1px solid var(--line); }
h3 { font-size: 16.5px; margin: 20px 0 6px; }
.updated { color: var(--muted); margin: 0 0 26px; font-size: 14px; }
p, li { color: var(--body); }
strong { color: var(--text); }
ul { padding-left: 22px; }
li { margin: 6px 0; }
.highlight { margin: 26px 0; padding: 18px 22px; border-radius: 16px; background: var(--panel); border: 1px solid var(--line); border-left: 4px solid var(--bronze); }
.highlight strong:first-child { font-size: 18px; }
footer { text-align: center; padding: 22px; color: var(--muted); font-size: 13px; border-top: 1px solid var(--line); }
footer a { color: var(--muted); }
@media (max-width: 600px) { h1 { font-size: 30px; } .brand { font-size: 22px; } header { padding: 10px 16px; } main { padding: 28px 16px 48px; } }

/* Brand name: blade Z as the first letter (no tile), "ulfi" in ink, "Era AI" in gold. */
.bz { display: inline-block; width: 1.044em; height: 1.223em; position: relative; top: 0.228em; margin-right: 0.01em; vertical-align: baseline; overflow: visible; }
.bz-solo { display: block; width: 60px; height: 70px; margin: 0 auto 12px; overflow: visible; }
.brand .zw { font-family: "Plus Jakarta Sans", "Segoe UI", sans-serif; font-weight: 800; letter-spacing: -0.02em; color: var(--text); }
.brand .zw span { color: var(--bronze); }
