/* ═══════════════════════════════════════════════════════════════════
   community.css — 탕비실 전용 스타일
   · 색은 css/theme.css 토큰만 쓴다(새 색을 하드코딩하지 않는다)
   · 클래스 이름은 1B-2(관리 화면)·p.php 도 같이 쓴다 — 이름을 바꾸지 말 것
   · 폭 360·390·1280 을 같은 규칙으로 본다(도구 페이지와 같은 방식)
   ═══════════════════════════════════════════════════════════════════ */

/* .tb-* 에 display 를 주면 브라우저 기본 [hidden] 이 밀린다 → 한 줄로 되돌린다 */
[hidden]{display:none!important;}

/* ═══ 탕비실 전용 토큰(T1 부품 한 벌) ═════════════════════════════════════
   ★theme.css 는 사이트 67곳이 불러 손대지 않는다 — 탕비실에서만 쓰는 토큰은 여기에 둔다.
   대비(직접 계산, WCAG 상대 휘도):
   · --field-line  입력칸 테두리(3:1 이상이어야 칸의 경계가 보인다 — 1.4.11)
       라이트 #A8842E : 흰 칸(#FFF) 3.50 · 페이퍼(#FAF8F2) 3.29 · 보조 표면(#F3F0E8) 3.07
       다크   #66746A : 칸(#0F1512) 3.76 · 바탕(#0A0E0C) 3.95 · 보조 표면(#16271D) 3.18
       (검수 보고서의 다크 값 #5E6B61 은 칸 위 3.30 이지만 비회원 상자 바탕(보조 표면) 위 2.80 이라 한 단계 밝혔다)
   · --focus-ring  포커스 링 2px — 라이트 딥그린(페이퍼 위 11.66) · 다크 골드(바탕 위 8.50)
       (예전 금색 링은 라이트 바탕 위 2.15 라 안 보였다 — A11Y-4)
   · --on-err      빨강(위험) 버튼 글자 — 라이트 흰 글자/#B0402F 5.80 · 다크 #0A0E0C/#E2887A 7.43
   · --tb-sunk     가려진·지워진 자리 글자 — 투명도(.62) 대신 색으로 가라앉힌다(A11Y-9)
       라이트 #6F6C62 : 페이퍼 4.95 · 보조 표면 4.61 · 흰 바탕 5.25 / 다크 = --muted : 바탕 6.14 · 보조 표면 4.94
   · --tb-read     읽은 글 제목(T-009) — 투명도 대신 색으로 한 단계 가라앉힌다(A11Y-9) · 굵기도 600→500
       라이트 #646A63 : 흰 바탕 5.55 · 페이퍼 5.23 · 보조 표면 4.87 · 마우스 올림 바탕 5.00 / 다크 #9CA49A : 칸 7.21 · 바탕 7.58 · 보조 표면 6.10 (둘 다 4.5 이상)
   · --btn-line    보조(외곽선) 버튼 테두리 — 라이트·다크 모두 입력칸 테두리(--field-line)와 같은 값(계획 결정 D1)
   ★색 글자(#…·rgb)는 이 두 토큰 칸 안에만 둔다(§3-7) — 아래 규칙은 var(--…)만 쓴다(--unit 이 잰다). */
:root,
:root[data-theme="light"]{
  --field-line:#A8842E;
  --focus-ring:var(--green);
  --on-err:#FFFFFF;
  --tb-sunk:#6F6C62;
  --tb-read:#646A63;
  --btn-line:var(--field-line);   /* 계획 결정 D1 — 시안 값 rgba(.55)는 흰 장부 위 1.89:1 이라 3:1(§3-7·§13)을 못 넘는다 */
  --tb-tab-bar:var(--green);      /* 켜진 말머리 탭 밑줄(결함 5) — 라이트 딥그린 */
  --tb-bar-bg:rgba(250,248,242,.92);                          /* 윗줄·하단 줄 바탕 */
  --tb-press:color-mix(in srgb,var(--gold) 9%,transparent);   /* 누를 때 */
  --tb-cup:#A8853E;                                           /* 컵·끝 카드·규칙 줄 아이콘 */
  --tb-vb-ring:transparent;
  --tb-primary-line:var(--green);                             /* 주 버튼 테두리 */
  --tb-quiet-line:color-mix(in srgb,#44423B 30%,transparent); /* 비회원 배지·잠긴 말머리 */
  --tb-quiet-bg:color-mix(in srgb,#44423B 11%,transparent);
  --tb-tag-bg:#EEEAE0; --tb-tag-ink:#33403A;                  /* 말머리 칩 기본(자유·정보·출근·청약) */
  --tb-tag-qna-bg:color-mix(in srgb,var(--green) 10%,var(--surface)); --tb-tag-qna-ink:var(--green-text);
  --tb-tag-compare-ink:#6B5418; --tb-tag-compare-line:rgba(168,132,46,.60);   /* 바탕 없음 + 외곽선 = 고지 뜻 */
  --tb-tag-notice-line:color-mix(in srgb,var(--green) 22%,transparent);      /* 공지 칩·운영팀 배지 테두리 */
  --tb-mask:#000;                                             /* 탭 줄 오른쪽 흐림(마스크 — 투명도만 본다) */
  --tb-hover:color-mix(in srgb,var(--green) 6%,var(--surface));   /* 마우스 올림 바탕(T-007 · 마우스 기기만) */
}
:root[data-theme="dark"]{
  --field-line:#66746A;
  --focus-ring:var(--gold);
  --on-err:#0A0E0C;
  --tb-sunk:var(--muted);
  --tb-read:#9CA49A;
  --btn-line:var(--field-line);
  --tb-tab-bar:var(--gold);       /* 다크는 골드 — 딥그린 밑줄은 바탕에 묻힌다(VIS-7) */
  --tb-bar-bg:rgba(10,14,12,.92);
  --tb-press:color-mix(in srgb,var(--gold) 9%,transparent);
  --tb-cup:var(--gold);
  --tb-vb-ring:#3F7358;
  --tb-primary-line:#3F7358;      /* 다크에서도 주 버튼 윤곽이 보이게 */
  --tb-quiet-line:#3A463F;
  --tb-quiet-bg:color-mix(in srgb,#8b9389 17%,transparent);
  --tb-tag-bg:#1B2621; --tb-tag-ink:#CFD5CC;
  --tb-tag-qna-bg:color-mix(in srgb,var(--green-text) 16%,var(--surface)); --tb-tag-qna-ink:#8FD3AE;
  --tb-tag-compare-ink:#D9C27A; --tb-tag-compare-line:#6F6337;
  --tb-tag-notice-line:#2C4A3A;
  --tb-mask:#000;
  --tb-hover:color-mix(in srgb,var(--green-text) 9%,var(--surface));
}

.tb-wrap{width:100%;max-width:760px;margin:0 auto;padding:0 16px;position:relative;z-index:5;}

/* 화면에는 없고 화면낭독기만 읽는 글자(목록 위 '글 목록' 제목 등) */
.tb-sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;}

/* ── 버튼 3종(T1) — 보조(외곽선) · 주(.is-primary 딥그린 채움) · 위험(.is-danger 빨강 채움) ──
   ★위험 버튼은 되돌리기 어려운 확정에만 쓴다 — 제재하기·삭제·지우기·닉네임 비우기.
   ★주 버튼 이름표는 is-primary 하나다(예전 'tb-primary' 오타로 댓글 [올리기]·[신고 보내기]·
     [지우기]가 흰 보조 버튼으로 나왔다 — 하네스가 모든 제출 버튼을 검사한다). */
.tb-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:0 16px;
  border:1px solid var(--btn-line);border-radius:10px;background:var(--surface);color:var(--ink-head);
  font-family:var(--sans-kr);font-size:15px;font-weight:700;line-height:1.2;text-decoration:none;cursor:pointer;white-space:nowrap;}
.tb-btn:active{background:var(--surface-2);}
.tb-btn.is-primary{background:var(--green);border-color:var(--tb-primary-line);color:var(--on-green);}
.tb-btn.is-primary:active{background:var(--green-deep);}
.tb-btn.is-block{display:flex;width:100%;}
.tb-btn.is-danger{background:var(--err);border-color:var(--err);color:var(--on-err);}
.tb-btn:disabled,.tb-btn[aria-disabled="true"]{opacity:.45;cursor:not-allowed;}
.tb-btn:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;}

/* 버튼 줄 — 오른쪽 정렬 · 간격 10px(예전엔 규칙이 없어 [닫기]와 주 버튼이 맞붙었다 — A11Y-12) */
.tb-form-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:10px;margin-top:12px;}

/* ── 입력칸 공통(T1) — 글자 16px(아이폰 확대 방지) · 높이 44px 이상 · 3:1 테두리 · 2px 포커스 링 ──
   ★JS 가 만드는 칸(댓글 닉·비번·내용, 창 안의 메모·사유·비밀번호)은 전부 .tb-input 을 단다.
     브라우저 기본 칸은 13.3px Arial·고정폭(textarea)이라 "덜 만든 사이트"로 보였다(VIS-1·A11Y-2). */
.tb-input{display:block;width:100%;min-height:44px;margin:0;padding:10px 13px;background:var(--surface);
  border:1px solid var(--field-line);border-radius:10px;color:var(--ink);font-family:var(--sans-kr);
  font-size:16px;font-weight:400;line-height:1.6;outline:none;-webkit-appearance:none;appearance:none;}
textarea.tb-input{min-height:88px;resize:vertical;}
.tb-input::placeholder{color:var(--tb-sunk);opacity:1;}
.tb-input:focus{border-color:var(--focus-ring);outline:2px solid var(--focus-ring);outline-offset:1px;}
.tb-input:disabled{opacity:.55;cursor:not-allowed;background:var(--surface-2);}
/* 칸 위 이름표 — 안내를 placeholder 에만 두면 쓰기 시작하는 순간 사라진다(A11Y-2) */
.tb-label{display:block;margin:12px 0 6px;font-size:13px;font-weight:600;color:var(--ink-head);}
.tb-field{display:block;min-width:0;}
.tb-field .tb-label{margin-top:0;}

/* ── 고르기 칩(2열 · 높이 44px) — 신고·제재·사유 창의 라디오 묶음(T1) ──
   라디오는 그대로 두고(방향키·화면낭독기 그대로) 겉모양만 칩으로 — 고르면 딥그린 채움 */
.tb-fieldset{margin:0 0 14px;padding:0;border:0;min-width:0;}
.tb-legend{display:block;margin:0 0 8px;padding:0;font-size:13px;font-weight:700;color:var(--ink-head);}
.tb-chips{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.tb-chip{position:relative;display:block;min-width:0;cursor:pointer;}
.tb-chip input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer;}
.tb-chip-face{display:flex;flex-wrap:wrap;align-items:center;gap:0 6px;height:100%;min-height:44px;padding:8px 12px;
  border:1px solid var(--field-line);border-radius:10px;background:var(--surface);color:var(--ink);
  font-size:15px;font-weight:600;line-height:1.35;overflow-wrap:anywhere;}
.tb-chip-note{font-size:12px;font-weight:700;color:var(--gold-text);}
.tb-chip input:checked + .tb-chip-face{background:var(--green);border-color:var(--green);color:var(--on-green);}
.tb-chip input:checked + .tb-chip-face .tb-chip-note{color:var(--on-green);}
/* 다크 — 딥그린 채움은 칸 바탕과 1.4:1 이라 "골랐다"가 흐리다. 골드 테두리(칸 위 8.09)를 더한다 */
:root[data-theme="dark"] .tb-chip input:checked + .tb-chip-face{border-color:var(--gold);box-shadow:inset 0 0 0 1px var(--gold);}
.tb-chip input:focus-visible + .tb-chip-face{outline:2px solid var(--focus-ring);outline-offset:2px;}

/* ── 말머리 탭 ── */
.tb-tabs{display:flex;gap:6px;overflow-x:auto;padding:4px 0 10px;-webkit-overflow-scrolling:touch;}
.tb-tabs::-webkit-scrollbar{display:none;}
.tb-tab{flex:none;min-height:44px;padding:0 14px;border:1px solid var(--gold-line);border-radius:999px;
  background:var(--surface);color:var(--muted);font-family:var(--sans-kr);font-size:15px;font-weight:600;cursor:pointer;}
.tb-tab.is-on{background:var(--green);border-color:var(--green);color:var(--on-green);}
.tb-tab:disabled{opacity:.45;cursor:not-allowed;}
.tb-tab:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;}
/* (글쓰기 말머리 고르기는 작업 7 부터 칩 3×2 .tb-tagpicks — 파일 끝 '글쓰기' 블록. 옆으로 밀려 잘리지 않는다 · UXV-5) */

/* ── 목록 말머리 탭 — 밑줄 탭 한 줄(결함 5 · VIS-4) ──
   ★알약 7개(약 470px)는 390px 폰에서 [상품비교]가 화면 밖이었다. 글자 13.5px · 좌우 9px 로 7개 합이
     약 340px — 390 폭 본문(358px)에 한 줄로 들어간다. 360 폭은 좌우 7px(아래 @media).
   ★그래도 넘치면(320 폭 등) 옆으로 밀리고, 켜진 탭은 JS 가 화면 안으로 옮기고, 오른쪽 끝을 흐린다(.is-more).
   ★글쓰기의 말머리 고르기(#tagPick)는 알약 그대로다 — 이 모양은 .is-line 에만 붙는다. */
/* ★탭 줄 아래 1px 선이 목록의 윗선을 맡는다 — 목록(.tb-list)의 윗선과 12px 떨어진 두 줄이 되지 않게 탭 줄 바로 밑에서 목록이 시작한다 */
.tb-tabs.is-line{position:relative;gap:0;margin:0;padding:0;overflow-y:hidden;scrollbar-width:none;
  box-shadow:inset 0 -1px 0 var(--line-soft);}          /* 탭 줄 아래 1px 선 — 켜진 탭 밑줄이 그 위를 덮는다 */
.tb-tabs.is-line .tb-tab{position:relative;display:inline-flex;align-items:center;min-height:44px;padding:0 9px;
  border:0;border-radius:0;background:none;color:var(--muted);font-size:15px;font-weight:600;
  text-decoration:none;white-space:nowrap;}
.tb-tabs.is-line .tb-tab.is-on{color:var(--ink-head);font-weight:700;}
.tb-tabs.is-line .tb-tab.is-on::after{content:"";position:absolute;left:9px;right:9px;bottom:0;height:2px;
  border-radius:2px 2px 0 0;background:var(--tb-tab-bar);}
.tb-tabs.is-line .tb-tab:focus-visible{outline-offset:-2px;border-radius:6px;}
/* 넘칠 때만 오른쪽 끝 28px 을 흐린다 — 마스크는 투명도만 본다(색이 아니다) */
.tb-tabs.is-line.is-more{-webkit-mask-image:linear-gradient(90deg,var(--tb-mask) calc(100% - 28px),transparent);
  mask-image:linear-gradient(90deg,var(--tb-mask) calc(100% - 28px),transparent);}
@media (max-width:374.98px){
  .tb-tabs.is-line .tb-tab{padding:0 7px;font-size:13px;}
  .tb-tabs.is-line .tb-tab.is-on::after{left:7px;right:7px;}
}


/* 닉 한 덩어리 — PHP(p.php)와 JS(TB.nick)가 같은 마크업을 낸다(공통 약속) */
.tb-nick{font-weight:600;color:var(--text-soft);}
.tb-badge{display:inline-flex;align-items:center;gap:3px;height:20px;margin-left:5px;padding:0 6px;border:1px solid var(--btn-line);
  border-radius:6px;background:transparent;font-size:12px;font-weight:600;line-height:1;color:var(--muted);white-space:nowrap;vertical-align:middle;}
.tb-badge.is-guest{border-color:transparent;background:var(--tb-quiet-bg);color:var(--muted);}
/* 댓글 '글쓴이'(대표 결정 2026-09-27 오후 · 시안 parts.js m-badge is-author) — 회원 글에 그 회원이 단 댓글에만 서버가 is_author 를 준다 */
.tb-badge.is-author{border-color:var(--green-text);color:var(--green-text);font-weight:700;}
.tb-dot{margin:0 5px;color:var(--gold-dim);}
.tb-when{color:var(--muted);}

/* 상태 한 줄 — 가려짐·지워짐·오픈 전·불러오기 실패 */
.tb-state{margin:14px 0;padding:14px 16px;border:1px solid var(--gold-line);border-radius:12px;
  background:var(--surface-2);font-size:15px;line-height:1.75;color:var(--muted);text-align:center;
  word-break:keep-all;}   /* 낱말 가운데서 끊지 않는다 */
/* 가림 공시의 기한("2026.10.22 이후 삭제 예정")은 한 덩어리 — '…삭제 / 예정'처럼 한 낱말만 떨어지지 않게(TB.hideInto · p.php tb_hide_html) */
.tb-keep{white-space:nowrap;}

/* 불러오기 실패 — 이유 한 줄 + [다시 불러오기](결함 16 · TB.retry). 상태 카드(.tb-state) 안에서도, 댓글 칸 자리에서도 같은 모양 */
.tb-retry-box{display:block;}
.tb-retry-text{display:block;}
.tb-retry-box .tb-retry{display:flex;margin:10px auto 0;}
.tb-cmt-form > .tb-retry-box{padding:14px 16px;border:1px solid var(--gold-line);border-radius:12px;
  background:var(--surface-2);font-size:15px;line-height:1.75;color:var(--muted);text-align:center;}
.tb-queue-retry{margin:0 14px 10px;}
.tb-queue-loading{margin:12px 14px;}

/* 쓰던 글을 기기에서 되살렸다는 한 줄(결함 7) — [지우기]로 처음 모양으로 */
.tb-draft{margin:0 0 10px;padding:8px 12px;border:1px solid var(--info-line);border-radius:10px;background:var(--info-bg);
  font-size:13px;line-height:1.6;color:var(--info-ink);}
