/* NABBA NEWS — 2026-10-07 리디자인(Figma v3). 흰 바탕·#111·골드는 선과 검정 판 위 숫자만. 기준: DESIGN.md */
:root{
  /* 글자 크기 4단계(2026-10-16 수정요청 "사이즈는 3~4개"): 작게·본문·소제목·제목. 새 스타일도 이 넷만 쓴다 */
  --fs-s:13px;--fs-m:16px;--fs-l:clamp(20px,2vw,24px);--fs-xl:clamp(32px,4.4vw,60px);
  --bg:#fff;--surface:#f5f5f5;--ink:#111;--ink-2:#444;--muted:#6e6e6e;--subtle:#a3a3a3;
  --line:#e5e5e5;--ink-line:#333;--gold:#D4AF37;--gold-deep:#7A6119;--on-ink:#fff;
  --kr:"Noto Sans KR",system-ui,-apple-system,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
  --num:"Archivo","Noto Sans KR",system-ui,sans-serif;
  /* 나바 서체(2026-10-21): 제목 Black Han Sans, 숫자·영문 Archivo ExtraBold 이탤릭 와이드, 본문 Noto Sans KR */
  --display:"Black Han Sans","Noto Sans KR",system-ui,sans-serif;
  --pad:clamp(20px,5.6vw,80px);--max:1280px;--sec:clamp(64px,8vw,120px);
  --ease:cubic-bezier(.2,.75,.5,1);
}
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important} /* 숨김 속성이 display 지정(.season li 등)에 덮이지 않게 — 2026-10-10 '오늘' 줄이 대회 당일에도 보이던 버그 */
html{-webkit-text-size-adjust:100%;scroll-padding-top:80px}
body{background:var(--bg);color:var(--ink);font-family:var(--kr);font-size:var(--fs-m);line-height:1.7;overflow-x:hidden;-webkit-font-smoothing:antialiased;word-break:keep-all;overflow-wrap:anywhere}
img,video{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
button,input,select{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer}
:focus-visible{outline:2px solid var(--gold-deep);outline-offset:3px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:var(--on-ink);padding:10px 14px;z-index:100}.skip:focus{left:8px}
.wrap{width:100%;max-width:calc(var(--max) + var(--pad)*2);margin:0 auto;padding:0 var(--pad)}
.preview-note{background:var(--surface);color:var(--ink-2);font-size:var(--fs-s);text-align:center;padding:8px var(--pad)}

/* ---------- 공통 글자·부품 ---------- */
.kick{font-size:var(--fs-s);font-weight:700;letter-spacing:.02em;color:var(--gold-deep);line-height:1.4}
.label{font-size:var(--fs-s);font-weight:700;color:var(--gold-deep);margin:40px 0 16px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 22px;border-radius:999px;background:var(--ink);color:var(--on-ink);font-weight:700;font-size:var(--fs-m);white-space:nowrap;transition:transform .2s var(--ease),background .2s}
.btn:hover{transform:translateY(-1px)}
.btn--sm{min-height:40px;padding:0 18px;font-size:var(--fs-m)}
.btn--gold{background:var(--gold);color:var(--ink)}
.pill{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 18px;border-radius:999px;border:1px solid var(--ink);font-weight:700;font-size:var(--fs-m);white-space:nowrap;background:transparent}
.pill:hover{background:var(--ink);color:var(--on-ink)}
.pill--dark{border-color:var(--on-ink);color:var(--on-ink)}.pill--dark:hover{background:var(--on-ink);color:var(--ink)}
.more{display:inline-flex;align-items:center;gap:6px;min-height:44px;font-size:var(--fs-m);font-weight:700;white-space:nowrap}
.more:hover{text-decoration:underline;text-underline-offset:4px}
.actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}.actions--center{justify-content:center}
.note{font-size:var(--fs-s);color:var(--muted);margin-top:20px}
.flag{display:inline-block;font-size:var(--fs-s);background:var(--ink);color:var(--on-ink);padding:2px 8px;border-radius:999px;margin-left:6px}
.is-gfx img{aspect-ratio:16/9!important;object-fit:contain;background:var(--ink)}
.is-gfx .plate{display:none}
.ai-note{font-size:var(--fs-s);color:var(--muted);margin-top:28px}

/* 숫자(Montserrat) */
.fig{display:inline-flex;align-items:baseline;gap:5px;font-family:var(--num);font-style:italic;font-stretch:semi-expanded;font-weight:800;letter-spacing:-.02em;line-height:1}
.fig b{font-size:var(--fs-l)}.fig small{font-family:var(--kr);font-size:var(--fs-s);font-weight:500;color:var(--ink-2)}
.plate{position:absolute;left:0;bottom:0;display:inline-flex;align-items:baseline;gap:8px;background:var(--ink);color:var(--gold);padding:12px 18px;font-family:var(--num);font-style:italic;font-stretch:semi-expanded;font-weight:800;line-height:1}
.plate b{font-size:var(--fs-xl);letter-spacing:-.03em}.plate small{font-family:var(--kr);font-size:var(--fs-s);font-weight:700;color:var(--on-ink)}

/* ---------- 머리(사이트 탐색) ---------- */
.nav{position:sticky;top:0;z-index:60;background:var(--bg);border-bottom:1px solid var(--ink)}
.nav__bar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;height:68px;max-width:calc(var(--max) + var(--pad)*2);margin:0 auto;padding:0 var(--pad)}
.nav__menu{display:flex;gap:4px;flex-wrap:nowrap}
.nav__item>a{display:inline-flex;align-items:center;min-height:44px;padding:0 9px;font-size:var(--fs-m);font-weight:700;white-space:nowrap}
.nav__item>a:hover,.nav__item>a[aria-current]{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:6px}
.nav__logo{display:flex;align-items:center;justify-content:center;min-height:44px}
.logo{display:block;aspect-ratio:1946/550;width:140px;background:currentColor;-webkit-mask:url(/logo.svg) center/contain no-repeat;mask:url(/logo.svg) center/contain no-repeat}
.nav__right{display:flex;align-items:center;justify-content:flex-end;gap:6px}
.nav__link{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 10px;font-size:var(--fs-m);font-weight:700}
.nav__search svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2}
.nav__search span{display:none}
.nav__burger{display:none;width:44px;height:44px;flex-direction:column;justify-content:center;align-items:flex-start;gap:5px;padding-left:4px}
.nav__burger i{display:block;width:22px;height:2px;background:var(--ink);transition:transform .25s var(--ease),opacity .2s}
.nav.has-drawer .nav__burger i:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav.has-drawer .nav__burger i:nth-child(2){opacity:0}
.nav.has-drawer .nav__burger i:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.sub{position:absolute;left:0;right:0;top:100%;background:var(--bg);border-bottom:1px solid var(--line);box-shadow:0 12px 24px rgba(0,0,0,.06);opacity:0;visibility:hidden;transition:opacity .2s}
.sub.is-open{opacity:1;visibility:visible}
.sub__row{display:none;gap:22px;align-items:center;max-width:calc(var(--max) + var(--pad)*2);margin:0 auto;padding:14px var(--pad);font-size:var(--fs-m)}
.sub__row.is-on{display:flex;flex-wrap:wrap}
.sub__row b{font-weight:900;margin-right:6px}
.sub__row a{display:inline-flex;align-items:center;min-height:40px;color:var(--ink-2)}.sub__row a:hover{color:var(--ink);text-decoration:underline}
.drawer{position:fixed;inset:57px 0 0 0;z-index:59;background:var(--bg);overflow:auto;transform:translateY(-8px);opacity:0;visibility:hidden;transition:opacity .2s,transform .25s var(--ease)}
.drawer.is-open{opacity:1;visibility:visible;transform:none}
.drawer__inner{padding:16px 20px 48px}
.drawer__grp{border-bottom:1px solid var(--line);padding:14px 0}
.drawer__top{display:flex;align-items:center;min-height:44px;font-size:var(--fs-l);font-weight:900}
.drawer__sub{display:flex;flex-wrap:wrap;gap:4px 16px}.drawer__sub a{display:inline-flex;align-items:center;min-height:40px;font-size:var(--fs-m);color:var(--ink-2)}
.drawer__row{display:flex;flex-wrap:wrap;gap:8px;padding-top:24px}

