/* 휴대폰 틀이 기본, 컴퓨터는 같은 화면을 넓혀 옆 칸을 더 보여 준다. 짧은 말(.nw)은 줄을 나누지 않는다. */
:root{
  --bg:#f7f9ff; --surface:#ffffff; --soft:#f2f6ff; --line:#d8e2f6; --line2:#e8eefb;
  --fg:#172033; --muted:#68758d; --accent:#5e86e8; --accent-ink:#3f5fb8; --accent-soft:#e6ebff; --ink:#1b2333;
  --p1:#bcd7ff; --p2:#bfe8d4; --p3:#d9c8f5; --p4:#ffd6b8; --p5:#f7c6d4; --p6:#f1e4a0; --p7:#b9e6ee; --p8:#d5e4c2;
  --g1:#f4978e; --g2:#f2bd5c; --g3:#86cf86; --g4:#6fc3d4; --g5:#8aa8f0; --g6:#c39bea;
  --warn:#b45309; --warn-bg:#fff4e5; --test:#7c3aed; --test-bg:#f3ecff; --shade:rgba(17,21,31,.38); --on-accent:#ffffff;
  --font:"Noto Sans KR","Malgun Gothic","Apple SD Gothic Neo",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Consolas,monospace;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#11151f; --surface:#171c28; --soft:#1c2333; --line:#2a3550; --line2:#222b40;
  --fg:#e6ebf5; --muted:#9aa6bf; --accent:#8fa7f4; --accent-ink:#b4c4fa; --accent-soft:#232c45;
  --warn:#f5b453; --warn-bg:#2c2213; --test:#b79cff; --test-bg:#271f3d; --shade:rgba(0,0,0,.55); --on-accent:#11151f; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#11151f; --surface:#171c28; --soft:#1c2333; --line:#2a3550; --line2:#222b40;
  --fg:#e6ebf5; --muted:#9aa6bf; --accent:#8fa7f4; --accent-ink:#b4c4fa; --accent-soft:#232c45;
  --warn:#f5b453; --warn-bg:#2c2213; --test:#b79cff; --test-bg:#271f3d; --shade:rgba(0,0,0,.55); --on-accent:#11151f; color-scheme:dark}