.tb-draft{display:flex;flex-wrap:wrap;align-items:center;gap:0 4px;}
.tb-draft .tb-link{position:relative;display:inline-flex;align-items:center;min-height:44px;margin-left:0;padding:0 8px;
  color:inherit;text-decoration:underline;text-underline-offset:2px;}   /* 누르는 자리 자체가 44px(전역 검사는 요소 네모를 잰다) */

.tb-closed{margin:28px 0;padding:34px 18px;border:1px solid var(--gold-line);border-radius:14px;
  background:var(--surface);text-align:center;font-size:15px;line-height:1.8;color:var(--ink);}

/* ── 글 상세 — 파일 끝 '글 상세 틀(작업 4)' 블록으로 옮겼다(시안 A) ── */

/* ── 댓글 ── */
.tb-cmt-list,.tb-cmt-replies{list-style:none;margin:0;padding:0;}
/* 가려진·지워진 자리 — 투명도 대신 색으로(A11Y-9·결함 20). ★자기 줄(바로 아래 자식)만 가라앉힌다 —
   예전 opacity 는 그 아래 매달린 살아 있는 답글까지 같이 흐리게 했다. */
.tb-cmt-item.is-hidden > .tb-cmt-off,.tb-cmt-item.is-gone > .tb-cmt-off,
.tb-cmt-item.is-hidden > .tb-row-meta,.tb-cmt-item.is-gone > .tb-row-meta,
.tb-cmt-item.is-hidden > .tb-row-meta .tb-nick,.tb-cmt-item.is-gone > .tb-row-meta .tb-nick,
.tb-cmt-item.is-hidden > .tb-cmt-body,.tb-cmt-item.is-gone > .tb-cmt-body,
.tb-cmt-item.is-hidden > .tb-cmt-off .tb-when,.tb-cmt-item.is-gone > .tb-cmt-off .tb-when{color:var(--tb-sunk);}
.tb-cmt-act:empty{display:none;}
.tb-cmt-form .msg{margin-top:8px;text-align:left;}
/* 비회원 칸 — 닉·비밀번호를 한 줄 두 칸으로(360px 에서도 칸당 150px 넘게 남는다) */
.tb-guest-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.tb-link{border:0;background:none;padding:0;color:var(--gold-text);font-family:inherit;font-size:13px;font-weight:600;cursor:pointer;}
.tb-link:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;border-radius:4px;}
.tb-hint{margin-top:6px;font-size:13px;line-height:1.6;color:var(--muted);}
.tb-hint a{color:var(--gold-text);}

/* ═══ 관리 모드(1B-2) — 운영자에게만 JS 가 붙인다. 색은 theme.css 토큰만 쓴다 ═══ */

/* 머리 줄 — 관리 모드 스위치 · 이 화면 전부 고르기 · 잠금/오픈 전 상태 띠(MOD-8) */
.tb-modbar{margin:0 0 10px;padding:9px 12px;
  border:1px solid var(--gold-line);border-radius:10px;background:var(--surface-2);}
.tb-modbar-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;}
.tb-modbar-row .tb-pickall{margin-left:auto;min-height:44px;padding:0 12px;font-size:15px;}
.tb-modbar-state:empty{display:none;}
.tb-modwarn{margin:8px 0 0;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:var(--surface);
  font-size:13px;line-height:1.6;color:var(--text-soft);}
.tb-modwarn.is-lock{border-color:var(--warn-line);background:var(--warn-bg);color:var(--warn-ink);font-weight:600;}
.tb-modwarn a{color:inherit;text-decoration:underline;text-underline-offset:2px;}
.tb-modsw{display:inline-flex;align-items:center;gap:7px;min-height:44px;
  font-size:15px;font-weight:700;color:var(--ink-head);cursor:pointer;}
.tb-modsw input{width:18px;height:18px;accent-color:var(--green);}
.tb-modsw-note{font-size:12px;line-height:1.6;color:var(--muted);}

/* 줄 상태 배지 — 신고 n건 · 가려짐 · 삭제 대기 · 고정 */
.tb-badge-st{display:inline-flex;align-items:center;height:20px;margin-right:5px;padding:0 6px;border:1px solid var(--line);
  border-radius:6px;font-size:12px;font-weight:700;line-height:1;color:var(--muted);vertical-align:middle;}
.tb-badge-st.is-flag{border-color:var(--err);color:var(--err);}
.tb-badge-st.is-hidden{border-color:var(--gold-line);color:var(--gold-text);}
/* '삭제 대기'는 글자로 이미 말한다 — 취소선을 겹치면 흐림과 겹쳐 안 읽혔다(A11Y-9) */
.tb-badge-st.is-del{border-color:var(--line);color:var(--text-soft);}
/* 고정 — 다크에서 --green 글자는 바탕 위 1.57:1 로 안 보였다 → --green-text(다크 9.79 · 라이트는 같은 값)(A11Y-13) */
.tb-badge-st.is-pin{border-color:var(--green-text);color:var(--green-text);}
/* 즉시 가림(개인정보·불법촬영물) — 자동으로 안 지워지는 줄이라 빨강 */
.tb-badge-st.is-urgent{border-color:var(--err);color:var(--err);}


/* 일괄 조치 막대 — 1개 이상 골랐을 때만 화면 아래에 붙는다(MOD-12) */
.tb-bulk{position:fixed;left:0;right:0;bottom:0;z-index:70;display:flex;flex-wrap:wrap;align-items:center;
  justify-content:center;gap:8px 10px;padding:10px 16px calc(10px + env(safe-area-inset-bottom, 0px));
  border-top:1px solid var(--gold-line);background:var(--surface);box-shadow:0 -8px 24px var(--shadow-2);}
.tb-bulk-acts{display:flex;flex-wrap:wrap;gap:8px;}
.tb-bulk .tb-btn{min-height:44px;padding:0 14px;font-size:15px;}
.tb-bulk-n{font-size:15px;font-weight:700;color:var(--ink-head);}
.tb-bulk .tb-bulk-clear{border-color:transparent;background:none;color:var(--muted);}
/* 막대가 뜬 동안: 목록 끝이 막대 밑에 깔리지 않게 · 알림은 막대 위로 */
html.tb-bulk-on body{padding-bottom:120px;}
html.tb-bulk-on .tb-toast{bottom:calc(128px + env(safe-area-inset-bottom, 0px));}

/* ── 1B-2 Task 2(글 상세 관리)는 이 줄 바로 뒤에 붙인다 ── */

/* 글 상세 관리 카드 — 제목 아래(#tbMod, 설계 §11-2)에 JS 가 붙인다(T7)
   순서: 상태 한 줄 → 주 버튼 → 작성자 묶음 → 더 보기 → 신고 목록(접힘) */
.tb-mod:not(:empty){margin:12px 0 4px;}
.tb-modcard{padding:12px 14px 10px;border:1px solid var(--gold-line);border-radius:12px;background:var(--surface-2);}
.tb-modcard-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 6px;}
.tb-modcard-k{font-size:12px;font-weight:700;letter-spacing:.04em;color:var(--gold-text);}
.tb-modcard-head .tb-link{position:relative;display:inline-flex;align-items:center;min-height:44px;padding:0 8px;font-size:13px;color:var(--muted);}
.tb-modstate{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px;margin:0 0 10px;
  font-size:13px;line-height:1.6;color:var(--text-soft);}
.tb-modstate-chip{flex:none;display:inline-block;padding:1px 8px;border-radius:6px;font-size:12px;font-weight:700;
  border:1px solid var(--line);color:var(--ink-head);background:var(--surface);}
.tb-modstate-chip.is-public{border-color:var(--green-text);color:var(--green-text);}
.tb-modstate-chip.is-hidden{border-color:var(--gold-line);color:var(--gold-text);}
.tb-modstate-chip.is-deleted{border-color:var(--err);color:var(--err);}
.tb-modline{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 8px;}
.tb-modline .tb-btn{min-height:44px;padding:0 14px;font-size:15px;}
/* 작성자 묶음 — 사람에게 바로 닿는 조치라 구분선 아래에 따로 둔다 */
.tb-modline.is-author{padding-top:8px;border-top:1px solid var(--line-soft);}
.tb-modline-k{flex:none;min-width:44px;font-size:13px;font-weight:700;color:var(--muted);}
.tb-modline.is-author .tb-btn{min-height:44px;padding:0 12px;font-size:15px;}
/* 삭제 — 빨강 테두리(되돌릴 수 있지만 무거운 조치). 채움 빨강은 창 안의 확정 버튼 몫이다 */
.tb-btn.is-danger-line{border-color:var(--err);color:var(--err);}
/* 더 보기 — 말머리 옮기기·고정(자주 안 쓰는 것) */
.tb-modmore{margin:0 0 8px;}
/* ★display:block — flex 로 두면 글자 조각 사이 띄어쓰기가 사라진다("3건· 판정 전 2건—") */
.tb-modmore > summary,.tb-flags > summary{display:block;box-sizing:border-box;min-height:44px;padding:10px 0;line-height:1.5;cursor:pointer;
  font-size:15px;font-weight:700;color:var(--ink-head);list-style:none;}
.tb-modmore > summary::-webkit-details-marker,.tb-flags > summary::-webkit-details-marker{display:none;}
.tb-modmore > summary::before,.tb-flags > summary::before{content:"▸";display:inline-block;width:16px;color:var(--gold-text);}
.tb-modmore[open] > summary::before,.tb-flags[open] > summary::before{content:"▾";}
.tb-modmore > summary:focus-visible,.tb-flags > summary:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;border-radius:6px;}
.tb-modmore .tb-modline{margin-top:4px;}
.tb-mod-note{margin:6px 0 2px;font-size:12px;}
/* 관리 카드 포인트 줄(계획 2C 작업 3 · 설계 6-2) — 글 포인트 · 추천 보너스 · 댓글 포인트 · 회원 id 는 없다 */
.tb-modpts{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:0 0 8px;padding-top:8px;border-top:1px solid var(--line-soft);}
.tb-modpts > .tb-hint{flex:1 1 200px;margin:6px 0 0;}
.tb-pt-list{flex:1 1 240px;min-width:0;margin:0;padding:0;list-style:none;}
.tb-pt-row{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 10px;padding:4px 0;}
.tb-pt-row + .tb-pt-row{border-top:1px solid var(--line-soft);}
.tb-pt-t{flex:1 1 200px;min-width:0;margin:0;font-size:13px;line-height:1.6;color:var(--ink);}
.tb-pt-t b{margin-right:6px;font-weight:700;color:var(--ink-head);}
.tb-pt-acts{display:flex;flex-wrap:wrap;gap:8px;}
.tb-pt-acts .tb-btn{min-height:44px;padding:0 12px;font-size:15px;}
.tb-dialog-body .tb-pt-list{margin:0 0 4px;}

/* 관리 모드가 꺼진 채 글로 들어온 운영자에게만 보이는 되돌리기 링크 — 탕비실에서 유일하게
   폰으로도 눌러야 하는 관리 자리라 다른 관리 버튼과 같은 탭 영역을 준다(항목 7). */
.tb-mod-on{margin:0 0 8px;}
.tb-mod-on-link{min-height:44px;padding:0 14px;font-size:15px;}

/* 이 글에 들어온 신고 — 접힌 한 줄, 펼치면 줄마다 카드(예전 6칸 표는 폰에서 '09/ 22' 로 깨졌다) */
.tb-flags{margin:0 0 6px;padding:2px 12px;border:1px solid var(--line-soft);border-radius:10px;background:var(--surface);}
.tb-flags-open{font-weight:600;color:var(--muted);}
.tb-flags-warn{margin:2px 0 8px;padding:8px 10px;border:1px solid var(--warn-line);border-radius:8px;
  background:var(--warn-bg);font-size:13px;line-height:1.6;color:var(--warn-ink);}
.tb-flags-none{margin:0 0 6px;}
.tb-flag-list{list-style:none;margin:0;padding:0 0 6px;}
.tb-flag-row{padding:9px 0;border-top:1px solid var(--line-soft);}
.tb-flag-top{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;font-size:13px;color:var(--ink);}
.tb-flag-top b{font-weight:700;color:var(--ink-head);}
.tb-flag-who,.tb-flag-when{font-size:13px;color:var(--muted);white-space:nowrap;}
.tb-flag-memo{margin-top:2px;font-size:13px;line-height:1.6;color:var(--text-soft);overflow-wrap:anywhere;}
.tb-verdict{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px;}
.tb-verdict .tb-btn{min-height:44px;padding:0 12px;font-size:15px;}
.tb-verdict-done{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:600;color:var(--muted);}

/* 댓글 ⋯ 메뉴 — 댓글 머리 줄 오른쪽 끝(VIS-16·MOD-4)
   ★⋯ 는 DOM 으로는 버튼 칸(.tb-cmt-act) 안에 있지만 댓글 한 줄(li, position:relative)의 오른쪽
     위에 붙인다 — p.php 가 그린 머리 줄을 JS 가 다시 그리지 않아도 된다. 메뉴는 오른쪽 끝에 맞춰
     왼쪽으로 펼치므로 폰에서도 화면 밖으로 안 나간다(예전엔 왼쪽으로 31px 잘렸다). */
.tb-cmt-item.has-menu > .tb-row-meta,.tb-cmt-item.has-menu > .tb-cmt-off:first-child{padding-right:48px;}
/* ★⋯(44px) 가운데 = 머리 줄(32px) 가운데 — 댓글 한 줄 위 여백 12 + 16 − 22 = 6 · 답글 한 줄은 위 여백 8 이라 2(작업 6 잔가지 · 시안 .m-cmt-head) */
.tb-cmt-act .tb-cmt-menu{position:absolute;top:6px;right:0;z-index:20;}
.tb-cmt-item.is-reply > .tb-cmt-act .tb-cmt-menu{top:2px;}
.tb-cmt-act .tb-cmt-menu.is-open{z-index:30;}   /* 열린 메뉴는 뒤 댓글들의 ⋯ 보다 위에 */
.tb-cmt-more{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;
  border:0;border-radius:10px;background:none;color:var(--muted);font-family:inherit;font-size:20px;font-weight:700;
  line-height:1;cursor:pointer;}
.tb-cmt-more[aria-expanded="true"]{background:var(--surface-2);color:var(--ink-head);}   /* 마우스 올림(:hover)은 파일 끝 호버 블록(T-007) */
.tb-cmt-more:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-2px;}
.tb-cmt-menu-list{position:absolute;right:0;top:calc(100% + 4px);display:flex;flex-direction:column;gap:2px;
  min-width:168px;max-width:calc(100vw - 32px);padding:6px;border:1px solid var(--btn-line);border-radius:12px;
  background:var(--surface);box-shadow:0 12px 30px var(--shadow-2);}
.tb-cmt-menu-item{display:flex;align-items:center;min-height:44px;padding:0 12px;border:0;border-radius:10px;
  background:none;color:var(--ink);font-family:var(--sans-kr);font-size:15px;font-weight:600;text-align:left;
  white-space:nowrap;cursor:pointer;}
.tb-cmt-menu-item:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-2px;}
.tb-cmt-menu-item.is-danger{color:var(--err);}

/* 작성자 확인 결과 — 그 자리에 잠깐만 보이고 다시 그리면 사라진다(설계 §4-3).
   복사·갈무리 버튼을 만들지 않는다 */
.tb-reveal{margin:0 0 12px;padding:11px 13px;border:1px solid var(--err);border-radius:10px;
  background:var(--surface);font-size:13px;line-height:1.85;color:var(--ink);}
.tb-reveal b{display:inline-block;min-width:64px;color:var(--muted);font-weight:700;}

/* ── 입력 묶음 — 칸은 .tb-input·.tb-fgroup 한 벌(core.css 의 .field 는 네 화면 어디에도 없다 · 옛 .tb-wrap .field 규칙은 최종 검토에서 지웠다) ── */
.tb-form{padding:6px 0 10px;}
/* (옛 글쓰기 본문 칸 .tb-form textarea 규칙은 작업 7 에서 지웠다 — 남겨 두면 특이도 0,1,1 이 새 .tb-bodyta 를 이겨
    내용 칸에 테두리·안쪽 여백이 되살아난다. 내용 칸의 테두리·포커스는 .tb-bodybox 가 맡는다) */
.tb-guest{margin-top:6px;padding:14px 14px 4px;border:1px solid var(--gold-line);border-radius:12px;
  background:var(--surface-2);}

/* 꿀단지 — 사람 눈에는 없는 칸(자동 프로그램만 채운다).
   ★상자(.tb-pot-box)에 aria-hidden 을 건다 — 칸 자체는 tabindex="-1" 이라 사람 손은 안 닿고,
     화면낭독기에는 '편집 상자'로 읽히지 않는다(A11Y-M1·결함 13). 봇은 여전히 채운다. */
.tb-pot-box{position:absolute;left:-9999px;top:0;width:1px;height:1px;overflow:hidden;}
.tb-pot{position:absolute;left:-9999px;top:0;width:1px;height:1px;opacity:0;}

.tb-privacy{margin-top:20px;padding-top:14px;border-top:1px solid var(--line-soft);
  font-size:12px;line-height:1.85;color:var(--muted);}
.tb-privacy p{margin-bottom:4px;}
.tb-privacy a{color:var(--gold-text);}

/* ── 창(T1) — 신고·제재·사유·작성자 확인·닉 비우기·비밀번호 전부 같은 모양(tb-common.js 의 TB.openDialog) ──
   ★<dialog> + showModal() — 맨 위 층에 뜨고 뒤 화면을 막는다. 덮개는 ::backdrop.
   ★제목 줄·버튼 줄은 고정하고 가운데(.tb-dialog-body)만 스크롤한다 — 긴 제재 창에서도 버튼이 안 잘린다(VIS-14).
   ★폰(700px 미만)은 아래에서 올라오는 시트, PC 는 가운데 창. */
