/* Shared styling for /privacy and /terms.
   Same tokens as index.html — kept in one file rather than duplicated inline,
   because these two pages are near-identical and only differ in prose. */

:root {
  --paper: #f4ede1;
  --ink: #1a1614;
  --ink-soft: #574e45;
  --ink-faint: #8a7f72;
  --accent: #c3392c;
  --accent-dark: #9c2c22;
  --vermillion: #c3392c;
  --gold: #b08b4f;
  --rule: #d9cdb9;
}

body::before {
  content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 0; opacity: .5;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.1 0 0 0 0 0.08 0 0 0 0 0.06 0 0 0 0.04 0'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E");
}
body > * { position: relative; z-index: 1; }
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; background: var(--paper); }
body {
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
  color: var(--ink); line-height: 1.62;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}
a { color: var(--accent); text-decoration: none; transition: color .15s; }
a:hover { color: var(--accent-dark); }
.wrap { max-width: 1080px; margin: 0 auto; padding: 0 28px; }
.narrow { max-width: 720px; }

header { padding: 28px 0 24px; }
header .wrap { display: flex; align-items: baseline; justify-content: space-between; gap: 24px; }
.logo {
  font-family: "Cormorant Garamond", Georgia, serif; font-weight: 600; font-size: 26px;
  letter-spacing: -0.01em; color: var(--ink); display: flex; align-items: center; gap: 12px;
}
.logo-word { white-space: nowrap; }
.logo em { font-style: italic; color: var(--accent); font-weight: 400; margin-left: 3px; }
.seal {
  display: inline-flex; align-items: center; justify-content: center;
  width: 32px; height: 32px; background: var(--vermillion); color: var(--paper);
  font-family: "Noto Serif TC", "Songti SC", serif; font-weight: 500; font-size: 18px;
  border-radius: 2px; box-shadow: 0 1px 0 rgba(0,0,0,.08); transform: rotate(-2deg);
}
nav { display: flex; gap: 28px; }
nav a { color: var(--ink-soft); font-size: 14px; font-weight: 500; letter-spacing: .02em; }
nav a:hover { color: var(--ink); }

main { padding: 56px 0 72px; }
h1 {
  font-family: "Cormorant Garamond", Georgia, serif; font-weight: 500;
  font-size: clamp(38px, 5vw, 56px); line-height: 1.02; letter-spacing: -0.015em;
  margin: 0 0 10px;
}
h2 {
  font-family: "Cormorant Garamond", Georgia, serif; font-weight: 500;
  font-size: 30px; line-height: 1.15; letter-spacing: -0.01em;
  margin: 44px 0 12px; color: var(--ink);
}
.updated { color: var(--ink-faint); font-size: 13.5px; margin: 0 0 8px; }
p, li { color: var(--ink-soft); font-size: 16px; }
p { margin: 0 0 16px; }
ul { margin: 0 0 16px; padding-left: 22px; }
li { margin-bottom: 9px; }
li::marker { color: var(--vermillion); }
strong { color: var(--ink); font-weight: 600; }

table { border-collapse: collapse; width: 100%; margin: 0 0 20px; font-size: 15px; }
th, td { text-align: left; padding: 10px 14px 10px 0; border-bottom: 1px solid var(--rule); vertical-align: top; }
th { color: var(--ink); font-weight: 600; font-size: 13px; letter-spacing: .04em; text-transform: uppercase; }
td { color: var(--ink-soft); }

footer { padding: 36px 0 48px; color: var(--ink-faint); font-size: 13px; border-top: 1px solid var(--rule); }
footer .wrap { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; }
footer a { color: var(--ink-soft); }
footer nav { gap: 18px; }

@media (max-width: 700px) {
  header .wrap { flex-direction: column; align-items: flex-start; gap: 14px; }
  nav { gap: 18px; flex-wrap: wrap; }
}