/* ---------- 섹션 공통 ---------- */
.sec{padding:var(--sec) 0 0}
.sec--tight{padding-top:48px}
.sec--dark{background:var(--ink);color:var(--on-ink);margin-top:var(--sec);padding-bottom:var(--sec)}
.sec--dark .kick,.sec--dark .label{color:var(--gold)}
.sh{position:relative;display:flex;justify-content:space-between;align-items:flex-end;gap:20px;padding-top:18px;margin-bottom:32px}
.sh::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--ink);transform-origin:0 50%}
.sec--dark .sh::before{background:var(--gold)}
.sh__text h2{font-size:var(--fs-xl);font-weight:900;letter-spacing:-.03em;line-height:1.2;margin-top:8px}
.sh__desc{font-size:var(--fs-m);color:var(--ink-2);margin-top:10px;max-width:620px}
.sec--dark .sh__desc{color:var(--subtle)}

/* ---------- 홈: 제호 ---------- */
.mast__line{display:flex;justify-content:space-between;gap:16px;font-size:var(--fs-s);color:var(--muted);padding:12px 0 0}
.mast__links{display:flex;gap:14px}.mast__links a{color:var(--ink)}
.mast__logo{display:flex;justify-content:center;padding:20px 0 26px;border-bottom:1px solid var(--ink)}
.logo--mast{width:clamp(220px,24vw,320px)}

/* 홈: 표지(질문 → 짧은 답 → 사진) */
.cover{padding:40px 0 48px}
.cover__grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(24px,4vw,64px);align-items:start}
.cover__kick{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:var(--fs-s);color:var(--muted)}
.cover__q{font-size:var(--fs-xl);font-weight:900;letter-spacing:-.045em;line-height:1.16;margin:16px 0 24px}
.cover__q a:hover{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:8px}
.short{border-left:3px solid var(--gold);padding:2px 0 2px 18px}
.short__head{font-size:var(--fs-s);font-weight:700;color:var(--gold-deep)}
.short__rows{margin-top:10px}
.short__rows div{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:8px 0;border-bottom:1px solid var(--line)}
.short__rows dt{font-size:var(--fs-m);font-weight:500;color:var(--ink-2)}
.short__rows dd{display:flex;align-items:baseline;gap:6px;font-family:var(--num);font-style:italic;font-stretch:semi-expanded;font-weight:800;line-height:1}
.short__rows dd b{font-size:var(--fs-l);letter-spacing:-.02em}
.short__rows dd small{font-family:var(--kr);font-size:var(--fs-s);font-weight:500;color:var(--ink-2)}
.short__note{font-size:var(--fs-s);color:var(--muted);margin-top:10px;line-height:1.6}
.short__note--lg{font-size:var(--fs-m);color:var(--ink-2);line-height:1.75}
.cover__basis{font-size:var(--fs-m);color:var(--ink-2);margin-top:18px}
.cover__act{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;margin-top:24px;font-size:var(--fs-s);color:var(--muted)}
.cover__act b{color:var(--ink)}
.cover__fig img{width:100%;aspect-ratio:4/3;object-fit:cover}
.cover__fig--wide img{aspect-ratio:16/9}  /* 논문이 아닌 표지 글: 무대·현장 사진(16:9)을 자르지 않게 */
.cover__fig figcaption{font-size:var(--fs-s);color:var(--muted);margin-top:8px}

/* 홈: 대회 주간 띠 */
.cweek{background:var(--ink);color:var(--on-ink)}
.cweek__grid{display:grid;grid-template-columns:168px 1fr auto;gap:24px;align-items:center;padding-top:22px;padding-bottom:22px}
.cweek__img img{width:168px;aspect-ratio:16/10;object-fit:cover}
.cweek .kick{color:var(--gold)}
.cweek__name{font-size:var(--fs-l);font-weight:900;letter-spacing:-.02em;margin-top:4px}
.cweek__name a:hover{text-decoration:underline}
.cweek__meta{font-size:var(--fs-s);color:var(--subtle)}
.cweek__act{display:flex;gap:8px;flex-wrap:wrap}

/* 홈: 이번 주 */
.wk{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.wk a{position:relative;display:flex;flex-direction:column;gap:6px;height:100%;padding:0 26px 18px 0;border-bottom:1px solid var(--line)}
.wk__kick{font-size:var(--fs-s);color:var(--muted)}
.wk b{font-size:var(--fs-m);font-weight:700;line-height:1.45;letter-spacing:-.01em}
.wk__fig{font-family:var(--num);font-style:italic;font-stretch:semi-expanded;font-weight:700;font-size:var(--fs-m);color:var(--ink-2);margin-top:auto}.wk__fig small{font-family:var(--kr);font-size:var(--fs-s)}
.wk__go{position:absolute;right:0;top:22px;color:var(--gold-deep)}
.wk a:hover b{text-decoration:underline}

/* 고민 칩 */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.hx-chip{min-height:44px;padding:0 18px;border-radius:999px;border:1px solid var(--ink);font-size:var(--fs-m);font-weight:700;background:var(--bg)}
.hx-chip[aria-pressed="true"]{background:var(--ink);color:var(--gold)}
.answers__label{font-size:var(--fs-s);font-weight:700;color:var(--gold-deep);margin:24px 0 8px}

/* 목록 줄 */
.rows{display:grid;gap:0 32px}
.rows--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.row a{display:grid;grid-template-columns:112px 1fr 20px;gap:16px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line);height:100%}
.rows--dark .row a{border-color:var(--ink-line)}
.row__img img{width:112px;aspect-ratio:4/3;object-fit:cover}
.row__body{display:flex;flex-direction:column;gap:3px;min-width:0}
.row__kick{font-size:var(--fs-s);color:var(--muted)}
.rows--dark .row__kick{color:var(--subtle)}
.row b{font-size:var(--fs-m);font-weight:700;line-height:1.45}
.row__dek{font-size:var(--fs-s);color:var(--ink-2);line-height:1.6}
.rows--dark .row__dek{color:var(--subtle)}
.row__fig{font-family:var(--num);font-style:italic;font-stretch:semi-expanded;font-weight:700;font-size:var(--fs-m)}.row__fig small{font-family:var(--kr);font-size:var(--fs-s);color:var(--muted)}
.row__go{color:var(--gold-deep);align-self:start;margin-top:4px}
.rows--dark .row__go{color:var(--gold)}
.row a:hover b{text-decoration:underline}

