/* 전문가답다 v5 서버 화면 부품(2026-10-24 X-EB5). b.css(B안 「밑줄 한 줄」 사본) 위에 얹는다 — 새 디자인 언어를 만들지 않고 B 토큰·괘선·형광 막대·DM Mono 라벨만 조합한다.
   B 에 없던 것: 진짜 검색 입력칸 · 서랍 메뉴 · 샘플 띠 · 폼(밑줄 입력) · 상태 4가지 · 배지 3단 · 답 카드 보조 줄 · 네임카드 · 다음 걸음 · 댓글 · 목록 줄 · 쪽 넘김 · 표 · 옆 상자 · 탭 · 대시보드 · 운영자 표 · 404.
   모바일 글자: 본문·답 16px 안팎 · 표 14px↑ · 버튼·입력 16px. */

/* ---------- 머리글: 진짜 검색칸(B .srch 모양 그대로) ---------- */
.srch input{flex:1;min-width:0;height:100%;border:0;background:none;font:inherit;font-size:15px;color:var(--ink)}
.srch input::placeholder{color:var(--ink2)}
.srch input:focus{outline:0}.srch:focus-within{box-shadow:inset 0 -6px 0 var(--marker)}
.srch button{display:grid;place-items:center;width:28px;height:28px}
.hd .login{white-space:nowrap}
.burger{flex:none}
.drawer{position:fixed;z-index:99;inset:66px 0 0 0;background:var(--sheet);padding:24px var(--gut) 40px;display:none;flex-direction:column;gap:2px;overflow:auto;border-top:2px solid var(--ink)}
.drawer.open{display:flex}
.drawer>a:not(.btn){font:800 22px/1.3 var(--hd);padding:14px 0;border-bottom:1px solid var(--rule)}
.drawer .btn{margin-top:20px;justify-content:center}
.drw-s{display:flex;gap:8px;margin-bottom:12px}.drw-s input{flex:1;min-width:0;height:48px;border:1.5px solid var(--ink);padding:0 12px;font:inherit;font-size:16px;background:#fff}
.drw-s button{min-height:48px;padding:0 16px;background:var(--ink);color:#fff;font-weight:700;font-size:16px}
.smpbar{position:relative;z-index:5;margin-top:66px;padding:8px var(--gut);background:var(--grey);font:500 13px/1.5 var(--mono);color:var(--ink2)}
.smpbar b{display:inline-block;margin-right:10px;padding:0 6px;background:var(--marker);color:var(--ink);font-weight:500}
.sub .smpbar+main{padding-top:0}
.home .smpbar{position:absolute;left:0;right:0;top:0;margin-top:66px;z-index:6}
.home .hero{padding-top:100px}
.sr{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}

/* ---------- 홈 보조 ---------- */
.pf a{display:block}.pf a:hover span{text-decoration:underline;text-underline-offset:4px}
.wait-q{margin-top:40px}.wait-q .eye{margin-bottom:10px}
.tk .by .smp,.ep .smp{vertical-align:1px}

/* ---------- 쪽 공통 ---------- */
.page{padding-bottom:90px}
.q-top .asker a{text-decoration:underline;text-underline-offset:3px}
.lede-p{font-size:18px;color:var(--ink2);max-width:760px;margin-top:14px}
.sec{padding:80px 0}.sec.grey{background:var(--grey)}
.sec-h.solo{grid-template-columns:1fr}
.muted{color:var(--ink2)}
.row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.go{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.q-main>section,.q-main>div{margin-bottom:56px}
.q-side .side-in+.side-in{margin-top:18px}
.side-in .box-h,.side-in h2{font:800 21px/1.35 var(--hd);margin-bottom:12px}
.side-in>p{font-size:15px;color:var(--ink2);margin-bottom:10px}
.side-in ul.lk-list li{padding:12px 0;border-bottom:1px solid var(--rule)}
.side-in ul.lk-list li a{display:block;font-weight:700;line-height:1.45}
.side-in ul.lk-list small{display:block;margin-top:2px;font:500 12px var(--mono);color:var(--ink2)}
.side-in .btn{width:100%;justify-content:center;margin-top:14px}
.pg-band{height:clamp(150px,22vh,240px);overflow:hidden;margin-bottom:56px}.pg-band img{width:100%;height:100%;object-fit:cover;object-position:center 55%;filter:grayscale(1) contrast(1.05)}

/* ---------- 푸터 칸(서버 화면: 묶음 3칸) ---------- */
.ft-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-bottom:8px}
.ft-cols h2{font:500 13px var(--mono);letter-spacing:.02em;color:var(--ink2);margin-bottom:10px}
.ft-cols ul{flex-direction:column;gap:8px}
.ft-bot{flex-wrap:wrap}
@media (max-width:760px){.ft-cols{grid-template-columns:1fr 1fr}}

/* ---------- 목록 화면 보조(고민톡·주제·전문가·검색) ---------- */
.fm.fm-row{display:flex;flex-wrap:wrap;gap:12px 18px;align-items:flex-end}
.fm-row .field{flex:0 1 200px;min-width:0}.fm-row .field.grow{flex:1 1 260px}
.fm-row .btn{min-height:48px}
.qlist.two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:56px}
.list-refresh{margin-top:18px}
.notice a{text-decoration:underline;font-weight:700}
.sec-gap{margin-top:70px}
.sec-gap>h2,.q-main h2.sm{font-size:clamp(24px,2.2vw,32px);margin-bottom:20px}

/* ---------- 고민 상세(B q.html) 보조 ---------- */
.q-grid>*{min-width:0}
.q-tags{margin-top:16px}
.ask .ck,.fm .ck{display:flex}.ck>span{display:block}
.sit .acts{margin-top:18px}
.sit p{font-size:17px}
.ans-list>h2{margin-bottom:8px}
.write-ans{margin-top:26px}
.write-ans summary{list-style:none;cursor:pointer;width:max-content;max-width:100%}
.write-ans summary::-webkit-details-marker{display:none}
.write-ans .fm{margin-top:18px;padding:22px;border:2px solid var(--ink);background:#fff}
.cmt-f{margin-top:18px}.cmt-login{margin-top:14px;font-size:16px}.cmt-login a{text-decoration:underline;font-weight:700;color:var(--ink)}
.rel li a{display:block}
.rel .ql{display:block;font:700 16px/1.7 var(--qt)}
.relc .cc{background:#fff;border:1px solid var(--rule)}.relc .cc+.cc{margin-top:14px}
.relc .cc h3{font-size:19px}
.again{margin-top:-20px}
.sex li>span{min-width:0}.sex li a b{display:inline}.sex li a:hover b{text-decoration:underline;text-underline-offset:3px}
.sex em{display:block}
.side-in .ask{margin-top:22px}
.side-in .ask textarea{min-height:110px}
.side-more{background:var(--grey)!important;border-width:0!important}

/* ---------- 버튼 보조 ---------- */
.btn{justify-content:center}
.btn[aria-busy="true"]{opacity:.6;pointer-events:none}
.act{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 14px;border:1.5px solid var(--rule);font-size:15px;font-weight:700;background:none}
.act:hover{border-color:var(--ink)}
.act[aria-pressed="true"]{background:var(--marker);border-color:var(--ink)}
.act[aria-busy="true"]{opacity:.5}
.acts .sp{flex:1}
.help b,.act .n{font-family:var(--mono);font-weight:500}

/* ---------- 배지 3단(확인 = 먹 글자 + 막대 / 서류 = 테두리 / 확인 전 = 점선 회색) ---------- */
.badge{display:inline-flex;align-items:center;gap:6px;width:max-content;max-width:100%;font:500 12px/1.4 var(--mono);color:var(--ink);padding:2px 0}
.badge::before{content:"";width:16px;height:7px;flex:none;background:var(--marker);clip-path:polygon(1% 18%,99% 0,100% 82%,0 100%)}
.badge.doc{border:1px solid var(--ink);padding:1px 6px}
.badge.wait{color:var(--ink2);border:1px dashed var(--ink2);padding:1px 6px}.badge.wait::before{background:var(--grey)}

/* ---------- 아바타 ---------- */
.av{display:block;flex:none;width:60px;height:60px;object-fit:cover;background:var(--grey)}
.av-sm{width:40px;height:40px}.av-lg{width:120px;height:120px}
.av-t{display:grid;place-content:center;justify-items:center;gap:0;background:var(--ink);color:#fff;position:relative;overflow:hidden}
.av-t b{font:800 22px/1 var(--hd)}.av-t i{font:500 10px/1.2 var(--mono);font-style:normal;margin-top:3px;background:var(--marker);color:var(--ink);padding:0 3px}
.av-t.wait{background:var(--grey);color:var(--ink2);border:1px dashed var(--ink2)}
.av-sm.av-t b{font-size:15px}.av-sm.av-t i{display:none}
.av-lg.av-t b{font-size:44px}.av-lg.av-t i{font-size:13px}

/* ---------- 답 카드 보조(B .an 위) ---------- */
.an .ans-hd{display:grid;grid-template-columns:60px 1fr auto;gap:14px;align-items:center;margin-bottom:16px}
.an .ans-hd .who{display:flex;flex-direction:column;gap:2px;margin:0;font-weight:400}
.an .ans-hd .who b{font:800 19px var(--hd)}
.an .ans-hd .rl{font-size:14px;color:var(--ink2)}
.an .ans-hd time{font:500 12px var(--mono);color:var(--ink2);align-self:start}
.cred-line{font-size:15px;margin:-4px 0 14px;padding:8px 12px;background:var(--grey)}
.cred-line span{font:500 12px var(--mono);color:var(--ink2);margin-right:10px}
.an.picked{border-top-width:4px}
.picked-tag{font-weight:800}
.acc .picked-tag{font-size:15px}
.rev{margin-top:14px;font:500 13px/1.6 var(--mono);color:var(--ink2)}
.edited{font:500 12px var(--mono);background:var(--grey);color:var(--ink);padding:0 5px;margin-left:4px}
.disclose{margin-top:12px;font-size:15px;padding:10px 12px;border-left:6px solid var(--marker);background:#fff}
.disclose b{font:500 12px var(--mono);margin-right:8px}
.endorse{display:flex;align-items:center;gap:10px}
.estack{display:flex}.estack a+a{margin-left:-8px}.estack .av{border:2px solid var(--sheet)}
.body.prose{font-size:16px;line-height:1.85}
.prose p+p{margin-top:12px}
.tbl{overflow-x:auto;margin:14px 0;-webkit-overflow-scrolling:touch}
.tbl table{width:100%;min-width:420px;border-collapse:collapse;font-size:15px}
.tbl th,.tbl td{border-bottom:1px solid var(--rule);padding:10px 8px;text-align:left;vertical-align:top}
.tbl th{font:500 13px var(--mono);border-bottom:2px solid var(--ink)}
.ans-foot{margin-top:18px}
.edit-f{margin-top:16px;padding:18px;border:2px solid var(--ink);background:#fff}

/* ---------- 네임카드(하이닥 고정 형식 + 실적 줄) ---------- */
.namecard{display:grid;grid-template-columns:60px 1fr auto;gap:14px;align-items:center;margin-top:22px;padding:16px 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.namecard .t{display:flex;flex-direction:column;gap:3px;min-width:0}
.nc-name{font:800 17px var(--hd)}
.namecard .fixed{font-size:14px;color:var(--ink2)}
.namecard .go{margin-top:0}
.namecard .nc-track{font:500 12px var(--mono);color:var(--ink2)}

/* ---------- 다음 걸음(번호 목록, 마지막 칸 = 상담 요청) ---------- */
.nextstep{display:grid;grid-template-columns:repeat(3,1fr);margin-top:16px;border-top:2px solid var(--ink)}
.nextstep .ns-h{grid-column:1/-1;font:500 12px var(--mono);color:var(--ink2);padding:10px 0 4px}
.nextstep a{position:relative;display:block;padding:12px 14px 14px 0;font-size:15px;font-weight:700;line-height:1.45;border-right:1px solid var(--rule);margin-right:14px;isolation:isolate}
.nextstep a:last-child{border-right:0;margin-right:0}
.nextstep i{display:block;font:500 12px var(--mono);font-style:normal;color:var(--ink2);margin-bottom:4px}
.nextstep small{display:block;font:500 12px var(--mono);color:var(--ink2);margin-top:4px}
.nextstep a::before{content:"";position:absolute;inset:0 0 0 -8px;z-index:-1;background:var(--marker);transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease)}
.nextstep a:hover::before,.nextstep .ns-go::before{transform:scaleX(1)}
.nextstep .ns-go::before{opacity:.55}.nextstep .ns-go:hover::before{opacity:1}

/* ---------- 댓글 ---------- */
.cmt{border-top:2px solid var(--ink)}
.cmt li{padding:14px 0;border-bottom:1px solid var(--rule);font-size:16px}
.cmt li b{font-weight:800;margin-right:8px}.cmt li time{font:500 12px var(--mono);color:var(--ink2)}
.cmt li p{margin-top:4px}
.cmt.sub{margin-top:16px;border-top:1px solid var(--rule)}.cmt.sub li{padding-left:16px;border-left:3px solid var(--marker)}
.c-acts{display:flex;gap:6px;margin-top:6px}.c-acts .act{min-height:36px;padding:0 10px;font-size:14px}

/* ---------- 고민 목록 줄(답 수 상자 + B 고민톡 단) ---------- */
.qlist{border-top:2px solid var(--ink)}
.qrow{display:grid;grid-template-columns:76px 1fr;gap:20px;padding:22px 0 24px;border-bottom:1px solid var(--rule)}
.num{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding-top:4px}
.num b{font:800 34px/1 var(--hd);letter-spacing:-.03em}
.num span{font:500 12px var(--mono);color:var(--ink2)}
.num.has b{background:linear-gradient(transparent 55%,var(--marker) 55%,var(--marker) 92%,transparent 92%);padding:0 3px}
.num.wait b{color:var(--ink2)}
.qrow .tl{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center}
.qrow .tl a:hover{color:var(--ink)}
.qrow .bounty{background:var(--ink);color:#fff;padding:0 5px}
.qrow .picked-tag{background:var(--marker);color:var(--ink);padding:0 5px;font-weight:500}
.qrow h3{font:800 21px/1.4 var(--hd);letter-spacing:-.02em;margin:6px 0 8px}
.qrow h3 a:hover{text-decoration:underline;text-underline-offset:4px}
.qrow .ql{font-size:17px}
.qrow .qb{font-size:16px;color:var(--ink2)}
.qrow .by{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:10px;font-size:14px;font-weight:600;color:var(--ink2)}
.qrow .by .pro{color:var(--ink);font-weight:800}
.tks.two{display:grid;grid-template-columns:1fr 1fr;column-gap:56px}

/* ---------- 전문가 줄(B .exl 확장) ---------- */
.xlist{display:grid;grid-template-columns:1fr 1fr;column-gap:56px;border-top:2px solid var(--ink)}
.xcard a{display:grid;grid-template-columns:64px minmax(0,1fr) auto;column-gap:16px;row-gap:4px;align-items:center;padding:18px 0;border-bottom:1px solid var(--rule)}
.xcard .av{grid-row:1/4;width:64px;height:64px}
.xcard .ep b{font:800 19px var(--hd);margin-right:6px}.xcard .ep span{font-size:15px;color:var(--ink2)}
.xcard .et{grid-column:2;font-size:14px;color:var(--ink2)}
.xcard .st{grid-column:2;display:flex;gap:14px;font-size:14px;color:var(--ink2)}.xcard .st b{font:500 14px var(--mono);color:var(--ink)}
.xcard .ea{grid-row:1/4;grid-column:3;font-weight:800;font-size:15px}.xcard .ea .mk{height:8px;margin-top:0}
.xcard a:hover .ea .mk{transform:scaleX(1)}

/* ---------- 폼(B .ask 밑줄 입력칸을 모든 폼으로) ---------- */
.fm{display:grid;gap:16px}
.fm .field{display:grid;gap:6px}
.fm label,.fm .lab{font-size:15px;font-weight:700}
.fm label:not(.ck):not(.radios label){display:grid;gap:6px}
.fm input[type=text],.fm input[type=email],.fm input[type=password],.fm input[type=search],.fm input[type=url],.fm input:not([type]),.fm select{font:inherit;font-size:16px;font-weight:500;height:48px;padding:0 4px;border:0;border-bottom:2px solid var(--ink);border-radius:0;background:linear-gradient(var(--marker),var(--marker)) left bottom/0% 40% no-repeat;transition:background-size .4s var(--ease);color:var(--ink);width:100%}
.fm select{background-color:transparent;appearance:none;-webkit-appearance:none;background-image:linear-gradient(var(--marker),var(--marker)),linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-size:0% 40%,6px 6px,6px 6px;background-position:left bottom,calc(100% - 14px) 50%,calc(100% - 8px) 50%;background-repeat:no-repeat}
.fm input:focus,.fm select:focus{outline:0;background-size:100% 40%}
.fm select:focus{background-size:100% 40%,6px 6px,6px 6px}
.fm textarea{font:inherit;font-size:16px;line-height:1.7;min-height:130px;padding:12px;border:1.5px solid var(--ink);border-radius:0;background:#fff;resize:vertical;width:100%}
.fm textarea.tall{min-height:280px}
.fm textarea:focus{outline:0;box-shadow:inset 0 -6px 0 var(--marker)}
.fm input[type=file]{font-size:15px;padding:10px 0}
.fm .hint{font-size:14px;font-weight:500;color:var(--ink2)}
.fm .ck,.agree{display:flex;align-items:flex-start;gap:10px;font-size:15px;font-weight:500;line-height:1.55}
.fm .ck input,.agree input{width:20px;height:20px;margin-top:2px;flex:none;accent-color:var(--ink)}
.fm .ck a,.agree a{text-decoration:underline}
.radios{display:flex;flex-wrap:wrap;gap:8px}
.radios label{display:inline-flex!important;align-items:center;gap:6px;min-height:44px;padding:0 14px;border:1.5px solid var(--rule);font-size:15px;cursor:pointer}
.radios input{accent-color:var(--ink)}
.radios label:has(input:checked){background:var(--marker);border-color:var(--ink)}
.fm .btn{min-height:54px}
.fm-2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.status{display:none;font-size:15px;font-weight:700;padding:10px 12px;border-left:6px solid var(--ink)}
.status.show{display:block}
.status.load{border-color:var(--rule);color:var(--ink2)}
.status.err{border-color:#c0392b;background:#fff}
.status.dup{border-color:var(--ink2);background:var(--grey)}
.status.ok{border-color:var(--ink);background:var(--marker)}
.done-card{padding:28px 24px;border:2px solid var(--ink);background:#fff}
.done-card h3{font:800 22px/1.35 var(--hd);margin:10px 0 6px}
.done-card .mk{width:60%}
.form-card{max-width:620px;padding:32px clamp(18px,3vw,36px);border:2px solid var(--ink);background:#fff}
.form-card h2{font-size:clamp(24px,2.4vw,32px);margin-bottom:6px}
.form-card .sub-p{font-size:16px;color:var(--ink2);margin-bottom:18px}
.form-card .alt{font-size:15px;color:var(--ink2);margin-top:6px}.form-card .alt a{text-decoration:underline;font-weight:700;color:var(--ink)}
.auth-grid{display:grid;grid-template-columns:minmax(0,620px) minmax(0,1fr);gap:56px;align-items:start;padding-bottom:100px}
.auth-aside{padding-top:10px}
.auth-aside ol{border-top:2px solid var(--ink)}
.auth-aside li{padding:16px 0;border-bottom:1px solid var(--rule)}
.auth-aside li em{font:500 12px var(--mono);font-style:normal;background:var(--marker);padding:0 5px}
.auth-aside li b{display:block;font-size:18px;margin:6px 0 4px}
.auth-aside li p{font-size:15px;color:var(--ink2)}
.notice{padding:14px 16px;border-left:6px solid var(--marker);background:#fff;font-size:16px;margin-bottom:22px}
.notice b{font-weight:800}
.notice.warn{border-color:var(--ink)}

/* ---------- 큰 검색칸(검색·404) ---------- */
.bigsearch{display:flex;gap:10px;max-width:760px;margin-top:20px}
.bigsearch input{flex:1;min-width:0;height:58px;padding:0 16px;border:2px solid var(--ink);border-radius:0;font:inherit;font-size:17px;font-weight:700;background:#fff}
.bigsearch input:focus{outline:0;box-shadow:inset 0 -8px 0 var(--marker)}
.bigsearch .btn{min-height:58px}

/* ---------- 탭·칩 ---------- */
.tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.tabs a{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border:1.5px solid var(--rule);font-size:15px;font-weight:700}
.tabs a[aria-current="page"],.tabs a.cur{background:var(--marker);border-color:var(--ink)}
.tabs a small{font:500 12px var(--mono);margin-left:6px;color:var(--ink2)}
.chips a{display:inline-flex;align-items:center;min-height:40px;padding:0 12px;border:1.5px solid var(--rule);font-size:15px;font-weight:700}
.chips a:hover{border-color:var(--ink)}
.chips a[aria-current="page"]{background:var(--marker);border-color:var(--ink)}
.filters{display:grid;gap:12px;margin-bottom:26px;padding-bottom:20px;border-bottom:1px solid var(--rule)}
.filters .fl{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.filters .fl>span{font:500 12px var(--mono);color:var(--ink2);min-width:56px}

/* ---------- 쪽 넘김 ---------- */
.pager{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:30px;padding-top:16px;border-top:2px solid var(--ink);font:500 14px var(--mono)}
.pager .pg{min-height:44px;display:inline-flex;align-items:center;font-family:var(--hd);font-weight:800;font-size:16px;border-bottom:2px solid var(--ink)}

/* ---------- 주제 색인 판(주제별 화면: 가로 판을 격자로) ---------- */
.tgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:2px solid var(--ink);border-left:1px solid var(--rule)}
.tgrid .pn{flex:none;border-left:0;border-right:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:18px 18px 22px;background:none}
.tgrid .pph{aspect-ratio:3/4;flex:none}
.tgrid .pt h3{font-size:24px}
.tgrid .cnt{display:block;margin-top:6px;font:500 12px var(--mono);color:var(--ink2)}
.t-hub-h{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:56px;align-items:end}
.t-hub-h .pph{aspect-ratio:3/4;max-height:420px;overflow:hidden}.t-hub-h .pph img{width:100%;height:100%;object-fit:cover}
.t-stats{display:grid;grid-template-columns:repeat(3,1fr);margin-top:28px;border-top:2px solid var(--ink)}
.t-stats div{padding:16px 16px 0 0}.t-stats b{display:block;font:800 44px/1 var(--hd);letter-spacing:-.04em}.t-stats span{font-size:15px;color:var(--ink2)}

/* ---------- 칼럼 상세 ---------- */
.col-meta{display:flex;flex-wrap:wrap;gap:6px 16px;font:500 13px var(--mono);color:var(--ink2)}
.col-meta a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.summary{font:800 19px/1.85 var(--qt);margin:0 0 22px;padding:18px 0;border-top:2px solid var(--ink);border-bottom:1px solid var(--rule)}
.col-body{font-size:17px;line-height:1.9}
.col-body h2{font:800 clamp(22px,2vw,28px)/1.35 var(--hd);margin:40px 0 12px}
.col-body h3{font:800 19px/1.4 var(--hd);margin:26px 0 8px}
.col-body ul,.col-body ol{padding-left:22px;margin:10px 0}.col-body ul{list-style:square}.col-body ol{list-style:decimal}
.col-body li{margin:5px 0}
.col-body p+p{margin-top:14px}
.col-body sup a{font:500 11px var(--mono);background:var(--marker);padding:0 3px;margin-left:1px}
.srcpanel{margin-top:40px;border-top:2px solid var(--ink)}
.srcpanel h2{font-size:24px;margin:18px 0 10px}
.srcpanel ol{list-style:none;counter-reset:s}
.srcpanel li{display:grid;grid-template-columns:40px 1fr;gap:10px;padding:10px 0;border-bottom:1px solid var(--rule);font-size:15px}
.srcpanel li em{font:500 13px var(--mono);font-style:normal}
.srcpanel li a{font-weight:700;text-decoration:underline;text-decoration-color:var(--marker);text-decoration-thickness:4px}
.srcpanel li:target{background:var(--marker)}
.faq-l details{border-bottom:1px solid var(--rule)}
.faq-l summary{display:flex;justify-content:space-between;gap:16px;padding:20px 0;cursor:pointer;list-style:none;font:800 19px/1.45 var(--hd)}
.faq-l summary::-webkit-details-marker{display:none}
.faq-l summary::after{content:"+";font:500 24px var(--mono);transition:transform .3s var(--ease)}
.faq-l details[open] summary::after{transform:rotate(45deg)}
.faq-l details p{padding:0 0 20px;font-size:17px;line-height:1.8;max-width:820px}
.byline{display:grid;gap:12px;margin-top:30px;border-top:2px solid var(--ink);padding-top:10px}
.byline .namecard{margin-top:0;border-top:0}
.byline small{font:500 12px var(--mono);color:var(--ink2)}

/* ---------- 프로필 보조 ---------- */
.p-head .p-badge.av-t{display:grid}
.p-acts{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.kv{border-top:2px solid var(--ink)}
.kv li{display:grid;grid-template-columns:140px 1fr;gap:16px;padding:12px 0;border-bottom:1px solid var(--rule);font-size:16px}
.kv li>span:first-child{font:500 13px var(--mono);color:var(--ink2)}
.cards-c{display:grid;grid-template-columns:1fr 1fr;gap:18px}

/* ---------- 랭킹 표 ---------- */
.rk-tbl .rkl a{grid-template-columns:60px 64px minmax(0,1fr) 200px 120px}
.rk-tbl .rkl .av{width:56px;height:56px}
.ladder{border-top:2px solid var(--ink);margin-top:20px}
.ladder li{display:grid;grid-template-columns:120px 1fr;gap:16px;padding:14px 0;border-bottom:1px solid var(--rule);font-size:16px}
.ladder b{font:500 14px var(--mono)}

/* ---------- 대시보드·내 정보 ---------- */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);border-top:2px solid var(--ink);margin-bottom:40px}
.kpi{padding:20px 20px 0 0;border-right:1px solid var(--rule);margin-right:20px}
.kpi:last-child{border-right:0}
.kpi b{display:block;font:800 clamp(36px,3.6vw,56px)/1 var(--hd);letter-spacing:-.04em}
.kpi span{display:block;font-size:15px;font-weight:700;margin-top:10px}
.kpi em{font:500 12px var(--mono);font-style:normal;color:var(--ink2)}
.kpi .mk{width:70%;transform:scaleX(1)}
.samp{font:500 12px var(--mono);background:var(--marker);padding:0 6px;margin-left:6px}
.kpi .samp{display:inline-block;margin-top:0;vertical-align:1px}
.chart{border:1.5px solid var(--ink);background:#fff;padding:16px}
.chart svg{display:block;width:100%;height:auto}
.chart .lg{display:flex;flex-wrap:wrap;gap:6px 16px;font:500 12px var(--mono);color:var(--ink2);margin-top:8px}
.chart .lg i{display:inline-block;width:14px;height:6px;margin-right:6px;vertical-align:middle}
.alist{border-top:2px solid var(--ink)}
.alist li{padding:14px 0;border-bottom:1px solid var(--rule)}
.alist li a{font-weight:800;font-size:17px;line-height:1.45}
.alist small,.alist .m{display:block;font:500 12px var(--mono);color:var(--ink2);margin-top:4px}
.inbox li{display:grid;grid-template-columns:1fr auto;gap:10px 16px;padding:16px 0;border-bottom:1px solid var(--rule)}
.inbox .who{font-weight:800}
.inbox .msg{grid-column:1/-1;font-size:16px;background:#fff;padding:10px 12px;border-left:4px solid var(--marker)}
.inbox .ct{font:500 14px var(--mono)}
.inbox .st-f{display:flex;flex-wrap:wrap;gap:6px}
.inbox .st-f button{min-height:40px;padding:0 12px;border:1.5px solid var(--rule);font-size:14px;font-weight:700}
.inbox .st-f button[aria-pressed="true"]{background:var(--marker);border-color:var(--ink)}
.stag{display:inline-block;font:500 12px var(--mono);padding:0 6px;border:1px solid var(--ink)}
.stag.new{background:var(--marker)}.stag.closed{color:var(--ink2);border-style:dashed}
.syn textarea{width:100%;min-height:150px;font:inherit;font-size:15px;line-height:1.6;padding:12px;border:1.5px solid var(--ink);background:#fff}
.syn h3{font:800 18px var(--hd);margin:20px 0 8px}
.prefs{border-top:2px solid var(--ink)}
.prefs li{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;padding:14px 0;border-bottom:1px solid var(--rule)}
.prefs li b{display:block;font-size:17px}.prefs li small{font-size:14px;color:var(--ink2)}
.prefs .req{font:500 12px var(--mono);color:var(--ink2)}
.switch{position:relative;display:inline-flex;align-items:center;gap:8px;min-height:44px;font-size:15px;font-weight:700;cursor:pointer}
.switch input{width:22px;height:22px;accent-color:var(--ink)}

/* ---------- 운영자 ---------- */
.adm{border-top:2px solid var(--ink)}
.adm>li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 20px;padding:18px 0;border-bottom:1px solid var(--rule)}
.adm .ad-t b{font:800 18px var(--hd)}
.adm .ad-t p{font-size:15px;margin-top:4px}
.adm .ad-t small{display:block;font:500 12px var(--mono);color:var(--ink2);margin-top:4px}
.adm .ad-a{display:flex;flex-wrap:wrap;gap:6px;align-items:flex-start;justify-content:flex-end}
.adm .ad-a .fm{grid-template-columns:1fr;gap:8px;min-width:260px}
.adm .quote{grid-column:1/-1;font-size:15px;padding:10px 12px;background:#fff;border-left:4px solid var(--ink2);max-height:160px;overflow:auto}
.score{font:500 13px var(--mono);background:var(--ink);color:#fff;padding:1px 6px}

/* ---------- 404 ---------- */
.nf{padding:150px var(--gut) 110px}
.nf .eline{margin:0 0 22px;background:linear-gradient(100deg,var(--marker) 30%,var(--grey) 30%,var(--grey) 62%,transparent 62%,transparent 70%,var(--grey) 70%)}
.nf h1{font:900 clamp(34px,5vw,72px)/1.1 var(--hd);letter-spacing:-.04em}
.nf-p{font-size:18px;color:var(--ink2);margin-top:12px}

/* ---------- 정책·도움말 ---------- */
.pol .pdoc p,.pol .pdoc li{font-size:16px;line-height:1.8}
.pol .pdoc ul{list-style:square;padding-left:20px}
.pol h2 small{font:500 12px var(--mono);color:var(--ink2);margin-left:8px}


/* ---------- 화면별 보조(2026-10-24 X-EB5 화면 전부 B안으로) ---------- */
.pt .pn-h{font:800 26px/1.2 var(--hd);letter-spacing:-.03em;margin:6px 0}
.pt .pn-h a:hover,.pt .pr a:hover{text-decoration:underline;text-underline-offset:4px}
.h2-n{font:500 14px var(--mono);color:var(--ink2);margin-left:10px;letter-spacing:0;vertical-align:middle}
.sec-gap.first{margin-top:0}
/* 프로필 */
.pf-name{font:900 clamp(32px,4vw,58px)/1.15 var(--hd);letter-spacing:-.04em}
.pf-role{font-size:16px;color:var(--ink2);margin:8px 0 10px}.pf-role b{color:var(--ink);font-weight:800}
.p-id .badge{margin-bottom:12px}
.p-crumb{padding-top:16px}.p-crumb .crumb{margin-bottom:14px}
.p-id .bio{margin-top:6px}
.p-head .p-badge.av-t{width:200px;height:200px;border:8px solid var(--sheet)}
.side-meta{margin-top:14px;font:500 12px var(--mono);color:var(--ink2)}
.pans .chips{margin-bottom:0;padding-bottom:16px}
.pans .tks.list{border-top:2px solid var(--ink)}
.pans .tks.list .tl{display:block}
/* 고민 올리기·폼 */
.situ-f{border:0;padding:0;margin:0;min-width:0}
.situ-f legend{margin-bottom:6px}
.form-card .tabs{margin-bottom:18px}
.form-card h2+.sub-p{margin-top:6px}
/* 칼럼 */
.cs{font:500 12px var(--mono);color:var(--ink2);margin-top:auto}
.cc.feat{background:#fff;border:1px solid var(--rule);padding:18px;gap:28px}.cc.feat .cph{width:min(46%,560px)}
.cc.feat h3{font:800 clamp(24px,2.4vw,34px)/1.35 var(--hd);margin:8px 0 10px}
.cc.feat .ql{font-size:17px}
.col-groups{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:56px 22px;margin-top:60px}
.col-g h2{font-size:clamp(22px,2vw,28px);margin-bottom:14px;padding-bottom:10px;border-bottom:2px solid var(--ink)}
.col-g .cc{background:#fff;border:1px solid var(--rule)}.col-g .cc+.cc{margin-top:18px}
.art-body .summary .hl{background-size:100% 62%}
.byline h2{font-size:clamp(22px,2vw,28px);margin:10px 0 6px}
/* 랭킹 */
.rk-note{font-size:15px}
.ladder+.ladder{margin-top:18px}
/* 대시보드 */
.chart .bar{fill:var(--ink)}.chart .bar.ai{fill:var(--marker-d)}.chart .ax{stroke:var(--rule);stroke-width:1}
.chart text{font:500 11px var(--mono);fill:var(--ink2)}
.dash .tabs a:last-child{border-color:transparent;text-decoration:underline;text-underline-offset:4px}
.syn-d{border-top:1px solid var(--rule);padding:16px 0}.syn-d summary{cursor:pointer;font:800 18px/1.45 var(--hd)}
.syn-d .notice{margin:14px 0 6px}
.pt-d{font-family:var(--mono);font-weight:500;margin-right:6px}
/* 입점 안내 */
.pro-lede{padding-bottom:40px}.pro-lede .lede-p{margin-top:0}
.cmp th[scope=row]{font:800 15px var(--hd);white-space:nowrap}
.cmp td .hl{font-weight:700}
/* 도움말·정책 */
.help-g{margin-bottom:56px}.help-g h2{font-size:clamp(24px,2.2vw,32px);margin-bottom:16px}
.help-more{margin-top:20px}
.polp .q-top{padding-top:44px}
.pol li>*{min-width:0}
.pol .pdoc>*+*{margin-top:10px}
.pol .pdoc .tbl{margin:0}
@media (max-width:1024px){.col-groups{grid-template-columns:1fr 1fr}}
@media (max-width:760px){
  .cc.feat{flex-direction:column;align-items:stretch}.cc.feat .cph{width:100%}
  .col-groups{grid-template-columns:1fr;gap:40px}
  .p-head .p-badge.av-t{width:140px;height:140px}
  .pt .pn-h{font-size:19px}
  .fm-row .field{flex:1 1 100%}.fm-row .btn{width:100%}
  .cmp th[scope=row]{white-space:normal}
  .polp .q-top{padding-top:28px}
}

/* ---------- 토스트·하단 고정 ---------- */
.toast{position:fixed;z-index:400;left:50%;bottom:88px;transform:translate(-50%,20px);opacity:0;background:var(--ink);color:#fff;padding:12px 18px;font-size:15px;font-weight:700;transition:opacity .3s,transform .3s var(--ease);pointer-events:none;max-width:calc(100vw - 32px)}
.toast.show{opacity:1;transform:translate(-50%,0)}
.mbar{display:none}

/* ---------- 반응형 ---------- */
@media (max-width:1200px){.tgrid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:1024px){
  .xlist,.tks.two,.qlist.two{grid-template-columns:minmax(0,1fr)}
  .auth-grid,.t-hub-h{grid-template-columns:1fr}.t-hub-h .pph{max-height:260px;aspect-ratio:auto}
  .kpis{grid-template-columns:1fr 1fr}.kpi:nth-child(2){border-right:0}.kpi{padding-bottom:16px}
  .rk-tbl .rkl a{grid-template-columns:44px 48px minmax(0,1fr) auto}.rk-tbl .rkl .rb{display:none}
  .srch input{display:none}
}
@media (max-width:760px){
  .smpbar{margin-top:58px;font-size:12px}.home .smpbar{margin-top:58px}
  .drawer{inset:58px 0 0 0}
  .q-top{padding-top:28px}
  .qrow{grid-template-columns:52px 1fr;gap:12px}.num b{font-size:26px}.qrow h3{font-size:19px}
  .nextstep{grid-template-columns:1fr}.nextstep a{border-right:0;margin-right:0;border-bottom:1px solid var(--rule)}
  .an .ans-hd{grid-template-columns:48px 1fr}.an .ans-hd .av{width:48px;height:48px}.an .ans-hd time{grid-column:2}
  .namecard{grid-template-columns:48px 1fr}.namecard .av{width:48px;height:48px}.namecard .go{grid-column:1/-1}.namecard .go .btn{width:100%}
  .tgrid{grid-template-columns:1fr 1fr}.tgrid .pn{padding:12px 12px 16px}.tgrid .pt h3{font-size:19px}.tgrid .tg,.tgrid .pr{font-size:14px}
  .fm-2{grid-template-columns:1fr}
  .kv li{grid-template-columns:1fr;gap:4px}
  .cards-c{grid-template-columns:1fr}
  .adm>li{grid-template-columns:1fr}.adm .ad-a{justify-content:flex-start}.adm .ad-a .fm{min-width:0;width:100%}
  .inbox li{grid-template-columns:1fr}
  .t-stats b{font-size:32px}
  .bigsearch{flex-direction:column}.bigsearch .btn{width:100%}
  .xcard a{grid-template-columns:52px minmax(0,1fr)}.xcard .av{width:52px;height:52px}.xcard .ea{grid-row:auto;grid-column:2}
  .ladder li{grid-template-columns:1fr;gap:4px}
  body.has-mbar{padding-bottom:76px}
  .mbar{position:fixed;z-index:90;left:0;right:0;bottom:0;display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:8px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:rgba(251,251,249,.96);border-top:1px solid var(--rule)}
  .mbar .btn{min-height:50px;padding:0 10px;font-size:16px;background:var(--sheet)}.mbar .btn.main{background:var(--ink)}.mbar .btn .ar{display:none}
  .ft{padding-bottom:110px}
  .tbl table{font-size:14px}
  .rel b{font-size:17px}
}
@media (prefers-reduced-motion:reduce){.nextstep a::before{transition:none}}