:root{--paper:#f6f3ec;--paper2:#fffdf8;--ink:#171614;--mute:#6f6a60;--rule:#d8d2c4;--acc:#c8361d;--serif:"Noto Serif KR",serif;--sans:"Pretendard Variable",Pretendard,-apple-system,"Apple SD Gothic Neo",sans-serif;--mono:ui-monospace,"SFMono-Regular",Menlo,monospace}
*{box-sizing:border-box}html,body{margin:0}body{font-family:var(--sans);background:var(--paper);color:var(--ink);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;letter-spacing:-.01em}
a{color:inherit}.wrap{max-width:520px;margin:0 auto;padding:0 22px 48px;min-height:100vh}
header.top{display:flex;justify-content:space-between;align-items:center;padding:18px 0 14px;border-bottom:1px solid var(--ink);margin-bottom:28px}
header.top a{text-decoration:none}.logo{display:flex;align-items:center;gap:8px;font-family:var(--serif);font-weight:700;font-size:18px}
.logo svg{width:22px;height:22px;color:var(--acc)}header.top nav a{font-size:13px;color:var(--mute);margin-left:14px}
.ico{width:28px;height:28px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.kicker{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--acc)}
h1,h2,.serif{font-family:var(--serif);font-weight:700;letter-spacing:-.03em}h1{font-size:34px;line-height:1.22;margin:10px 0 14px;word-break:keep-all}
h2{font-size:23px;line-height:1.45;margin:10px 0 22px;word-break:keep-all}.sub{color:var(--mute);line-height:1.75;font-size:15px;word-break:keep-all}
.meta{display:flex;gap:0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);margin:22px 0}.meta div{flex:1;padding:12px 0;font-size:12px;color:var(--mute)}.meta b{display:block;font-family:var(--serif);font-size:18px;color:var(--ink)}
.btn{display:block;width:100%;padding:16px;margin:10px 0;border:1px solid var(--ink);border-radius:2px;background:var(--ink);color:var(--paper);font:600 16px var(--sans);cursor:pointer;transition:transform .15s,background .2s}
.btn:active{transform:scale(.99)}.btn.ghost{background:transparent;color:var(--ink)}.btn.kakao{background:#fee500;border-color:#fee500;color:#191600}
.btn.row{display:flex;justify-content:space-between}.btns2{display:grid;grid-template-columns:1fr 1fr;gap:8px}.btns2 .btn{margin:0}
.opt{display:flex;gap:14px;align-items:baseline;width:100%;text-align:left;padding:17px 4px;border:0;border-bottom:1px solid var(--rule);background:transparent;font:16px/1.5 var(--sans);color:var(--ink);cursor:pointer;transition:padding .2s,color .2s}
.opt:first-child{border-top:1px solid var(--rule)}.opt i{font-style:normal;font-family:var(--mono);font-size:12px;color:var(--mute)}.opt:hover,.opt.sel{padding-left:12px;color:var(--acc)}.opt.sel i{color:var(--acc)}
input,select{width:100%;padding:14px 2px;font:18px var(--sans);border:0;border-bottom:1.5px solid var(--ink);background:transparent;border-radius:0;color:var(--ink);outline:none}
.bar{height:2px;background:var(--rule);margin:8px 0 26px}.bar>i{display:block;height:100%;background:var(--acc);transition:width .5s ease}
.stepn{display:flex;justify-content:space-between;font-family:var(--mono);font-size:11px;letter-spacing:.12em;color:var(--mute)}
.react{min-height:24px;margin:18px 0 0;font-family:var(--serif);font-style:italic;color:var(--acc);opacity:0;transform:translateY(4px);transition:.35s}.react.on{opacity:1;transform:none}
.fade{animation:fd .45s ease both}@keyframes fd{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
/* 광고 슬롯: 콘텐츠와 구분 라벨, 버튼과 충분한 간격, 고정 높이(CLS 방지) */
.ad-slot{margin:40px 0;min-height:120px;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);color:#aaa49a;font:11px var(--mono);display:flex;align-items:center;justify-content:center;flex-direction:column;letter-spacing:.08em}
.ad-slot::before{content:"ADVERTISEMENT · 광고";font-size:10px;margin-bottom:6px}
.log{list-style:none;padding:0;margin:20px 0;font-family:var(--mono);font-size:13px;line-height:2}.log li{color:var(--mute);animation:fd .3s both}.log li.done::before{content:"✓ ";color:var(--acc)}.log li.cur::after{content:"▍";animation:bl 1s steps(1) infinite}
@keyframes bl{50%{opacity:0}}
.card{perspective:1200px;margin:16px 0;cursor:pointer}.card .in{position:relative;min-height:250px;transition:transform .7s cubic-bezier(.2,.7,.2,1);transform-style:preserve-3d}
.card.open .in{transform:rotateY(180deg)}.card .f,.card .b{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;padding:20px}
.card .f{background:var(--ink);color:var(--paper);display:flex;flex-direction:column;justify-content:space-between}
.card .f .n{font-family:var(--serif);font-size:44px;font-weight:700}.card .f small{font-family:var(--mono);font-size:11px;letter-spacing:.12em;opacity:.7}
.card .b{background:var(--paper2);border:1px solid var(--ink);transform:rotateY(180deg);overflow:auto}
.card .b .t{font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:var(--mute);display:flex;justify-content:space-between;border-bottom:1px solid var(--rule);padding-bottom:8px}
.card .b .big{font-family:var(--serif);font-size:30px;font-weight:700;color:var(--acc);margin:14px 0 8px;line-height:1.25;word-break:keep-all}.card .b .h{font-weight:700;font-size:15px}
.card .b .d{font-size:14px;line-height:1.65;color:#3c3934;margin-top:6px;word-break:keep-all}.src{font-size:11px;color:var(--mute);margin-top:12px;line-height:1.5;border-top:1px dotted var(--rule);padding-top:8px}
.report{background:var(--paper2);border:1px solid var(--ink);padding:24px 22px;position:relative}
.report .hd{display:flex;justify-content:space-between;font:11px var(--mono);letter-spacing:.1em;color:var(--mute);border-bottom:2px solid var(--ink);padding-bottom:10px}
.report .ico{width:40px;height:40px;color:var(--acc);margin:22px 0 4px}.report h1{font-size:30px;margin:6px 0 10px}
.report ol{padding-left:20px;margin:18px 0 0;font-size:14px;line-height:1.9}.report .fn{font-size:11px;color:var(--mute);margin-top:16px;line-height:1.6}
.stamp{position:absolute;right:18px;top:48px;border:2px solid var(--acc);color:var(--acc);font:700 11px var(--mono);padding:4px 8px;transform:rotate(8deg);letter-spacing:.1em;opacity:.85}
.grid{display:grid;grid-template-columns:1fr;gap:0}.tile{display:grid;grid-template-columns:44px 1fr;gap:14px;padding:18px 2px;border-bottom:1px solid var(--rule);text-decoration:none;transition:background .2s}
.grid .tile:first-child{border-top:1px solid var(--ink)}.tile:hover{background:var(--paper2)}.tile .ico{width:30px;height:30px;color:var(--acc);margin-top:2px}
.tile b{display:block;font-family:var(--serif);font-size:17px;margin:2px 0 4px}.tile small{color:var(--mute);font-size:13px;line-height:1.5}.tag{font:10px var(--mono);letter-spacing:.1em;color:var(--mute);text-transform:uppercase}
.banner{border:1px solid var(--acc);color:var(--acc);padding:10px;margin:0 0 18px;text-align:center;font-size:13px}
.hero{padding:6px 0 26px}.hero h1{font-size:38px}footer{margin-top:56px;padding-top:18px;border-top:1px solid var(--ink);font-size:12px;color:var(--mute);line-height:1.9}
.note{font-size:12px;color:var(--mute);line-height:1.6}.prose p{line-height:1.85;color:#3c3934}
.report .kicker,.hero .kicker{letter-spacing:.06em}
.chips{display:flex;gap:6px;overflow-x:auto;padding:4px 0 12px;scrollbar-width:none}.chips::-webkit-scrollbar{display:none}
.chip{flex:none;border:1px solid var(--rule);background:transparent;padding:8px 14px;border-radius:999px;font:13px var(--sans);color:var(--ink);cursor:pointer}.chip.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.search{display:flex;gap:8px;align-items:center;margin:4px 0 10px}.search input{font-size:16px;padding:10px 2px}.search .btn{width:auto;flex:none;margin:0;padding:11px 14px;font-size:14px}
.prog{margin:16px 0 22px}.prog a{display:flex;justify-content:space-between;text-decoration:none;font-size:13px;color:var(--mute)}.prog b{color:var(--ink);font-family:var(--serif)}.prog .bar{margin:8px 0 0}
.bd{font-style:normal;color:var(--acc);font-weight:700}.bd.nw{color:#1d6fc8}.bd.ok{color:#2f7d4f}
.next{display:block;text-decoration:none;border:1px solid var(--ink);background:var(--ink);color:var(--paper);padding:22px;margin:28px 0 10px}.next .kicker{color:#f0a493}.next .ico{display:block;color:#f0a493;margin:14px 0 6px}
.next b{display:block;font-family:var(--serif);font-size:22px;margin-bottom:4px}.next small{opacity:.75;font-size:13px}.next .go{display:block;margin-top:16px;font-weight:600}
.vs{margin:28px 0}.vs2{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--ink)}.vs2>div{padding:16px;background:var(--paper2)}.vs2>div.me{background:var(--ink);color:var(--paper)}
.vs2 b{display:block;font-family:var(--serif);font-size:18px;margin:8px 0;line-height:1.35;word-break:keep-all}.vs2 small{font-size:12px;line-height:1.6;opacity:.8}.vs2 .me .tag{color:#f0a493}
.badges{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:10px 0}.badge{border:1px dashed var(--rule);padding:12px 8px;text-align:center;color:var(--mute)}.badge b{display:block;font-family:var(--serif);font-size:14px}.badge.got{border:1px solid var(--acc);color:var(--acc)}
.tb{width:100%;border-collapse:collapse;font-size:13px;margin:8px 0}.tb th,.tb td{border-bottom:1px solid var(--rule);padding:8px 4px;text-align:left}.tb th{font:11px var(--mono);color:var(--mute)}
.hb{display:inline-block;height:6px;background:var(--acc);margin-right:6px;vertical-align:middle}.dt{border-bottom:1px solid var(--rule);padding:12px 0}.dt summary{cursor:pointer;font-size:14px}