.tb-dialog{position:fixed;inset:0;margin:auto;z-index:81;box-sizing:border-box;
  width:calc(100% - 32px);max-width:440px;height:fit-content;max-height:84vh;padding:0;
  border:1px solid var(--gold-line);border-radius:16px;background:var(--surface);color:var(--ink);
  box-shadow:0 22px 60px var(--shadow-2);overflow:hidden;}
.tb-dialog[open]{display:flex;flex-direction:column;}
.tb-dialog::backdrop{background:var(--scrim);}
.tb-dim{position:fixed;inset:0;z-index:80;background:var(--scrim);}   /* showModal 이 없는 옛 브라우저용 덮개 */
.tb-dialog-form{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;max-height:inherit;margin:0;}
.tb-dialog-head{flex:none;padding:18px 20px 12px;border-bottom:1px solid var(--line-soft);}
.tb-dialog-title{margin:0;font-family:var(--sans-kr);font-size:17px;font-weight:700;line-height:1.4;color:var(--ink-head);}
.tb-dialog-body{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;padding:14px 20px 16px;}
.tb-dialog-body > .tb-hint:first-child{margin-top:0;margin-bottom:12px;}
.tb-dialog-body .tb-privacy{margin-top:14px;padding-top:12px;}
.tb-dialog-foot{flex:none;padding:10px 20px 14px;border-top:1px solid var(--line-soft);background:var(--surface);}
.tb-dialog-foot .msg{margin:0 0 8px;text-align:left;}
.tb-dialog-foot .tb-form-foot{margin-top:0;}
@media (max-width:699.98px){
  .tb-dialog{inset:auto 0 0 0;margin:0;width:100%;max-width:none;max-height:88vh;
    border-width:1px 0 0;border-radius:16px 16px 0 0;animation:tb-sheet-up .18s ease-out;}
  /* 아래 안전영역(아이폰 홈 막대·앱) 만큼 버튼 줄을 띄운다 */
  .tb-dialog-foot{padding-bottom:calc(14px + env(safe-area-inset-bottom, 0px));}
  /* 엄지로 누르기 쉽게 — [닫기]는 제 크기, 주(위험) 버튼은 남은 폭을 다 쓴다 */
  .tb-dialog .tb-form-foot .tb-btn{flex:0 0 auto;min-width:88px;}
  .tb-dialog .tb-form-foot .tb-btn[type="submit"]{flex:1 1 auto;}
  html.tb-lock{overflow:hidden;}      /* 시트가 떠 있는 동안 뒤 화면이 같이 밀리지 않게 */
}
@keyframes tb-sheet-up{from{opacity:.4;translate:0 24px;}to{opacity:1;translate:0 0;}}
@media (prefers-reduced-motion:reduce){ .tb-dialog{animation:none;} }

/* ── 결과 알림(T1) — TB.toast. 화면 아래 가운데 고정(어드민 설정 화면의 알림과 같은 모양) ──
   성공 = 딥그린(3초 뒤 사라짐, role=status) · 실패 = 살구색(닫기까지 남음, role=alert)
   ★소리 알림 자리(.tb-toast-host — #tbToastLive·#tbToastAlert)는 늘 있는 빈 칸이다. 숨기지 않는다(display:none·hidden
     이면 화면낭독기가 자리를 모른다). 크기가 없어 화면엔 안 보이고, 말풍선(.tb-toast)만 그 안에서 화면 아래에 뜬다. */
.tb-toast-host{display:block;margin:0;padding:0;}
.tb-toast{position:fixed;left:16px;right:16px;bottom:calc(16px + env(safe-area-inset-bottom, 0px));z-index:90;
  display:flex;align-items:center;gap:12px;width:fit-content;max-width:440px;margin:0 auto;padding:12px 16px;
  border:1px solid var(--gold-dim);border-radius:10px;box-shadow:0 12px 32px var(--shadow-2);
  font-family:var(--sans-kr);font-size:15px;font-weight:600;line-height:1.55;animation:tb-toast-in .2s ease-out;}
.tb-toast.is-ok{background:var(--green);color:var(--on-green);}
.tb-toast.is-error{background:var(--err-bg);border-color:var(--err-line);color:var(--err-ink);}
.tb-toast-text{flex:1 1 auto;min-width:0;overflow-wrap:anywhere;}
.tb-toast-close{flex:none;min-height:44px;padding:0 12px;border:1px solid currentColor;border-radius:8px;
  background:none;color:inherit;font-family:inherit;font-size:15px;font-weight:700;cursor:pointer;}
.tb-toast-close:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;}
@keyframes tb-toast-in{from{opacity:0;translate:0 8px;}to{opacity:1;translate:0 0;}}
@media (prefers-reduced-motion:reduce){ .tb-toast{animation:none;} }

/* ═══ 1B-2 관리 화면 ═══════════════════════════════════════════════
   여기부터는 관리자에게만 JS 가 붙이는 것들이다. 색은 theme.css 토큰만 쓴다.
   ★폰에서도 눌러야 하므로 버튼 높이는 40px 아래로 내리지 않는다. */

/* ── 관리함 ── */
.tb-queue-n{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;margin-left:5px;padding:0 6px;border-radius:6px;
  background:var(--green);color:var(--on-green);font-size:12px;font-weight:700;line-height:1;}
/* 급한 칸(즉시 가림)이 있으면 배지를 빨강으로(MOD-14) — 늘 같은 초록 숫자는 금방 배경이 된다 */
.tb-queue-tab.is-urgent .tb-queue-n,.tb-queue-n.is-urgent{background:var(--err);color:var(--on-err);}
.tb-queue{margin:0 0 14px;border:1px solid var(--gold-line);border-radius:14px;background:var(--surface-2);}
.tb-queue-msg{margin:10px 14px;font-size:13px;line-height:1.6;color:var(--err);}
.tb-queue-msg:empty{display:none;}
/* 1분 갱신으로 달라졌을 때 — 칸을 갈아엎지 않고 띠만(MOD-21) */
.tb-queue-new{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;margin:10px 14px 0;
  padding:8px 10px 8px 12px;border:1px solid var(--info-line);border-radius:10px;background:var(--info-bg);
  font-size:13px;font-weight:600;color:var(--info-ink);}
.tb-queue-cell{padding:12px 14px;border-bottom:1px solid var(--line-soft);}
.tb-queue-cell:last-child{border-bottom:0;}
.tb-queue-cell.is-urgent{box-shadow:inset 3px 0 0 var(--err);}
.tb-queue-h{display:flex;align-items:center;gap:4px;font-size:15px;font-weight:700;color:var(--ink-head);}
.tb-queue-h:focus{outline:none;}
.tb-queue-h:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;border-radius:4px;}
.tb-queue-hint{margin-top:3px;font-size:12px;line-height:1.6;color:var(--muted);}
.tb-queue-list{list-style:none;margin:8px 0 0;padding:0;}
.tb-queue-row{padding:10px 0;border-top:1px solid var(--line-soft);transition:background-color .3s;}
.tb-queue-row.is-busy{opacity:.6;}
.tb-queue-row.is-back{background:color-mix(in srgb, var(--gold) 14%, transparent);}
.tb-queue-title{display:flex;align-items:center;min-height:44px;font-size:15px;font-weight:600;color:var(--ink-head);
  text-decoration:none;line-height:1.5;overflow-wrap:anywhere;}
.tb-queue-ex{margin-top:2px;font-size:13px;line-height:1.6;color:var(--text-soft);overflow-wrap:anywhere;}
/* 댓글 줄 — 제목은 어디에 달린 댓글인지라 작게, 댓글 내용이 주인공(MOD-11) */
.tb-queue-row.is-cmt .tb-queue-title{font-size:13px;font-weight:600;color:var(--muted);}
.tb-queue-row.is-cmt .tb-queue-ex{font-size:15px;font-weight:600;color:var(--ink-head);}
/* 즉시 가림 발췌는 눌러야 보인다(고객 정보가 적혔을 수 있다 — MOD-1) */
.tb-queue-ex.is-veiled .tb-queue-ex-text{display:none;}
.tb-queue-row.is-cmt .tb-queue-ex.is-veiled{font-size:13px;font-weight:400;color:var(--text-soft);}
.tb-queue-row.is-cmt.is-peek .tb-queue-ex-text{font-size:15px;font-weight:600;color:var(--ink-head);}
.tb-queue-row.is-peek .tb-queue-ex-text{display:block;margin-top:2px;}
.tb-queue-row.is-peek .tb-queue-veil{display:none;}
.tb-queue-veil{color:var(--muted);font-weight:400;}
.tb-qlink{position:relative;border:0;background:none;padding:0;color:var(--gold-text);font-family:inherit;
  font-size:13px;font-weight:700;cursor:pointer;text-decoration:underline;text-underline-offset:2px;}
.tb-qlink{display:inline-flex;align-items:center;min-height:44px;padding:0 6px;}
.tb-qlink:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;border-radius:4px;}
.tb-queue-why{margin-top:3px;font-size:12px;line-height:1.6;color:var(--muted);}
.tb-queue-age{font-weight:700;color:var(--ink-head);}
.tb-queue-age.is-late{color:var(--err);}
/* 신고 쌓인 글 중 개인정보·불법촬영물 신고가 섞인 줄 — 빨간 표시(즉시 가림 한도를 넘겨 안 가려진 채 온 것, 최종 검토) */
.tb-queue-sens{display:inline-flex;align-items:center;height:20px;padding:0 6px;border:1px solid var(--err);border-radius:6px;
  color:var(--err);font-size:12px;font-weight:700;line-height:1;white-space:nowrap;}
.tb-queue-act{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px;}
.tb-queue-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;padding:8px;
  border:1px solid var(--gold-line);border-radius:10px;}
.tb-queue-empty{margin-top:8px;font-size:13px;color:var(--muted);}
.tb-queue-more{margin-top:8px;}
/* 관리함 버튼 — 누르는 자리 44px · 간격 8px(예전 40px 알약이 붙어 있어 한 칸 빗나가면 개인정보 글이 다시 공개됐다) */
.tb-qbtn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 14px;
  border:1px solid var(--btn-line);border-radius:10px;background:var(--surface);color:var(--ink);
  font-family:var(--sans-kr);font-size:15px;font-weight:600;text-decoration:none;cursor:pointer;white-space:nowrap;}
.tb-qbtn.is-main{background:var(--green);border-color:var(--green);color:var(--on-green);}
.tb-qbtn.is-danger{border-color:var(--err);color:var(--err);}
.tb-qbtn.is-danger-fill{background:var(--err);border-color:var(--err);color:var(--on-err);}
.tb-qbtn:disabled{opacity:.45;cursor:not-allowed;}
.tb-qbtn:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;}

/* ── 창 안의 작은 부품(T7) — 대상 한 줄 · 작성자도 제재 칸 · 자주 쓰는 사유 · 한 번 더 묻기 ── */
.tb-dialog-body > .tb-dialog-lead:first-child{margin:0 0 10px;padding:8px 10px;border-radius:8px;
  background:var(--surface-2);font-size:13px;color:var(--ink);overflow-wrap:anywhere;}
.tb-dialog-body > .tb-dialog-lead + .tb-hint{margin:0 0 12px;}
.tb-checkline{display:flex;align-items:center;gap:10px;min-height:44px;margin:4px 0 0;padding:0 2px;
  font-size:15px;font-weight:600;color:var(--ink-head);cursor:pointer;}
.tb-checkline input{flex:none;width:20px;height:20px;margin:0;accent-color:var(--err);}
.tb-fillchips{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 8px;}
.tb-fillchip{min-height:44px;padding:0 12px;border:1px solid var(--btn-line);border-radius:999px;background:var(--surface);
  color:var(--text-soft);font-family:var(--sans-kr);font-size:13px;font-weight:600;cursor:pointer;}
.tb-fillchip:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;}
.tb-ask-text{margin:0;font-size:15px;line-height:1.7;color:var(--ink);}

/* ── 글 상세 관리 모드의 댓글 — 판정 전 신고 한 줄(MOD-M2) · 관리함에서 온 댓글 강조(MOD-10) ── */
.tb-cmt-flagline{display:flex;flex-wrap:wrap;align-items:center;gap:2px 6px;margin-top:3px;font-size:13px;color:var(--err);}
.tb-cmt-item.is-target{box-shadow:inset 0 0 0 2px var(--gold);border-radius:8px;}
@media (prefers-reduced-motion:no-preference){ .tb-cmt-item{transition:box-shadow .4s;} }

/* ── 글쓰기: 운영팀 공지 칸 ── */
.tb-noticebox{margin:0 0 14px;padding:10px 14px;border:1px solid var(--gold);border-radius:12px;
  background:var(--green-tint);}
.tb-noticebox label{display:flex;align-items:center;gap:8px;min-height:44px;
  font-size:15px;font-weight:600;color:var(--ink-head);cursor:pointer;}
.tb-noticebox input{width:18px;height:18px;accent-color:var(--green);flex-shrink:0;}
.tb-noticebox input:disabled{opacity:.45;cursor:not-allowed;}
.tb-noticebox .hint{margin-top:2px;font-size:13px;line-height:1.65;color:var(--muted);}

/* ═══ 시안 A 부품(작업 2) ═══════════════════════════════════════════════
   값은 시안 mock.css 그대로, 색만 사이트 토큰으로(--s-* → --surface·--tb-sunk·--tb-press·--tb-cup·--tb-bar-bg·--focus-ring·
   --tb-primary-line·--btn-line). 누르는 자리는 모두 44px(설계 §2-2 첫 줄 — 시안의 36·40px 는 44px 로 올렸다). */
.tb-ic{flex:none;display:block;pointer-events:none;}          /* ★클릭은 늘 버튼이 받는다(svg·path 가 target 이 되지 않게) */
.tb-vb{flex:none;display:block;pointer-events:none;}
.tb-vb-bg{fill:var(--green);stroke:var(--tb-vb-ring);}
.tb-vb-t{fill:var(--gold);}
.tb-sp{flex:1 1 auto;}
.tb-copy-src{position:fixed;left:-9999px;top:0;width:1px;height:1px;opacity:0;}

/* 윗줄 52px(§3-1 · mock.css .m-top) — 스크롤해도 붙어 있고, 위 안전영역만큼 안쪽을 띄운다 */
.tb-top{position:sticky;top:0;z-index:20;padding-top:env(safe-area-inset-top,0px);background:var(--tb-bar-bg);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--line-soft);}
.tb-top-in{display:flex;align-items:center;gap:6px;max-width:760px;height:52px;margin:0 auto;padding:0 12px 0 14px;}
.tb-brand{display:inline-flex;align-items:center;gap:8px;min-height:44px;color:var(--ink-head);text-decoration:none;}
.tb-brand-t{font-size:17px;font-weight:800;letter-spacing:-.02em;}
.tb-brand-cup{margin-left:-3px;color:var(--tb-cup);}
.tb-who{display:inline-flex;align-items:center;justify-content:flex-end;min-width:64px;}
.tb-who-link{display:inline-flex;align-items:center;min-height:44px;padding:0 8px;color:var(--green-text);font-size:15px;font-weight:700;text-decoration:none;}
.tb-who .tb-cmt-more.tb-who-btn{width:auto;min-width:44px;height:44px;gap:3px;padding:0 8px;color:var(--ink-head);font-size:15px;font-weight:600;}
.tb-who-nick{max-width:108px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.tb-top-write{padding:0 13px;}
@media (max-width:299.98px){ .tb-brand-cup,.tb-top-write .tb-ic{display:none;} .tb-who{min-width:0;} }
/* ★회원 [내 닉 ▾] + [글쓰기] 가 좁은 폰에서 윗줄을 넘치지 않게(Global '360·320 가로 넘침 없음') — 닉 108px(§3-1)은 400 이상에서만.
   어림: 이름 110 + [글쓰기] 94 + 사이·여백 44 + 닉 버튼(닉 + 35) → 390 폭은 닉 96 · 360 폭은 64 · 320 폭은 컵을 빼고 44 까지.
   값은 작업 3 의 frame_member(390·360·320 틀 · 12자 닉) 검사가 통과하는 데까지 줄인다 — 글자 크기·누르는 자리(44px)는 줄이지 않는다 */
@media (max-width:399.98px){ .tb-who-nick{max-width:96px;} }
@media (max-width:389.98px){ .tb-who-nick{max-width:64px;} }
@media (max-width:359.98px){ .tb-brand-cup{display:none;} .tb-who-nick{max-width:44px;} }

/* ⋯ 메뉴 한 벌(§6-4) — 글·댓글·내 닉 공통. 댓글 안의 자리 잡기(.tb-cmt-act .tb-cmt-menu)는 위 규칙 그대로 */
.tb-cmt-menu{position:relative;display:inline-flex;}
.tb-cmt-menu.is-open{z-index:30;}
a.tb-cmt-menu-item{text-decoration:none;}
.tb-cmt-menu-item.is-quiet{color:var(--muted);}
.tb-cmt-menu-sep{display:block;height:1px;margin:4px 6px;background:var(--line-soft);}

/* 오픈 전 카드(§8-2) — 목록·글쓰기(div.tb-closed)·글 상세(p.tb-state.is-closed) 같은 속 */
.tb-closed,.tb-state.is-closed{display:grid;justify-items:center;gap:6px;margin:28px 0;padding:34px 18px;border:1px solid var(--gold-line);
  border-radius:14px;background:var(--surface);text-align:center;}
.tb-closed-ic{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--surface-2);color:var(--tb-cup);}
.tb-closed-t{display:block;font-size:17px;font-weight:800;line-height:1.4;color:var(--ink-head);}
.tb-closed-d{display:block;font-size:15px;line-height:1.7;color:var(--muted);}

/* 바닥글 하나(§3-3 · mock.css .m-foot) */
.tb-foot{display:grid;justify-items:center;gap:8px;margin-top:22px;padding:18px 16px calc(22px + env(safe-area-inset-bottom,0px));
  border-top:1px solid var(--line-soft);font-size:13px;line-height:1.6;color:var(--muted);text-align:center;}
