/* doc.css — the shared look of the four static pages (about · guide · privacy · terms): the brand line, the link row, headings,
   links, the table, the English section's rule. Every value is a token from /tokens.css (linked first). D3 2026-09-26. */
*{box-sizing:border-box}
body{margin:0;background:var(--background);color:var(--foreground);font:var(--text-prose)/var(--leading-prose) var(--font);letter-spacing:-.01em;-webkit-font-smoothing:antialiased;word-break:keep-all;overflow-wrap:break-word}
/* Korean lines break between words, never inside one (P2 2026-10-02: 17 to 57 breaks inside a word per page at 390 px, the link row only was kept whole); break-word lets a run too long for the line (an address) still wrap */
.wrap{max-width:640px;margin:0 auto;padding:44px 20px 80px}
:focus-visible{outline:2px solid var(--ring);outline-offset:2px}
a{color:inherit}
/* the brand line, as the main page's header: the dot, the brand name, mostwatched — one link home. Its sizes are the main page's h1 (28 px,
   24 px under 421 px; the small word 15 px; the dot 10 px) and its line box is the main header's 44 px brand row, so the brand does not
   move or change size between a ranking page and these pages (P1 2026-10-02: it sat 6 px higher here, the small word 13 px) */
.brand{display:inline-flex;align-items:baseline;gap:var(--space-2);margin:0 0 var(--space-3);font-size:var(--text-brand);font-weight:800;letter-spacing:-.03em;line-height:var(--hit);text-decoration:none}
.brand i{width:10px;height:10px;border-radius:var(--radius-full);background:var(--accent);align-self:center}
.brand small{font-size:var(--text-base);font-weight:600;color:var(--muted-foreground);letter-spacing:-.01em}
@media (max-width:420px){.brand{font-size:var(--text-xl)}}
/* the link row under it: a word never breaks in the middle (390 px: 「개인정보처 / 리방침」) */
.links{margin:0 0 var(--space-5);font-size:var(--text-sm);color:var(--muted-foreground);word-break:keep-all}
h1{font-size:var(--text-xl);letter-spacing:-.03em;line-height:var(--leading-tight);margin:0 0 var(--space-1)}
h2{font-size:var(--text-lg);line-height:var(--leading-tight);margin:var(--space-5) 0 var(--space-1)}
small,li span{color:var(--muted-foreground)}
#en{border-top:1px solid var(--border);margin-top:calc(2 * var(--space-5));padding-top:var(--space-5)}
table{border-collapse:collapse;width:100%;font-size:var(--text-base)}
td{padding:var(--space-2) var(--space-1);border-bottom:1px solid var(--border);vertical-align:top}
td:first-child{white-space:nowrap;font-weight:600;padding-left:0;padding-right:var(--space-3)} /* the first column on the text's left edge (it stood 4 px in) and clear of the second (8 px between them before; P2 2026-10-02) */