/* Terms / Privacy pages - same look as the web app (index.html): black page, white card. */
* { box-sizing: border-box; }
body {
  margin: 0; background: #000; color: #1e1e22;
  font-family: -apple-system, "Segoe UI", Pretendard, sans-serif; line-height: 1.6;
}
.wrap { max-width: 720px; margin: 0 auto; padding: 32px 16px 48px; }
.brand {
  display: block; text-align: center; margin-bottom: 24px; color: #fff; text-decoration: none;
  font-family: 'Silkscreen', sans-serif; font-weight: 700; font-size: 33px; letter-spacing: 0.06em;
}
.card { background: #fff; border: 1px solid #e2e4ea; border-radius: 12px; padding: 28px 28px 32px; }
h1 { font-size: 24px; margin: 0 0 4px; }
h2 { font-size: 17px; margin: 28px 0 8px; }
h3 { font-size: 14px; margin: 16px 0 4px; }
p, li { font-size: 14px; }
ul, ol { padding-left: 20px; }
li + li { margin-top: 4px; }
a { color: #0078d4; }
.updated { color: #6b6f7a; font-size: 13px; margin: 0 0 20px; }
/* English | 한국어 - top right of the card (privacy.html / privacy-ko.html). */
/* The switch always sits right of the title; on a narrow phone the title wraps between words
   (keep-all - never inside a Korean word). */
.cardHead { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.cardHead h1 { min-width: 0; word-break: keep-all; }
.langSwitch { display: inline-flex; flex-shrink: 0; border: 1px solid #c9ccd3; border-radius: 999px; padding: 2px; font-size: 12px; margin-top: 4px; }
.langSwitch a, .langSwitch span { padding: 2px 10px; border-radius: 999px; text-decoration: none; color: #6b6f7a; }
.langSwitch span { background: #1e1e22; color: #fff; }
.langSwitch a:hover { color: #1e1e22; }
/* Outsourcing / overseas-transfer tables - scroll sideways on a phone instead of squeezing. */
.tableWrap { overflow-x: auto; margin: 8px 0 12px; }
table { border-collapse: collapse; font-size: 13px; min-width: 100%; }
th, td { border: 1px solid #e2e4ea; padding: 6px 8px; text-align: left; vertical-align: top; }
th { background: #f4f5f8; font-weight: 600; white-space: nowrap; }
.tableWrap table:has(th:nth-child(6)) { min-width: 760px; }
.siteFooter { margin-top: 24px; text-align: center; font-size: 12px; color: #6b6f7a; }
.siteFooter a { color: #9a9ea8; text-decoration: none; }
@media (max-width: 480px) { .card { padding: 22px 18px 26px; } }
/* A round back button floating at the bottom left (explicit request; added by legal.js): frosted dark
   glass with a white chevron - back to the web app. Clear of the iPhone's home bar; the page ends with
   room for it so it never covers the footer. */
.wrap { padding-bottom: 96px; }
/* It must stay put on screen while the page scrolls (explicit request): on iPhone Safari a fixed element
   that carries backdrop-filter itself can be painted with the page during a scroll, so the button is its
   own compositing layer (translateZ) and the frosted glass sits on a layer under it (::before). */
.backFab {
  position: fixed; left: 16px; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); z-index: 10;
  width: 46px; height: 46px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  -webkit-transform: translateZ(0); transform: translateZ(0); will-change: transform; isolation: isolate;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.28);
  -webkit-tap-highlight-color: transparent;
}
.backFab::before {
  content: ''; position: absolute; inset: 0; border-radius: inherit; z-index: -1;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18);
  background: rgba(30, 30, 34, 0.55); -webkit-backdrop-filter: blur(12px) saturate(1.4); backdrop-filter: blur(12px) saturate(1.4);
}
.backFab svg { width: 22px; height: 22px; margin-left: -2px; }
.backFab:active { -webkit-transform: translateZ(0) scale(0.94); transform: translateZ(0) scale(0.94); }