.tb-foot-brand{display:inline-flex;align-items:center;gap:8px;margin:0;font-weight:600;color:var(--text-soft);}
.tb-foot-links{display:flex;flex-wrap:wrap;justify-content:center;}
.tb-foot-links a{display:inline-flex;align-items:center;min-height:44px;padding:0 8px;color:var(--green-text);font-weight:600;text-decoration:none;}
.tb-foot-links a+a{border-left:1px solid var(--line);}
.tb-foot-theme{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 12px;border:1px solid var(--btn-line);border-radius:10px;
  background:transparent;color:var(--text-soft);font-family:var(--sans-kr);font-size:13px;font-weight:600;cursor:pointer;}
.tb-foot-theme:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;}

/* ═══ 목록(작업 3 · 시안 A · 설계 §4) ═══════════════════════════════════ */
/* 목록 머리 첫 줄 — 모든 폭에서 진하게 700/--ink-head(T-014 · D-PL-003 C3) · 폰 15px · 1200 이상 17px(아래 위계 블록) */
.tb-lede{margin:0;padding:14px 0 6px;font-size:15px;font-weight:700;line-height:1.55;color:var(--ink-head);}
/* 말머리 탭 — 화면 끝까지(좌우 16px 밖 · 안쪽 7px) · 46px · 켜진 탭 800 + 밑줄 2.5px(§4-5) */
.tb-tabs.is-line{margin:0 -16px;padding:0 7px;box-shadow:inset 0 -1px 0 var(--line);}
.tb-tabs.is-line .tb-tab{min-height:46px;min-width:44px;justify-content:center;padding:0 9px;font-size:15px;}
.tb-tabs.is-line .tb-tab.is-on{font-weight:800;}
.tb-tabs.is-line .tb-tab.is-on::after{left:9px;right:9px;height:2.5px;}
@media (max-width:374.98px){ .tb-tabs.is-line .tb-tab{padding:0 7px;font-size:13px;} .tb-tabs.is-line .tb-tab.is-on::after{left:7px;right:7px;} }
@media (max-width:339.98px){ .tb-tabs.is-line .tb-tab{min-width:40px;} }   /* 계획 결정 D2 · ★옛 PC 스크롤바(15px)를 단 320 폭 창은 대상 밖 — 탭 줄 가로 스크롤로 대신한다(작업 3 잔가지) */
/* [상품비교] 고지(§4-5) — 외곽선 --tb-tag-compare-line · 모서리 10 · info 17px */
.tb-notice{display:flex;align-items:flex-start;gap:8px;margin:12px 0;padding:11px 13px;border:1px solid var(--tb-tag-compare-line);border-radius:10px;
  background:var(--surface);font-size:13px;line-height:1.6;color:var(--muted);}
.tb-notice .tb-ic{margin-top:1px;color:var(--tb-tag-compare-ink);}

/* 말머리 칩(§3-6·§3-7) — 동그랗게 · 기본 중립, [질문] 옅은 딥그린, [상품비교] 외곽선, 공지 옅은 딥그린 + 테 */
.tb-row-tag{display:inline-flex;align-items:center;gap:3px;height:24px;margin:0;padding:0 9px;border:1px solid var(--chip-line,transparent);border-radius:999px;
  background:var(--chip-bg,var(--tb-tag-bg));color:var(--chip-ink,var(--tb-tag-ink));font-size:12px;font-weight:700;line-height:1;white-space:nowrap;vertical-align:middle;}
.tb-row-tag[data-tag="qna"]{--chip-bg:var(--tb-tag-qna-bg);--chip-ink:var(--tb-tag-qna-ink);}
.tb-row-tag[data-tag="compare"]{--chip-bg:transparent;--chip-ink:var(--tb-tag-compare-ink);--chip-line:var(--tb-tag-compare-line);}
.tb-row-tag.is-notice{--chip-bg:var(--green-tint);--chip-ink:var(--green-text);--chip-line:var(--tb-tag-notice-line);}
.tb-nick.is-op,.tb-badge.is-op{display:inline-flex;align-items:center;height:20px;padding:0 6px;border:1px solid var(--tb-tag-notice-line);border-radius:6px;
  background:var(--green-tint);color:var(--green-text);font-size:12px;font-weight:700;line-height:1;}
.tb-badge.is-here{margin:0 6px 0 0;background:var(--surface);border-color:var(--green-text);color:var(--green-text);font-weight:700;}
.tb-badge.is-wait{margin-left:0;background:var(--warn-bg);border-color:var(--warn-line);color:var(--warn-ink);font-weight:700;}

/* 고정 글 접힌 줄(§4-4) — 장부 밖 위 · 폭마다 장부(.tb-sheet)와 같은 묶음(T-014 · D-PL-003 C4):
   700 미만 화면 끝까지 띠(좌우 -16 · 흰 바탕 · 위아래 선) · 700 이상 테두리·모서리 12 상자(아래 @media) · 장부와 사이 12 */
.tb-pins{list-style:none;margin:0 -16px 12px;padding:0;background:var(--surface);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.tb-pins .tb-pinline{padding:0 16px;}
.tb-pins .tb-pinline.is-mod{padding:6px 16px;}
.tb-pins .tb-check > .tb-pinline{padding-left:0;}
.tb-pins > li:last-child > .tb-pinline,.tb-pins > li:last-child > .tb-check{border-bottom:0;}
.tb-pins > li{margin:0;padding:0;}
.tb-pinline{display:flex;align-items:center;gap:9px;min-height:46px;border-bottom:1px solid var(--line-soft);color:var(--ink-head);
  font-size:15px;font-weight:600;text-decoration:none;}
.tb-pinline:active{background:var(--tb-press);}
.tb-pinline:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-2px;}
.tb-pinline-t{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.tb-pinline-go{color:var(--tb-sunk);}
.tb-pin-ic{display:inline-flex;color:var(--green-text);}
.tb-pinline.is-mod{flex-wrap:wrap;row-gap:4px;padding:6px 0;}
.tb-pinline.is-hidden .tb-pinline-t{color:var(--tb-sunk);font-weight:500;}

/* 흰 장부(§4-2) — 폰은 화면 끝까지 · 크림 바탕 위 흰 종이 한 장. ★overflow:hidden 금지(날짜 띠 sticky 가 멈춘다) */
.tb-list{list-style:none;margin:0;padding:0;}
.tb-list > li{display:block;margin:0;padding:0;}
.tb-sheet{margin:0 -16px;background:var(--surface);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.tb-band{position:sticky;top:calc(52px + env(safe-area-inset-top,0px));z-index:5;display:flex !important;align-items:stretch;min-height:30px;
  background:var(--surface-2);border-bottom:1px solid var(--line);font-size:12px;line-height:1.2;}
.tb-sheet > .tb-band:not(:first-child){border-top:1px solid var(--line);}
.tb-band-l{flex:1 1 auto;display:flex;align-items:center;gap:7px;padding:0 16px;color:var(--green-text);font-weight:800;letter-spacing:.03em;}
.tb-band-l::before{content:"";flex:none;width:3px;height:12px;border-radius:2px;background:var(--gold);}   /* 날짜 도장 — 채움 아닌 표시 */
.tb-band-r{flex:none;display:flex;align-items:center;justify-content:center;width:56px;border-left:1px solid var(--line);color:var(--muted);font-weight:700;}
/* 한 줄 — 제목(두 줄까지) + 정보 줄 · 줄 전체가 링크 · 58px(두 줄이면 80px 안팎) */
.tb-row{position:relative;display:flex;align-items:stretch;min-height:58px;padding:0;border-bottom:1px solid var(--line-soft);color:inherit;text-decoration:none;}
.tb-sheet > li:last-child > .tb-row,.tb-sheet > li:last-child > .tb-check{border-bottom:0;}
.tb-row:active{background:var(--tb-press);}
.tb-row:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-3px;}
.tb-row-main{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:2px;padding:7px 12px 7px 16px;}
.tb-row-title{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;font-size:16px;font-weight:600;line-height:1.4;
  letter-spacing:-.015em;color:var(--ink-head);word-break:keep-all;overflow-wrap:anywhere;}
.tb-row-info{display:flex;align-items:center;gap:6px;min-width:0;height:20px;overflow:hidden;white-space:nowrap;}
.tb-row-info .tb-row-tag{flex:none;height:20px;padding:0 7px;}
.tb-row-meta{display:inline-flex;flex-wrap:nowrap;align-items:center;column-gap:4px;min-width:0;overflow:hidden;font-size:13px;line-height:1.5;color:var(--muted);}
.tb-row-info .tb-nick{font-weight:500;color:var(--muted);}
/* 운영팀 배지는 목록 줄 안에서도 배지 색 그대로(§3-7 — 위 줄이 같은 구체성이라 뒤에서 이기던 것 · 작업 3 잔가지) */
.tb-row-info .tb-nick.is-op{font-weight:700;color:var(--green-text);}
.tb-row-info .tb-row-meta .tb-badge{height:auto;margin-left:4px;padding:0;border:0;background:none;font-weight:500;color:var(--tb-sunk);}
.tb-row-info .tb-dot{margin:0;}
.tb-row.is-mod .tb-row-info{height:auto;flex-wrap:wrap;row-gap:4px;white-space:normal;}   /* 관리 배지가 잘리지 않게(§4-6) */
/* 오른쪽 댓글 칸 56px — 숫자 자리가 고정돼 훑을 때 눈이 한 줄로 내려간다 */
.tb-row-cnt{flex:none;display:flex;align-items:center;justify-content:center;width:56px;margin:0;border-left:1px solid var(--line);font-variant-numeric:tabular-nums;}
.tb-row-cnt b{font-size:17px;font-weight:800;line-height:1;letter-spacing:-.02em;color:var(--green-text);}
.tb-row-cnt.is-zero b{font-weight:600;color:var(--tb-sunk);}
.tb-row-cnt.is-hot{background:var(--green-tint);}
.tb-row-cnt.is-wait{flex-direction:column;gap:3px;padding:0 2px;background:var(--warn-bg);border-left-color:var(--warn-line);color:var(--warn-ink);}   /* ★금색 채움은 이 칸에만 */
.tb-row-wait{font-size:12px;font-weight:800;line-height:1.3;text-align:center;word-break:keep-all;letter-spacing:-.02em;}
.tb-row-cnt.is-none{background:var(--surface-2);}
.tb-row.is-current{background:var(--green-tint);box-shadow:inset 3px 0 0 var(--green-text);}
.tb-row.is-current .tb-row-title{font-weight:800;}
.tb-row.is-current .tb-row-cnt:not(.is-wait){background:transparent;}
/* 가려진 줄(§4-4) — 44px 회색 한 줄 · 공시 이름 · 빈 댓글 칸으로 괘선만 잇는다 */
.tb-row.is-line{min-height:44px;background:var(--surface-2);}
.tb-row.is-line .tb-row-main{flex-direction:row;align-items:center;justify-content:flex-start;gap:7px;padding:0 12px 0 16px;color:var(--tb-sunk);}
.tb-row.is-line .tb-row-title{display:block;flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font-size:13px;font-weight:500;color:var(--tb-sunk);-webkit-line-clamp:unset;line-clamp:unset;}
.tb-row.is-line .tb-when{font-size:13px;color:var(--tb-sunk);}
/* 관리 모드의 가려진·삭제 줄 — 원문을 보이되 색으로 가라앉힌다(투명도 금지 · A11Y-9) */
.tb-row.is-hidden .tb-row-title,.tb-row.is-hidden .tb-row-meta,.tb-row.is-hidden .tb-nick,.tb-row.is-hidden .tb-when{color:var(--tb-sunk);}
.tb-row.is-hidden .tb-row-title{font-weight:500;}
/* 읽은 글(T-009) — 제목 글자만 색·굵기 한 단계(투명도 금지 · A11Y-9). 가려진 줄(.is-line)·지금 읽는 글(.is-current)·관리 모드 가려진 줄(.is-hidden)엔 JS 가 붙이지 않는다. 마우스 올림 색은 뒤(hover 블록)가 이긴다 */
.tb-row.is-read .tb-row-title{font-weight:500;color:var(--tb-read);}
.tb-pinline.is-read .tb-pinline-t{font-weight:500;color:var(--tb-read);}
/* 관리 모드 체크 칸 — label 이 폭 44px · 줄 높이 전체(MOD-12) · 체크 칸이 16px 여백을 대신한다(§4-6)
   ★폰에서 고정 줄 묶음도 장부처럼 화면 끝까지(-16px · T-014 C4) — 체크 칸 열이 장부와 같은 화면 끝에서 시작한다(작업 3 잔가지의 -16 보정은 묶음이 대신한다) */
.tb-check{display:flex;align-items:stretch;border-bottom:1px solid var(--line-soft);}
.tb-check > .tb-row,.tb-check > .tb-pinline{flex:1 1 auto;min-width:0;border-bottom:0;}
.tb-check > .tb-row .tb-row-main{padding-left:0;}
.tb-pick{flex:none;display:flex;justify-content:center;align-items:center;width:44px;min-height:44px;padding:0;cursor:pointer;}
.tb-pick input{width:18px;height:18px;margin:0;accent-color:var(--green);cursor:pointer;}
/* 끝 카드 · 빈 카드(§4-4) */
.tb-end{display:grid !important;justify-items:center;gap:6px;padding:26px 16px 24px !important;border-top:1px solid var(--line);text-align:center;}
.tb-end-ic,.tb-empty-ic{display:grid;place-items:center;width:48px;height:48px;margin-bottom:4px;border-radius:50%;background:var(--surface-2);color:var(--tb-cup);}
.tb-end-t,.tb-empty-t{margin:0;font-size:17px;font-weight:800;letter-spacing:-.01em;color:var(--ink-head);}
.tb-end-d,.tb-empty-d{margin:0;font-size:15px;line-height:1.6;color:var(--muted);}
.tb-end-btns,.tb-empty-btns{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:10px;}
.tb-end-btns .tb-btn,.tb-empty-btns .tb-btn{padding:0 14px;}
.tb-empty{display:grid;justify-items:center;gap:6px;margin:16px 0;padding:26px 16px 24px;border:1px solid var(--line);border-radius:12px;background:var(--surface);text-align:center;}
.tb-empty-link{display:inline-flex;align-items:center;min-height:44px;padding:0 8px;color:var(--green-text);font-size:15px;font-weight:700;text-decoration:none;}
/* 불러오는 동안 — 뼈대 줄(§4-4) */
.tb-loading{margin:0;}
.tb-skel > .tb-skel-row{display:flex;min-height:58px;border-bottom:1px solid var(--line-soft);}   /* ★.tb-list > li{display:block} 을 이겨야 한다(두 칸 모양) */
.tb-skel-main{flex:1 1 auto;display:flex;flex-direction:column;justify-content:center;gap:8px;padding:0 12px 0 16px;}
.tb-skel-t,.tb-skel-i{display:block;border-radius:4px;background:var(--surface-2);}
.tb-skel-t{width:60%;height:14px;}
.tb-skel-i{width:40%;height:10px;}
@media (prefers-reduced-motion:no-preference){ .tb-skel-t,.tb-skel-i{animation:tb-skel 1.1s ease-in-out infinite alternate;} }
@keyframes tb-skel{from{opacity:1;}to{opacity:.5;}}
.tb-more{margin:16px 0 6px;}
/* 관리 줄(§4-6) — 첫 줄: 스위치 ········ [관리함] · 둘째 줄: 전부 고르기 */
.tb-modbar{margin:12px 0 10px;}
.tb-modbar-row.is-sub{margin-top:6px;}
.tb-queue-slot{display:inline-flex;margin-left:auto;}   /* 줄이 넘쳐도 오른쪽 끝 */
/* 폰 — 스위치 설명이 길어 [관리함]을 밀어낸다. 설명을 스위치 아래 줄로 내리고 첫 줄은 스위치 ········ [관리함] */
@media (max-width:599.98px){ .tb-modbar-row:not(.is-sub) > .tb-modsw-note{order:3;flex-basis:100%;margin-top:-6px;} }
.tb-queue{margin:0 0 12px;}
/* 오류·안내 줄(core.css 의 .msg) — 글자 단계(§3-5) 안으로. core.css 는 고치지 않고 탕비실 범위에서만 덮는다(네 화면·창 공통) */
.tb-wrap .msg,.tb-dialog .msg{font-size:15px;line-height:1.6;}
/* 체크·라디오 칸은 브라우저 기본 글자 13.33px 을 갖는다 — 글자는 없지만 글자 단계(§3-5) 밖 값이 남지 않게. 칸 크기는 각 규칙의 width·height(px) 그대로 */
.tb-wrap input[type="checkbox"],.tb-wrap input[type="radio"],.tb-dialog input[type="checkbox"],.tb-dialog input[type="radio"]{font-size:15px;}
@media (min-width:700px){
  .tb-tabs.is-line{margin:0;padding:0;}
  .tb-sheet{margin:0;border:1px solid var(--line);border-radius:12px;}
  .tb-pins{margin:0 0 12px;border:1px solid var(--line);border-radius:12px;overflow:hidden;}   /* 고정 글 묶음도 장부와 같은 상자(T-014 C4) */
  .tb-sheet > li:first-child{border-radius:11px 11px 0 0;}
  .tb-sheet > li:last-child,.tb-sheet > li:last-child > .tb-row{border-radius:0 0 11px 11px;}
  /* 끝 카드 없이 끝나는 쪽(다음 쪽이 있다) — 마지막 줄 댓글 칸 바탕(붐빔·답 기다려요)이 둥근 테두리 밖으로 네모나게 나오지 않게(작업 3 잔가지) */
  .tb-sheet > li:last-child .tb-row-cnt{border-bottom-right-radius:11px;}
  .tb-sheet > li:last-child > .tb-check,.tb-sheet > li:last-child .tb-pick{border-bottom-left-radius:11px;}
}

/* ═══ 글 상세 틀(작업 4 · 시안 A · 설계 §3-2 · §5) ═════════════════════════
   값은 시안 dir-A.js(a-crumb·a-phead·a-ptitle·a-pmeta·a-pstat) · mock.css(m-actions·m-bottombar·m-posted) 그대로, 색만 사이트 토큰으로.
   누르는 자리는 모두 44px(하단 줄은 56px) · 글자 단계 안(§3-5). */
.tb-intro{margin:0 -16px;padding:8px 16px 9px;background:var(--surface-2);border-bottom:1px solid var(--line-soft);font-size:13px;line-height:1.5;}
.tb-intro p{margin:0;}
.tb-intro-t{font-weight:700;color:var(--text-soft);}
.tb-intro-s{color:var(--muted);}
.tb-intro .tb-dot{margin:0 5px;}
/* PC — 가운데 760 칸보다 16px 씩 삐져나오던 것(폰처럼 화면 끝까지도 아니다) → 본문 칸에 맞춘 한 장(작업 4 잔가지) */
@media (min-width:700px){ .tb-intro{margin:12px 0 0;border:1px solid var(--line-soft);border-radius:10px;} }
.tb-crumb{display:flex;align-items:center;gap:2px;margin-top:6px;}
.tb-crumb-home{display:inline-flex;align-items:center;gap:6px;min-height:44px;color:var(--green-text);font-size:15px;font-weight:700;text-decoration:none;}
.tb-crumb-sep{color:var(--tb-sunk);}
.tb-crumb-tag{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:0 6px;color:var(--green-text);
  font-size:15px;font-weight:700;text-decoration:none;}
.tb-crumb-home:focus-visible,.tb-crumb-tag:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;border-radius:6px;}
.tb-post{padding:0 0 8px;}
.tb-post-head{padding:2px 0 12px;border-bottom:1px solid var(--line);}
.tb-post-title{margin:0 0 10px;font-family:var(--sans-kr);font-size:20px;font-weight:800;line-height:1.45;letter-spacing:-.02em;color:var(--ink-head);}
.tb-post-sub{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;}
.tb-post-sub .tb-row-meta{margin:0;display:inline-flex;flex-wrap:wrap;align-items:center;column-gap:4px;}
.tb-post-stat{margin-left:auto;font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap;}
.tb-post-stat b{margin-left:3px;font-weight:700;color:var(--ink-head);}
.tb-post-body{padding:18px 0 20px;font-size:16px;line-height:1.65;color:var(--ink);overflow-wrap:anywhere;}
.tb-post-body a{color:var(--green-text);}
/* 본문 끝 행동 줄(§5-3) — [댓글 N] [링크 복사] ········ [⋯] */
.tb-post-foot{display:flex;align-items:center;gap:8px;padding:12px 0;border-top:1px solid var(--line-soft);}
.tb-mod:empty,.tb-mine:empty,.tb-actions:empty{display:none;}
.tb-actions{display:flex;flex-wrap:wrap;gap:8px;}
.tb-act{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 13px;border:1px solid var(--btn-line);border-radius:10px;background:var(--surface);
  color:var(--ink-head);font-family:var(--sans-kr);font-size:15px;font-weight:700;text-decoration:none;white-space:nowrap;cursor:pointer;}
