/* 사기예방백서 · 글꼴은 기기 글꼴만(외부 요청 0 · 응급 쪽을 빨리 띄우기 위함). 글자는 크게, 누를 곳은 넓게. */
:root{
  color-scheme:light dark;
  --bg:#FBFAF7;--surface:#FFFFFF;--ink:#1B2430;--muted:#55606E;--line:#E3E0D8;
  --accent:#0B5A8A;--accent-bg:#EAF3F9;--danger:#B3261E;--danger-bg:#FDF0EE;--ok:#176B4D;--ok-bg:#E8F4EE;--warn-bg:#FFF6DF;
  --radius:12px;
  --font:-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic","Noto Sans KR",system-ui,sans-serif;
}
@media (prefers-color-scheme:dark){:root{
  --bg:#12151A;--surface:#1B2027;--ink:#EDEFF2;--muted:#A7B0BC;--line:#2E3540;
  --accent:#7FC1F0;--accent-bg:#17283A;--danger:#FF8A80;--danger-bg:#2B1A19;--ok:#6FD3A8;--ok-bg:#15291F;--warn-bg:#2C2513;
}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:12px}
body{margin:0;background:var(--bg);color:var(--ink);font:400 18px/1.75 var(--font);word-break:keep-all;overflow-wrap:anywhere}
a{color:var(--accent);text-underline-offset:3px}
h1,h2,h3{line-height:1.35;margin:0}
.wrap{max-width:760px;margin:0 auto;padding:0 16px}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;background:var(--surface);padding:8px 12px;z-index:10}

/* 머리 · 바닥 */
.masthead{background:var(--surface);border-bottom:1px solid var(--line)}
.bar{max-width:760px;margin:0 auto;padding:10px 16px;display:flex;flex-wrap:wrap;align-items:center;gap:4px 18px}
.brand{font-weight:800;font-size:20px;color:var(--ink);text-decoration:none;letter-spacing:-.01em}
.nav{display:flex;flex-wrap:wrap;gap:0 14px;font-size:16px}
.nav a{color:var(--muted);text-decoration:none;padding:4px 0}
.nav a:hover{color:var(--ink)}
.nav a[aria-current]{color:var(--ink);font-weight:700}
.nav a:first-child{color:var(--danger);font-weight:700}
.foot{margin-top:56px;border-top:1px solid var(--line);padding:22px 0 36px;font-size:15px;color:var(--muted);line-height:1.8}
.foot a{color:var(--muted)}
.foot p{margin:0 0 8px}
.biz summary{cursor:pointer}
.biz-dl{margin:8px 0;display:grid;gap:2px}
.biz-dl div{display:grid;grid-template-columns:7.5em 1fr;gap:10px}
.biz-dl dt{color:var(--muted)}.biz-dl dd{margin:0}
.note{color:var(--muted);font-size:15px;line-height:1.65}
.empty{color:var(--muted)}
.more{font-weight:700;text-decoration:none}