/* 카드 */
.card a{display:flex;flex-direction:column;gap:8px}
.card__img{display:block;overflow:hidden;margin-bottom:6px}
.card__img img{width:100%;aspect-ratio:16/9;object-fit:cover;transition:transform .5s var(--ease)}
.card a:hover .card__img img{transform:scale(1.03)}
.card__kick{font-size:var(--fs-s);color:var(--muted)}
.card__title{font-size:var(--fs-l);font-weight:700;line-height:1.4;letter-spacing:-.02em}
.card--sm .card__title{font-size:var(--fs-m)}
.card__dek{font-size:var(--fs-m);color:var(--ink-2)}
.card__meta{font-size:var(--fs-s);color:var(--muted)}
.card a:hover .card__title{text-decoration:underline}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}

/* 홈: 운동·식단·회복 */
.topics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;margin-top:28px}
.topics--4{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.topics--4 .card__title{font-size:var(--fs-l)}
.topic__head{display:flex;justify-content:space-between;align-items:center;border-bottom:2px solid var(--ink);margin-bottom:16px}
.topic__head b{font-size:var(--fs-l);font-weight:900}
.links li a{display:flex;justify-content:space-between;gap:12px;align-items:center;min-height:52px;padding:12px 0;border-bottom:1px solid var(--line);font-size:var(--fs-m);font-weight:700}
.links li a span[aria-hidden]{color:var(--gold-deep)}
.links li a:hover{text-decoration:underline}
.topic .links{margin-top:12px}
.topic{display:flex;flex-direction:column}
.topic .card__kick,.topic .card__meta{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.topic .card__title{min-height:2.8em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.links__t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* 홈: 무대(검정) */
.stage{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:40px}
.stage__next{display:flex;flex-direction:column;gap:8px}
.stage__img img{width:100%;aspect-ratio:16/9;object-fit:cover}
.stage__kick{font-size:var(--fs-s);color:var(--gold);margin-top:8px}
.stage__next b{font-size:var(--fs-l);font-weight:900;letter-spacing:-.02em;line-height:1.35}
.stage__dek{font-size:var(--fs-m);color:var(--subtle)}
.stage__next:hover b{text-decoration:underline}
.season__h{font-size:var(--fs-m);font-weight:900;padding-bottom:10px;border-bottom:1px solid var(--on-ink)}
.season li{display:grid;grid-template-columns:62px 1fr auto;gap:14px;align-items:center;padding:12px 0;border-bottom:1px solid var(--ink-line)}
.season__date{font-family:var(--num);font-style:italic;font-stretch:semi-expanded;font-weight:700;font-size:var(--fs-m)}
.season__name{display:flex;flex-direction:column;font-size:var(--fs-m);font-weight:700;line-height:1.4}
.season__name a{text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--ink-line)}
.season__name small{font-size:var(--fs-s);font-weight:400;color:var(--subtle)}
.season__state{font-size:var(--fs-s);color:var(--subtle);white-space:nowrap}
.season li.is-next .season__date,.season li.is-next .season__state{color:var(--gold)}
.season .more{margin-top:6px;color:var(--on-ink)}
.results{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.results a{display:flex;flex-direction:column;gap:10px}
.results__img img{width:100%;aspect-ratio:16/9;object-fit:cover}
.results__body{display:flex;flex-direction:column;gap:4px}
.results__body b{font-size:var(--fs-m);line-height:1.4}
.results__body small{font-size:var(--fs-s);color:var(--subtle)}
.results a:hover b{text-decoration:underline}

/* 홈: 피플 */
.feature{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,4vw,48px);align-items:center}
.feature__img img{width:100%;aspect-ratio:16/10;object-fit:cover}
.feature__text{display:flex;flex-direction:column;gap:12px}
.feature__text b{font-size:var(--fs-xl);font-weight:900;letter-spacing:-.03em;line-height:1.2}
.feature__text>span:not(.kick):not(.feature__meta){font-size:var(--fs-m);color:var(--ink-2)}
.feature__meta{font-size:var(--fs-s);color:var(--muted)}
.feature:hover b{text-decoration:underline}

/* 가로 띠 */
.rail{position:relative}
.rail__track{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;padding-bottom:10px}
.rail__track>li{flex:0 0 auto;scroll-snap-align:start}
.rail--people .rail__track>li{width:clamp(150px,15vw,200px)}
.label-row{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:40px 0 16px}.label-row .label{margin:0}
.ivgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.rail__ctrl{display:flex;gap:8px;justify-content:flex-end;margin-top:8px}
.rail__ctrl button{width:44px;height:44px;border:1px solid currentColor;border-radius:999px}
.rail__ctrl button:disabled{opacity:.3;cursor:default}

/* 영상 */
.vid{display:flex;flex-direction:column;gap:10px}
.vid__frame{position:relative;display:block;background:#000;overflow:hidden}
.vid__frame img{width:100%;aspect-ratio:16/9;object-fit:cover}
.vid--v .vid__frame img{aspect-ratio:9/16}
.vid__frame iframe{display:block;width:100%;aspect-ratio:16/9;border:0}
.vid--v .vid__frame iframe{aspect-ratio:9/16}
.vid__play{position:absolute;left:12px;bottom:12px;display:inline-flex;align-items:center;min-height:36px;padding:0 14px;border-radius:999px;background:var(--gold);color:var(--ink);font-size:var(--fs-s);font-weight:700}
.vid__title{font-size:var(--fs-m);font-weight:700;line-height:1.45}
.vid__meta{display:block;font-size:var(--fs-s);color:var(--muted);margin-top:2px}
.sec--dark .vid__meta{color:var(--subtle)}
.vid__desc{display:block;font-size:var(--fs-m);color:var(--ink-2);margin-top:6px}
.sec--dark .vid__desc{color:var(--subtle)}
.vid__rel{font-size:var(--fs-s);color:var(--muted);margin-top:6px}.vid__rel a{text-decoration:underline}
.tv{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:32px;margin-bottom:28px}
.tv>.vid .vid__title{font-size:var(--fs-l)}
.tv__list{display:flex;flex-direction:column;justify-content:space-between}
.tv__list li{padding:14px 0;border-top:1px solid var(--ink-line)}
.tv__list li:first-child{padding-top:0;border-top:0}
.tv__list .vid{display:grid;grid-template-columns:minmax(0,190px) 1fr;gap:16px;align-items:center}
.tv__list .vid__play{left:6px;bottom:6px;min-height:28px;padding:0 10px;font-size:var(--fs-s)}

.vgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.vgrid--v{grid-template-columns:repeat(5,minmax(0,1fr));gap:20px}

/* ---------- 하위 페이지 머리 ---------- */
.phead{text-align:center;padding:56px 0 8px}
.phead h1{font-size:var(--fs-xl);font-weight:900;letter-spacing:-.05em;line-height:1.05;margin-top:12px}
.phead__lead{font-size:var(--fs-m);color:var(--ink-2);max-width:620px;margin:16px auto 0}
.phead__stats{display:flex;justify-content:center;gap:32px;margin-top:20px;font-size:var(--fs-s);color:var(--muted)}
.phead__stats b{font-family:var(--num);font-style:italic;font-stretch:semi-expanded;font-weight:800;font-size:var(--fs-l);color:var(--ink);margin-right:5px}
.subnav{display:flex;justify-content:center;flex-wrap:wrap;gap:0 26px;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);margin-top:36px;padding:2px 0}
.subnav a{display:inline-flex;align-items:center;gap:6px;min-height:46px;min-width:44px;justify-content:center;font-size:var(--fs-m);font-weight:700;color:var(--muted)}
.subnav a span{font-family:var(--num);font-style:italic;font-stretch:semi-expanded;font-size:var(--fs-s)}
.subnav a[aria-current]{color:var(--ink);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:8px}

/* 섹션: 모자이크 + 지난 글 표 */
.mosaic{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px}
.mosaic__lead{display:flex;flex-direction:column;gap:10px}
.mosaic__img{position:relative;display:block;margin-bottom:8px}
.mosaic__img img{width:100%;aspect-ratio:4/3;object-fit:cover}
.mosaic__lead b{font-size:var(--fs-xl);font-weight:900;letter-spacing:-.03em;line-height:1.2}
.mosaic__dek{font-size:var(--fs-m);color:var(--ink-2)}
.mosaic__lead:hover b{text-decoration:underline}
.mosaic__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 24px;align-content:start}
.index{border-top:2px solid var(--ink)}
.index a{display:grid;grid-template-columns:120px 120px 1fr 180px 100px;gap:20px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}
.index__img img{width:120px;aspect-ratio:3/2;object-fit:cover}
.index__kind{font-size:var(--fs-s);color:var(--ink-2)}
.index__title{font-size:var(--fs-l);font-weight:700;line-height:1.45}
.index__fig{font-family:var(--num);font-style:italic;font-stretch:semi-expanded;font-weight:800;font-size:var(--fs-l)}.index__fig small{font-family:var(--kr);font-size:var(--fs-s);font-weight:500;color:var(--muted)}
.index__date{font-size:var(--fs-s);color:var(--muted);text-align:right}
.index a:hover .index__title{text-decoration:underline}
.method{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,3fr);gap:40px;align-items:start}
.method h2{font-size:var(--fs-l);font-weight:900;line-height:1.3;margin-top:8px}
.method ol{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.method li{border-top:1px solid var(--gold);padding-top:16px;display:flex;flex-direction:column;gap:10px;font-size:var(--fs-m)}
.method li b{font-family:var(--num);font-style:italic;font-stretch:semi-expanded;font-weight:800;font-size:var(--fs-l);color:var(--gold)}

/* ---------- 기사 ---------- */
.reading-progress{position:fixed;left:0;right:0;top:0;height:3px;z-index:70;pointer-events:none}
.reading-progress span{display:block;height:100%;background:var(--gold);transform-origin:0 50%;transform:scaleX(0)}
.art__path{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:var(--fs-s);color:var(--muted);padding:24px 0 12px;border-bottom:1px solid var(--ink)}
.art__path a{color:var(--ink);font-weight:700}.art__path a:hover{text-decoration:underline}
.art__head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);align-items:center;padding:40px 0 48px}
.art__title h1{font-size:var(--fs-xl);font-weight:900;letter-spacing:-.045em;line-height:1.12;margin-bottom:28px}
.byline{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:var(--fs-s);color:var(--muted);margin-top:24px;padding-top:16px;border-top:1px solid var(--line)}
.art__img{position:relative;display:block}
.art__img img{width:100%;height:auto;max-height:min(72vh,680px);object-fit:contain;background:var(--surface)}
.art__img.is-gfx img{aspect-ratio:auto!important;object-fit:fill}
.art__fig figcaption{font-size:var(--fs-s);color:var(--muted);margin-top:8px}
.art__layout{display:grid;grid-template-columns:200px minmax(0,680px) 220px;justify-content:space-between;gap:40px;padding-top:40px;border-top:1px solid var(--line)}
.art__rail{position:sticky;top:96px;align-self:start}
.article-toc summary{display:flex;align-items:center;min-height:44px;font-size:var(--fs-s);font-weight:700;color:var(--gold-deep);cursor:pointer;list-style:none}
.article-toc summary::-webkit-details-marker{display:none}
.article-toc nav{display:flex;flex-direction:column}
.article-toc a{display:block;padding:8px 0 8px 12px;border-left:1px solid var(--line);font-size:var(--fs-s);color:var(--muted);line-height:1.5}
.article-toc a[aria-current]{border-left:2px solid var(--ink);color:var(--ink);font-weight:700}
.art__tools{display:flex;flex-wrap:wrap;gap:6px;margin-top:20px}
.art__tools button{min-height:44px;padding:0 12px;border-radius:999px;border:1px solid var(--line);font-size:var(--fs-s)}
.art__tools button[aria-pressed="true"]{border-color:var(--ink);font-weight:700}
.article-copy{font-size:var(--fs-l);line-height:1.85;color:var(--ink-2)}
.article-copy.is-large{font-size:var(--fs-l)}
.article-copy section{padding-bottom:28px}
.article-copy section>.kick{font-family:var(--num);font-style:italic;font-stretch:semi-expanded;font-size:var(--fs-s)}
.article-copy h2{font-size:var(--fs-l);font-weight:900;color:var(--ink);letter-spacing:-.025em;line-height:1.4;margin:6px 0 16px}
.article-copy p{margin-bottom:18px}
.article-copy a{text-decoration:underline;text-underline-offset:3px}
.article-disclosure{background:var(--surface);padding:12px 16px;font-size:var(--fs-m)}
.table-wrap{overflow-x:auto;margin:8px 0 22px}
table{width:100%;border-collapse:collapse;font-size:var(--fs-m);line-height:1.55}
th,td{text-align:left;padding:11px 12px 11px 0;border-bottom:1px solid var(--line);vertical-align:top}
thead th{border-bottom:2px solid var(--ink);color:var(--ink);font-weight:700;white-space:nowrap}
caption{text-align:left;font-weight:900;color:var(--ink);padding:16px 0 8px}
.gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 12px;align-items:start}
.gallery figure{display:flex;flex-direction:column;gap:6px}
.gallery figure a{display:block}
.gallery img{width:100%;height:auto}
.gallery figcaption{font-size:var(--fs-s);color:var(--muted);line-height:1.5}
.article-faq details{border-top:1px solid var(--ink)}
.article-faq details:last-child{border-bottom:1px solid var(--ink)}
.article-faq summary{display:flex;justify-content:space-between;gap:16px;align-items:center;min-height:56px;font-size:var(--fs-m);font-weight:700;color:var(--ink);cursor:pointer;list-style:none}
.article-faq summary::-webkit-details-marker{display:none}
.article-faq summary::after{content:"+";font-family:var(--num);font-style:italic;font-stretch:semi-expanded;font-size:var(--fs-l)}
.article-faq details[open] summary::after{content:"−"}
.article-faq p{font-size:var(--fs-m);padding-bottom:16px;margin:0}
.article-sources{border-top:2px solid var(--ink);padding-top:16px;font-size:var(--fs-m)}
.article-sources h2{font-size:var(--fs-l);margin-top:0}
.article-sources li{padding:10px 0;border-bottom:1px solid var(--line);font-size:var(--fs-m)}
.article-sources>p{font-size:var(--fs-s);color:var(--muted);margin-top:16px}
.article-video .vid{margin-bottom:20px}
.article-video__src{font-size:var(--fs-s);color:var(--muted)}
.art__side{display:flex;flex-direction:column;gap:6px;align-self:start;position:sticky;top:96px}
.next-box{background:var(--ink);color:var(--on-ink);border-radius:10px;padding:18px;margin-bottom:12px}
.next-box .kick{color:var(--gold)}
.next-box__date{font-size:var(--fs-l);font-weight:900;margin:6px 0 2px}.next-box__date b{font-weight:900}
.next-box p:last-child{font-size:var(--fs-s);color:var(--subtle)}
.side-list li a{display:flex;flex-direction:column;gap:8px;padding:12px 0;border-top:1px solid var(--line);font-size:var(--fs-m);line-height:1.45}
.side-list img{width:100%;aspect-ratio:3/2;object-fit:cover}
.side-list a:hover b{text-decoration:underline}
.art__side .label{margin:16px 0 4px}