.tb-act:active{background:var(--surface-2);}
.tb-act:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;}
.tb-mine{display:flex;}
.tb-mine .tb-cmt-more{color:var(--muted);}
/* 상태 카드(§5-6) — 공시 앞 눈 가림 아이콘 */
.tb-state .tb-state-ic{display:inline-block;vertical-align:-3px;margin-right:6px;}
/* 폰 하단 고정 줄(§5-4) — 정상 글 · 700 미만 */
.tb-dock{position:fixed;left:0;right:0;bottom:0;z-index:40;display:grid;grid-template-columns:repeat(4,1fr);min-height:56px;
  padding-bottom:env(safe-area-inset-bottom,0px);background:var(--tb-bar-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  border-top:1px solid var(--line);}
.tb-dock-btn{display:flex;align-items:center;justify-content:center;gap:6px;min-height:56px;padding:0;border:0;background:none;color:var(--ink-head);
  font-family:var(--sans-kr);font-size:15px;font-weight:600;text-decoration:none;white-space:nowrap;cursor:pointer;}
.tb-dock-btn:active{background:var(--tb-press);}
.tb-dock-btn:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-2px;}
.tb-dock-btn.is-primary{color:var(--green-text);font-weight:800;}
@media (max-width:699.98px){
  body:has(> .tb-dock:not([hidden])){padding-bottom:calc(56px + env(safe-area-inset-bottom,0px));}
  body:has(> .tb-dock:not([hidden])) .tb-toast{bottom:calc(72px + env(safe-area-inset-bottom,0px));}
  /* 화면 안으로 당길 때(포커스·오류 줄) 하단 줄 뒤는 '화면 밖'으로 친다 — 작업 9 */
  html:has(> body > .tb-dock:not([hidden])){scroll-padding-bottom:calc(68px + env(safe-area-inset-bottom,0px));}
}
/* 올린 직후 띠(§5-7) */
.tb-posted{margin:14px 0 10px;padding:12px 14px 14px;border:1px solid color-mix(in srgb,var(--green-text) 35%,transparent);border-radius:14px;background:var(--green-tint);}
.tb-posted-h{display:flex;align-items:center;gap:8px;}
.tb-posted-ic{color:var(--green-text);}
.tb-posted-t{flex:1 1 auto;margin:0;font-size:17px;font-weight:800;letter-spacing:-.01em;color:var(--ink-head);}
.tb-posted-x{display:inline-grid;place-items:center;width:44px;height:44px;margin:-8px -8px -8px 0;border:0;border-radius:10px;background:none;color:var(--muted);cursor:pointer;}
.tb-posted-x:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-2px;}
.tb-posted-d{margin:4px 0 0;font-size:15px;line-height:1.6;color:var(--text-soft);}
.tb-posted-url{display:flex;align-items:center;gap:6px;margin:10px 0 0;padding:8px 10px;border-radius:8px;background:var(--surface);
  color:var(--ink-head);font-size:13px;font-weight:600;font-variant-numeric:tabular-nums;overflow-wrap:anywhere;}
.tb-posted-url .tb-ic{color:var(--muted);}
.tb-posted-btns{display:flex;margin:10px 0 0;}
/* 다크 답글 줄(보조 표면 바탕) 위 비회원 배지 — --muted 는 옅은 배지 바탕과 겹쳐 3.83:1 이라 한 단계 밝힌다(4.66:1 · 전역 대비 검사). 목록 줄은 따로(.tb-row-info) */
:root[data-theme="dark"] .tb-cmt .tb-badge.is-guest{color:var(--text-soft);}
@media (min-width:700px){
  .tb-post-title{font-size:24px;}
  .tb-dock{display:none !important;}
}

/* ═══ 글 아래 최근 글(작업 5 · §5-5) — 줄은 목록과 같은 장부(.tb-sheet · .tb-row) ═══ */
.tb-rel{padding:20px 0 4px;border-top:1px solid var(--line-soft);}
.tb-rel-title{display:flex;align-items:center;gap:7px;margin:0 0 10px;font-size:17px;font-weight:800;letter-spacing:-.01em;color:var(--ink-head);}
.tb-colhead{flex:none;width:56px;margin-right:-16px;text-align:center;font-size:12px;font-weight:700;letter-spacing:0;color:var(--muted);}
.tb-rel-all{margin:14px 0 4px;}
@media (min-width:700px){ .tb-colhead{margin-right:0;} }

/* ═══ 댓글(작업 6 · 시안 A · 설계 §6) ═════════════════════════════════════
   값은 시안 dir-A.js(a-again) · mock.css(m-cmts·m-cmt·m-compose·m-cmt-replies) 그대로, 색만 사이트 토큰으로.
   ★입력칸 위 규칙 한 줄(시안 m-cmt-rule)은 두지 않는다 — 대표 결정 2026-09-27 오후(공개 약속 문구라 뺐다).
   누르는 자리는 모두 44px(시안의 40·36px 는 44px 로 올렸다 — §2-2) · 글자 단계 안(§3-5). */
.tb-cmt{padding:22px 0 4px;border-top:1px solid var(--line-soft);}
/* #tbCmt·#c-<번호> 로 오면(스크립트 없이 [댓글 N] · 관리함 [열기]) 제목·댓글이 붙어 있는 윗줄(52px) 밑에 깔리지 않게(작업 4 잔가지) */
.tb-cmt,.tb-cmt-item{scroll-margin-top:calc(60px + env(safe-area-inset-top,0px));}
.tb-cmt-title{margin:0 0 10px;font-size:17px;font-weight:800;letter-spacing:-.01em;color:var(--ink-head);}
.tb-cmt-title #tbCmtCount{color:var(--green-text);}
.tb-cmt-item{position:relative;padding:12px 0 6px;border-bottom:1px solid var(--line-soft);font-size:15px;line-height:1.6;color:var(--ink);}
.tb-cmt-item > .tb-row-meta{display:flex;flex-wrap:wrap;align-items:center;column-gap:4px;min-height:32px;margin:0;font-size:13px;color:var(--muted);}
.tb-cmt-item > .tb-row-meta .tb-nick{font-size:15px;font-weight:600;color:var(--text-soft);}
.tb-cmt-body{margin-top:2px;font-size:16px;line-height:1.65;color:var(--ink);overflow-wrap:anywhere;}
.tb-cmt-body a{color:var(--green-text);}
.tb-cmt-off{display:flex;flex-wrap:wrap;align-items:center;column-gap:4px;min-height:32px;margin:0;font-size:13px;color:var(--tb-sunk);}
/* 목록 아래 16px(시안 .m-cmt-list) — 아래 자리가 비면 마지막 댓글 선과 최근 글 윗선이 5px 사이로 겹쳐 보이던 것 */
.tb-cmt-list{margin:0 0 16px;}
/* 답글 —채운 상자 대신 왼쪽 2px 금색 세로줄 · 안쪽 14 · 바깥 4 · 답글 한 줄은 위 8 아래 4 · 아래 선 없음 */
.tb-cmt-replies{margin:4px 0 4px 4px;padding:0 0 0 14px;border-left:2px solid var(--gold);}
.tb-cmt-replies:not(:has(> li)){display:none;}
.tb-cmt-item.is-reply{padding:8px 0 4px;border-bottom:0;background:none;}
/* 발 — [답글]만(신고·지우기는 ⋯ 안 · §6-1) */
.tb-cmt-act{display:flex;align-items:center;margin:0;}
.tb-cmt-act .tb-cmt-reply{display:inline-flex;align-items:center;justify-content:center;gap:4px;min-width:44px;min-height:44px;margin-left:-4px;padding:0 4px;
  border:0;background:none;color:var(--green-text);font-family:var(--sans-kr);font-size:15px;font-weight:700;cursor:pointer;}
.tb-cmt-act .tb-cmt-more{color:var(--tb-sunk);}
/* 입력칸 자리 — 둘 중 빈 곳은 숨긴다(§6-2) */
.tb-cmt-form:empty{display:none;}
.tb-cmt > .tb-cmt-form{margin:10px 0 14px;}
/* 입력칸(§6-3) — 처음엔 한 줄, 누르면 펼침 */
.tb-compose{margin:0;border:1px solid var(--field-line);border-radius:12px;background:var(--surface);}
.tb-compose-open{display:flex;align-items:center;gap:8px;width:100%;min-height:50px;padding:0 14px;border:0;border-radius:12px;background:none;
  color:var(--tb-sunk);font-family:var(--sans-kr);font-size:16px;text-align:left;cursor:text;}
.tb-compose-open .tb-ic{flex:none;}
.tb-compose-open:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-2px;}
.tb-compose.is-open > .tb-compose-open{display:none;}
.tb-compose-in{display:flex;flex-direction:column;gap:10px;padding:12px;}
.tb-compose-in[hidden]{display:none;}
.tb-compose-in > *{margin:0;}
.tb-compose .tb-cmt-guest{display:flex;flex-direction:column;gap:6px;margin:0;padding:0;border:0;background:none;}
.tb-compose .tb-cmt-input{min-height:96px;font-size:16px;line-height:1.65;resize:vertical;}
.tb-compose .tb-form-foot{margin-top:0;}
.tb-compose .tb-privacy{margin-top:0;padding-top:10px;}
.tb-cmt-form.tb-compose.is-reply{margin:10px 0 6px;}
/* 비회원 칸의 도움말·혜택 한 줄 — 글쓰기(작업 7)도 같은 두 클래스 */
.tb-guest-help,.tb-guest-perk{display:flex;align-items:flex-start;flex-wrap:wrap;gap:0 5px;margin:0;font-size:13px;line-height:1.55;color:var(--muted);}
.tb-guest-help .tb-ic{flex:none;margin-top:2px;color:var(--green-text);}
.tb-guest-help > span{flex:1 1 0;min-width:0;}
.tb-guest-perk a{color:var(--green-text);font-weight:700;}
/* 혜택 한 줄은 문장으로 흐른다 — 폭이 좁으면 [회원가입]만 떨어져 다음 줄로 가던 것(flex 조각 · 작업 7 잔가지 · §7-1) */
.tb-guest-perk{display:block;}
/* 돌아가는 줄(§6-2) */
/* 글자는 시안 .a-again 그대로 딥그린 700 — 회색이면 안내문으로 읽혀 누르는 줄인 줄 모른다(작업 6 잔가지) */
.tb-again{display:flex;align-items:center;gap:8px;min-height:48px;padding:0 14px;border-radius:10px;background:var(--surface-2);
  color:var(--green-text);font-size:15px;font-weight:700;text-decoration:none;}
.tb-again > span{flex:1 1 auto;}
.tb-again .tb-again-up{color:var(--muted);transform:rotate(180deg);}
.tb-again:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;}

/* ═══ 글쓰기(작업 7 · 시안 A · 설계 §7) ═════════════════════════════════════ */
.tb-whead{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 12px;padding:18px 0 12px;}
.tb-whead h1,.tb-nhead{margin:0;font-size:20px;font-weight:800;letter-spacing:-.02em;color:var(--ink-head);}
.tb-draftnote{display:inline-flex;align-items:center;gap:4px;margin:0;font-size:12px;color:var(--tb-sunk);}
.tb-wnotice{display:flex;align-items:flex-start;gap:8px;margin:0 0 14px;padding:12px 14px;border:1px solid var(--err-line);border-radius:12px;
  background:var(--err-bg);color:var(--err-ink);font-size:15px;line-height:1.6;}
.tb-wnotice .tb-ic{flex:none;margin-top:2px;}
/* 칸 묶음 사이 24px — ★폼은 JS 가 style.display='block' 으로 여닫는다(하네스가 그 값을 본다) → gap 대신 margin */
.tb-wform{padding:4px 0 10px;}
.tb-wform > * + *{margin-top:24px;}
.tb-wform > .tb-noticebox{margin:0;}
/* 회원은 맨 위 비회원 칸이 숨어 있어 회원 줄이 첫 칸이다 — 숨은 칸 뒤라고 24px 를 더 벌리지 않는다(비회원 칸과 같은 자리 · 캡처 대조) */
.tb-wform > .tb-guest[hidden]:first-child + *{margin-top:0;}
.tb-wform > .msg{margin-top:10px;}
.tb-wform > .tb-privacy{margin-top:8px;padding:0;border:0;font-size:12px;line-height:1.7;color:var(--muted);}
/* 비회원 칸 — 맨 위(§7-2) */
.tb-wform > .tb-guest{display:flex;flex-direction:column;gap:8px;padding:14px;border:1px solid var(--gold-line);border-radius:12px;background:var(--surface-2);}
.tb-guest > *{margin:0;}
.tb-guest-head{display:flex;align-items:center;justify-content:space-between;gap:8px;}
.tb-guest-t{font-size:15px;font-weight:800;color:var(--ink-head);}
.tb-guest-login{display:inline-flex;align-items:center;justify-content:center;gap:2px;min-width:44px;min-height:44px;margin:-8px -6px -8px 0;padding:0 6px;
  color:var(--green-text);font-size:13px;font-weight:700;text-decoration:none;}
.tb-as{display:flex;align-items:center;gap:8px;padding:12px 14px;border-radius:10px;background:var(--surface-2);font-size:15px;line-height:1.5;color:var(--text-soft);}
.tb-as .tb-ic{flex:none;color:var(--green-text);}
.tb-as b{font-weight:800;color:var(--ink-head);}
/* 칸 묶음 — 이름표 15px 800 · 번호 없음(신청서처럼 보이지 않게 · §7-1) */
.tb-fgroup{display:flex;flex-direction:column;gap:8px;min-width:0;}
.tb-fgroup > *{margin:0;}
.tb-flabel{display:block;font-size:15px;font-weight:800;color:var(--ink-head);}
.tb-req{margin-left:3px;color:var(--err);}
.tb-ffoot{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;}
.tb-fhelp{margin:0;font-size:13px;line-height:1.5;color:var(--muted);}
.tb-count{flex:none;margin:0 0 0 auto;font-size:12px;color:var(--tb-sunk);font-variant-numeric:tabular-nums;white-space:nowrap;}
/* 말머리 칩 3×2(§7-3) */
.tb-tagpicks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;}
.tb-tagpick{display:inline-flex;align-items:center;justify-content:center;gap:4px;min-width:0;min-height:44px;padding:0 6px;
  border:1px solid var(--btn-line);border-radius:999px;background:var(--surface);color:var(--ink);font-family:var(--sans-kr);
  font-size:15px;font-weight:600;white-space:nowrap;cursor:pointer;}
.tb-tagpick:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;}
.tb-tagpick[aria-pressed="true"]{background:var(--green);border-color:var(--tb-primary-line);color:var(--on-green);font-weight:800;
  box-shadow:inset 0 0 0 1.5px var(--green-text);}
