/* [GS cat1030 2026-10-30 대표 «시안에서 준 내용대로 바꾸되 카테고리명은 좌측정렬로»] 카테고리 알약 단추 → 글자 탭·펼침 판(시안 4차 source/tab1029/cand/gs_t29*.css 이식)
   ① 베스트 보기 = 음식 사진 동그라미 ② 분류 = 회색 글자 줄 + ▼ 4칸 펼침 판(아래 어둡게) ③ 목록 세부 줄 → «필터» 단추 안 ④ 큰 메뉴 끝 «이벤트» · 맨 위 바로가기 줄·큰 제목 숨김
   움직임 = js/gs_cat1030.js · 시안의 html.gs-t29 켜짐 조건은 :root 로 바꿔 늘 켬 */
/* 10/29 시안 · 카테고리 단추(알약) → 글자 탭 · 대표 «너무 AI 같다 · 이 방식(글자 탭 + 펼침)으로 · 우리 톤에 맞게»
   1단 보기 탭 = 글자 15 + 고른 칸만 진갈색 밑줄 2px · 2단 분류 = 글자 14 · 안 고름 진갈색 62% · 고름 진갈색 굵게
   면·테두리 0 · 민트는 맨 위 큰 탭(홈·베스트…) 한 곳만 */
:root { --t29-on: var(--gs-text, #24190f); --t29-off: rgba(36, 25, 15, .62); --t29-off1: rgba(36, 25, 15, .58); --t29-bg: var(--gs-app, #fffcf7); }

/* ── 1단: 보기 탭(베스트 화면 · 메인 베스트 · 메인 시간) ── */
:root #wrap #gsViews.gs-views, :root #wrap #gsBestTabs.gs-tabs-pill {
  display: flex !important; grid-template-columns: none !important; column-gap: 22px !important; gap: 0 22px !important; overflow-x: auto; scrollbar-width: none;
  padding: 0 var(--gs-gutter, 20px) !important; margin: 0 0 4px !important; border-bottom: 1px solid var(--gs-line, #ece5db); background: none; }
:root #wrap #gsBestTabs.gs-tabs-pill { margin-bottom: 18px !important; }
:root #wrap #gsViews.gs-views > button, :root #wrap #gsViews.gs-views > a, :root #wrap #gsBestTabs > button {
  flex: 0 0 auto !important; display: inline-flex; align-items: center; height: 46px !important; min-height: 0 !important; padding: 0 !important; margin: 0 0 -1px;
  border: 0 !important; border-bottom: 2px solid transparent !important; border-radius: 0 !important; background: none !important; box-shadow: none !important;
  font-size: 15px !important; font-weight: 500 !important; letter-spacing: -0.02em !important; line-height: 1 !important; white-space: nowrap !important; color: var(--t29-off1) !important; }
:root #wrap #gsViews.gs-views > [aria-pressed="true"], :root #wrap #gsBestTabs > [aria-selected="true"] {
  color: var(--t29-on) !important; font-weight: 700 !important; border-bottom-color: var(--t29-on) !important; }

:root #wrap #gsClockTabs.gs-clock-tabs { gap: 0 !important; border-bottom: 1px solid var(--gs-line, #ece5db); }
:root #wrap #gsClockTabs > button { border: 0 !important; box-shadow: none !important; outline: 0; background: none !important; border-radius: 0 !important; padding: 6px 0 10px !important; margin-bottom: -1px; gap: 3px; border-bottom: 2px solid transparent !important; }
:root #wrap #gsClockTabs b { font-size: 12px !important; font-weight: 600 !important; color: var(--t29-off) !important; }
:root #wrap #gsClockTabs span { font-size: 14px !important; font-weight: 500 !important; color: var(--t29-off1) !important; letter-spacing: -0.02em; }
:root #wrap #gsClockTabs > [aria-selected="true"] { border-bottom-color: var(--t29-on) !important; }
:root #wrap #gsClockTabs > [aria-selected="true"] b, :root #wrap #gsClockTabs > [aria-selected="true"] span { color: var(--t29-on) !important; font-weight: 700 !important; }

/* ── 2단: 분류 글자 줄(베스트·목록·골라담기·자주 묻는 질문·메인 간편 한 스푼) ── */
:root #wrap .gs-t29-row { column-gap: 18px !important; gap: 0 18px !important; align-items: center; padding-top: 2px !important; padding-bottom: 2px !important; }
:root #wrap .gs-t29-row > .gs-chip, :root #wrap .gs-t29-row > button:not(.gs-v18y-nav), :root #wrap .gs-t29-row > a.gs-chip {
  flex: 0 0 auto; height: 40px !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: none !important; box-shadow: none !important;
  font-size: 14px !important; font-weight: 500 !important; letter-spacing: -0.02em; color: var(--t29-off) !important; white-space: nowrap; }