/* ---------- 산문·목록 페이지 ---------- */
.prose{max-width:760px;margin:0 auto;font-size:var(--fs-m);color:var(--ink-2)}
.prose h2{font-size:var(--fs-l);font-weight:900;color:var(--ink);margin:40px 0 12px;padding-top:16px;border-top:1px solid var(--ink)}
.prose p{margin-bottom:14px}.prose a{text-decoration:underline;text-underline-offset:3px}
.lead{font-size:var(--fs-l);font-weight:700;color:var(--ink);line-height:1.6}
.archive-tools{display:grid;grid-template-columns:1fr 180px;gap:12px;align-items:end;margin-bottom:16px}
.archive-tools label{display:flex;flex-direction:column;gap:6px;font-size:var(--fs-s);font-weight:700}
.archive-tools input,.archive-tools select,.result-tools input,.result-tools select{min-height:48px;border:1px solid var(--ink);border-radius:999px;padding:0 18px;background:var(--bg);font-size:var(--fs-m)}
.archive-tabs{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px}
.archive-tabs button,.search-types button{min-height:44px;padding:0 16px;border-radius:999px;border:1px solid var(--line);font-size:var(--fs-m);font-weight:700}
.archive-tabs button[aria-pressed="true"],.search-types button[aria-pressed="true"]{background:var(--ink);color:var(--on-ink);border-color:var(--ink)}
.archive-count,.search-status{font-size:var(--fs-s);color:var(--muted);margin:16px 0 8px}
.archive-list>li{display:grid;grid-template-columns:240px 1fr;gap:24px;padding:24px 0;border-top:1px solid var(--line)}
.archive-list>li[hidden]{display:none}
.archive-image img{width:100%;aspect-ratio:3/2;object-fit:cover}
.archive-meta{font-size:var(--fs-s);color:var(--muted)}
.archive-list h2{font-size:var(--fs-l);font-weight:900;line-height:1.4;margin:6px 0 8px;letter-spacing:-.02em}
.archive-list h2 a:hover{text-decoration:underline}
.archive-list p{font-size:var(--fs-m);color:var(--ink-2)}
.archive-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:var(--fs-s);color:var(--muted);margin-top:10px}
.archive-foot button,.saved-list button{white-space:nowrap;min-height:44px;padding:0 14px;border-radius:999px;border:1px solid var(--line);font-size:var(--fs-s);font-weight:700}
.load-more{margin:24px auto 0;display:flex}
.empty-state{border:1px solid var(--line);border-radius:10px;padding:32px;text-align:center;margin-top:16px}
.empty-state h2{font-size:var(--fs-l);font-weight:900;margin-bottom:8px}.empty-state p{color:var(--ink-2);margin-bottom:16px}
.sform{display:flex;gap:8px;max-width:620px;margin:28px auto 0}
.sform input{flex:1;min-height:52px;border:1px solid var(--ink);border-radius:999px;padding:0 22px;font-size:var(--fs-m);background:var(--bg)}
.srs li a{display:flex;flex-direction:column;gap:2px;padding:16px 0;border-bottom:1px solid var(--line)}
.srs b{font-size:var(--fs-m)}.srs small{font-size:var(--fs-s);color:var(--muted)}
.search-types{display:flex;flex-wrap:wrap;gap:8px}
.search-empty{color:var(--ink-2)}
.saved-list li{display:flex;align-items:center;gap:16px;padding:16px 0;border-bottom:1px solid var(--line)}
.saved-item{flex:1;display:grid;grid-template-columns:120px 1fr;gap:16px;align-items:center}
.saved-item img{width:120px;aspect-ratio:3/2;object-fit:cover}
.saved-item h2{font-size:var(--fs-m)}.saved-item p{font-size:var(--fs-s);color:var(--muted)}
.result-tools{display:flex;flex-wrap:wrap;gap:12px;align-items:end;margin-bottom:16px}
.result-tools label{display:flex;flex-direction:column;gap:6px;font-size:var(--fs-s);font-weight:700}

