/* Public pages (privacy / account deletion). Same teal tokens + fonts as the app (theme-base.md). Body 18px+, AAA ink on white. Works without JavaScript (all languages stacked, Thai first). */
@font-face { font-family: 'IBM Plex Sans'; font-display: swap; font-weight: 400; src: url(fonts/ibm-plex-sans-latin-400-normal.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+2000-206F,U+20AC,U+2122,U+2190-2193,U+2212; }
@font-face { font-family: 'IBM Plex Sans'; font-display: swap; font-weight: 700; src: url(fonts/ibm-plex-sans-latin-700-normal.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+2000-206F,U+20AC,U+2122,U+2190-2193,U+2212; }
@font-face { font-family: 'IBM Plex Sans Thai'; font-display: swap; font-weight: 400; src: url(fonts/ibm-plex-sans-thai-thai-400-normal.woff2) format("woff2"); unicode-range: U+02D7,U+0303,U+0331,U+0E01-0E5B,U+200C-200D,U+25CC; }
@font-face { font-family: 'IBM Plex Sans Thai'; font-display: swap; font-weight: 700; src: url(fonts/ibm-plex-sans-thai-thai-700-normal.woff2) format("woff2"); unicode-range: U+02D7,U+0303,U+0331,U+0E01-0E5B,U+200C-200D,U+25CC; }
:root { --bg: #fff; --ink: #111; --muted: #4a4a52; --line: #e3e3e8; --brand: #0c635c; --soft: #e6f4f2; --grad: linear-gradient(135deg, #0c635c, #0a5651); --ease: cubic-bezier(.2, .7, .2, 1); }
@media (prefers-color-scheme: dark) { :root { --bg: #0e0e12; --ink: #f2f2f5; --muted: #b4b4bf; --line: #2a2a33; --brand: #2dd4bf; --soft: #123532; --grad: linear-gradient(135deg, #5eead4, #2dd4bf); } }
* { box-sizing: border-box; }
html { font-size: 100%; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--bg); color: var(--ink); font: 400 1.125rem/1.7 'IBM Plex Sans Thai', 'IBM Plex Sans', system-ui, 'Noto Sans KR', 'Noto Sans SC', 'Noto Sans Devanagari', sans-serif; overflow-wrap: anywhere; }
header { position: sticky; top: 0; z-index: 2; background: var(--bg); border-bottom: 1px solid var(--line); padding: .5rem 1rem; display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: center; justify-content: space-between; }
.back { display: inline-flex; align-items: center; min-height: 3.5rem; color: var(--brand); font-weight: 700; text-decoration: none; padding: 0 .25rem; }
#langs { display: flex; flex-wrap: wrap; gap: .5rem; }
#langs button { min-height: 3.5rem; min-width: 3.5rem; padding: 0 1rem; border-radius: 999px; border: 1px solid var(--line); background: var(--bg); color: var(--ink); font: inherit; font-weight: 600; cursor: pointer; transition: background .2s var(--ease), transform .18s var(--ease); }
#langs button[aria-pressed="true"] { background: var(--soft); border-color: var(--brand); color: var(--brand); }
#langs button:active { transform: scale(.97); }
:root:not([data-js]) #langs { display: none; }
main { max-width: 46rem; margin: 0 auto; padding: 1rem 1rem 3rem; }
:root[data-js] section:not(.on) { display: none; }
section { padding-bottom: 2rem; border-bottom: 1px solid var(--line); margin-bottom: 2rem; animation: enter .3s var(--ease) both; }
section:last-child { border: 0; }
h1 { font-size: 1.75rem; line-height: 1.3; margin: 1rem 0 .25rem; }
h2 { font-size: 1.25rem; line-height: 1.4; margin: 1.75rem 0 .25rem; color: var(--brand); }
.meta { color: var(--muted); margin: 0 0 1rem; }
p, li { margin: .5rem 0; } ul, ol { padding-left: 1.5rem; }
a { color: var(--brand); text-underline-offset: .2em; } a:focus-visible, button:focus-visible { outline: 3px solid var(--brand); outline-offset: 2px; }
.links a { display: inline-flex; align-items: center; min-height: 3.5rem; font-weight: 700; }
@keyframes enter { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }

/* Korean: wrap only at spaces, never inside a word (owner rule; 2026-11-10) */
:lang(ko) { word-break:keep-all; overflow-wrap:break-word; }