:root #wrap .gs-t29-row.gs-t29-row > [aria-pressed="true"], :root #wrap .gs-t29-row.gs-t29-row > .on, :root #wrap .gs-t29-row.gs-t29-row > [aria-selected="true"] { color: var(--t29-on) !important; font-weight: 700 !important; }
:root #wrap .gs-t29-row small, :root #wrap .gs-t29-row .gs-v19-c { font-size: 12px !important; font-weight: 500 !important; opacity: .7; margin-left: 3px; font-variant-numeric: tabular-nums; }
:root #wrap .gs-t29-row .gs-v19-lbl, :root #wrap .gs-t29-row .gs-v18u-lbl { font-size: 12px !important; font-weight: 700 !important; color: var(--t29-on) !important; opacity: .9; padding-right: 2px; }
/* 세부·기준 줄 = 고르면 글자 앞에 작은 점(여러 개 고르는 줄이라 «켜짐»이 보이게) */
:root #wrap .gs-t29-row.t29-multi > [aria-pressed="true"]:not([data-v19-t=""]):not([data-v19-n=""])::before { content: ''; display: inline-block; width: 5px; height: 5px; margin-right: 5px; border-radius: 50%; background: var(--gs-accent-ink, #00785F); vertical-align: middle; }
:root #wrap .gs-t29-row.t29-sub2 { padding-top: 0 !important; }
:root #wrap .gs-t29-row.t29-sub2 > .gs-chip, :root #wrap .gs-v19-frow.gs-t29-row > .gs-chip { height: 36px !important; }
:root #wrap .gs-t29-row.t29-sub2 > .gs-chip { font-size: 13px !important; }

/* 간편 한 스푼 = 우리 음식 사진 동그라미는 남기고 알약 면만 뺌 */
:root #wrap #gsWhoChips.gs-t29-row > button { display: inline-flex; align-items: center; gap: 7px; height: 44px !important; }
:root #wrap #gsWhoChips img { display: block !important; flex: 0 0 auto; width: 30px; height: 30px; border-radius: 50%; object-fit: cover; transition: box-shadow .15s; }
:root #wrap #gsWhoChips > [aria-selected="true"] img { box-shadow: 0 0 0 2px var(--t29-bg), 0 0 0 3.5px var(--t29-on); }