/* 뉴스레터 띠 */
.letter{background:var(--surface);border-top:2px solid var(--gold);margin-top:var(--sec);padding:56px 0}
.sec--dark+.letter{margin-top:0}
.letter__inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:center}
.letter h2{font-size:var(--fs-xl);font-weight:900;letter-spacing:-.03em;margin-top:6px}
.letter__lead{font-size:var(--fs-m);color:var(--ink-2);margin-top:8px}
.letter__box{background:var(--bg);border:1px solid var(--ink);border-radius:10px;padding:22px;display:flex;flex-direction:column;align-items:flex-start;gap:10px;font-size:var(--fs-m);color:var(--ink-2)}
.letter__state{font-size:var(--fs-s);font-weight:700;color:var(--gold-deep)}
.letter__inner--page{padding-bottom:24px}

/* 푸터 */
.footer{background:var(--ink);color:var(--on-ink);padding:64px 0 32px}
.footer__top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:40px}
.footer__brand{display:flex;flex-direction:column;gap:12px;font-size:var(--fs-m);color:var(--subtle)}
.footer__brand .logo{width:180px;color:var(--on-ink)}
.footer__cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.fcol summary{display:block;font-size:var(--fs-s);font-weight:700;color:var(--gold);margin-bottom:6px;list-style:none;pointer-events:none}
.fcol summary::-webkit-details-marker{display:none}
.footer__cols a{display:flex;align-items:center;min-height:44px;font-size:var(--fs-m)}
.footer__cols a:hover{text-decoration:underline}
.footer__bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;align-items:center;border-top:1px solid var(--ink-line);margin-top:48px;padding-top:20px;font-size:var(--fs-s);color:var(--subtle)}
.footer__share{display:flex;gap:16px;align-items:center}
.footer__share a,.footer__share button{display:inline-flex;align-items:center;min-height:40px;color:var(--on-ink);font-size:var(--fs-s)}