/* 버튼 */
.btn{display:inline-block;padding:10px 16px;min-height:44px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink);font:600 16px/1.4 var(--font);text-decoration:none;cursor:pointer}
.btn:hover{border-color:var(--muted)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}
@media (prefers-color-scheme:dark){.btn.primary{color:#0B1620}}
a.tel{display:inline-block;padding:0 8px;border-radius:7px;background:var(--danger-bg);color:var(--danger);text-decoration:none;white-space:nowrap}
a.tel strong{font-weight:800}

/* 홈 */
.hero{padding:30px 0 14px}
.hero h1{font-size:30px;font-weight:800;letter-spacing:-.02em}
.hero .sub{margin:10px 0 0;color:var(--muted)}
.door{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:18px;margin:12px 0}
.door h2{font-size:22px;font-weight:800}
.door p{margin:6px 0 10px}
.door-now{border:2px solid var(--danger);background:var(--danger-bg)}
.door-now h2{color:var(--danger)}
.door-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.door-now .door-list a{display:block;padding:12px 14px;background:var(--surface);border:1px solid var(--line);border-radius:10px;color:var(--ink);font-weight:700;text-decoration:none}
.door-now .door-list a:hover{border-color:var(--danger)}
.door-list.plain a{display:block;padding:6px 0;text-decoration:none;border-bottom:1px solid var(--line);color:var(--ink)}
.hot{margin:12px 0 0!important;display:flex;flex-wrap:wrap;gap:8px}
.hot a.tel{background:var(--surface);border:1px solid var(--danger);padding:8px 12px}
.doors{display:grid;gap:12px;grid-template-columns:1fr 1fr}
.doors .door{margin:0}
@media (max-width:640px){.doors{grid-template-columns:1fr}}
.promise,.latest{margin-top:34px}
.promise h2,.latest h2{font-size:20px;font-weight:800;margin-bottom:8px}
.promise ul{margin:0 0 8px;padding-left:1.2em}

/* 목록 쪽 */
.sec-list{padding-top:26px}
.pt{font-size:28px;font-weight:800}
.lede{margin:8px 0 0;color:var(--muted)}
.cards{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:10px}
.cards a{display:block;padding:14px 16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);color:var(--ink);text-decoration:none}
.cards a:hover{border-color:var(--muted)}
.cards b{display:block;font-size:19px;line-height:1.45}
.cards span{display:block;margin-top:2px;color:var(--muted);font-size:16px;line-height:1.6}

/* 글 */
.art-head{padding-top:20px}
.art-head h1{font-size:28px;font-weight:800;letter-spacing:-.015em}
.kicker{margin:0 0 4px;font-size:15px;font-weight:700;color:var(--accent)}
.kicker a{text-decoration:none;color:inherit}
.art-head.now .kicker{color:var(--danger)}
.art-head .lede{font-size:17px;line-height:1.6}
.meta{margin:8px 0 0;display:flex;flex-wrap:wrap;gap:2px 14px;font-size:15px;color:var(--muted)}
.body{margin-top:16px}
.body h2{font-size:22px;font-weight:800;margin:30px 0 10px}
.body section:first-child h2{margin-top:14px}
.body h3{font-size:19px;font-weight:700;margin:22px 0 6px}
.body p{margin:0 0 14px}
.body ul,.body ol{margin:0 0 14px;padding-left:1.35em}
.body li{margin:6px 0}
.body li ul{margin:4px 0 0}
.body hr{border:0;border-top:1px solid var(--line);margin:24px 0}
.body blockquote{margin:0 0 14px;padding:10px 14px;border-left:3px solid var(--line);background:var(--surface);color:var(--muted)}
.body blockquote p{margin:0}
.body code{font-size:.92em;background:var(--accent-bg);padding:0 4px;border-radius:4px}
.tbl{overflow-x:auto;margin:0 0 16px}
table{border-collapse:collapse;width:100%;font-size:16px;line-height:1.55;min-width:460px}
th,td{border:1px solid var(--line);padding:8px 10px;text-align:left;vertical-align:top}
th{background:var(--surface);font-weight:700}
sup.fn{font-size:.72em;line-height:0;margin-left:1px}
sup.fn a{text-decoration:none;font-weight:700;padding:0 2px}

/* 응급 쪽 절 */
.sec-now{background:var(--danger-bg);border:2px solid var(--danger);border-radius:var(--radius);padding:4px 16px 8px;margin:0 -2px}
.sec-now h2{color:var(--danger);margin:12px 0 8px!important}
.sec-now ol{list-style:none;padding:0;counter-reset:s}
.sec-now ol>li{counter-increment:s;position:relative;padding-left:40px;margin:12px 0;font-size:19px;line-height:1.65}
.sec-now ol>li::before{content:counter(s);position:absolute;left:0;top:1px;width:29px;height:29px;border-radius:50%;background:var(--danger);color:#fff;font:800 16px/29px var(--font);text-align:center}
@media (prefers-color-scheme:dark){.sec-now ol>li::before{color:#21100F}}
.sec-now a.tel{background:var(--surface);border:1px solid var(--danger)}
.sec-dont h2{color:var(--danger)}
.sec-fork{background:var(--accent-bg);border-radius:var(--radius);padding:2px 16px 6px;margin-top:24px}
.sec-fork h2{margin-top:12px!important}

/* 보내기 카드 */
.share{margin-top:30px;background:var(--ok-bg);border-radius:var(--radius);padding:16px}
.share h2{font-size:21px;font-weight:800;margin-bottom:8px;color:var(--ok)}
.share-in.has-thumb{display:grid;grid-template-columns:150px 1fr;gap:14px;align-items:start}
.share-thumb img{display:block;width:100%;height:auto;border-radius:8px;border:1px solid var(--line)}
.share-main{min-width:0}
.share-url{margin:0 0 6px;font-size:16px}
.share-text{margin:0 0 10px;padding:10px 12px;background:var(--surface);border:1px solid var(--line);border-radius:8px;font:400 15px/1.6 var(--font);white-space:pre-wrap;word-break:keep-all;overflow-wrap:anywhere}
.share-btns{display:flex;flex-wrap:wrap;gap:8px}
.share .note{margin:6px 0 0}
.share .note:empty{display:none}
@media (max-width:560px){.share-in.has-thumb{grid-template-columns:1fr}.share-thumb{max-width:210px}}

/* 근거 · 고친 내용 */
.sources,.fixes{margin-top:30px}
.sources h2,.fixes h2{font-size:20px;font-weight:800;margin-bottom:6px}
.sources ol{margin:10px 0 0;padding-left:1.4em;font-size:16px;line-height:1.6}
.sources li{margin:8px 0}
.sources li:target{background:var(--warn-bg);border-radius:6px}
.tier{display:inline-block;font-size:13px;font-weight:700;padding:0 6px;border-radius:5px;background:var(--line);color:var(--muted)}
.tier.g1{background:var(--ok-bg);color:var(--ok)}
.src-date{color:var(--muted);font-size:14px}
.back{text-decoration:none}
.fixes ul{padding-left:1.2em;font-size:16px}

/* 길 찾기: :target만으로 움직임 · :has가 없는 브라우저는 전체가 펼쳐 보임 */
.flow{margin-top:18px}
.step{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px;margin-bottom:12px;scroll-margin-top:12px}
.step h2{font-size:22px;font-weight:800;margin-bottom:10px}
@supports selector(:has(*)){
  .step{display:none}
  .step:target,.flow:not(:has(.step:target)) .step:first-child{display:block}
}
.choices,.goes{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.choice{display:block;padding:12px 14px;min-height:48px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink);font-weight:600;text-decoration:none}
.choice:hover{border-color:var(--accent)}
.result{border:2px solid var(--accent)}
.result p{margin:0 0 12px}
.go{display:block;padding:12px 14px;border-radius:10px;background:var(--accent);color:#fff;font-weight:700;text-decoration:none}
@media (prefers-color-scheme:dark){.go{color:#0B1620}}
.restart{margin:12px 0 0!important;font-size:16px}
.tool-note{font-size:16px;color:var(--muted)}
.tool-note h2{font-size:18px}

/* 기록 쪽 */
.log{list-style:none;margin:0;padding:0}
.log li{padding:14px 0;border-bottom:1px solid var(--line)}
.log time{display:block;font-size:15px;color:var(--muted)}
.log h2{font-size:20px;margin:2px 0 8px}
.log p{margin:4px 0}
.log.compact li{padding:8px 0}
.ba{margin:0;display:grid;gap:4px}
.ba div{display:grid;grid-template-columns:2.2em 1fr;gap:6px}
.ba dt{font-weight:700;color:var(--muted)}.ba dd{margin:0}
.doc .body{font-size:17px}

@media (max-width:480px){
  body{font-size:17.5px}
  .hero h1,.pt,.art-head h1{font-size:25px}
  .sec-now{margin:0 -6px;padding:4px 12px 8px}
  .sec-now ol>li{font-size:18px;padding-left:36px}
}
@media print{.masthead,.foot,.share{display:none}body{background:#fff;color:#000}}
