/* 글자수·단어수 세기 면(de). 인라인 style 은 CSP style-src 'self' 가 막으므로 모양은 전부 여기 있다. */

/* 결과는 **조작 전에 이미 떠 있어야 한다**(발행 ⑧). 그래서 숫자가 입력칸보다 눈에 먼저 들어오게
   크게 둔다 — 이 면에 온 사람이 알고 싶은 것은 입력칸이 아니라 숫자다. */
.count-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:10px 0}
.count-cell{border:1px solid var(--line);border-radius:8px;padding:10px 12px;background:var(--card)}
.count-cell .num{font-size:26px;line-height:1.2;font-variant-numeric:tabular-nums;color:var(--brand-ink)}
.count-cell .lab{font-size:13px;color:var(--mut)}

#counter-input{width:100%;min-height:7em;font:inherit;padding:10px;border:1px solid var(--line);border-radius:8px;background:var(--card);color:inherit}
.counter-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}