/* 공용: 알림, 확대 보기 */
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:var(--ink);color:var(--on-ink);padding:12px 18px;border-radius:999px;font-size:var(--fs-m);z-index:90}
.lightbox{border:0;padding:0;background:transparent;max-width:none;max-height:none;width:100%;height:100%}
.lightbox::backdrop{background:rgba(0,0,0,.9)}
.lightbox figure{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:12px;padding:56px 16px}
.lightbox img{max-height:80vh;width:auto}
.lightbox figcaption{color:var(--on-ink);font-size:var(--fs-m)}
.lightbox-close{position:fixed;top:12px;right:12px;min-height:44px;padding:0 16px;background:var(--on-ink);border-radius:999px}
.lightbox-controls{position:fixed;bottom:16px;left:50%;transform:translateX(-50%);display:flex;gap:8px}
.lightbox-controls button{min-height:44px;padding:0 16px;background:var(--on-ink);border-radius:999px}
.reveal{opacity:1}

/* ---------- 반응형 ---------- */
@media (max-width:1100px){
  .topics--4{grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 24px}
  .nav__item>a{padding:0 6px;font-size:var(--fs-s)}
  .nav__link:first-child{display:none}
  .art__layout{grid-template-columns:180px minmax(0,1fr);}
  .art__side{display:none}
  .index a{grid-template-columns:100px 1fr 150px 90px}
  .index__kind{display:none}
}
@media (max-width:900px){
  html{scroll-padding-top:64px}
  .nav__bar{grid-template-columns:44px 1fr 44px;height:56px;gap:8px}
  .nav__menu,.nav__link:not(.nav__search),.nav__right .btn,.sub{display:none}
  .nav__burger{display:flex}
  .nav__logo .logo{width:116px}
  .nav__right{gap:0}
  .nav__search{padding:0;width:44px;justify-content:center}
  .mast__line{display:none}
  .mast__logo{display:none}
  .cover{padding-top:24px}
  .cover__grid{grid-template-columns:1fr;gap:28px}
  .cover__fig{order:-1;margin:0 calc(var(--pad)*-1)}
  .cover__fig figcaption{padding:0 var(--pad)}
  .cweek__grid{grid-template-columns:96px 1fr;gap:14px}
  .cweek__img img{width:96px}
  .cweek__act{grid-column:1/-1}
  .wk{grid-template-columns:1fr;gap:0}
  .wk a{padding:14px 26px 14px 0}
  .rows--2{grid-template-columns:1fr}
  .topics,.topics--4{grid-template-columns:1fr;gap:40px}
  .links__t{white-space:normal}
  .topic .card__title{min-height:0}
  .stage{grid-template-columns:1fr;gap:28px}
  .results{grid-template-columns:1fr;gap:0}
  .results li:first-child a{padding-bottom:16px}
  .results li:not(:first-child) a{display:grid;grid-template-columns:112px 1fr;gap:14px;align-items:center;padding:14px 0;border-top:1px solid var(--ink-line)}
  .feature{grid-template-columns:1fr;gap:18px}
  .tv{grid-template-columns:1fr}
  .cards{grid-template-columns:1fr;gap:28px}
  .vgrid{grid-template-columns:1fr 1fr;gap:20px}
  .vgrid--v{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ivgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  .mosaic{grid-template-columns:1fr}
  .index a{grid-template-columns:96px 1fr;gap:6px 14px}
  .index__img{grid-row:span 3}
  .index__fig{font-size:var(--fs-m)}
  .index__date{text-align:left}
  .method{grid-template-columns:1fr}
  .method ol{grid-template-columns:1fr}
  .art__head{grid-template-columns:1fr;padding-top:24px}
  .art__fig{order:-1;margin:0 calc(var(--pad)*-1)}
  .art__fig figcaption{padding:0 var(--pad)}
  .art__layout{grid-template-columns:1fr;gap:20px}
  .art__rail{position:static;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);padding:12px 0}
  .article-toc:not([open]) summary{margin-bottom:0}
  .letter__inner{grid-template-columns:1fr;gap:24px}
  .footer__top{grid-template-columns:1fr}
  .archive-list>li{grid-template-columns:120px 1fr;gap:14px}
  .archive-list h2{font-size:var(--fs-m)}
  .archive-list p{display:none}
  .archive-tools{grid-template-columns:1fr}
}
@media (max-width:600px){
  .phead{padding-top:36px}
  .phead__stats{gap:18px}
  .sh{flex-wrap:wrap;align-items:flex-start;gap:4px}
  .footer{padding:40px 0 28px}
  .footer__brand .logo{width:132px}
  .footer__cols{grid-template-columns:1fr;gap:0;border-top:1px solid var(--ink-line)}
  .fcol{border-bottom:1px solid var(--ink-line)}
  .fcol summary{display:flex;justify-content:space-between;align-items:center;min-height:52px;margin:0;font-size:var(--fs-m);color:var(--on-ink);pointer-events:auto;cursor:pointer}
  .fcol summary::after{content:"+";font-family:var(--num);font-style:italic;font-stretch:semi-expanded;font-size:var(--fs-l);color:var(--gold)}
  .fcol[open] summary::after{content:"−"}
  .fcol__links{display:grid;grid-template-columns:1fr 1fr;padding-bottom:12px}
  .footer__bottom{margin-top:24px}
  .gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 10px}
  .short__rows dd b{font-size:var(--fs-l)}
  .row a{grid-template-columns:88px 1fr 16px;gap:12px}
  .row__img img{width:88px}
  .article-copy{font-size:var(--fs-m)}
}
/* ---------- 오프닝(홈 첫 화면 무대 영상) ---------- */
.intro{position:relative;height:100vh;background:#000 url(/media/intro-stage-poster.jpg) center/cover no-repeat;color:var(--on-ink)}
html.motion .intro{height:230vh;background-image:none}
.intro__stick{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
.intro__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(var(--intro-s,1));border-radius:var(--intro-r,0);transition:none}
.intro__shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.25),rgba(0,0,0,.05) 35%,rgba(0,0,0,.65));opacity:var(--intro-shade,1)}
.intro__text{position:absolute;left:var(--pad);right:var(--pad);bottom:clamp(64px,14vh,140px);max-width:var(--max);margin:0 auto}
.intro__l{font-size:var(--fs-xl);font-weight:900;letter-spacing:-.04em;line-height:1.12}
.intro__l2{color:var(--gold)}
html.motion .intro__l1{opacity:var(--intro-l1,0);transform:translateY(calc((1 - var(--intro-l1,0)) * 24px))}
html.motion .intro__l2{opacity:var(--intro-l2,0);transform:translateY(calc((1 - var(--intro-l2,0)) * 24px))}
.intro__sub{font-size:var(--fs-s);color:rgba(255,255,255,.75);margin-top:18px}
/* 영상 위 롤링 CTA(웰니스 입구): 한 줄씩 바뀐다. 마우스를 올리거나 포커스하면 멈춘다 */
.intro__roll{position:relative;display:grid;grid-template-columns:minmax(0,1fr);margin-top:20px;max-width:560px}
.intro__roll-item{grid-area:1/1;display:flex;align-items:center;gap:12px;min-height:52px;padding:10px 18px 10px 10px;border-radius:999px;background:rgba(0,0,0,.55);border:1px solid rgba(212,175,55,.6);color:var(--on-ink);font-size:var(--fs-m);font-weight:700;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .2s,transform .2s,visibility 0s .2s}
.intro__roll-item.is-on{opacity:1;visibility:visible;transform:none;transition:opacity .4s .2s,transform .4s .2s,visibility 0s}
.intro__roll-item:hover,.intro__roll-item:focus-visible{border-color:var(--gold);background:rgba(0,0,0,.75)}
.intro__roll-kick{flex:none;padding:4px 10px;border-radius:999px;background:var(--gold);color:var(--ink);font-size:var(--fs-s);font-weight:800}
.intro__roll-text{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.intro__roll-item > span:last-child{flex:none;color:var(--gold)}
html.motion .intro__text{opacity:var(--intro-out,1)}
@media (max-width:900px){html.motion .intro{height:200vh}.intro__l{font-size:var(--fs-xl)}}

/* ---------- 인터랙션(움직임 허용일 때만, 처음 한 번) ---------- */
html.motion .sh::before{transform:scaleX(0);transition:transform .7s var(--ease)}
html.motion .sh__text>*{opacity:0;transform:translateY(14px);transition:opacity .5s var(--ease),transform .5s var(--ease)}
html.motion .sh__text>:nth-child(2){transition-delay:.08s}
html.motion .sh__text>:nth-child(3){transition-delay:.16s}
html.motion .sh.is-in::before{transform:scaleX(1)}
html.motion .sh.is-in .sh__text>*{opacity:1;transform:none}
@keyframes ansIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
html.motion .answers.is-swap{animation:ansIn .32s var(--ease)}
html.motion .hx-chip{transition:background .2s,color .2s,transform .12s var(--ease)}
.cweek__clock{font-family:var(--num);font-style:italic;font-stretch:semi-expanded;font-weight:700;font-size:var(--fs-m);color:var(--gold);font-variant-numeric:tabular-nums;margin-top:2px}
.cweek__clock small{font-family:var(--kr);font-weight:500;color:var(--subtle);margin-right:6px}
html.motion .nav{transition:transform .28s var(--ease)}
@media (max-width:900px){.nav.is-hidden{transform:translateY(-100%)}}
html.motion :is(.btn,.pill,.hx-chip,.more,.card a,.row a,.links a,.feature,.mosaic__lead,.results a,.stage__next,.vid__frame,.index a,.fcol summary):active{transform:scale(.97)}
html.motion :is(.card a,.row a,.links a,.feature,.mosaic__lead,.results a,.stage__next,.index a){transition:transform .12s var(--ease)}
[data-count]{font-variant-numeric:tabular-nums}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;scroll-behavior:auto!important}}