.tb-tagpick[aria-disabled="true"]{border-color:var(--tb-quiet-line);background:var(--surface-2);color:var(--tb-sunk);cursor:not-allowed;}
.tb-tagpicks.is-invalid .tb-tagpick:not([aria-disabled="true"]){border-color:var(--err);}
.tb-pickhelp{display:flex;align-items:flex-start;gap:5px;font-size:13px;line-height:1.55;color:var(--muted);}
.tb-pickhelp .tb-ic{flex:none;margin-top:2px;color:var(--tb-sunk);}
.tb-pickhelp a{color:var(--green-text);font-weight:700;}
/* 내용 상자 — 안 첫 줄 안내 + 테두리 없는 칸(§7-5) */
.tb-bodybox{border:1px solid var(--field-line);border-radius:10px;background:var(--surface);overflow:hidden;}
.tb-bodybox:focus-within{border-color:var(--focus-ring);box-shadow:0 0 0 1px var(--focus-ring);}
.tb-guide{display:flex;align-items:flex-start;gap:6px;margin:0;padding:10px 12px;border-bottom:1px solid var(--line);background:var(--surface-2);
  font-size:13px;line-height:1.6;color:var(--text-soft);}
.tb-guide .tb-ic{flex:none;margin-top:1px;color:var(--green-text);}
.tb-bodyta{display:block;width:100%;min-height:200px;margin:0;padding:12px 13px;border:0;border-radius:0;background:none;color:var(--ink);
  font-family:var(--sans-kr);font-size:16px;line-height:1.7;outline:none;resize:vertical;-webkit-appearance:none;appearance:none;}
.tb-bodyta::placeholder{color:var(--tb-sunk);opacity:1;}
/* 연락처 미리 알림(§7-6) · 칸 아래 오류(§7-7) */
.tb-cwarn{display:flex;align-items:flex-start;gap:6px;padding:8px 10px;border-radius:8px;background:var(--warn-bg);color:var(--warn-ink);font-size:13px;line-height:1.6;}
/* 비었을 때 — 소리 자리(role=status)는 그대로 두고 화면에서만 1px 로 접는다(hidden·display:none 이면 자리째 빠져 다음 경고가 안 읽힌다 · 칸 묶음 gap 도 안 먹는다) */
.tb-cwarn:empty{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);border:0;}
.tb-cwarn .tb-ic,.tb-ferr .tb-ic{flex:none;margin-top:2px;}
.tb-ferr{display:flex;align-items:flex-start;gap:5px;font-size:13px;line-height:1.55;color:var(--err);}
.tb-input.is-invalid,.tb-bodybox.is-invalid{border-color:var(--err);}
/* 이것만 지켜 주세요(§7-7) */
.tb-rules{padding:12px 14px;border:1px solid var(--gold-line);border-radius:12px;background:var(--surface);}
.tb-rules-t{margin:0 0 6px;font-size:15px;font-weight:800;color:var(--ink-head);}
.tb-rules ul{display:flex;flex-direction:column;gap:6px;list-style:none;margin:0;padding:0;}
.tb-rules li{display:flex;align-items:flex-start;gap:6px;font-size:13px;line-height:1.55;color:var(--text-soft);}
.tb-rules li .tb-ic{flex:none;margin-top:1px;color:var(--green-text);}
.tb-wform #sendBtn{gap:6px;}
/* ═══ 닉네임(작업 7 · §8-1) ═══ */
.tb-nhead{padding:18px 0 4px;}
.tb-nlede{margin:0 0 14px;font-size:15px;line-height:1.6;color:var(--muted);}
.tb-nform{padding:4px 0 10px;}
.tb-nform > * + *{margin-top:16px;}
.tb-curnick{margin:0;font-size:15px;line-height:1.6;color:var(--text-soft);}
.tb-nform .tb-hint{margin:0;}

/* ═══ 2단계(계획 2B) — 칭호 · 추천 줄 · 목록 추천 칸 · 베스트 · 이벤트 띠 · 해결됐어요 · 내 정보 ═══
   값은 시안 mock.css(m-vote · m-eventbar · m-badge) 그대로, 색만 사이트·탕비실 토큰으로. 글자 단계·44px 규칙 그대로. */
/* 칭호(설계 4-15) — 글 상세 머리 한 줄 "닉 Lv.3 · 핸드드립 · 시간" · 흐린 글자(닉 색은 두지 않는다) */
.tb-title{font-size:13px;font-weight:600;color:var(--tb-sunk);white-space:nowrap;}
/* 추천 줄(설계 6-1) — 본문 끝과 행동 줄 사이 가운데 한 줄(시안 m-vote — 390 폭에서 행동 줄에 넣으면 넘친다) */
.tb-vote{display:flex;justify-content:center;gap:10px;padding:6px 0 16px;}
.tb-vote-b{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:112px;min-height:44px;padding:0 16px;
  border:1px solid var(--btn-line);border-radius:10px;background:var(--surface);color:var(--ink-head);
  font-family:var(--sans-kr);font-size:15px;font-weight:700;line-height:1.2;cursor:pointer;font-variant-numeric:tabular-nums;white-space:nowrap;}
.tb-vote-b b{margin-left:2px;font-weight:800;}
.tb-vote-b:active{background:var(--surface-2);}
.tb-vote-b:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;}
.tb-vote-b.is-up .tb-ic,.tb-vote-b.is-up b{color:var(--green-text);}
.tb-vote-b.is-down .tb-ic,.tb-vote-b.is-down b{color:var(--muted);}
.tb-vote-b[aria-pressed="true"]{background:var(--green);border-color:var(--tb-primary-line);color:var(--on-green);}
.tb-vote-b[aria-pressed="true"] .tb-ic,.tb-vote-b[aria-pressed="true"] b{color:var(--on-green);}
.tb-vote-b[aria-disabled="true"],.tb-vote-b:disabled{opacity:.45;cursor:not-allowed;}
/* 목록 줄 추천 칸(설계 6-1 · §5-6 대표 결정) — 둘째 줄 끝에 작게 · 줄지 않는다 · 자리가 모자라면 닉이 말줄임된다 */
.tb-row-votes{flex:none;font-size:12px;font-weight:600;line-height:1.5;color:var(--muted);white-space:nowrap;}
.tb-row-info .tb-row-meta .tb-nick{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
/* 오픈 이벤트 띠(설계 6-1 · 시안 m-eventbar) — 탭·고지 아래 한 줄 · 옅은 딥그린 판 · 이벤트 기간에만 */
.tb-event{margin:10px 0 0;}
.tb-eventbar{display:flex;align-items:center;gap:10px;min-height:46px;margin:0;padding:0 8px 0 12px;border:1px solid var(--tb-tag-notice-line);
  border-radius:12px;background:var(--green-tint);color:var(--ink-head);font-size:15px;line-height:1.35;text-decoration:none;}
a.tb-eventbar:active{background:var(--tb-press);}
a.tb-eventbar:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;}
.tb-eventbar-ic{flex:none;color:var(--green-text);}
.tb-eventbar-t{flex:1 1 auto;min-width:0;padding:6px 0;font-weight:600;word-break:keep-all;}   /* 390 폭에선 두 줄 — 말줄임이면 끝 날짜가 잘린다 */
.tb-eventbar-t b{margin-right:3px;font-weight:800;color:var(--green-text);}
.tb-eventbar-go{flex:none;display:inline-flex;align-items:center;gap:1px;min-height:44px;font-size:13px;font-weight:700;color:var(--green-text);}
/* 베스트 구역(F3 · 설계 6-1) — 고정 줄 아래 · 흰 장부 위 · 최대 3줄 · 기간 단추는 내용이 있는 기간만 */
.tb-best{margin:14px 0 12px;}
.tb-best-h{display:flex;align-items:center;gap:6px;margin:0 0 6px;}
.tb-best-t{margin:0;font-size:17px;font-weight:800;letter-spacing:-.01em;color:var(--ink-head);}
.tb-best-ps{display:flex;gap:4px;}
.tb-best-p{min-width:44px;min-height:44px;padding:0 10px;border:0;border-radius:10px;background:none;color:var(--muted);
  font-family:var(--sans-kr);font-size:15px;font-weight:600;cursor:pointer;white-space:nowrap;}
.tb-best-p[aria-pressed="true"]{background:var(--green-tint);color:var(--green-text);font-weight:800;}
.tb-best-p:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;}
/* 해결됐어요(설계 4-16) — 고른 댓글 머리 배지 · 경로 줄 오른쪽 · 글쓴이에게만 보이는 안내 한 줄 */
.tb-badge.is-solved{border-color:var(--tb-tag-notice-line);background:var(--green-tint);color:var(--green-text);font-weight:700;}
.tb-crumb-solved{margin-left:0;}
.tb-solve-hint{margin:-4px 0 10px;}
.tb-solve-hint .tb-ic{display:inline-block;vertical-align:-3px;color:var(--muted);}   /* .tb-ic 는 원래 block — 문장 속 아이콘은 줄 안에 */
/* 포인트 문장(설계 6-1) — 글쓰기 이벤트 한 줄 · 올린 직후 띠 한 줄 */
.tb-wform > .tb-as + .tb-evline{margin-top:8px;}
.tb-evline{display:flex;align-items:flex-start;gap:6px;margin:0;font-size:13px;font-weight:600;line-height:1.55;color:var(--green-text);}
.tb-evline .tb-ic{flex:none;margin-top:1px;}
.tb-posted-pts{margin:6px 0 0;font-size:15px;font-weight:700;line-height:1.6;color:var(--green-text);}
/* 내 정보 카드(설계 6-1 · nick.html) — 닉이 있는 회원만 · 네 칸(Lv · 다음 Lv · 칭호 · 포인트) */
.tb-me{margin:14px 0 16px;padding:2px 16px;border:1px solid var(--line);border-radius:12px;background:var(--surface);}
.tb-me-row{padding:12px 0;border-bottom:1px solid var(--line-soft);}
.tb-me-row:last-child{border-bottom:0;}
.tb-me-k{margin:0 0 2px;font-size:13px;font-weight:700;color:var(--green-text);}
.tb-me-v{margin:0;font-size:16px;font-weight:600;line-height:1.5;color:var(--ink-head);}
.tb-me-v b{font-weight:800;}
.tb-me-d{margin:4px 0 0;font-size:13px;line-height:1.55;color:var(--muted);}
.tb-me-link{display:inline-flex;align-items:center;gap:2px;min-height:44px;margin-top:2px;color:var(--green-text);font-size:15px;font-weight:700;text-decoration:none;}
.tb-me-link:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;border-radius:6px;}
/* 알림 끝의 링크 한 개(비회원 추천 [로그인]) */
.tb-toast-link{flex:none;display:inline-flex;align-items:center;min-height:44px;padding:0 8px;color:inherit;font-weight:800;text-decoration:underline;text-underline-offset:2px;}
.tb-toast-link:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;border-radius:6px;}

/* ═══ 3단계(계획 3C) ═════════════════════════════════════════════════════
   색은 토큰만 · 누르는 자리 44px · 글자 12·13·15·16·17·20·24 · 버튼 모서리 10 */
/* ── 작업 1 — 글쓰기 사진 칸(설계 7-1) — [사진 올리기] · 작은 칸(✕ 빼기 · 올리는 중 막대 · 실패 한 줄) · [청약] 체크 ── */
.tb-photofield .tb-ffoot{align-items:center;}
.tb-photo-note,.tb-photo-off{margin:0;}
.tb-photo-agree{align-items:flex-start;padding:10px 12px;border:1px solid var(--warn-line);border-radius:10px;background:var(--warn-bg);
  font-size:13px;font-weight:600;line-height:1.55;color:var(--warn-ink);}
.tb-photo-agree input{margin-top:1px;accent-color:var(--green);}
.tb-photo-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px;margin:0;padding:0;list-style:none;}
.tb-photo-item{position:relative;display:flex;flex-direction:column;gap:4px;min-width:0;}
.tb-photo-thumb{display:grid;place-items:center;aspect-ratio:1/1;overflow:hidden;border:1px solid var(--line);border-radius:10px;
  background:var(--surface-2);color:var(--muted);}
.tb-photo-img{display:block;width:100%;height:100%;object-fit:cover;}
.tb-photo-item.is-up .tb-photo-thumb{opacity:.55;}
.tb-photo-item.is-fail .tb-photo-thumb{border-color:var(--err);}
.tb-photo-bar{position:absolute;left:8px;right:8px;top:calc(50% - 2px);height:4px;border-radius:2px;background:var(--line);overflow:hidden;}
.tb-photo-bar::after{content:"";position:absolute;inset:0 60% 0 0;border-radius:2px;background:var(--green);animation:tb-photo-bar 1.1s linear infinite;}
@keyframes tb-photo-bar{from{transform:translateX(-100%);}to{transform:translateX(250%);}}
.tb-photo-x{position:absolute;top:0;right:0;display:inline-grid;place-items:center;width:44px;height:44px;border:0;border-radius:10px;
  background:none;color:var(--ink-head);cursor:pointer;}
.tb-photo-x .tb-ic{padding:3px;border-radius:999px;background:var(--surface);box-shadow:0 0 0 1px var(--line);}
.tb-photo-x:disabled{cursor:not-allowed;opacity:.45;}
.tb-photo-x:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-2px;}
.tb-photo-err{margin:0;font-size:12px;line-height:1.5;color:var(--err);}
.tb-photo-add{align-self:flex-start;}
.tb-photo-add[aria-disabled="true"]{opacity:.45;cursor:not-allowed;}
/* ── 작업 2 — 글 상세 사진 칸 · 크게 보기 · 목록 줄 사진 칸(설계 7-1 · D-14) ── */
.tb-photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px;margin:14px 0 0;}
.tb-photo{display:block;overflow:hidden;min-height:44px;border:1px solid var(--line);border-radius:10px;background:var(--surface-2);}
.tb-photo-open{display:block;width:100%;height:100%;margin:0;padding:0;border:0;background:none;cursor:zoom-in;}
.tb-photo-open:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-2px;}
.tb-photo-pic{display:block;width:100%;height:100%;object-fit:cover;}
.tb-photo.is-broken{display:grid;place-items:center;padding:12px;}
.tb-photo-miss{font-size:13px;color:var(--muted);text-align:center;}
.tb-photo-gone{grid-column:1/-1;margin:0;font-size:13px;line-height:1.55;color:var(--tb-sunk);}
@media (min-width:700px){ .tb-dialog.is-photo{width:min(960px,calc(100vw - 24px));max-width:none;} }   /* 폰(700 미만)은 다른 창처럼 화면 폭 시트 그대로 — 폭을 주면 오른쪽이 24px 빈다(작업 2 캡처) */
.tb-dialog.is-photo .tb-photo-full{max-height:calc(84vh - 200px);}   /* 창 머리·숫자·버튼 줄(약 190px)을 빼고 잰다 — 사진이 스크롤 없이 한 번에 다 보이게(작업 2 캡처) */
.tb-photo-view{display:grid;gap:8px;justify-items:center;}
.tb-photo-count{margin:0;font-size:13px;font-weight:600;color:var(--muted);}
.tb-photo-full{display:block;max-width:100%;max-height:72vh;border-radius:10px;object-fit:contain;background:var(--surface-2);}
.tb-row-img{display:inline-flex;flex:none;align-items:center;gap:2px;font-size:12px;font-weight:600;line-height:1.5;color:var(--muted);}
.tb-row-img .tb-ic{flex:none;}
/* ── 작업 3 — 종(윗줄 [내 닉 ▾] 점 · 메뉴 "알림 N") · 알림 화면(목록 · 모두 읽음 · 이의신청 · 설정) ── */
.tb-bell-dot{flex:none;width:8px;height:8px;margin-left:2px;border-radius:50%;background:var(--err);}
.tb-who-alerts .tb-ic{flex:none;margin-right:6px;color:var(--muted);}
.tb-who-n{margin-left:6px;padding:0 7px;border-radius:999px;background:var(--err);color:var(--on-err);font-size:12px;font-weight:800;line-height:20px;}
.tb-ahead{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:18px 0 4px;}
.tb-ahead .tb-nhead{padding:0;}
.tb-ahead .tb-nhead:focus{outline:none;}
.tb-alerts{list-style:none;margin:8px 0 0;padding:0;border-bottom:1px solid var(--line-soft);}
.tb-alert{border-top:1px solid var(--line-soft);}
.tb-alert-a{display:flex;align-items:flex-start;gap:10px;min-height:44px;padding:12px 4px;color:var(--ink);text-decoration:none;}
.tb-alert-a:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-2px;border-radius:8px;}
.tb-alert-ic{flex:none;margin-top:1px;color:var(--muted);}
.tb-alert.is-unread .tb-alert-ic{color:var(--green-text);}
.tb-alert-main{flex:1 1 auto;min-width:0;}
.tb-alert-t{display:block;font-size:15px;line-height:1.55;color:var(--text-soft);overflow-wrap:anywhere;}
.tb-alert.is-unread .tb-alert-t{font-weight:700;color:var(--ink-head);}
.tb-alert-main .tb-when{display:block;margin-top:2px;font-size:13px;}
.tb-alert-dot{flex:none;width:8px;height:8px;margin-top:9px;border-radius:50%;background:var(--err);}
.tb-alert-appeal,.tb-alert-done,.tb-alert-form{margin:0 4px 12px 34px;}
.tb-alert-done:focus{outline:none;}
.tb-alert-form .tb-label{margin-top:0;}
.tb-alert-form .msg{margin-top:8px;text-align:left;}
.tb-state-link{display:inline-flex;align-items:center;min-height:44px;margin:-10px 0;padding:0 4px;font-weight:700;color:var(--gold-text);text-decoration:underline;text-underline-offset:2px;}
.tb-state-link:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-2px;border-radius:6px;}
.tb-aset{margin:26px 0 10px;}
.tb-aset-t{margin:0 0 4px;font-size:17px;font-weight:800;color:var(--ink-head);}
.tb-aset-list{margin:10px 0 0;border-top:1px solid var(--line-soft);}
.tb-aset-row{display:flex;flex-wrap:wrap;align-items:center;gap:0 8px;margin:0;padding:6px 0;border:0;border-bottom:1px solid var(--line-soft);}
.tb-aset-k{float:left;display:flex;flex-wrap:wrap;align-items:center;gap:0 8px;min-width:0;margin:0;padding:0;font-size:15px;font-weight:600;color:var(--ink-head);}
.tb-aset-row > .tb-aset-c:first-of-type{margin-left:auto;}
.tb-aset-lock{display:inline-flex;align-items:center;gap:3px;font-size:12px;font-weight:600;color:var(--muted);}
.tb-aset-c{display:inline-flex;align-items:center;gap:6px;min-width:44px;min-height:44px;padding:0 6px;font-size:15px;color:var(--text-soft);cursor:pointer;}
.tb-aset-c input{flex:none;width:20px;height:20px;margin:0;accent-color:var(--green);}
.tb-aset-c input:disabled + span{color:var(--muted);}
.tb-aset-quiet{margin-top:8px;}
.tb-aset-quiet input{accent-color:var(--green);}
/* ── 작업 4 — [작성자예요] · 게시자 화면 · 내 가려진 글 상태 한 줄 · 신고 창 두 갈래 · 권리침해 신청 화면 ── */
.tb-authorbox{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px 12px;margin:-4px 0 14px;}
.tb-rights-link,.tb-flag-rights a{display:inline-flex;align-items:center;min-height:44px;padding:0 6px;font-size:13px;font-weight:600;
  color:var(--gold-text);text-decoration:underline;text-underline-offset:2px;}
