
* { box-sizing: border-box; }
/* 한국어는 어절 중간에서 끊기면 읽기 나쁘다. 단 긴 주소가 넘치므로
   overflow-wrap과 반드시 함께 (2026-07-29 리서치). */
body, p, li, td, th, h1, h2, h3, summary, label, button {
  word-break: keep-all; overflow-wrap: break-word; }
/* 한지 결: 종이 그레인(feTurbulence) + 결 방향 섬유 두 겹.
   바탕색은 그대로 두고 결만 얹는다 (2026-07-29 피드백: 배경이 허전함). */
body { font-family: 'Noto Serif KR', 'Nanum Myeongjo', serif;
  background-color: #faf9f6; color: #191919; margin: 0; line-height: 1.75;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='p'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='260' height='260' filter='url(%23p)' opacity='0.085'/%3E%3C/svg%3E"),
    repeating-linear-gradient(94deg, transparent 0 6px,
      rgba(122, 110, 84, .026) 6px 7px),
    repeating-linear-gradient(3deg, transparent 0 11px,
      rgba(122, 110, 84, .019) 11px 12px);
  background-attachment: fixed; }
/* 왼쪽 고정 메뉴 (2026-07-29) — 권장치대로 폭 250px, 항목 높이 44px.
   좁은 화면에서는 숨기고 상단 메뉴가 대신한다. */
.side { position: fixed; left: 0; top: 0; bottom: 0; width: 250px;
  padding: 2.4rem 1.1rem 1.5rem; overflow-y: auto; z-index: 2;
  border-right: 1px solid #e3ddcc; background: rgba(250, 249, 246, .82);
  backdrop-filter: blur(2px); }
.sgroup { margin-bottom: 1.6rem; }
.sgroup h3 { font-family: Pretendard, 'Apple SD Gothic Neo', sans-serif;
  font-size: .68rem; letter-spacing: .18em; color: #6b6659;
  margin: 0 0 .35rem .8rem; font-weight: 700; }
.side a { display: flex; align-items: center; min-height: 44px;
  padding: 0 .8rem; border-radius: 8px; color: #191919;
  text-decoration: none; font-size: .95rem; }