/* 시즌 일정: 오늘 줄과 다음 대회까지 막대 */
.season li.season__today{padding:18px 16px;margin:0 -16px;background:rgba(212,175,55,.12);border-bottom:0;box-shadow:inset 3px 0 0 var(--gold)}
.season__today .season__date{display:inline-flex;align-items:center;gap:8px;font-family:var(--kr);font-size:var(--fs-m);font-weight:900;color:var(--gold)}
.season__dot{width:8px;height:8px;border-radius:50%;background:var(--gold);flex-shrink:0}
html.motion .season__dot{animation:season-pulse 1.8s ease-out infinite}
@keyframes season-pulse{0%{box-shadow:0 0 0 0 rgba(212,175,55,.6)}70%,100%{box-shadow:0 0 0 8px rgba(212,175,55,0)}}
.season__prog{display:flex;flex-direction:column;gap:10px}
.season__prog small{font-size:var(--fs-m);font-weight:700;color:var(--on-ink)}
.season__prog small [data-today-date]{font-family:var(--num);font-style:italic;font-stretch:semi-expanded;font-weight:400;color:var(--subtle)}
.season__prog b{font-family:var(--num);font-style:italic;font-stretch:semi-expanded;font-size:var(--fs-l);font-weight:800;color:var(--gold);margin:0 1px}
.season__bar{display:block;height:8px;background:rgba(255,255,255,.12);border-radius:4px;overflow:hidden}
.season__bar i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,var(--gold-deep),var(--gold));transform-origin:left;transform:scaleX(var(--p,0))}
html.motion .season__bar i{transform:scaleX(0);transition:transform 1.2s var(--ease) .2s}
html.motion .season__today.is-in .season__bar i{transform:scaleX(var(--p,0))}