/* ── 펼침(∨) 단추 + 전체 분류 판 ── */
:root .gs-t29-wrap { position: relative; border-bottom: 1px solid var(--gs-line, #ece5db); margin-bottom: 10px; }
:root .gs-t29-wrap.has-more > .gs-t29-row { padding-right: 48px !important; }
:root .gs-t29-wrap.has-more > .gs-t29-row > .gs-v18y-nav.r::before { opacity: 0 !important; }
:root .gs-t29-more { display: none; position: absolute; top: 0; right: 0; bottom: 0; width: 56px; border: 0; padding: 0 0 0 14px; z-index: 4; cursor: pointer;
  background: linear-gradient(to right, rgba(255, 252, 247, 0), var(--t29-bg) 34%); }
:root .gs-t29-wrap.has-more > .gs-t29-more { display: block; }
:root .gs-t29-more::before { content: ''; position: absolute; left: 50%; top: 50%; width: 7px; height: 7px; margin: -6px 0 0 2px; border: solid var(--gs-sub, #5e4f40); border-width: 0 1.6px 1.6px 0; transform: rotate(45deg); transition: transform .2s; }
:root .gs-t29-wrap.open > .gs-t29-more::before { transform: rotate(-135deg); margin-top: -2px; }
:root .gs-t29-panel { position: absolute; left: 0; right: 0; top: 0; z-index: 30; background: var(--t29-bg); border-bottom: 1px solid var(--gs-line, #ece5db);
  box-shadow: 0 10px 18px -10px rgba(36, 25, 15, .18); padding: 0 var(--gs-gutter, 20px) 10px; }
:root .gs-t29-panel[hidden] { display: none; }
:root .gs-t29-panel .hd { display: flex; align-items: center; justify-content: space-between; height: 48px; font-size: 14px; font-weight: 700; color: var(--t29-on); letter-spacing: -0.02em; }
:root .gs-t29-panel .hd button { width: 44px; height: 44px; margin-right: -12px; border: 0; background: none; position: relative; cursor: pointer; }
:root .gs-t29-panel .hd button::before { content: ''; position: absolute; left: 50%; top: 50%; width: 7px; height: 7px; margin: -2px 0 0 -4px; border: solid var(--gs-sub, #5e4f40); border-width: 0 1.6px 1.6px 0; transform: rotate(-135deg); }
:root .gs-t29-panel .gd { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 8px; }
:root .gs-t29-panel .gd button { height: 46px; padding: 0 2px; border: 0; background: none; font: inherit; font-size: 14px; font-weight: 500; letter-spacing: -0.03em; line-height: 1.25; color: var(--t29-off); word-break: keep-all; text-align: center; cursor: pointer; }
:root .gs-t29-panel .gd button.on { color: var(--t29-on); font-weight: 700; }

/* 목록 위 «오늘의 핫딜 · 기획전·이벤트 · 신상스푼» = 다른 화면 가는 길 → 글자 + 가는 꺾쇠(›) · 사이 가는 세로선 */
:root #wrap #gsV18Follow.gs-v18-chips { display: flex !important; align-items: center; column-gap: 0 !important; gap: 0 !important; padding-top: 6px !important; padding-bottom: 6px !important; }
:root #wrap #gsV18Follow .gs-v18-chip { display: inline-flex; align-items: center; height: 36px !important; padding: 0 !important; margin: 0 20px 0 0; border: 0 !important; border-radius: 0 !important; background: none !important; box-shadow: none !important;
  font-size: 14px !important; font-weight: 600 !important; letter-spacing: -0.02em; color: var(--gs-sub, #5e4f40) !important; position: relative; }
:root #wrap #gsV18Follow .gs-v18-chip::before { content: ''; width: 5px; height: 5px; order: 2; margin-left: 6px; border: solid rgba(36, 25, 15, .45); border-width: 1.4px 1.4px 0 0; transform: rotate(45deg); }
:root #wrap #gsV18Follow .gs-v18-chip::after { content: none !important; }
:root .gs-t29-wrap:has(.gs-cs-cats) { border-bottom: 0; margin-bottom: 0; }
/* 좁은 폰(갤럭시 360 · 폴드 344) = 보기 탭 4칸이 한 줄에 다 보이게 */
@media (max-width: 380px) {
  :root #wrap #gsViews.gs-views, :root #wrap #gsBestTabs.gs-tabs-pill { column-gap: 15px !important; gap: 0 15px !important; }
  :root #wrap #gsViews.gs-views > button, :root #wrap #gsViews.gs-views > a, :root #wrap #gsBestTabs > button { font-size: 14px !important; }
}

/* ══ 2차(10/30 대표 «메뉴가 뜬금없이 시작 · 위 큰 메뉴에 딱 붙어 시작 · 큰 제목은 빼거나 다른 자리로») ══ */
/* 베스트·목록 화면: 맨 위 «오늘의 핫딜·기획전·신상스푼» 줄과 큰 제목을 빼고, 세부 메뉴가 큰 메뉴 바로 밑에서 시작 */
:root #gsV18Follow { display: none !important; }
:root #wrap #gsBestPage > .gs-ph, :root #wrap #gsListPage > .gs-ph { display: none !important; }
/* 베스트 보기 = 큰 메뉴 밑 회색 글자 줄(예시의 «전체·식단관리…» 자리) · 밑줄 없이 굵기·진하기로 */
:root #wrap #gsViews.gs-views { padding-top: 2px !important; margin: 0 !important; column-gap: 20px !important; gap: 0 20px !important; }
:root #wrap #gsViews.gs-views > button, :root #wrap #gsViews.gs-views > a { height: 48px !important; border-bottom: 0 !important; font-size: 15px !important; color: var(--t29-off) !important; }
:root #wrap #gsViews.gs-views > [aria-pressed="true"] { color: var(--t29-on) !important; font-weight: 700 !important; }
/* 목록 화면: 분류 이름은 «총 N개» 줄 왼쪽으로 */
:root #wrap #gsListPage .gs-tools .gs-t29-h1 { margin: 0 8px 0 0; font-size: 14px !important; font-weight: 700 !important; color: var(--t29-on); letter-spacing: -0.02em; display: inline; }
:root #wrap #gsListPage .gs-t29-wrap { margin-bottom: 0; }
:root #wrap #gsListPage #gsV18uRow { border-bottom: 1px solid var(--gs-line, #ece5db); margin-bottom: 8px; }

/* 메인 베스트: «베스트 1~9» 제목을 빼고 탭 글자가 곧 제목(고른 것만 진하게) · 설명·더 보기는 그 밑 한 줄 */
:root #wrap #sec-best > #gsBestTabs.gs-tabs-pill { border-bottom: 0 !important; margin: 0 !important; column-gap: 16px !important; gap: 0 16px !important; }
:root #wrap #sec-best > #gsBestTabs > button { height: auto !important; padding: 2px 0 !important; border-bottom: 0 !important; font-size: 19px !important; font-weight: 800 !important; letter-spacing: -0.035em !important; color: rgba(36, 25, 15, .3) !important; }
:root #wrap #sec-best > #gsBestTabs > [aria-selected="true"] { color: var(--t29-on) !important; }
:root #wrap #sec-best .gs-sec-hd { align-items: center; padding-bottom: 14px !important; margin-top: 4px; }
:root #wrap #sec-best .gs-sec-hd h3 { display: none; }
:root #wrap #sec-best .gs-sec-hd .gs-sub { margin: 0; }
@media (max-width: 380px) { :root #wrap #sec-best > #gsBestTabs > button { font-size: 17px !important; } :root #wrap #sec-best > #gsBestTabs.gs-tabs-pill { column-gap: 12px !important; gap: 0 12px !important; } }
/* 메인 간편 한 스푼·시간: 설명 한 줄을 빼고 제목 바로 밑에 붙임 */
:root #wrap #sec-who .gs-sec-hd .gs-sub, :root #wrap #sec-time .gs-sec-hd .gs-sub { display: none; }
:root #wrap #sec-who .gs-sec-hd, :root #wrap #sec-time .gs-sec-hd { padding-bottom: 4px !important; align-items: center; }
:root #wrap #gsWhoChips.gs-t29-row { padding-bottom: 12px !important; }
@media (max-width: 380px) {
  :root #wrap #gsViews.gs-views { column-gap: 14px !important; gap: 0 14px !important; }
  :root #wrap #gsViews.gs-views > button, :root #wrap #gsViews.gs-views > a { font-size: 14px !important; }
}

/* ══ 3차(10/30 · 윙잇·쿠캣·컬리 비교 반영) — 큰 메뉴 밑: ① 보기 = 음식 사진 동그라미(컬리) ② 분류 = 회색 글자 줄 + ▼ 4칸 펼침(윙잇) ③ «총 N개 · 정렬 · 필터» 한 줄(컬리) ══ */
:root { --t29-dim: rgba(36, 25, 15, .38); }
/* ① 보기 4칸 = 사진 동그라미 */
:root #wrap #gsViews.gs-views { display: grid !important; grid-template-columns: repeat(var(--gs-vn, 4), minmax(0, 1fr)) !important; gap: 0 6px !important; column-gap: 6px !important; padding: 14px var(--gs-gutter, 20px) 10px !important; border-bottom: 0 !important; overflow: visible !important; }
:root #wrap #gsViews.gs-views > button { display: flex !important; flex-direction: column; align-items: center; gap: 7px; height: auto !important; padding: 0 !important; font-size: 13px !important; font-weight: 500 !important; letter-spacing: -0.03em !important; color: var(--t29-off) !important; white-space: nowrap; }
:root #wrap #gsViews .t29-ph { position: relative; display: block; width: 64px; height: 64px; border-radius: 50%; overflow: hidden; background: #f5efe6; box-shadow: inset 0 0 0 1px rgba(36, 25, 15, .06); transition: box-shadow .15s; }
:root #wrap #gsViews .t29-ph img { width: 100%; height: 100%; object-fit: cover; display: block; }
:root #wrap #gsViews .t29-ph b { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 15px; font-weight: 800; letter-spacing: -0.03em; color: var(--gs-sub, #5e4f40); }
:root #wrap #gsViews > [aria-pressed="true"] { color: var(--t29-on) !important; font-weight: 700 !important; }
:root #wrap #gsViews > [aria-pressed="true"] .t29-ph { box-shadow: 0 0 0 2px var(--t29-bg), 0 0 0 4px var(--gs-accent, #2CD3A0); }
/* ② 분류 회색 글자 줄 (2차 «분류 전체 ∨» 대신 다시 줄로) · 위아래 가는 선 */
:root #wrap #gsBestPage .gs-t29-wrap { border-top: 1px solid var(--gs-line, #ece5db); margin-bottom: 0; }
:root .gs-t29-panel .gd { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; column-gap: 4px; }
:root .gs-t29-panel .gd button { font-size: 13.5px; height: 44px; }
:root .gs-t29-panel .hd { font-size: 15px; }
:root .gs-t29-dim { display: none; position: absolute; left: 0; right: 0; top: 0; height: 300vh; z-index: 29; background: var(--t29-dim); }
:root .gs-t29-wrap.open > .gs-t29-dim, :root .gs-t29-fwrap.open > .gs-t29-dim { display: block; }
/* ③ 베스트 설명 = «총 N개» 자리 한 줄 */
:root #wrap #gsBestPage .gs-rank-note { display: flex; align-items: center; height: 46px; margin: 0 !important; padding: 0 var(--gs-gutter, 20px); font-size: 13px; color: var(--t29-off); }
:root #wrap #gsBestPage .gs-rank-note b { color: var(--t29-on); font-weight: 700; margin-right: 2px; }
/* 목록: 세부 줄을 «필터» 단추 안으로 */
:root #wrap #gsListPage #gsV18uRow.t29-hide { display: none !important; }
:root #wrap #gsListPage .gs-tools { position: relative; align-items: center; }
:root .gs-t29-fbtn { display: inline-flex; align-items: center; gap: 5px; height: 36px; margin-left: 14px; padding: 0; border: 0; background: none; font: inherit; font-size: 13px; color: var(--gs-sub, #5e4f40); cursor: pointer; }
:root .gs-t29-fbtn svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; }
:root .gs-t29-fbtn em { font-style: normal; font-weight: 700; color: var(--gs-accent-ink, #00785F); }
:root .gs-t29-fwrap { position: relative; }
:root .gs-t29-fwrap .gs-t29-panel .gd { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
:root .gs-t29-fwrap .gs-t29-panel .gd button { display: flex; align-items: center; gap: 8px; justify-content: flex-start; text-align: left; padding-left: 2px; }
:root .gs-t29-fwrap .gs-t29-panel .gd button::before { content: ''; flex: 0 0 auto; width: 16px; height: 16px; border-radius: 4px; box-shadow: inset 0 0 0 1.5px rgba(36, 25, 15, .28); }
:root .gs-t29-fwrap .gs-t29-panel .gd button.on::before { background: var(--gs-accent-ink, #00785F) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.2l2.6 2.5L12 5.4' fill='none' stroke='%23fff' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat; box-shadow: none; }

/* ══ 4차(10/30 대표) ══ */
/* 전체 분류 판: 한 칸 한 줄 · 칸 폭은 글자만큼, 양 끝 맞춤 */
:root .gs-t29-wrap .gs-t29-panel .gd.t29-fit { column-gap: 6px; }
:root .gs-t29-wrap .gs-t29-panel .gd.t29-fit button { white-space: nowrap; letter-spacing: -0.04em; padding: 0; }
/* 메인 베스트: 탭 3칸 똑같이 나눠 · 글자는 칸마다 왼쪽에서 시작(대표 10/30 «3등분 하되 좌측정렬») · 선 없음 */
:root #wrap #sec-best > #gsBestTabs.gs-tabs-pill { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; column-gap: 0 !important; gap: 0 !important; overflow: visible !important; border: 0 !important; box-shadow: none !important; background: none !important; margin: 0 0 2px !important; }
:root #wrap #sec-best > #gsBestTabs > button { justify-content: flex-start !important; text-align: left !important; height: 48px !important; padding: 0 !important; border: 0 !important; box-shadow: none !important; background: none !important; font-size: 18px !important; font-weight: 800 !important; letter-spacing: -0.04em !important; color: rgba(36, 25, 15, .3) !important; }
:root #wrap #sec-best > #gsBestTabs > button::before, :root #wrap #sec-best > #gsBestTabs > button::after, :root #wrap #sec-best > #gsBestTabs::before, :root #wrap #sec-best > #gsBestTabs::after { content: none !important; display: none !important; }
:root #wrap #sec-best > #gsBestTabs > .gs-v18y-nav { display: none !important; }
:root #wrap #sec-best > #gsBestTabs > [aria-selected="true"] { color: var(--t29-on) !important; }
@media (max-width: 380px) { :root #wrap #sec-best > #gsBestTabs > button { font-size: 16.5px !important; } }

/* 좌측정렬(10/30 대표 «가운데 정렬은 들쭉날쭉 · 왼쪽으로») — 펼침 판 칸 이름은 칸 왼쪽 끝에서 시작해 세로로 가지런히 · 필터 판과 같은 시작선
   · 사진 동그라미 밑 이름은 동그라미 가운데 그대로(왼쪽이면 이름이 동그라미에서 비켜 보임) */
:root .gs-t29-panel .gd button, :root .gs-t29-wrap .gs-t29-panel .gd.t29-fit button { text-align: left; padding-left: 2px; }