.side a:hover { background: #f0ece1; }
.side a[aria-current="page"] { background: #191919; color: #faf9f6;
  font-weight: 700; }
.swhere { font-size: .76rem; color: #1c5cab; margin-left: .35rem; }
.sme-box { border-top: 1px dotted #c9c4b8; padding-top: 1rem; }
.sme { font-size: .8rem; color: #6b6659; margin: .2rem .8rem; }
.slink { font-size: .88rem; }
/* 본문 열의 자리.
   1차(2026-07-29): 사이드바에 붙여 놓으니 왼쪽으로 기울어 보여서 "남은 폭
   안에서 가운데"로 옮겼다. 2차 지적(같은 날): 그건 **사이드바를 뺀 화면**
   기준이라, 화면 전체로 보면 사이드바 폭의 절반(125px)만큼 오른쪽으로
   밀려 있었다. → **화면 전체 기준으로 가운데.**
   `50vw - 열폭/2`가 그 자리이고, 그 값이 사이드바보다 작아지는 좁은
   화면에서는 사이드바 옆으로 붙인다(밑으로 들어가면 안 되므로 max). */
main.wrap.side-on { padding-left: calc(250px + 1.4rem); }
@media (min-width: 1081px) {
  /* 50vw가 아니라 50% — vw는 스크롤바를 포함해서 그만큼(약 15px) 오른쪽으로
     밀린다. 퍼센트는 body 내용 폭 기준이라 정확히 가운데가 된다. */
  main.wrap.side-on {
    max-width: none;
    padding-left: max(calc(250px + 1.4rem), calc(50% - 360px));
    padding-right: 1.4rem; }
  main.wrap.side-on > * { max-width: 720px; }
  /* 랜딩(1020px 열)은 화면 전체 가운데가 물리적으로 불가능하다 —
     1020 + 사이드바 250이면 여백이 거의 없다. 그래서 **남은 폭 안에서
     좌우를 같게** 둔다: 양쪽 여백 = (화면 - 사이드바 - 열)/2.
     안 그러면 사이드바에 22px까지 붙는다 (2026-07-29 실측). */
  main.wrap.side-on.wide {
    max-width: none;
    padding-left: max(calc(250px + 1.4rem),
                      calc((100% + 250px - 1020px) / 2));
    padding-right: max(1.4rem, calc((100% - 250px - 1020px) / 2)); }
  main.wrap.side-on.wide > * { max-width: 1020px; }
}
@media (max-width: 1080px) {
  .side { display: none; }
  main.wrap.side-on { padding-left: 1.4rem; }
}
/* 여백에 세로로 옅게 — 광고가 들어오면 가려도 되는 자리.
   사이드바가 있는 폭에서는 왼쪽 것을 숨긴다 (겹침 방지) */
body:has(.side)::before { display: none; }
body::before, body::after {
  content: "후기의 후기 · 리뷰 신뢰도 판독";
  position: fixed; top: 4.5rem; writing-mode: vertical-rl;
  font-size: .8rem; letter-spacing: .55em; color: rgba(25, 25, 25, .075);
  pointer-events: none; user-select: none; z-index: 0; }
/* 양쪽 다 위에서 아래로 — 180도 돌리면 글자가 뒤집힌다 (실측 확인) */
body::before { left: 1.6rem; }
body::after { right: 1.6rem; }
@media (max-width: 1180px) {
  body::before, body::after { display: none; }
}
main.wrap { position: relative; z-index: 1; }
main.wrap { max-width: 720px; margin: 0 auto; padding: 2.2rem 1.4rem 4rem; }
main.wrap.wide { max-width: 1020px; }
.rule { border-top: 3px solid #191919; margin-bottom: .35rem; }
.rule2 { border-top: 1px solid #191919; margin-bottom: 2rem; }
.topnav { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap;
  margin-bottom: 2.4rem; }
/* 상단 워드마크. 작은 글자에 자간만 넓으면 두 글자가 흩어져 보인다
   (2026-07-29 지적) — 키우고 자간을 좁혀 한 낱말로 읽히게 한다. */
.brand { letter-spacing: .14em; font-size: 1.95rem; font-weight: 900;
  margin-right: auto; color: #191919; text-decoration: none;
  line-height: 1.15; }
.brand-lg { letter-spacing: .45em; font-size: 2.6rem; font-weight: 900;
  margin-bottom: 2rem; }
.masthead { text-align: center; margin-bottom: 2.4rem;
  position: relative; }
.stamp { position: absolute; right: -4px; top: 1.7rem; width: 94px;
  height: 94px; transform: rotate(8deg); opacity: .85; }
.orn { text-align: center; color: #b9b2a1; margin: 1.9rem 0 0;
  letter-spacing: .6em; font-size: .9rem; }
.orn + h2 { margin-top: .5rem; }
.rank { display: inline-flex; width: 1.35rem; height: 1.35rem;
  border: 1.5px solid #191919; border-radius: 50%; align-items: center;
  justify-content: center; font-size: .76rem; margin-right: .5rem;
  font-family: Pretendard, sans-serif; font-weight: 700; }
.picon { display: block; margin-bottom: .55rem; }
.spot { display: block; margin: 1.2rem 0 .4rem; }
.mast-name { display: block; font-size: 3.1rem; font-weight: 900;
  letter-spacing: -.02em; line-height: 1.15; color: #191919;
  text-decoration: none; }
.mast-sub { font-size: .82rem; letter-spacing: .38em; color: #55503f;
  margin-top: .3rem; }
.tag { font-size: 2.1rem; font-weight: 700; margin: .4rem 0 .7rem;
  line-height: 1.35; }
.deck { color: #444; max-width: 34em; margin-bottom: 1.6rem;
  font-size: 1.02rem; }
.searchbox { border: 1.5px solid #191919; border-radius: 12px;
  padding: 1.2rem 1.3rem 1.3rem; background: #fffdf8;
  margin-bottom: 1.6rem; }
.searchbox .modetabs { margin-bottom: .9rem; }
#linkTable td:first-child, #linkTable th { white-space: nowrap; }
#linkTable td:nth-child(3), #linkTable td:nth-child(4) {
  white-space: nowrap; }
/* 협찬 고지는 사실 표기일 뿐 흠이 아니다 — 색으로 도드라지게 하지 않는다 */
#linkTable td.spon { color: #55503f; font-size: .86rem; }
#ureviews { margin-top: 2.6rem; border-top: 2px solid #191919;
  padding-top: .4rem; }
/* 내 주변 — 오른쪽 위치 패널 (2026-07-30 요청: 지도꼴) */
.nearmap { background:#fffdf8; border:1px solid #e4e1da; border-radius:10px;
  padding:12px 14px; margin:1rem 0; }
.nearmap svg { width:100%; height:auto; background:#eef0ea;
  border-radius:8px; }
.nearmap h3 { margin:.1rem 0 .5rem; font-size:1rem; }
.nnum { color:#8a8577; margin-right:.15rem; }
@media (min-width:1280px) {
  main.wrap.side-on:has(.nearmap) { padding-right:390px; }
  .nearmap { position:fixed; top:96px; right:24px; width:340px; margin:0;
    z-index:3; animation:nslide .5s ease; }
}
@keyframes nslide { from { transform:translateX(28px); opacity:0; }
  to { transform:none; opacity:1; } }
/* 게시판꼴 표 (맛집 공유 갤러리·건의함) */
.tblwrap { overflow-x:auto; }
table.bd { width:100%; border-collapse:collapse; margin:.8rem 0; }
table.bd th, table.bd td { padding:.5rem .55rem; text-align:left;
  border-bottom:1px solid #e4e1da; font-size:.95rem; vertical-align:top; }
table.bd th { color:#6b6659; font-weight:600; font-size:.85rem; }
.exbox { border:1px dashed #c9c4b8; border-radius:10px; padding:.9rem 1rem;
  margin:1rem 0; background:#fcfbf7; }
.ovline { margin:.2rem 0 .1rem; }
/* 읽는 법 목록 */
.glist { list-style:none; padding:0; }
.glist li { border-bottom:1px solid #e4e1da; padding:.75rem 0; }
.glink { font-size:1.05rem; }
/* 광고 자리 — 랜딩만. 본문과 확실히 구분되게 (오인 금지) */
.adbox { margin:2.5rem 0 .5rem; padding-top:.8rem;
  border-top:1px solid #e4e1da; }
.adlabel { margin:0 0 .3rem; letter-spacing:.08em; }
/* 쪽지함 */
.mlist { list-style:none; padding:0; }
.mlist li { border-bottom:1px solid #e4e1da; padding:.7rem 0; }
.mnew { background:#1c5cab; color:#fff; border-radius:999px;
  font-size:.72rem; padding:.1rem .45rem; margin-left:.3rem; }
.ytl summary { cursor:pointer; color:#1c5cab; font-size:.9rem; }

/* 찜하기 — 눈에 띄되 차분하게 (적색·느낌표 금지) */
.wbar { display: flex; align-items: center; gap: .7rem; flex-wrap: wrap;
  margin: .9rem 0 1.2rem; }
.wbtn { padding: .5rem 1.1rem; font-size: .9rem; border-radius: 999px;
  border: 1.5px solid #191919; background: #fffdf8; color: #191919;
  cursor: pointer; font-family: inherit; font-weight: 700; }
.wbtn:hover { background: #eef3fa; }
.wbtn.on { background: #191919; color: #fffdf8; }
.wdelta { border: 1px solid #c9c4b8; border-left: 3px solid #191919;
  background: #fbfaf5; padding: .8rem 1.1rem .5rem; margin: 0 0 1.4rem;
  border-radius: 4px; }
.wdelta h2 { margin: 0 0 .4rem; font-size: .95rem; letter-spacing: .12em; }
.wdelta ul { margin: 0 0 .4rem; padding-left: 1.2rem; }
.wsince { margin: -.5rem 0 1.2rem; }
/* 업체 반론 — 우리 문장과 확실히 구분되게, 다만 차분하게 (적색 금지) */
.reb { margin: 1rem 0; padding: .8rem 1.2rem; border-left: 3px solid #b9b2a1;
  background: #f7f5ee; border-radius: 4px; }
.reb p { margin: 0 0 .4rem; white-space: pre-wrap; }
.reb footer { color: #6b6659; }
.rebform { margin: 1.2rem 0 2rem; }
.rebform label { font-size: .88rem; color: #55503f; }
.rebform input[type=text] { width: min(100%, 420px); }
.rebform textarea { width: 100%; max-width: 620px; font: inherit;
  font-size: 1rem; padding: .7rem; border: 1.5px solid #c9c4b8;
  border-radius: 10px; resize: vertical; background: #fffdf8; }
/* 이용자가 만든 목록 */
.llist { list-style: none; padding: 0; margin: 1.2rem 0; }
.llist li { padding: .8rem 0; border-bottom: 1px dotted #c9c4b8; }
.lname { font-size: 1.05rem; font-weight: 700; }
.snapline { color: #55503f; }
/* 지역 표기 — 최대 3개 또는 전국 (2026-07-29 요청) */
.rgnbox { border: 1px solid #c9c4b8; border-radius: 10px;
  padding: .5rem .9rem; background: #fbfaf5; margin: 0 0 1.2rem; }
.rgnbox summary { font-size: .92rem; color: #191919; }
.rgns { display: flex; flex-wrap: wrap; gap: .1rem .9rem;
  margin: .5rem 0 .9rem; }
.rgn { font-size: .92rem; white-space: nowrap; min-width: 4.6rem; }
.rgn.wide { min-width: 0; }
.rgnbox button { padding: .45rem 1.1rem; font-size: .88rem;
  border-radius: 999px; }
.sharebar { display: flex; align-items: center; gap: .5rem;
  flex-wrap: wrap; margin: .8rem 0 .4rem; }
.sharebox { width: min(100%, 420px); font-size: .92rem;
  border-bottom: 1.5px solid #b9b2a1; }
.sharebar .wbtn { padding: .45rem 1rem; font-size: .88rem; }
.opform select { font: inherit; font-size: .95rem; padding: .5rem .3rem;
  border: 1.5px solid #c9c4b8; border-radius: 8px; background: #fffdf8; }
.wlist { list-style: none; padding: 0; margin: 1rem 0; }
.wlist li { display: flex; align-items: baseline; gap: .6rem;
  flex-wrap: wrap; padding: .75rem 0; border-bottom: 1px dotted #c9c4b8; }
.wlist .wname { font-size: 1.05rem; font-weight: 700; margin-right: auto; }
.wform { display: inline; }
/* 목록의 '그만보기'는 이름보다 커지면 안 된다 — 글씨처럼 보이게 */
.linkish { background: none; border: none; padding: 0; font: inherit;
  font-size: .84rem; font-weight: 400; color: #6b6659;
  text-decoration: underline; cursor: pointer; border-radius: 0; }
.linkish:hover { color: #191919; }
.rform textarea { width: 100%; font: inherit; font-size: 1rem;
  padding: .7rem; border: 1.5px solid #c9c4b8; border-radius: 10px;
  resize: vertical; margin-bottom: .6rem; background: #fffdf8; }
.vchoices { margin: .6rem 0 .5rem; }
.vchoice { margin-right: 1rem; font-size: .92rem; white-space: nowrap; }
.rform button { padding: .55rem 1.4rem; font-size: .9rem;
  border-radius: 999px; }
.ophead { margin: 2.2rem 0 .2rem; font-size: 1rem; letter-spacing: .1em;
  padding-top: 1rem; border-top: 1px dotted #c9c4b8; }
.opform { display: flex; gap: .4rem; flex-wrap: wrap; margin: .6rem 0; }
.opform input[type=text] { padding: .5rem .3rem; font-size: .95rem; }
.opform input[name=nick] { width: 7rem; }
.opform input[name=body] { flex: 1; min-width: 12rem; }
.opform textarea { flex: 1 1 100%; padding: .55rem .6rem;
  font: inherit; font-size: .95rem; border: 1px solid #d8d4ca;
  border-radius: 8px; resize: vertical; }
/* 내 정보·건의는 한 줄짜리 입력이 아니라 폭을 넉넉히 준다 */
.opform input#nk, .opform input#cf { flex: 1; min-width: 12rem; }
.opform button { padding: .5rem 1.1rem; font-size: .88rem;
  border-radius: 999px; }
.oerr { color: #a8471f; }
.votes { display: inline-flex; align-items: center; gap: .45rem;
  margin-top: .2rem; }
.inline { display: inline; }
.vbtn { font-family: Pretendard, 'Apple SD Gothic Neo', sans-serif;
  font-size: .78rem; border: 1px solid #d8d2c4; border-radius: 999px;
  padding: .12rem .6rem; color: #55503f; background: #fffdf8;
  cursor: pointer; }
.vbtn:hover { border-color: #191919; }
.linkbtn { font-family: Pretendard, 'Apple SD Gothic Neo', sans-serif;
  background: none; border: none; padding: 0; font-size: .82rem;
  color: #6b6659; text-decoration: underline; cursor: pointer; }
.warnbox { border: 1px solid #e3ddcc; background: #f4f1e8;
  border-left: 4px solid #b9b2a1; border-radius: 8px;
  padding: .7rem 1rem; }
.hot { font-size: .72rem; background: #f3f7fd; color: #1c5cab;
  border: 1px solid #cddcf0; border-radius: 999px; padding: .06rem .5rem;
  margin-right: .3rem; font-family: Pretendard, sans-serif; }
.oplist li { border-top: 1px dotted #e0dace; }
.rlist { list-style: none; padding: 0; margin: 1.2rem 0 0; }
.rlist li { border-top: 1px dotted #c9c4b8; padding: .8rem 0;
  line-height: 1.7; }
.vtag { font-size: .74rem; border: 1px solid #b9b2a1; border-radius: 999px;
  padding: .08rem .55rem; margin-right: .35rem; color: #55503f; }
.rcount { font-size: .76rem; color: #1c5cab; border: 1px solid #cddcf0;
  background: #f3f7fd; border-radius: 999px; padding: .04rem .5rem; }
.src { font-size: .74rem; color: #8a8474; border: 1px solid #d8d2c4;
  border-radius: 4px; padding: 0 .3rem; margin-left: .3rem; }
.wherebox { margin: .2rem 0 1.2rem; font-size: .9rem; }
.wherebox label { color: #55503f; margin-right: .3rem; }
.wherebox input { width: 12rem; font-size: .92rem; padding: .3rem .2rem; }
.wherebox button { padding: .35rem .9rem; font-size: .82rem;
  border-radius: 999px; }
.nearbtn { margin-top: .8rem; padding: 0; background: none; border: none;
  color: #1c5cab; font-size: .88rem; cursor: pointer;
  text-decoration: underline; text-underline-offset: 3px;
  font-family: Pretendard, 'Apple SD Gothic Neo', sans-serif; }
.principles { display: grid; grid-template-columns: 1fr 1fr 1fr;
  gap: 1.2rem; margin: .7rem 0 1rem; }
.principles div { border-top: 2px solid #191919; padding-top: .6rem;
  font-size: .95rem; line-height: 1.55; }
.steps { margin-bottom: .4rem; }
@media (max-width: 640px) {
  .principles { grid-template-columns: 1fr; gap: .9rem; }
  .mast-name { font-size: 2.3rem; }
  .stamp { display: none; }
}
@media print {
  .topnav, .navsearch, #linkTabs, #pageTabs, .adslot, form {
    display: none; }
  body { background: #fff; }
  main.wrap { max-width: 100%; padding: 0; }
}
.modetabs { margin-bottom: 1.1rem; }
.modetabs button { padding: .45rem 1.2rem; font-size: .9rem;
  background: transparent; color: #191919; border: 1.5px solid #b9b2a1;
  border-radius: 999px; margin-right: .4rem; }
.modetabs button.on { background: #191919; color: #faf9f6;
  border-color: #191919; }
.adslot { margin-top: 2.6rem; border: 1px dashed #c9c4b8; border-radius: 10px;
  min-height: 90px; display: flex; align-items: center;
  justify-content: center; }
/* 처음 오신 분께 한 번만 — 무엇을 보여주고 무엇을 안 하는지.
   JS가 꺼져 있으면 아예 안 뜬다(그래야 닫을 수 없는 창이 안 생긴다). */
/* 덮개는 `main` **밖**에 둔다 (2026-07-29 실측으로 두 번 걸렸다):
   ① main 안에 두면 본문 열 폭 제한(`> *`)에 걸려 1905px 화면에서 덮개가
      1020px로 잘리고 왼쪽으로 치우친다.
   ② main이 `position:relative; z-index:1`로 쌓임 맥락을 만들어, 안에 있는
      z-index 20이 사이드바(z-index 2)를 못 넘는다 — 사이드바만 안 덮인다. */
#hello { display: none; position: fixed; inset: 0; z-index: 20;
  background: rgba(25, 25, 25, .38); align-items: center;
  justify-content: center; padding: 1.2rem; }
#hello.on { display: flex; }
#hello .card { background: #faf9f6; border: 1px solid #c9c4b8;
  border-radius: 14px; padding: 1.6rem 1.7rem 1.3rem;
  max-width: 460px; max-height: 86vh; overflow-y: auto;
  box-shadow: 0 10px 34px rgba(25, 25, 25, .18); }
#hello h2 { margin: 0 0 .8rem; font-size: 1.15rem; letter-spacing: .06em; }
#hello ul { padding-left: 1.1rem; margin: .4rem 0 1rem; }
#hello li { margin-bottom: .45rem; }
#hello .row { display: flex; align-items: center; gap: .8rem;
  flex-wrap: wrap; margin-top: .4rem; }
#hello label { font-size: .85rem; color: #55503f; }
.navsearch { display: flex; align-items: center; gap: .4rem; }
.navsearch input[type=text] { width: 170px; font-size: .92rem;
  padding: .35rem .2rem; }
.navsearch button { padding: .42rem .95rem; font-size: .82rem;
  border-radius: 999px; }
.navbtn { font-family: Pretendard, 'Apple SD Gothic Neo', sans-serif;
  padding: .3rem .95rem; border: 1.5px solid #191919; border-radius: 999px;
  text-decoration: none; color: #191919; font-size: .82rem; }
.navbtn:hover { background: #191919; color: #faf9f6; }
h1 { font-size: 2rem; font-weight: 700; letter-spacing: -.01em;
  margin: .2rem 0 1.1rem; }
h2 { font-size: .85rem; letter-spacing: .25em; color: #1c5cab;
  margin: 2.6rem 0 .9rem; font-weight: 700; }
table { border-collapse: collapse; }
td, th { border: none; border-bottom: 1px dotted #c9c4b8;
  padding: .45rem .9rem; font-size: .95rem; }
th { font-weight: 700; color: #55503f; font-size: .82rem;
  letter-spacing: .12em; }
tr:last-child td { border-bottom: none; }
.small { color: #6b6659; font-size: .85rem; }
.mobile-only { display: none; }
@media (max-width: 1080px) {
  .mobile-only { display: flex; margin-bottom: 1.4rem; gap: .4rem; }
}
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0;
  margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
  border: 0; }
.obs { background: #f4f1e8; border: 1px solid #e3ddcc;
  border-left: 4px solid #1c5cab; border-radius: 10px;
  padding: .2rem 1.2rem .7rem; margin-top: 1.4rem; }
.obs h2 { margin-top: .9rem; letter-spacing: .15em; }
.obs li { margin-bottom: .4rem; }
.rows { list-style: none; padding: 0; margin: 0; }
.rows li { display: flex; justify-content: space-between;
  align-items: center; border-bottom: 1px dotted #c9c4b8;
  padding: .4rem 0; }
.rows li > span:first-child { display: inline-flex; align-items: center;
  gap: .55rem; }
.rows svg { flex: none; }
.rows .num { font-variant-numeric: tabular-nums; color: #555; }
.ttabs { margin-bottom: .55rem; display: flex;
  justify-content: space-between; align-items: center; flex-wrap: wrap;
  gap: .3rem .8rem; }
.ttabs.sub { margin-bottom: .8rem; }
/* 기간 탭은 순위 **아래**에 (2026-07-29 요청) — 목록을 먼저 보고
   "언제 기준이지?" 할 때 손이 닿는 자리. 위 컨트롤과 구분되게 선을 얹는다. */
.ttabs.pbar { margin-top: .7rem; padding-top: .55rem;
  border-top: 1px solid #ddd7c7; }
.tgrid { display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 0 2.2rem; }
/* 급등할 자료가 아니다 — 눈이 편한 속도로 (2026-07-29 피드백) */
@keyframes rowUp {
  from { opacity: 0; transform: translateY(9px); }
  to { opacity: 1; transform: none; }
}
.rows li { animation: rowUp 1.1s cubic-bezier(.25, .6, .25, 1) both; }
@media (prefers-reduced-motion: reduce) {
  .rows li { animation: none; }
}
.tcol h3 { font-size: .82rem; letter-spacing: .22em; font-weight: 700;
  margin: 0 0 .35rem; padding-bottom: .3rem; color: #1c5cab;
  border-bottom: 2px solid #191919; font-family: Pretendard,
  'Apple SD Gothic Neo', sans-serif; }
@media (max-width: 760px) {
  .tgrid { grid-template-columns: 1fr; gap: 1.4rem 0; }
}
.up { color: #1c5cab; font-size: .68rem; margin-left: .35rem; }
.dn { color: #6b6659; font-size: .68rem; margin-left: .35rem; }
.src { color: #6b6659; }
.ttab.sm { padding: .16rem .7rem; font-size: .76rem; }
.ttab { font-family: Pretendard, 'Apple SD Gothic Neo', sans-serif;
  display: inline-block; padding: .28rem .95rem; margin: 0 .35rem .4rem 0;
  border: 1.5px solid #b9b2a1; border-radius: 999px; font-size: .84rem;
  font-weight: 600; color: #191919; text-decoration: none; }
.ttab.on { background: #191919; color: #faf9f6; border-color: #191919; }
input[type=text] { font-family: inherit; padding: .8rem .3rem;
  width: min(60%, 340px); font-size: 1.05rem; border: none;
  border-bottom: 2px solid #191919; background: transparent; }
input[type=text]:focus { border-bottom-color: #1c5cab; }
:focus-visible { outline: 2px solid #1c5cab; outline-offset: 2px; }
button { font-family: Pretendard, 'Apple SD Gothic Neo', sans-serif;
  padding: .9rem 1.5rem; font-size: .96rem; font-weight: 700; border: none;
  border-radius: 14px; background: #191919; color: #faf9f6; cursor: pointer; }
button.ghost { background: transparent; color: #191919;
  border: 2px solid #191919; }
a { color: #1c5cab; }
details { margin: .6rem 0; }
details summary { cursor: pointer; color: #55503f; font-size: .85rem; }
#linkTabs button, #pageTabs button { margin: 0 5px 6px 0;
  padding: .3rem .9rem; font-size: .84rem; font-weight: 600;
  background: transparent; color: #191919; border: 1.5px solid #b9b2a1;
  border-radius: 999px; cursor: pointer; }
#linkTabs button.on, #pageTabs button.on { background: #191919;
  color: #faf9f6; border-color: #191919; }
@media (max-width: 640px) {
  main.wrap { padding: 1.4rem 1rem 3rem; }
  .tag { font-size: 1.9rem; }
  input[type=text] { width: 100%; margin-bottom: .6rem; }
}