.tb-rights-link:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;border-radius:6px;}
.tb-minestate{margin:-4px 0 14px;padding:12px 14px;border:1px solid var(--info-line);border-radius:12px;background:var(--info-bg);color:var(--info-ink);}
.tb-mine-label{margin:0 0 4px;font-size:15px;font-weight:700;line-height:1.6;color:var(--info-ink);}
.tb-mine-line{margin:0;font-size:13px;line-height:1.6;color:var(--info-ink);}
.tb-minestate .tb-mine-act,.tb-cmt-mine .tb-mine-act{margin-top:10px;}
.tb-cmt-offact{margin:2px 0 0;}
.tb-cmt-offact .tb-author-btn{display:inline-flex;align-items:center;min-height:44px;padding:0 4px;text-decoration:underline;text-underline-offset:2px;}
.tb-cmt-mine{margin:8px 0 4px;padding:10px 12px;border:1px solid var(--info-line);border-radius:10px;background:var(--info-bg);color:var(--info-ink);}
.tb-cmt-mine .tb-mine-label{font-size:13px;}
.tb-gv-label{margin:0 0 8px;font-size:16px;font-weight:700;line-height:1.55;color:var(--ink-head);}
.tb-gv-line{margin:0;font-size:15px;line-height:1.6;color:var(--text-soft);}
.tb-gv-note{margin-top:6px;}
.tb-gv-copy{margin:12px 0 0;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface-2);}
.tb-gv-copy-t{margin:0;font-size:13px;font-weight:700;color:var(--ink-head);}
.tb-gv-copy-b{margin-top:6px;font-size:13px;line-height:1.6;color:var(--text-soft);overflow-wrap:anywhere;}
.tb-flag-rights{margin-top:10px;}
.tb-flag-rights a{padding:0;}   /* 캡처에서 찾은 것 — 창 안 다른 안내 줄과 왼쪽 끝을 맞춘다(6px 들여 써졌다) */
.tb-rinfo{margin:10px 0 12px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--surface);}
.tb-rinfo-t{margin:0 0 6px;font-size:15px;font-weight:800;color:var(--ink-head);}
.tb-rinfo .tb-hint{margin:0;}
.tb-rinfo-dl{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;margin:0;font-size:13px;line-height:1.6;}
.tb-rinfo-dl dt{font-weight:700;color:var(--muted);}
.tb-rinfo-dl dd{margin:0;color:var(--ink);overflow-wrap:anywhere;}
.tb-rlede{margin:0 0 6px;}
.tb-rform{display:flex;flex-direction:column;gap:16px;margin-top:14px;}
.tb-rform .tb-fieldset{margin:0;}
.tb-rtarget{margin:0;padding:10px 12px;border-radius:10px;background:var(--surface-2);font-size:15px;font-weight:700;color:var(--ink-head);}
.tb-rdone{margin:18px 0;padding:18px 16px;border:1px solid color-mix(in srgb,var(--green-text) 35%,transparent);border-radius:14px;background:var(--green-tint);text-align:center;}
.tb-rdone:focus{outline:none;}
.tb-rdone-ic{display:inline-block;color:var(--green-text);}
.tb-rdone-t{margin:6px 0 0;font-size:17px;font-weight:800;color:var(--ink-head);}
.tb-rdone-d{margin:6px 0 14px;font-size:15px;line-height:1.6;color:var(--text-soft);}
/* ── 작업 6 — 첫 방문 안내 카드(목록) · 가입 권유 카드(글 상세 · D-62) ── */
.tb-firstcard{margin:10px 0 14px;padding:14px 16px;border:1px solid var(--gold-line);border-radius:12px;background:var(--surface);}
.tb-firstcard-t{display:flex;align-items:center;gap:6px;margin:0 0 8px;font-size:17px;font-weight:800;color:var(--ink-head);}
.tb-firstcard-t .tb-ic{color:var(--tb-cup);}
.tb-firstcard ul{display:grid;gap:4px;margin:0;padding:0;list-style:none;font-size:13px;line-height:1.6;color:var(--text-soft);}
.tb-firstcard-tags b{color:var(--ink-head);font-weight:700;}
.tb-firstcard-k{margin:10px 0 4px;font-size:13px;font-weight:800;color:var(--ink-head);}
.tb-firstcard-no li::before{content:"· ";color:var(--muted);}
.tb-firstcard-btns{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;}
/* [첫 질문 쓰기] — 모든 폭에서 테두리형(T-014 · D-PL-003 C2 · T-013 은 1200 이상만) · 화면의 짙은 주 버튼은 윗줄 [글쓰기] 하나 */
.tb-firstcard-btns .tb-btn.is-primary{background:var(--surface);border-color:var(--btn-line);color:var(--ink-head);}
.tb-firstcard-btns .tb-btn.is-primary:active{background:var(--surface-2);}
/* 위 10(+글 아래 여백 8 = 행동 줄과 18) · 아래 18 — 아래가 0 이면 카드가 댓글 칸 윗줄에 붙는다(작업 6 캡처에서 찾은 것) */
.tb-joincard{position:relative;margin:10px 0 18px;padding:12px 52px 12px 14px;border:1px solid color-mix(in srgb,var(--green-text) 35%,transparent);border-radius:12px;background:var(--green-tint);}
.tb-joincard-t{margin:0;font-size:15px;line-height:1.6;color:var(--ink-head);}
.tb-joincard-t a{color:var(--green-text);font-weight:800;}
.tb-joincard-x{position:absolute;top:4px;right:4px;display:inline-grid;place-items:center;width:44px;height:44px;border:0;border-radius:10px;background:none;color:var(--muted);cursor:pointer;}
.tb-joincard-x:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-2px;}
/* ✕ 로 닫으면 포커스가 댓글 제목으로 간다(누르는 칸이 아니다) — 기본 테두리가 글자에 겹쳐 그려졌다(작업 6 캡처에서 찾은 것 · .tb-rdone 과 같게) */
.tb-cmt-title:focus{outline:none;}
/* ── 작업 5 — (수정됨) · 반박 상자 · 댓글 고치기 칸 ── */
.tb-edited{margin-left:5px;font-size:12px;font-weight:600;color:var(--muted);white-space:nowrap;}
.tb-rebut{margin:16px 0 0;padding:12px 14px;border:1px solid var(--line);border-left:3px solid var(--gold);border-radius:10px;background:var(--surface-2);}
.tb-rebut-t{margin:0 0 6px;font-size:13px;font-weight:800;color:var(--ink-head);}
.tb-rebut-b{font-size:15px;line-height:1.7;color:var(--ink);overflow-wrap:anywhere;}
/* 캡처에서 찾은 것(작업 5) — 반박 상자가 위 36px(본문 아래 여백 20 + 16) · 아래 6px 로 추천 줄에 붙어 있었다 → 본문 여백 바로 아래 · 추천 단추와 16px(여기 10 + 추천 줄 위 6) · 사진 칸 뒤면 14px
   ★위 .tb-rebut 줄은 그대로 두고 여기서 덮는다(뒤 작업 패치가 그 줄을 맥락으로 쓴다) */
.tb-rebut{margin:0 0 10px;}
.tb-photos:not([hidden]) + .tb-rebut{margin-top:14px;}
/* 댓글 고치기 칸 오류 줄 — 댓글 칸 오류 줄(.tb-cmt-form .msg)과 같게 왼쪽 · 위 8px(core.css .msg 는 가운데 · 18px) */
.tb-cmt-editform .msg{margin-top:8px;text-align:left;}
/* 글쓰기 머리 안내 — 고치기 안내("고치면 바로 다시 보여요." 등)는 info 상자(제재·막힘의 빨간 경고 상자가 아니다) · 고칠 수 없을 때 돌아갈 단추 줄 */
.tb-wnotice.is-info{border-color:var(--info-line);background:var(--info-bg);color:var(--info-ink);}
.tb-wback{margin:0 0 14px;}
.tb-rebut-f{margin:8px 0 0;font-size:12px;color:var(--muted);}
.tb-cmt-editform{margin:6px 0 4px;}
.tb-cmt-editform .tb-label{margin-top:0;}
/* ══ 3단계(계획 3D) — 관리함 칸 2 권리침해·저작권 · 칸 3 이의신청 ══ */
.tb-queue-kind{margin:0;font-size:12px;line-height:1.6;color:var(--muted);}
.tb-queue-badge{display:inline-flex;align-items:center;height:20px;margin-right:4px;padding:0 6px;border:1px solid var(--gold-line);border-radius:6px;
  font-size:12px;font-weight:700;color:var(--gold-text);vertical-align:middle;}
.tb-queue-t{display:flex;align-items:center;min-height:44px;margin:0;font-size:15px;font-weight:600;color:var(--ink-head);overflow-wrap:anywhere;}
.tb-queue-due{font-weight:700;color:var(--ink-head);}
.tb-queue-due.is-late{color:var(--err);}
.tb-queue-tools{margin:8px 0 0;}
.tb-queue-legal{margin:4px 0 0;font-size:13px;line-height:1.6;color:var(--muted);}
.tb-rq-more{margin-top:10px;padding:10px 12px;border:1px solid var(--line-soft);border-radius:10px;background:var(--surface);}
.tb-rq-dl{margin:0;}
.tb-rq-dl > div{display:grid;grid-template-columns:7.5em minmax(0,1fr);gap:0 10px;padding:6px 0;border-top:1px solid var(--line-soft);}
.tb-rq-dl > div:first-child{border-top:0;padding-top:0;}
.tb-rq-dl dt{font-size:12px;line-height:1.7;color:var(--muted);}
.tb-rq-dl dd{margin:0;font-size:15px;line-height:1.7;color:var(--ink);overflow-wrap:anywhere;}
.tb-rq-text{white-space:pre-wrap;}
.tb-rq-who-text{display:none;}
.tb-rq-who.is-peek .tb-rq-who-text{display:inline;}
.tb-rq-who.is-peek .tb-queue-veil{display:none;}
.tb-rq-acts{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 0;}
.tb-rq-line{margin:10px 0 0;}
.tb-rq-line .tb-label,.tb-rq-rebut .tb-label{margin-top:0;}
.tb-rq-gap{margin-top:12px;}   /* 입력칸 바로 밑 묶음(대신 접수 창 연락 수단) — 라벨과 같은 위 여백 · 3D 작업 1 캡처 */
.tb-rq-rebut{margin-top:12px;}
.tb-rq-date{max-width:14em;}
@media (max-width:600px){ .tb-rq-dl > div{grid-template-columns:1fr;} }
/* ── 작업 2 — 관리 카드 절차 줄 · 이의 줄 · 사진 줄 ── */
/* 이름표 | 글 두 칸 — 링크가 줄을 넘으면 글 밑으로(이름표 밑에 홀로 떨어져 아래 줄 것처럼 보이던 것 · 3D 작업 2 캡처) */
.tb-proc{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:baseline;column-gap:8px;margin:0 0 8px;font-size:13px;line-height:1.6;color:var(--ink);}
.tb-proc-k{display:inline-block;padding:1px 8px;border:1px solid var(--gold-line);border-radius:6px;font-size:12px;font-weight:700;color:var(--gold-text);}
.tb-proc-b{display:flex;flex-wrap:wrap;align-items:center;column-gap:8px;min-width:0;}
/* 누르는 자리는 44px 그대로 · 줄 높이는 위아래 8px 씩 덜 차지한다(링크 한 줄이 44px 로 벌어지던 것) — 아래 줄 단추와 겹치지 않게 줄 간격(8px)만큼만 */
.tb-proc .tb-link{display:inline-flex;align-items:center;min-height:44px;margin:-8px 0;font-size:13px;}
.tb-modline.is-photos{padding-top:8px;border-top:1px solid var(--line-soft);}
.tb-mod-photo-gone{margin:0;}
/* 관리 모드에서만 — 글 사진 칸 모서리 "N번"(사진 줄 단추 번호와 같은 차례 · 3D 작업 2 캡처) · 누르는 자리(크게 보기)는 막지 않는다 */
#tbPhotos.is-modnum{counter-reset:tbph;}
#tbPhotos.is-modnum .tb-photo{position:relative;counter-increment:tbph;}
#tbPhotos.is-modnum .tb-photo::after{content:counter(tbph) "번";position:absolute;top:8px;left:8px;padding:1px 8px;border:1px solid var(--gold-line);border-radius:6px;
  background:var(--surface);color:var(--ink);font-size:12px;font-weight:700;line-height:1.6;pointer-events:none;}
/* ── 4단계(계획 4B 작업 2) — 글 상세 "이 글의 보험사" 줄(D4-6 · p.php 가 그린다) · 올린 직후 띠 단추 둘(D4-14) ── */
.tb-ins{display:flex;flex-wrap:wrap;align-items:center;margin:2px 0 0;font-size:13px;line-height:1.6;color:var(--muted);}
.tb-ins-k{margin-right:4px;font-weight:600;}
.tb-ins-a{display:inline-flex;align-items:center;min-height:44px;padding:0 6px;color:var(--green-text);font-weight:700;text-decoration:none;}
.tb-ins-a:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-2px;border-radius:6px;}
.tb-posted-btns{flex-wrap:wrap;gap:8px;}
/* ── 4단계(계획 4B 작업 4) — 보험사별 모아보기(i.php · D4-4~D4-6) — 목록 쪽 묶음 줄 · 보험사 쪽 머리(줄은 목록 장부 그대로) ── */
.tb-insp-t{margin:6px 0 4px;font-size:24px;line-height:1.3;font-weight:800;letter-spacing:-.01em;color:var(--ink-head);word-break:keep-all;}
.tb-insp-lede{margin:0 0 6px;font-size:13px;line-height:1.55;color:var(--muted);word-break:keep-all;}
.tb-insp-n{margin:0 0 10px;font-size:13px;font-weight:700;color:var(--ink);}
.tb-ins-grp{margin:18px 0 0;}
.tb-ins-grp-t{margin:0 0 8px;font-size:15px;font-weight:800;color:var(--ink-head);}
.tb-ins-idx{list-style:none;margin:0;padding:0;border:1px solid var(--line);border-radius:10px;background:var(--surface);overflow:hidden;}
.tb-ins-idx li + li{border-top:1px solid var(--line-soft);}
.tb-ins-go{display:flex;align-items:center;gap:8px;min-height:44px;padding:0 12px 0 14px;color:var(--ink);text-decoration:none;font-size:15px;}
.tb-ins-go-n{flex:1;min-width:0;font-weight:700;word-break:keep-all;}
.tb-ins-go-c{font-size:13px;color:var(--muted);white-space:nowrap;}
.tb-ins-go .tb-ic{color:var(--tb-sunk);flex:none;}
.tb-ins-go:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-2px;border-radius:10px;}
/* ── 4단계(계획 4B 작업 5) — 글 찾기 칸(목록 머리 · 검색 화면 · D4-3) · [보험사별] · 결과 머리 ── */
.tb-find{display:flex;align-items:center;gap:8px;margin:2px 0 12px;}
.tb-find-q{flex:1 1 auto;min-width:0;-webkit-appearance:none;appearance:none;}
.tb-find-go{flex:none;padding:0 14px;}
.tb-find-ins{flex:none;display:inline-flex;align-items:center;min-height:44px;padding:0 6px;color:var(--green-text);font-size:15px;font-weight:700;text-decoration:none;white-space:nowrap;}
.tb-find-ins:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-2px;border-radius:6px;}
.tb-search-h{margin:6px 0 10px;font-size:17px;font-weight:800;letter-spacing:-.01em;color:var(--ink-head);overflow-wrap:anywhere;}
/* ── 4단계(계획 4B 작업 6) — 운영정책(rules.html · D4-23) · 내 정보 모두 지우기(D4-22) ── */
.tb-pol-t{margin:14px 0 4px;font-size:24px;line-height:1.3;font-weight:800;letter-spacing:-.02em;color:var(--ink-head);}
.tb-pol-ver{margin:0 0 8px;font-size:15px;font-weight:700;color:var(--green-text);}
.tb-pol-lede{margin:0 0 14px;font-size:15px;line-height:1.6;color:var(--muted);word-break:keep-all;}
.tb-pol-toc{margin:0 0 18px;padding:4px 14px;border:1px solid var(--line);border-radius:12px;background:var(--surface);}
.tb-pol-toc ol{margin:0;padding:0 0 0 22px;font-size:15px;color:var(--muted);}
.tb-pol-toc a{display:inline-flex;align-items:center;min-height:44px;color:var(--green-text);font-weight:700;text-decoration:none;}
.tb-pol-toc a:focus-visible,.tb-pol-a:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;border-radius:6px;}
.tb-pol-s{margin:0 0 22px;scroll-margin-top:64px;}
.tb-pol-s h2{margin:0 0 8px;font-size:17px;font-weight:800;letter-spacing:-.01em;color:var(--ink-head);}
.tb-pol-h3{margin:14px 0 6px;font-size:15px;font-weight:800;color:var(--ink-head);}
.tb-pol-s ul{margin:0;padding:0 0 0 18px;font-size:15px;line-height:1.7;color:var(--ink);word-break:keep-all;}
.tb-pol-s li + li{margin-top:4px;}
.tb-pol-s p{margin:6px 0 0;font-size:15px;line-height:1.7;color:var(--ink);word-break:keep-all;}
.tb-pol-s p.tb-pol-note,.tb-pol-note{margin:8px 0 0;font-size:13px;line-height:1.6;color:var(--muted);}
/* 문장 안 링크 — 누르는 자리 44px · 줄 높이는 위아래 10px 씩 덜 차지(관리 카드 절차 줄과 같은 방식) */
.tb-pol-a{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;margin:-10px 0;color:var(--green-text);font-weight:700;text-decoration:underline;text-underline-offset:2px;}
.tb-pol-tw{overflow-x:auto;margin-top:10px;}
.tb-pol-tb{width:100%;border-collapse:collapse;font-size:13px;line-height:1.6;color:var(--ink);background:var(--surface);}
.tb-pol-tb th,.tb-pol-tb td{padding:8px 10px;border:1px solid var(--line);text-align:left;vertical-align:top;}
.tb-pol-tb th{font-weight:700;white-space:nowrap;}
.tb-pol-ev{margin:12px 0 0;padding:4px 14px 12px;border:1px solid var(--gold-line);border-radius:12px;background:var(--surface);}
.tb-delall{margin:28px 0 8px;padding:16px;border:1px solid var(--line);border-radius:12px;background:var(--surface);}
.tb-delall-t{margin:0 0 6px;font-size:17px;font-weight:800;color:var(--ink-head);}
.tb-delall-d{margin:0 0 12px;font-size:15px;line-height:1.6;color:var(--muted);word-break:keep-all;}