/* 고민 3문항 */
.quiz-cta{display:flex;align-items:center;justify-content:space-between;gap:16px 24px;flex-wrap:wrap;margin-bottom:20px;padding:20px 24px;background:var(--ink);color:var(--on-ink)}
.quiz-cta p{display:flex;flex-direction:column;gap:4px}
.quiz-cta b{font-size:var(--fs-l);font-weight:900;letter-spacing:-.02em;color:var(--gold)}
.quiz-cta p span{font-size:var(--fs-m);color:var(--subtle)}
.quiz-cta__btn{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 24px;border-radius:999px;background:var(--gold);color:var(--ink);font-size:var(--fs-m);font-weight:900;white-space:nowrap;transition:background .2s,transform .2s}
.quiz-cta__btn:hover{background:var(--on-ink)}
.quiz-cta__btn span{transition:transform .2s var(--ease)}.quiz-cta__btn:hover span{transform:translateX(4px)}
.quiz-cta__btn[aria-expanded="true"]{background:var(--on-ink)}
.quiz{border:1px solid var(--ink);padding:24px;margin-bottom:24px;background:var(--bg)}
.quiz__top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;font-size:var(--fs-s);font-weight:700;color:var(--gold-deep)}
.quiz__steps{display:flex;gap:4px;flex-shrink:0;margin-top:6px}.quiz__steps i{width:28px;height:3px;background:var(--line)}.quiz__steps i.on{background:var(--ink)}
.quiz__q{font-size:var(--fs-l);font-weight:900;letter-spacing:-.02em;line-height:1.35;margin:14px 0 18px}
.quiz__opts{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px}
.quiz__opt{min-height:52px;padding:12px 16px;text-align:left;border:1px solid var(--line);font-size:var(--fs-m);font-weight:700;background:var(--bg);transition:border-color .2s,background .2s}
.quiz__opt:hover,.quiz__opt:focus-visible{border-color:var(--ink)}
.quiz__opt[aria-pressed="true"]{background:var(--ink);color:var(--gold);border-color:var(--ink)}
.quiz__foot{display:flex;gap:16px;margin-top:16px;font-size:var(--fs-s)}
.quiz__link{min-height:44px;padding:0;background:none;color:var(--muted);text-decoration:underline;text-underline-offset:4px}
.quiz__picks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:4px}
.quiz__pick a{display:flex;flex-direction:column;gap:6px}
.quiz__pick img{width:100%;aspect-ratio:16/9;object-fit:cover;background:var(--surface)}
.quiz__pick .is-gfx img{object-fit:contain;background:var(--ink)}
.quiz__pick small{font-size:var(--fs-s);font-weight:700;color:var(--gold-deep)}
.quiz__pick b{font-size:var(--fs-m);font-weight:900;line-height:1.4;letter-spacing:-.01em}
.quiz__pick p{font-size:var(--fs-s);color:var(--ink-2);line-height:1.6}
.quiz__pick a:hover b{text-decoration:underline}
html.motion .quiz__body{animation:quiz-in .35s var(--ease)}
@keyframes quiz-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* 다 읽으면 다음 글 */
.nextup{position:fixed;right:24px;bottom:24px;z-index:40;width:min(380px,calc(100vw - 32px));background:var(--ink);color:var(--on-ink);box-shadow:0 12px 40px rgba(0,0,0,.25)}
.nextup a{display:grid;grid-template-columns:112px 1fr;gap:14px;align-items:center;padding:14px 48px 14px 14px}
.nextup__img img{width:112px;aspect-ratio:16/9;object-fit:cover;display:block}
.nextup__img.is-gfx img{object-fit:contain;background:#000}
.nextup__body{display:flex;flex-direction:column;gap:4px}
.nextup__kick{font-size:var(--fs-s);font-weight:700;color:var(--gold)}
.nextup b{font-size:var(--fs-m);font-weight:900;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.nextup a:hover b{text-decoration:underline}
.nextup__close{position:absolute;top:2px;right:2px;width:44px;height:44px;background:none;color:var(--subtle);font-size:var(--fs-l);line-height:1}
.nextup__close:hover{color:var(--on-ink)}
html.motion .nextup{transition:transform .45s var(--ease),opacity .45s var(--ease)}
.nextup.is-off{transform:translateY(calc(100% + 32px));opacity:0;pointer-events:none}
@media (max-width:600px){
  .quiz-cta{padding:18px 16px}.quiz-cta__btn{width:100%;justify-content:center}
  .quiz{padding:20px 16px}.quiz__opts{grid-template-columns:1fr}.quiz__picks{grid-template-columns:1fr;gap:16px}
  .quiz__pick a{display:grid;grid-template-columns:112px 1fr;gap:4px 12px;align-items:start}.quiz__pick a>span:first-child{grid-row:span 3}.quiz__pick p{display:none}
  .nextup{left:16px;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));width:auto}
  .nextup a{grid-template-columns:88px 1fr}.nextup__img img{width:88px}
}

/* 푸터 사업자 정보(나바코리아 공식몰 표기 그대로) */
.footer__biz{display:flex;flex-direction:column;gap:6px;margin-top:40px;padding-top:20px;border-top:1px solid var(--ink-line);font-size:var(--fs-s);line-height:1.7;color:var(--subtle)}
.footer__biz p{display:flex;flex-wrap:wrap;gap:0 14px}
.footer__biz p span{position:relative}
.footer__biz a{text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--ink-line)}
.footer__legal{gap:0 20px!important;font-size:var(--fs-s)}.footer__legal a{display:inline-flex;align-items:center;min-height:32px;text-decoration:none;color:var(--on-ink)}.footer__legal b{font-weight:700;color:var(--gold)}
.footer__note{margin-top:4px}
.footer__biz + .footer__bottom{margin-top:20px}
.footer__agency{margin-top:8px}.footer__agency b{font-weight:700;color:var(--on-ink)}

/* 푸터 왼쪽: 로고 · 공식 SNS · 나바코리아 공식 홈페이지 배너(2026-10-16 수정요청) */
.footer__lead{display:flex;flex-direction:column;gap:20px;align-items:flex-start}
.footer__sns{display:flex;gap:8px;list-style:none;margin:0;padding:0}
.footer__sns a{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;border:1px solid var(--ink-line);color:var(--on-ink);transition:background .2s,color .2s,border-color .2s}
.footer__sns a:hover,.footer__sns a:focus-visible{background:var(--gold);border-color:var(--gold);color:var(--ink)}
.footer__sns svg{width:20px;height:20px}
.footer__nabba{position:relative;display:grid;gap:2px;width:100%;max-width:320px;padding:16px 48px 16px 18px;border:1px solid var(--gold);border-radius:4px;color:var(--on-ink);transition:background .2s}
.footer__nabba:hover,.footer__nabba:focus-visible{background:#1d1a10}
.footer__nabba-kick{font-family:var(--num);font-style:italic;font-stretch:semi-expanded;font-size:var(--fs-s);font-weight:800;letter-spacing:.12em;color:var(--gold)}
.footer__nabba b{font-size:var(--fs-m);font-weight:700}
.footer__nabba > span:not([class]){font-size:var(--fs-s);color:var(--subtle)}
.footer__nabba-go{position:absolute;right:18px;top:50%;transform:translateY(-50%);font-size:var(--fs-l);color:var(--gold)}


/* 고민 칩: 같은 너비 칸으로 줄을 맞춘다. 데스크톱 4칸×2줄, 모바일 2칸×2줄까지 보이고 나머지는 '더 보기'로 펼친다.
   고민이 늘어도 줄이 들쭉날쭉하지 않게(2026-10-09 사용자 지적). */
.chips{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.chips .hx-chip,.chips__more{min-height:48px;padding:8px 14px;border-radius:12px;font-size:var(--fs-m);line-height:1.35;text-align:center;word-break:keep-all}
.chips__more{display:none;align-items:center;justify-content:center;gap:4px;grid-column:1/-1;border:1px dashed var(--ink-2);font-weight:700;background:var(--bg);color:var(--ink-2)}
.chips__more span{font-family:var(--num);font-style:italic;font-stretch:semi-expanded}
.chips.is-open .chips__more{border-style:solid}
.chips--d-fold .chips__more{display:flex}
.chips:not(.is-open) .hx-chip:nth-child(n+9):not([aria-pressed="true"]){display:none}
@media (max-width:600px){
  .chips{grid-template-columns:1fr 1fr}.chips .hx-chip{padding:8px 10px}
  .chips--m-fold .chips__more{display:flex}
  .chips:not(.is-open) .hx-chip:nth-child(n+5):not([aria-pressed="true"]){display:none}
}

/* 나바 서체: 큰 제목은 Black Han Sans(굵기 하나뿐이라 400으로 둔다) */
.sh__text h2,.cover__q,.feature__text b,.phead h1,.mosaic__lead b,.art__title h1,.letter h2,.intro__l{font-family:var(--display);font-weight:400;letter-spacing:-.01em}
