/* 보글보블 지원 페이지 공통 스타일 (2026-08-20)
   외부 의존성 없음 - 폰트/스크립트/이미지를 전혀 불러오지 않는다.
   스토어 심사자와 이용자가 어떤 환경에서 열어도 그대로 보여야 하고,
   서버에 파일만 올리면 끝나야 하기 때문이다. */
:root{
  --bg:#0b1220; --panel:#131c2e; --line:#26344d;
  --text:#e8eefc; --muted:#9fb0cc; --accent:#7ce0ff; --gold:#ffd166; --warn:#ff8f8f;
}
*{box-sizing:border-box}
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",
    "Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  line-height:1.75; font-size:16px;
}
.wrap{max-width:820px; margin:0 auto; padding:24px 20px 72px}
header.site{border-bottom:1px solid var(--line); margin-bottom:28px; padding-bottom:16px}
.brand{font-size:20px; font-weight:700; color:var(--gold); text-decoration:none; letter-spacing:.02em}
nav.site{margin-top:12px; display:flex; flex-wrap:wrap; gap:14px}
nav.site a{color:var(--muted); text-decoration:none; font-size:14px}
nav.site a:hover,nav.site a[aria-current="page"]{color:var(--accent)}
h1{font-size:28px; line-height:1.35; margin:8px 0 4px}
h2{font-size:20px; margin:34px 0 10px; padding-top:6px; border-top:1px solid var(--line)}
h3{font-size:17px; margin:22px 0 6px; color:var(--accent)}
p,li{color:var(--text)}
.lede{color:var(--muted); font-size:15px; margin-top:0}
ul,ol{padding-left:20px}
li{margin:6px 0}
a{color:var(--accent)}
.panel{background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:16px 18px; margin:18px 0}
.panel.warn{border-color:#5c3b3b; background:#1e1414}
.panel h3{margin-top:0}
table{width:100%; border-collapse:collapse; margin:14px 0; font-size:15px; display:block; overflow-x:auto}
th,td{border:1px solid var(--line); padding:9px 11px; text-align:left; vertical-align:top}
th{background:#182236; color:var(--accent); white-space:nowrap}
code{background:#0f1728; border:1px solid var(--line); border-radius:5px; padding:1px 6px; font-size:14px}
.meta{color:var(--muted); font-size:14px}
footer.site{margin-top:48px; padding-top:16px; border-top:1px solid var(--line); color:var(--muted); font-size:14px}
.langbar{display:flex; gap:8px; margin:18px 0 4px}
.langbar button{
  background:var(--panel); color:var(--muted); border:1px solid var(--line);
  border-radius:999px; padding:6px 16px; font-size:14px; cursor:pointer; font-family:inherit;
}
.langbar button[aria-pressed="true"]{color:#0b1220; background:var(--accent); border-color:var(--accent); font-weight:700}
[data-lang]{display:none}
[data-lang].on{display:block}
.todo{color:var(--warn); font-weight:700}