/* ═══ PC 넓은 화면 2단(T-007 · 2026-10-04 대표 요청 · 설계 §3-9) — 넓게 펼치기(T-011 · 2026-10-04 대표 선택) ═══════════
   ★1200px 미만(폰·태블릿)은 아무것도 바뀌지 않는다 — 아래 규칙은 모두 (min-width:1200px) 안이고, 옆 칸(aside#tbSide)은
     tb-common.js 가 1200 이상에서만 그린다(1200 미만이면 DOM 에 없다 · 옮긴 부품은 제자리로 돌아간다).
   ★바깥 상자 = 윗줄 안쪽 칸 = 창 폭 전부(최대 1920 · 양옆 안쪽 여백 32 포함) — 모든 화면에서 윗줄 좌우 끝과 본문·옆 칸 좌우 끝이 같은 자리.
     (T-007 은 1088/1112 로 묶어 2000px 화면에서 양옆 약 45% 가 비었다 — 대표 지적)
   ★두 종류(T-011) — 가르는 것은 바깥 상자의 수정 클래스 하나(.tb-wrap.is-list · 마크업에 박혀 JS 없이 첫 그림부터 자리가 맞다):
     · 읽는·쓰는 화면(기본 — 글 상세 p.php · 글쓰기 · 운영정책 · 권리침해 · 닉): 본문 칸 최대 880(글 한 줄이 너무 길지 않게) ·
       옆 칸 = 남는 폭 전부(최소 340 — 좁은 창에선 본문 칸이 줄어든다).
     · 목록형 화면(.is-list — 목록 · 글 찾기 · 알림 / 보험사별 i.php 는 서버가 그리는 마크업·견본(scripts/fixtures)을 건드리지 않으려고
       :has(#tbInsPage) 로 같은 값): 본문 칸 = 남는 폭 전부 · 옆 칸 340(1600 이상 380).
     · 사이 32(1600 이상 40).
   ★JS 가 없어도(p.php 첫 그림) 본문 칸 자리는 같다 — 그리드 칸은 CSS 만으로 정해지고 옆 칸만 비어 있다. */
@media (min-width:1200px){
  .tb-top-in{max-width:1920px;padding:0 28px 0 30px;}   /* 윗줄 단추의 누르는 자리 여백만큼 안쪽(1200 미만 12/14 ↔ 상자 16 과 같은 차이) */
  .tb-wrap{display:grid;grid-template-columns:minmax(0,880px) minmax(340px,1fr);column-gap:32px;align-items:start;max-width:1920px;padding:0 32px;
    grid-template-areas:"main side" "foot foot";}
  .tb-wrap.is-list,.tb-wrap:has(#tbInsPage){grid-template-columns:minmax(0,1fr) 340px;}
  /* 글 상세 — 머리 아래 두 줄(.tb-intro)이 본문 칸 맨 위 · 옆 칸은 두 줄 옆부터 */
  .tb-wrap:has(> .tb-intro){grid-template-areas:"intro side" "main side" "foot foot";grid-template-rows:auto 1fr auto;}
  .tb-wrap > main{grid-area:main;min-width:0;}
  .tb-wrap > .tb-intro{grid-area:intro;}
  .tb-wrap > .tb-foot{grid-area:foot;}
  /* 옆 칸 — 윗줄(52px) 아래에 붙는다 · 창보다 길면 칸 안에서 스크롤(잘리지 않게) · 포커스 테두리가 칸 끝에서 잘리지 않게 안쪽 3px */
  .tb-side{grid-area:side;display:flex;flex-direction:column;gap:16px;min-width:0;position:sticky;top:calc(52px + env(safe-area-inset-top,0px) + 11px);
    max-height:calc(100vh - 52px - env(safe-area-inset-top,0px) - 22px);overflow-y:auto;overscroll-behavior:contain;
    margin:11px -3px 0;padding:3px 3px 8px;}
  .tb-side > *{margin:0;flex:none;}
  .tb-side .tb-find{flex-wrap:wrap;row-gap:0;}
  .tb-side .tb-find-q{flex:1 1 150px;}
  .tb-side .tb-rel{padding:0;border-top:0;}
  .tb-side .tb-rel-all{margin:10px 0 0;}
  .tb-side .tb-best-h{flex-wrap:wrap;}
  /* 옆 칸 베스트 줄 — 좁은 칸(줄 글 칸 약 200px)에서 정보 줄(말머리·닉·Lv·시간·사진·추천)이 한 줄에 안 들어가 12자 닉이 "닉..."으로 잘렸다.
     이 칸 안에서만 정보 줄이 줄바꿈하고(차례는 본문 줄 그대로 — 말머리 → 닉·등급·시간 묶음 → 사진·추천 · 넘치면 다음 줄로 · T-014 C1) 그래도 길면 닉 묶음 안에서 시간이 아래로(T-009 · 1200 미만·본문 칸 목록은 그대로) */
  .tb-side .tb-best-list .tb-row-info{height:auto;min-height:20px;flex-wrap:wrap;row-gap:0;white-space:normal;}
  .tb-side .tb-best-list .tb-row-meta{flex-wrap:wrap;overflow:visible;}   /* T-014 C1 — order 를 빼 본문 줄과 같은 차례(닉 → 등급 → 시간 → 사진·추천) · 칸이 좁으면 사진·추천이 아래 줄로 */
  .tb-side .tb-firstcard-btns .tb-btn{flex:1 1 auto;}
  /* 접힌 안내(첫 방문 카드를 닫은 뒤 · 다른 화면) — 카드와 같은 글자 · 머리 한 줄만 보이고 누르면 펼친다 */
  .tb-side-guide{padding:0 16px;}
  .tb-side-guide > summary{display:flex;align-items:center;gap:6px;min-height:48px;margin:0;cursor:pointer;list-style:none;}
  .tb-side-guide > summary::-webkit-details-marker{display:none;}
  .tb-side-guide > summary .tb-side-chev{margin-left:auto;color:var(--tb-sunk);}
  .tb-side-guide[open] > summary .tb-side-chev{transform:rotate(180deg);}
  .tb-side-guide > summary:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;border-radius:8px;}
  .tb-side-guide[open]{padding-bottom:12px;}
  .tb-side-guide .tb-side-pol{display:inline-flex;align-items:center;gap:2px;min-height:44px;margin-top:4px;color:var(--green-text);font-size:13px;font-weight:700;text-decoration:none;}
  .tb-side-guide .tb-side-pol:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;border-radius:6px;}
}
@media (min-width:1600px){
  .tb-wrap{column-gap:40px;}
  .tb-wrap.is-list,.tb-wrap:has(#tbInsPage){grid-template-columns:minmax(0,1fr) 380px;}
}
/* ── 위계 다듬기(T-013 · 2026-10-04 PM 디자인 검토 T-012 · 설계 §3-9) — 1200 이상만 · 문구 그대로 ──
   · 목록 머리 첫 줄(부제) 한 단계 강조 17/700/--ink-head(글자 단계 17 안)
   · 옆 칸 첫 방문 카드 [첫 질문 쓰기] — 주 버튼(짙은 채움) → 테두리형(.tb-btn 기본 모양 그대로). 화면의 주 버튼은 윗줄 [글쓰기] 하나
   · 고정 글 줄(#pinList)을 목록 장부와 같은 테두리·모서리 상자로(넓은 화면에서 떠 보이지 않게)
   · 글 찾기 칸 최대 폭 — 옆 칸 찾기 칸(입력 392 + 사이 8 + [찾기] ≈ 480 · 넓은 옆 칸에서 820 으로 늘어나지 않게) · 글 찾기 화면 본문 찾기 줄 ≤ 880 · 왼쪽 정렬 */
@media (min-width:1200px){
  .tb-lede{font-size:17px;}   /* 굵기·색(700 · --ink-head)은 모든 폭 공통(T-014 C3) */
  .tb-side .tb-find-q{max-width:392px;}
  .tb-wrap > main .tb-find{max-width:880px;}
}
/* ── 넓은 목록 한 줄 표(T-013 · 2026-10-04 대표 결정 D-PL-002 · 설계 §3-9) — 1600 이상 · 가운데 목록 칸의 줄만 ──
   한 줄 = 말머리 칩 → 제목(한 줄 · 넘치면 말줄임) → 오른쪽 정렬 정보(닉·등급·비회원 배지·시간·사진·추천·비추천 — 지금 정보 줄 그대로) → 댓글 칸 56.
   ★마크업은 그대로(TB.row · 서버 i.php 줄 · 견본 그대로) — 정보 줄 상자(.tb-row-info)를 display:contents 로 풀어 칩·제목·정보가 한 줄의 형제가 되고,
     칩만 order:-1 로 제목 앞. 제목이 남는 폭을 다 가져 정보가 오른쪽 끝(댓글 칸 앞)에 붙는다 — 제목과 숫자 사이를 눈으로 잇기 쉽게.
   ★대상: 목록(.is-list — 목록 #list · 글 찾기 #tbSearchList) · 보험사별(:has(#tbInsPage) — #tbInsList) 의 본문 칸(main) 줄.
     옆 칸(aside) 줄(베스트 · 같은 말머리 최근 글)은 두 줄 그대로 · 가려진 줄(.is-line 이미 한 줄) · 관리 모드 줄(.is-mod 배지·체크 칸)은 두 줄 그대로.
   ★줄 높이 52 — 누르는 자리 44 이상 · '답 기다려요' 칸(연필 16 + 사이 3 + 12px 두 줄 31.2 = 50.2)이 잘리지 않는 가장 낮은 높이.
   ★1600 미만은 줄 모양 그대로(두 줄 · 58) — 이 블록은 (min-width:1600px) 안에만 있다. */
@media (min-width:1600px){
  :is(.tb-wrap.is-list,.tb-wrap:has(#tbInsPage)) > main .tb-row:not(.is-line):not(.is-mod){min-height:52px;}
  :is(.tb-wrap.is-list,.tb-wrap:has(#tbInsPage)) > main .tb-row:not(.is-line):not(.is-mod) .tb-row-main{flex-direction:row;align-items:center;justify-content:flex-start;gap:6px;}
  :is(.tb-wrap.is-list,.tb-wrap:has(#tbInsPage)) > main .tb-row:not(.is-line):not(.is-mod) .tb-row-info{display:contents;}
  :is(.tb-wrap.is-list,.tb-wrap:has(#tbInsPage)) > main .tb-row:not(.is-line):not(.is-mod) .tb-row-tag{order:-1;margin-right:2px;}
  :is(.tb-wrap.is-list,.tb-wrap:has(#tbInsPage)) > main .tb-row:not(.is-line):not(.is-mod) .tb-row-title{display:block;flex:1 1 0;min-width:0;margin-right:10px;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-line-clamp:unset;line-clamp:unset;}
  :is(.tb-wrap.is-list,.tb-wrap:has(#tbInsPage)) > main .tb-row:not(.is-line):not(.is-mod) .tb-row-meta{flex:0 1 auto;}
}

/* ═══ 마우스 올림(T-007) — 마우스 기기만 · 키보드 :focus-visible 도 같은 표시(테두리 outline 은 각 규칙 그대로) ═══
   ★:hover 는 이 블록 안에만 둔다 — 터치 기기는 누른 뒤 :hover 가 남아(고착) 눌린 채로 보였다. 하네스가 CSSOM 으로 잰다.
   ★색만 바뀐다(120ms) · 움직임 줄이기면 바로 · transform 은 쓰지 않는다 */
@media (hover:hover) and (pointer:fine){
  .tb-btn:hover{border-color:var(--gold);}
  .tb-btn.is-primary:hover{background:var(--green-deep);border-color:var(--green-deep);}
  .tb-firstcard-btns .tb-btn.is-primary:hover{background:var(--surface);border-color:var(--gold);}   /* T-013·T-014 — 카드 버튼은 테두리형(.tb-btn:hover 와 같은 표시) */
  .tb-btn.is-danger:hover{background:color-mix(in srgb, var(--err) 88%, var(--ink));border-color:transparent;}
  .tb-chip:hover .tb-chip-face{border-color:var(--gold);}
  .tb-tabs.is-line .tb-tab:hover{color:var(--ink-head);}
  .tb-btn.is-danger-line:hover{border-color:var(--err);background:color-mix(in srgb, var(--err) 8%, transparent);}
  .tb-cmt-more:hover{background:var(--surface-2);color:var(--ink-head);}
  .tb-cmt-menu-item:hover{background:var(--surface-2);}
  .tb-fillchip:hover{border-color:var(--gold);}
  .tb-pick:hover{background:var(--tb-press);}
  .tb-row,.tb-pinline,.tb-act,.tb-tab,.tb-best-p,.tb-crumb-home,.tb-crumb-tag,.tb-foot-links a,.tb-foot-theme,.tb-who-link,.tb-ins-go,.tb-alert-a,
  .tb-rel-all,.tb-side-pol,.tb-side-guide > summary,.tb-empty-link,.tb-pol-toc a{transition:background-color .12s ease,color .12s ease,border-color .12s ease;}
  .tb-row:not(.is-current):hover,.tb-row:not(.is-current):focus-visible,.tb-pinline:hover,.tb-pinline:focus-visible,
  .tb-ins-go:hover,.tb-ins-go:focus-visible,.tb-alert-a:hover,.tb-alert-a:focus-visible{background:var(--tb-hover);}
  .tb-row:not(.is-line):hover .tb-row-title,.tb-row:not(.is-line):focus-visible .tb-row-title,
  .tb-pinline:hover .tb-pinline-t,.tb-pinline:focus-visible .tb-pinline-t{color:var(--green-text);}
  .tb-pinline:hover .tb-pinline-go,.tb-pinline:focus-visible .tb-pinline-go{color:var(--green-text);}
  /* 테두리는 그대로(--btn-line 3:1) — 금색 테두리는 흰 바탕 위 2.15:1 이라 경계 대비 규칙(§3-7)을 못 넘는다 */
  .tb-act:hover,.tb-act:focus-visible,.tb-foot-theme:hover,.tb-foot-theme:focus-visible{background:var(--tb-hover);}
  .tb-tabs.is-line .tb-tab:focus-visible{color:var(--ink-head);}
  .tb-best-p:not([aria-pressed="true"]):hover,.tb-best-p:not([aria-pressed="true"]):focus-visible{background:var(--surface-2);color:var(--ink-head);}
  .tb-crumb-home:hover,.tb-crumb-home:focus-visible,.tb-crumb-tag:hover,.tb-crumb-tag:focus-visible,.tb-foot-links a:hover,.tb-foot-links a:focus-visible,
  .tb-who-link:hover,.tb-who-link:focus-visible,.tb-side-pol:hover,.tb-side-pol:focus-visible,.tb-empty-link:hover,.tb-empty-link:focus-visible,
  .tb-pol-toc a:hover,.tb-pol-toc a:focus-visible{text-decoration:underline;text-underline-offset:3px;}
  .tb-side-guide > summary:hover,.tb-side-guide > summary:focus-visible{color:var(--green-text);}
}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:reduce){
  .tb-row,.tb-pinline,.tb-act,.tb-tab,.tb-best-p,.tb-crumb-home,.tb-crumb-tag,.tb-foot-links a,.tb-foot-theme,.tb-who-link,.tb-ins-go,.tb-alert-a,
  .tb-rel-all,.tb-side-pol,.tb-side-guide > summary,.tb-empty-link,.tb-pol-toc a{transition:none;}
}