/**
 * 메인 레이아웃
 */

/* 헤더 */
.header {
    position: sticky;
    top: 0;
    z-index: 100;
    background-color: var(--bg-primary);
    border-bottom: 1px solid var(--border);
    height: var(--header-height);
}

.header__inner {
    max-width: var(--content-width);
    margin: 0 auto;
    padding: 0 var(--space-lg);
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.header__logo {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    text-decoration: none;
    padding: 0.15rem 0;
    /* 은박 광택 기본 그림자 — 텍스트에 얇게 적용 */
    filter: drop-shadow(0 1px 0 rgba(255, 255, 255, 0.08)) drop-shadow(0 -1px 0 rgba(0, 0, 0, 0.35));
}

.header__logo-text,
.header__logo-sub {
    /* CSS 미지원 폴백 — 정적 실버 톤 */
    color: #d2d8e0;
    /* 은박 베이스 그라데이션 (어두운 금속회 → 하이라이트 → 다시 어두운 톤). 애니메이션으로 이동 */
    background-image: linear-gradient(
        100deg,
        #5a6370 0%,
        #8b95a3 18%,
        #c8d0da 38%,
        #ffffff 50%,
        #c8d0da 62%,
        #8b95a3 82%,
        #5a6370 100%
    );
    background-size: 220% 100%;
    background-position: 50% 0;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: logo-shimmer 5.5s cubic-bezier(0.6, 0.1, 0.4, 0.9) infinite;
}

.header__logo-text {
    font-family: 'JetBrains Mono', monospace;
    font-size: 1.35rem;
    font-weight: 700;
    letter-spacing: -0.025em;
    text-shadow: 0 0 18px rgba(200, 208, 218, 0.12);
}

.header__logo-sub {
    font-family: 'Pretendard', sans-serif;
    font-size: 1.35rem;          /* 10-K 와 동일 크기로 통일 */
    font-weight: 700;
    letter-spacing: 0.06em;       /* 대문자 가독성. 큰 크기에선 자간을 조금 좁힘 */
    /* ANALYTICS 는 본문 폰트, 약간 지연된 shimmer 로 도서 표지 2단 구성 느낌 */
    animation-delay: 0.4s;
    text-shadow: 0 0 18px rgba(200, 208, 218, 0.12);
}

.header__logo:hover .header__logo-text,
.header__logo:hover .header__logo-sub {
    /* hover 시 shimmer 빠르게 + 더 밝게 */
    animation-duration: 2.2s;
    filter: brightness(1.12);
}

@keyframes logo-shimmer {
    /* 하이라이트 밴드가 오른쪽 → 왼쪽으로 이동. 한 바퀴 후 잠시 정지하듯 느린 ease-in-out */
    0%, 18%   { background-position: 220% 0; }
    52%, 60%  { background-position: 50% 0; }
    100%      { background-position: -120% 0; }
}

/* 모션 감소 선호: 정적 하이라이트 유지 (중앙 밴드에 고정) */
@media (prefers-reduced-motion: reduce) {
    .header__logo-text,
    .header__logo-sub {
        animation: none;
        background-position: 50% 0;
    }
}

/* 폴백: background-clip:text 미지원 환경 — 단색 은빛 표시 */
@supports not ((background-clip: text) or (-webkit-background-clip: text)) {
    .header__logo-text,
    .header__logo-sub {
        -webkit-text-fill-color: initial;
        background-image: none;
        color: #d2d8e0;
        animation: none;
    }
}

/* PC 헤더 탭 */
.header__tabs {
    display: flex;
    gap: 4px;
}

.header__tab {
    display: inline-block;
    padding: 8px 18px;
    font-size: 0.9375rem;
    font-weight: 500;
    color: var(--text-tertiary);
    background: none;
    border: 1px solid transparent;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.15s;
    font-family: inherit;
    text-decoration: none;            /* anchor 로 변환 시 underline 제거 */
}

.header__tab:hover {
    color: var(--text-primary);
    background: var(--bg-elevated);
}

.header__tab--active,
.header__tab[aria-current="page"] {
    color: var(--accent);
    border-color: var(--border-accent);
    background: var(--accent-dim);
}

/* 모바일: 헤더 탭 숨기고 하단 탭 표시 */
@media (max-width: 768px) {
    .header__tabs {
        display: none;
    }
}

/* 메인 */
.main {
    max-width: var(--content-width);
    margin: 0 auto;
    padding: var(--space-2xl) var(--space-lg);
    min-height: calc(100vh - var(--header-height) - 120px);
}

/* 모바일 — 좌우 패딩 조정 */
@media (max-width: 768px) {
    .main {
        padding: var(--space-xl) var(--space-md);   /* 16px 좌우 */
    }
}
@media (max-width: 480px) {
    .main {
        padding: var(--space-lg) 0.875rem;          /* 14px 좌우 — 너무 좁지도 넓지도 않게 */
    }
}

/* 기업 섹션 */
.companies__title {
    font-size: 1.5rem;
    color: var(--text-primary);
    margin-bottom: var(--space-xs);
}

.companies__subtitle {
    font-size: 0.9rem;
    color: var(--text-secondary);
    margin-bottom: var(--space-xl);
}

.companies__grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: var(--space-lg);
}

.companies__empty {
    text-align: center;
    padding: var(--space-3xl) var(--space-lg);
    color: var(--text-secondary);
}

.companies__empty-hint {
    margin-top: var(--space-md);
    font-size: 0.875rem;
}

/* 푸터 */
.footer {
    border-top: 1px solid var(--border);
    padding: var(--space-xl) 0;
    margin-top: var(--space-3xl);
}

.footer__inner {
    max-width: var(--content-width);
    margin: 0 auto;
    padding: 0 var(--space-lg);
    text-align: center;
}

.footer__text {
    font-size: 0.9375rem;
    color: var(--text-secondary);
}

.footer__link {
    color: var(--text-secondary);
    text-decoration: underline;
}

.footer__link:hover {
    color: var(--accent);
}

.footer__disclaimer {
    font-size: 0.875rem;
    color: var(--text-tertiary);
    margin-top: var(--space-sm);
}

/* ── 정적 페이지 (about · privacy · terms · author) ─────── */
.static-page {
    max-width: 720px;
    margin: 0 auto;
    padding: 1rem 0 3rem;
    font-family: 'Noto Serif KR', Georgia, serif;
    font-size: 18px;
    line-height: 1.85;
    letter-spacing: -0.01em;
    color: var(--text-primary, #E6EDF3);
}
.static-page h1 {
    font-family: 'Pretendard', sans-serif;
    font-size: 30px;
    line-height: 1.3;
    letter-spacing: -0.025em;
    margin: 0 0 0.8rem;
    font-weight: 700;
}
.static-page h2 {
    font-family: 'Pretendard', sans-serif;
    font-size: 22px;
    font-weight: 700;
    margin: 2.5rem 0 0.8rem;
    padding-bottom: 0.4rem;
    border-bottom: 1px solid var(--border-light, #2F3540);
    line-height: 1.4;
}
.static-page__lede {
    font-style: italic;
    color: var(--text-secondary, #c8d0da);
    font-size: 19px;
    margin: 0 0 2.5rem;
}
.static-page p { margin: 0 0 1.2rem; }
.static-page ul { margin: 0 0 1.5rem; padding-left: 1.5rem; }
.static-page li { margin-bottom: 0.5rem; }
.static-page a {
    color: var(--accent);
    text-decoration: underline;
    text-underline-offset: 3px;
}
.static-page a:hover { color: var(--accent-hover, #E2E8F0); }

/* 푸터 정책 네비 */
.footer__nav {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    justify-content: center;
    margin-bottom: 1rem;
    font-size: 0.85rem;
}
.footer__nav .footer__link {
    color: var(--text-secondary, #c8d0da);
    text-decoration: none;
}
.footer__nav .footer__link:hover {
    color: var(--accent);
    text-decoration: underline;
}
.footer__sep { color: var(--text-tertiary, #6E7681); }

@media (max-width: 640px) {
    .static-page { font-size: 17px; padding: 1rem 0 2rem; }
    .static-page h1 { font-size: 24px; }
    .static-page h2 { font-size: 20px; }
    .static-page__lede { font-size: 17px; }
}

/* ─── 고지 사항 (분석글·기업페이지 공통, E-E-A-T Trust) ─── */
.nd-disclaimer {
    margin: 1.75rem 0 0;
    padding: 1.25rem 1.5rem;
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid var(--border-light, #2F3540);
    border-radius: 8px;
    font-size: 13px;
    line-height: 1.7;
    color: var(--text-secondary, #9AA3AE);
}
.nd-disclaimer__title {
    font-family: 'Pretendard', sans-serif;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--text-tertiary, #6E7681);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin: 0 0 0.875rem;
}
.nd-disclaimer__list {
    margin: 0;
    display: grid;
    grid-template-columns: max-content 1fr;
    column-gap: 1.25rem;
    row-gap: 0.625rem;
    align-items: start;
}
.nd-disclaimer__list dt {
    font-weight: 600;
    color: var(--text-primary, #C8D0DA);
    white-space: nowrap;
}
.nd-disclaimer__list dd {
    margin: 0;
    color: var(--text-secondary, #9AA3AE);
}
.nd-disclaimer__list dd strong {
    color: var(--text-primary, #C8D0DA);
    font-weight: 600;
}
.nd-disclaimer__source {
    color: var(--accent);
    text-decoration: none;
    border-bottom: 1px dotted rgba(var(--accent-rgb), 0.4);
    transition: border-color 0.15s;
}
.nd-disclaimer__source:hover {
    border-bottom-color: var(--accent);
}
@media (max-width: 640px) {
    .nd-disclaimer {
        padding: 1rem;
        font-size: 12.5px;
    }
    .nd-disclaimer__list {
        grid-template-columns: 1fr;
        row-gap: 0.25rem;
    }
    .nd-disclaimer__list dt {
        margin-top: 0.625rem;
    }
}

/* ─── 정적 페이지 pull-quote (about, author 등) ─── */
.static-page__pull {
    margin: 1.5rem 0;
    padding: 1.25rem 1.5rem 1.25rem 1.75rem;
    border-left: 4px solid var(--accent);
    background: rgba(var(--accent-rgb), 0.04);
    border-radius: 0 8px 8px 0;
    font-size: 1.05rem;
    line-height: 1.7;
    color: var(--text-primary, #C8D0DA);
    font-style: italic;
}
.static-page__pull cite {
    display: block;
    margin-top: 0.5rem;
    font-size: 0.85rem;
    color: var(--text-tertiary, #6E7681);
    font-style: normal;
}
.static-page__credentials {
    margin: 0;
    padding-left: 1.25rem;
}
.static-page__credentials li {
    list-style: '✓ ';
    padding-left: 0.25rem;
    margin: 0.25rem 0;
}

/* ─── P2-3: 광고 슬롯 CLS 방지 — slot별 min-height 예약 (자료 B Part 7.3) ─── */
/* INS 태그가 들어오면(승인 후 slot ID 채워지면) 광고 로드 전부터 자리 확보 → CLS 0 */
.ad-slot--inline_top:has(ins.adsbygoogle),
.ad-slot--inline_middle:has(ins.adsbygoogle),
.ad-slot--inline_bottom:has(ins.adsbygoogle) {
    min-height: 280px;
    contain: layout;
}
.ad-slot--sidebar:has(ins.adsbygoogle) {
    min-height: 600px;
    contain: layout;
}
.ad-slot--feed_inline:has(ins.adsbygoogle) {
    min-height: 250px;
    contain: layout;
}
/* INS 태그 자체에도 min-height — 광고 로드 전 빈 박스 방지 */
.ad-slot ins.adsbygoogle {
    min-height: 280px;
    display: block;
}
.ad-slot--sidebar ins.adsbygoogle {
    min-height: 600px;
}
.ad-slot--feed_inline ins.adsbygoogle {
    min-height: 250px;
}
/* 모바일에서는 광고 높이 약간 줄임 (UX 균형) */
@media (max-width: 640px) {
    .ad-slot--inline_top:has(ins.adsbygoogle),
    .ad-slot--inline_middle:has(ins.adsbygoogle),
    .ad-slot--inline_bottom:has(ins.adsbygoogle),
    .ad-slot--feed_inline:has(ins.adsbygoogle) {
        min-height: 250px;
    }
    .ad-slot ins.adsbygoogle {
        min-height: 250px;
    }
}

/* Pillar-Cluster 종목 허브 + 메인 페이지 그리드 (2026-05-22 추가)        */

/* ───── 4열 그리드 (메인·종목 허브 공통) ───── */
.news-stream,
.news-grid {
    display: grid;
    gap: var(--space-md, 1rem);
    grid-template-columns: 1fr;
}
@media (min-width: 768px) {
    .news-stream,
    .news-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1200px) {
    .news-stream,
    .news-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* 4열에서 카드 컴팩트 fit — 가로 좁아도 깨지지 않게 */
@media (min-width: 1200px) {
    .news-stream .news-card__title,
    .news-grid .news-card__title {
        font-size: var(--fs-sm, 0.9375rem);
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
    .news-stream .news-card__desc,
    .news-grid .news-card__desc {
        display: none;
    }
}

/* ───── ticker-hub 영역 (company.php ZONE A2) ───── */
.ticker-hub {
    margin: var(--space-xl, 2rem) 0;
    padding: 0;
    display: grid;
    gap: var(--space-xl, 2rem);
}
.ticker-hub__title {
    font-size: var(--fs-lg, 1.125rem);
    font-weight: 600;
    color: var(--text-primary);
    margin: 0 0 var(--space-md) 0;
    display: flex;
    align-items: baseline;
    gap: var(--space-sm);
}
.ticker-hub__count {
    font-size: var(--fs-xs, 0.8125rem);
    font-weight: 400;
    color: var(--text-tertiary);
}

/* 점수 sparkline */
.ticker-hub__sparkline {
    background: var(--bg-card);
    border: 1px solid var(--border-light);
    border-radius: 8px;
    padding: var(--space-md);
}
.ticker-hub__svg {
    display: block;
    width: 100%;
    height: 80px;
    margin: var(--space-sm) 0;
}
.ticker-hub__meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: var(--fs-xs);
    color: var(--text-tertiary);
    font-family: 'JetBrains Mono', ui-monospace, monospace;
}
.ticker-hub__meta-avg {
    color: var(--accent);
    font-weight: 600;
}

/* 페이지네이션 */
.ticker-hub__pagination {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--space-md);
    margin-top: var(--space-lg);
    padding: var(--space-md) 0;
    border-top: 1px solid var(--border-light);
}
.ticker-hub__nav {
    color: var(--accent);
    text-decoration: none;
    font-size: var(--fs-sm);
    padding: var(--space-sm) var(--space-md);
    border: 1px solid var(--border-light);
    border-radius: 6px;
    transition: background 0.15s, border-color 0.15s;
}
.ticker-hub__nav:hover {
    background: var(--accent-dim);
    border-color: var(--border-accent);
}
.ticker-hub__nav--prev { margin-right: auto; }
.ticker-hub__nav--next { margin-left: auto; }
.ticker-hub__page {
    color: var(--text-tertiary);
    font-size: var(--fs-xs);
    font-family: 'JetBrains Mono', ui-monospace, monospace;
}

/* 모바일 보강 */
@media (max-width: 767px) {
    .ticker-hub { gap: var(--space-lg); }
    .ticker-hub__pagination { flex-direction: column; }
    .ticker-hub__svg { height: 60px; }
}

/* 카드 세로형 + 4행 본문 + 광고 cell 시각 통일 (2026-05-22 정정)         */

/* 4열에서도 desc 표시 — 4행 ellipsis (직전 display:none 정정) */
@media (min-width: 1200px) {
    .news-stream .news-card__desc,
    .news-grid .news-card__desc {
        display: -webkit-box !important;
        -webkit-line-clamp: 4;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: var(--fs-xs, 0.8125rem);
        color: var(--text-secondary);
        line-height: 1.5;
        margin-top: 8px;
        margin-bottom: 10px;
    }
    .news-stream .news-card__title,
    .news-grid .news-card__title {
        font-size: var(--fs-sm, 0.9375rem);
        line-height: 1.35;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        margin-bottom: 6px;
    }
}

/* 태블릿(768~1199) 도 desc 표시 — 모바일은 원래 보임 */
@media (min-width: 768px) and (max-width: 1199px) {
    .news-stream .news-card__desc,
    .news-grid .news-card__desc {
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
}

/* 카드 세로 stretch — 그리드 안에서 같은 row 카드들 height 통일 (광고와도) */
.news-stream .news-card,
.news-grid .news-card {
    display: flex;
    flex-direction: column;
    height: 100%;
}
.news-stream .news-card__footer,
.news-grid .news-card__footer {
    margin-top: auto;  /* footer 하단 고정 → 카드 stretch 시 메타 항상 아래 */
}

/* 그리드 row stretch — 같은 row 안 카드·광고 모두 같은 height */
.news-stream,
.news-grid {
    grid-auto-rows: 1fr;
    align-items: stretch;
}

/* 광고 cell 시각 통일 — 카드와 같은 background·border-radius·padding */
.news-stream .ad-slot--feed_inline,
.news-grid .ad-slot--feed_inline {
    background: var(--bg-card);
    border: 1px solid var(--border-light);
    border-radius: 10px;
    padding: 14px 16px;
    min-height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.news-stream .ad-slot--feed_inline .ad-slot__label,
.news-grid .ad-slot--feed_inline .ad-slot__label {
    font-size: var(--fs-xs);
    color: var(--text-tertiary);
    margin-bottom: 8px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* 우측 sticky rail (책 CTA + 광고) — viewport ≥1700px (2026-05-24)      */
/* 계산: main(--content-width=1100) 가운데 정렬. rail 폭 = 카드 1개 폭 = 263px        */
/* 카드 폭 = (1100 - 3 * 16gap) / 4 = 263px. rail이 카드와 동일 폭으로 시각 일관성.   */
/* right = calc((100vw - 1100) / 2 - 279px) = main 우측 끝에서 16px gap 자동 유지.    */

.page-rail {
    display: none;  /* 기본 숨김 */
}

@media (min-width: 1700px) {
    .page-rail {
        display: flex;
        flex-direction: column;
        gap: var(--space-md);
        position: fixed;
        top: calc(var(--header-height) + var(--space-md));
        right: calc((100vw - var(--content-width)) / 2 - 279px);
        width: 263px;
        max-height: calc(100vh - var(--header-height) - 2 * var(--space-md));
        overflow-y: auto;
        z-index: 5;
        scrollbar-width: thin;
    }
}

/* ───── rail-cta (책 CTA 컴팩트) ───── */
.rail-cta {
    background: var(--bg-card);
    border: 1px solid var(--border-light);
    border-radius: 10px;
    overflow: hidden;
    transition: border-color 0.15s, transform 0.15s;
}
.rail-cta:hover {
    border-color: var(--border-accent);
}
.rail-cta__link {
    display: block;
    color: inherit;
    text-decoration: none;
}
.rail-cta__cover {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 3 / 4;
    object-fit: cover;
    background: var(--bg-elevated);
}
.rail-cta__body {
    padding: var(--space-md);
}
.rail-cta__eyebrow {
    font-size: var(--fs-xs);
    color: var(--accent);
    margin: 0 0 4px 0;
    font-weight: 500;
}
.rail-cta__title {
    font-size: var(--fs-md, 1rem);
    color: var(--text-primary);
    margin: 0 0 6px 0;
    font-weight: 600;
    line-height: 1.3;
}
.rail-cta__author {
    font-size: var(--fs-xs);
    color: var(--text-secondary);
    margin: 0 0 2px 0;
}
.rail-cta__price {
    font-size: var(--fs-xs);
    color: var(--text-tertiary);
    margin: 0;
    font-family: 'JetBrains Mono', ui-monospace, monospace;
}
.rail-cta__stores {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    padding: 0 var(--space-md) var(--space-md);
}
.rail-cta__store {
    flex: 1;
    min-width: calc(50% - 2px);
    text-align: center;
    padding: 6px 8px;
    background: var(--bg-elevated);
    color: var(--text-secondary);
    text-decoration: none;
    font-size: var(--fs-xs);
    border-radius: 4px;
    transition: background 0.15s, color 0.15s;
}
.rail-cta__store:hover {
    background: var(--accent-dim);
    color: var(--accent);
}

/* rail 안의 sidebar 광고 — 카드와 같은 시각 */
.page-rail .ad-slot--sidebar {
    background: var(--bg-card);
    border: 1px solid var(--border-light);
    border-radius: 10px;
    padding: var(--space-md);
}

/* 뉴스 상세 페이지는 페이지 자체 grid 우측 컬럼에 관련 분석·광고 → 외부 page-rail 숨김 (중복 차단, 2026-05-24) */
body:has(.news-detail-page) .page-rail {
    display: none !important;
}

/* page-rail 정렬 정정 (2026-05-22 v2) — main 콘텐츠 상단과 정렬          */

@media (min-width: 1700px) {
    .page-rail {
        /* main의 padding-top과 동일하게 — 첫 카드 상단과 정렬 */
        top: calc(var(--header-height) + var(--space-2xl, 3rem));
    }
}

/* rail-cta 안 "자세히 보기" 마이크로 텍스트 */
.rail-cta__more {
    display: block;
    margin-top: var(--space-sm, 0.5rem);
    color: var(--accent);
    font-size: var(--fs-xs, 0.8125rem);
    font-weight: 500;
}
.rail-cta:hover .rail-cta__more {
    color: var(--accent-hover);
}

/* 더 이상 사용 안 함 — 서점 링크 영역 (rail에선 숨김) */
.rail-cta__stores { display: none !important; }

/* 광고 cell 정렬 정정 (2026-05-22 v3) — 비활성 상태에서도 row 정렬       */

/* grid 안 광고 slot — 비활성·활성 무관 자리 차지 + 다른 카드와 row 정렬 */
.news-stream .ad-slot--feed_inline,
.news-grid .ad-slot--feed_inline {
    /* 비활성 상태(빈 aside)에서도 카드와 같은 높이 강제 */
    min-height: 280px;
    height: 100%;
    /* grid item 자체를 row 시작 정렬 (top align) — 빈 cell이 아래로 밀리는 현상 차단 */
    align-self: stretch;
    /* 시각 통일 */
    background: var(--bg-card);
    border: 1px dashed var(--border-light);   /* dashed = 임시 자리 시그널 */
    border-radius: 10px;
    padding: 14px 16px;
    box-sizing: border-box;
    /* 내용 가운데 정렬 (활성 시 광고가 가운데로) */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

/* 활성 상태 — dashed border 제거하고 solid (실제 광고 자리) */
.ad-slot--feed_inline:has(ins.adsbygoogle) {
    border-style: solid;
}

/* 모바일에선 약간 낮게 (240px) — 카드와 비례 */
@media (max-width: 767px) {
    .news-stream .ad-slot--feed_inline,
    .news-grid .ad-slot--feed_inline {
        min-height: 240px;
    }
}

/* 광고 cell 정렬 v4 (위쪽 정렬) + 카드 margin 제거 + 저자 카드 (2026-05-22) */

/* 카드 margin-bottom 제거 — grid gap이 대체. 광고와 outer height 통일 */
.news-stream .news-card,
.news-grid .news-card {
    margin-bottom: 0;
}

/* 광고 cell — 위쪽 정렬 (justify-content: center → flex-start) */
.news-stream .ad-slot--feed_inline,
.news-grid .ad-slot--feed_inline {
    justify-content: flex-start !important;
    align-items: stretch !important;
}

/* ───── book-page 저자 소개 섹션 (2026-05-22) ───── */
.book-authors {
    margin: var(--space-2xl, 3rem) 0;
    padding: var(--space-xl, 2rem) 0;
    border-top: 1px solid var(--border-light);
    border-bottom: 1px solid var(--border-light);
}
.book-authors__title {
    font-size: var(--fs-lg, 1.125rem);
    color: var(--text-primary);
    margin: 0 0 var(--space-lg) 0;
    text-align: center;
}
.book-authors__list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: var(--space-md);
    max-width: 720px;
    margin: 0 auto;
}
.book-author {
    display: block;
    padding: var(--space-md);
    background: var(--bg-card);
    border: 1px solid var(--border-light);
    border-radius: 10px;
    text-decoration: none;
    color: inherit;
    text-align: center;
    transition: border-color 0.15s, background 0.15s, transform 0.15s;
}
.book-author:hover {
    border-color: var(--border-accent);
    background: var(--bg-elevated);
    transform: translateY(-1px);
}
.book-author__name {
    font-size: var(--fs-md, 1rem);
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 4px;
}
.book-author__role {
    font-size: var(--fs-xs, 0.8125rem);
    color: var(--text-secondary);
}

/* 광고 cell 위치 최종 정정 v5 (2026-05-22)                              */
/* 원인: news-detail.css 의 전역 `.ad-slot { margin: 2.5rem 0 }` 가      */
/* 메인 그리드 안의 광고 박스에도 적용되어 위·아래 40px 마진 → 박스가    */
/* 다른 카드보다 아래로 밀림. 그리드 안에선 강제 0 마진.                 */
.news-stream .ad-slot,
.news-grid .ad-slot {
    margin: 0 !important;
    display: flex !important;     /* 전역 display: none 차단 */
    position: static !important;
    align-self: stretch !important;
}

/* rail 정정 v3 (2026-05-22) — 메인 카드와 동일 폭 + 아래 정렬          */

/* viewport 1700~1799 에선 기존 240px 유지 (좁은 PC) */

@media (min-width: 1800px) {
    .page-rail {
        /* width·right 는 base(1700+) 의 263px 통일을 유지 — viewport jitter 차단 */
        /* 메인 카드 두 번째 row 정도로 더 아래 */
        top: calc(var(--header-height) + var(--space-2xl, 3rem) * 2);
    }
    /* rail-cta 자체 — 카드 2개 세로 합친 정도 (~600px 까지 자연 확장) */
    .rail-cta {
        /* 책 커버를 더 크게 → 폭이 커진 만큼 비례 자연 확대 (aspect-ratio 3/4 그대로) */
        /* 284 * 4/3 = ~378px 커버 + body(약 140px) + padding 등 = ~520~580px */
    }
    .rail-cta__body {
        padding: var(--space-lg, 1.5rem);  /* 책 정보 영역 더 풍부 */
    }
    .rail-cta__title {
        font-size: var(--fs-lg, 1.125rem);  /* 제목 키움 */
    }
    .rail-cta__eyebrow {
        font-size: var(--fs-sm, 0.9375rem);
    }
}

/* viewport 2000px+ — width·right base 통일 유지 (카드 263과 일관). 별도 override 없음. */

/* book-page 2열 구조 + 저자 풀 프로필 (2026-05-22)                      */

.book-page--2col {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-xl, 2rem);
    align-items: start;
}
@media (min-width: 900px) {
    .book-page--2col {
        grid-template-columns: minmax(280px, 380px) 1fr;
        gap: var(--space-2xl, 3rem);
    }
}

.book-page__left,
.book-page__right {
    min-width: 0;
}

/* 저자 프로필 카드 */
.book-authors__title {
    font-size: var(--fs-lg, 1.125rem);
    color: var(--text-primary);
    margin: var(--space-xl, 2rem) 0 var(--space-md);
    padding-bottom: var(--space-sm);
    border-bottom: 1px solid var(--border-light);
}
.book-author-profile {
    background: var(--bg-card);
    border: 1px solid var(--border-light);
    border-radius: 10px;
    padding: var(--space-lg, 1.5rem);
    margin-bottom: var(--space-md);
}
.book-author-profile:last-child { margin-bottom: 0; }
.book-author-profile__head {
    margin-bottom: var(--space-md);
    padding-bottom: var(--space-sm);
    border-bottom: 1px solid var(--border-light);
}
.book-author-profile__name {
    font-size: var(--fs-md, 1rem);
    color: var(--text-primary);
    margin: 0 0 4px 0;
    font-weight: 700;
}
.book-author-profile__role {
    font-size: var(--fs-xs, 0.8125rem);
    color: var(--accent);
    margin: 0;
}
.book-author-profile__bio {
    font-size: var(--fs-sm, 0.9375rem);
    color: var(--text-secondary);
    line-height: 1.6;
    margin: 0 0 var(--space-md);
}
.book-author-profile__group {
    margin-bottom: var(--space-sm);
    display: grid;
    grid-template-columns: 56px 1fr;
    gap: var(--space-sm);
    align-items: baseline;
}
.book-author-profile__group:last-child { margin-bottom: 0; }
.book-author-profile__label {
    font-size: var(--fs-xs);
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.book-author-profile__list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.book-author-profile__list li {
    font-size: var(--fs-xs);
    color: var(--text-secondary);
    margin-bottom: 3px;
    line-height: 1.5;
}

/* 도서 탭(#tab-book) 활성 시 우측 rail 책 CTA 숨김 (중복 차단)           */
body:has(#tab-book.tab-view--active) .page-rail .rail-cta {
    display: none !important;
}

/* book-page 소개 + 목차 (2026-05-22 추가)                              */

/* 책 소개 (왜 이 책인가) */
.book-intro {
    margin-bottom: var(--space-xl, 2rem);
}
.book-intro__heading {
    font-size: var(--fs-lg, 1.125rem);
    color: var(--text-primary);
    margin: 0 0 var(--space-md);
    padding-bottom: var(--space-sm);
    border-bottom: 1px solid var(--border-light);
}
.book-intro p {
    font-size: var(--fs-sm, 0.9375rem);
    color: var(--text-secondary);
    line-height: 1.75;
    margin: 0 0 var(--space-md);
}
.book-intro p:last-child {
    margin-bottom: 0;
}

/* 목차 */
.book-toc {
    margin: var(--space-xl, 2rem) 0;
}
.book-toc__heading {
    font-size: var(--fs-lg, 1.125rem);
    color: var(--text-primary);
    margin: 0 0 var(--space-md);
    padding-bottom: var(--space-sm);
    border-bottom: 1px solid var(--border-light);
}
.book-toc__pre {
    list-style: none;
    margin: 0 0 var(--space-md);
    padding: 0;
    font-size: var(--fs-sm);
    color: var(--text-secondary);
}
.book-toc__pre li {
    padding: 4px 0;
    border-bottom: 1px dotted var(--border-light);
}
.book-toc__pre li:last-child {
    border-bottom: none;
}
.book-toc__part {
    margin: var(--space-lg) 0;
    padding: var(--space-md);
    background: var(--bg-card);
    border: 1px solid var(--border-light);
    border-radius: 10px;
}
.book-toc__part-title {
    font-size: var(--fs-md, 1rem);
    color: var(--accent);
    margin: 0 0 var(--space-md);
    font-weight: 700;
    letter-spacing: -0.01em;
}
.book-toc__chapter {
    margin-bottom: var(--space-md);
}
.book-toc__chapter:last-child {
    margin-bottom: 0;
}
.book-toc__chapter-title {
    font-size: var(--fs-sm);
    color: var(--text-primary);
    margin: 0 0 var(--space-xs);
    font-weight: 600;
}
.book-toc__sections {
    list-style: none;
    margin: 0;
    padding: 0 0 0 var(--space-md);
    border-left: 2px solid var(--border-light);
}
.book-toc__sections li {
    font-size: var(--fs-xs);
    color: var(--text-secondary);
    padding: 3px 0;
    line-height: 1.45;
}
.book-toc__cases {
    list-style: decimal inside;
    margin: 0;
    padding: 0;
}
.book-toc__cases li {
    font-size: var(--fs-sm);
    color: var(--text-secondary);
    padding: 4px 0;
    line-height: 1.5;
}
.book-toc__cases li::marker {
    color: var(--accent);
    font-weight: 600;
}

/* 기사 분석 자료 상세 — 제목은 고딕(Pretendard) 강제 (2026-05-22)        */
/* 본문 컨테이너 `.news-detail-page { font-family: 'Noto Serif KR' }`이   */
/* h1~h6에 명조 상속시키는 걸 차단. 본문 p·li 등은 명조 유지(가독성).    */
/* "지금 있는 것들과 앞으로 있을 것들 모두" — 셀렉터 기반 자동 적용.      */
.news-detail-page h1,
.news-detail-page h2,
.news-detail-page h3,
.news-detail-page h4,
.news-detail-page h5,
.news-detail-page h6 {
    font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', sans-serif !important;
    letter-spacing: -0.015em;
}

/* 기사 상세 페이지 — page-rail 책 CTA 다시 노출 (2026-05-24).            */
/* 구 정책: nd-book-cta 사이드바와 중복이라 숨김 → nd-book-cta 제거(D2-4)로 */
/* 근거 사라짐. 사용자 의도로 우측 여백 책 CTA 플로팅 활성.                  */

/* 기업분석 카드 그리드(.co-grid/.co-card) 제거 — 홈 #tab-companies 폐지 (2026-05-24) */

/* 종목 페이지 재설계 (2026-05-22) — 좌측 nav + anchor nav + 6 섹션      */

.company-page {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-lg, 1.5rem);
    margin-top: var(--space-md);
}
@media (min-width: 1024px) {
    .company-page {
        grid-template-columns: 220px 1fr;
        gap: var(--space-xl, 2rem);
        align-items: start;
    }
}

/* 좌측 종목 nav */
.ticker-nav {
    background: var(--bg-card);
    border: 1px solid var(--border-light);
    border-radius: 12px;
    padding: var(--space-md);
}
@media (min-width: 1024px) {
    .ticker-nav {
        position: sticky;
        top: calc(var(--header-height) + var(--space-md));
        max-height: calc(100vh - var(--header-height) - 2 * var(--space-md));
        overflow-y: auto;
    }
}
.ticker-nav__title {
    font-size: var(--fs-xs, 0.8125rem);
    color: var(--text-tertiary);
    margin: 0 0 var(--space-sm);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 600;
    padding: 0 var(--space-xs);
}
.ticker-nav__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
@media (max-width: 1023px) {
    /* 모바일: 가로 스크롤 칩 */
    .ticker-nav__list {
        flex-direction: row;
        overflow-x: auto;
        gap: var(--space-xs);
        scrollbar-width: thin;
        padding-bottom: 4px;
    }
    .ticker-nav__li { flex-shrink: 0; }
}
.ticker-nav__item {
    display: flex;
    flex-direction: column;
    padding: var(--space-sm) var(--space-md);
    border-radius: 8px;
    text-decoration: none;
    color: var(--text-secondary);
    transition: background 0.15s, color 0.15s;
    border: 1px solid transparent;
}
.ticker-nav__item:hover {
    background: var(--bg-elevated);
    color: var(--text-primary);
}
.ticker-nav__item--active {
    background: var(--accent-dim);
    color: var(--accent);
    border-color: var(--border-accent);
}
.ticker-nav__ticker {
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-weight: 700;
    font-size: var(--fs-sm, 0.9375rem);
    letter-spacing: 0.02em;
}
.ticker-nav__name {
    font-size: var(--fs-xs, 0.8125rem);
    color: inherit;
    opacity: 0.8;
    margin-top: 2px;
}
@media (max-width: 1023px) {
    .ticker-nav__item {
        flex-direction: row;
        align-items: center;
        gap: var(--space-xs);
        white-space: nowrap;
        padding: var(--space-xs) var(--space-sm);
    }
    .ticker-nav__name { margin-top: 0; }
}

/* 우측 카테고리 anchor nav */
.category-anchor-nav {
    background: var(--bg-card);
    border-bottom: 1px solid var(--border-light);
    margin-bottom: var(--space-lg);
    /* sticky 제거 (2026-05-25) — 부모 .cat-bar 가 sticky 담당. 자식 중복 sticky 무의미·중첩 원인. */
}
.category-anchor-nav__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: var(--space-xs);
    overflow-x: auto;
    scrollbar-width: thin;
}
.category-anchor-nav__link {
    display: block;
    padding: var(--space-sm) var(--space-md);
    color: var(--text-secondary);
    text-decoration: none;
    border-bottom: 2px solid transparent;
    transition: color 0.15s, border-color 0.15s;
    white-space: nowrap;
    font-size: var(--fs-sm);
}
.category-anchor-nav__link:hover {
    color: var(--text-primary);
}
.category-anchor-nav__link.is-active {
    color: var(--accent);
    border-bottom-color: var(--accent);
    font-weight: 600;
}

/* anchor 스크롤 offset (sticky 헤더·anchor nav 만큼) */
.company-main [id] {
    scroll-margin-top: 120px;
}

html {
    scroll-behavior: smooth;
}

.company-main {
    min-width: 0;
}

/* sticky bar 통합 (종목 메타 + anchor nav) + active 강조 (2026-05-22)    */

.cat-bar {
    background: var(--bg-base, var(--bg-primary, #1F2027));
    border-bottom: 1px solid var(--border);
    position: sticky;
    top: calc(var(--header-height));
    z-index: 6;
    margin: 0 calc(-1 * var(--space-lg)) var(--space-lg);
    padding: var(--space-sm) var(--space-lg);
    backdrop-filter: blur(8px);
}

.cat-bar__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-sm);
    margin-bottom: var(--space-xs);
    padding-bottom: var(--space-xs);
    border-bottom: 1px dashed var(--border-light);
}
.cat-bar__ticker {
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-weight: 700;
    color: var(--accent);
    font-size: var(--fs-md, 1rem);
}
.cat-bar__name {
    font-weight: 600;
    color: var(--text-primary);
    font-size: var(--fs-sm);
}
.cat-bar__sector,
.cat-bar__fcf {
    color: var(--text-tertiary);
    font-size: var(--fs-xs);
}
.cat-bar__sector::before { content: '·'; margin-right: var(--space-sm); color: var(--text-tertiary); }
.cat-bar__fcf::before { content: '·'; margin-right: var(--space-sm); color: var(--text-tertiary); }
.cat-bar__fcf {
    color: var(--accent-muted);
    font-weight: 500;
}

/* category-anchor-nav 는 cat-bar 안으로 통합됐으므로 자체 sticky·border 제거 */
.cat-bar .category-anchor-nav {
    position: static;
    border-bottom: none;
    margin: 0;
    background: transparent;
}

/* ───── 좌측 종목 nav active 강조 강화 ───── */
.ticker-nav__item--active {
    background: var(--accent-dim);
    color: var(--accent);
    border-color: var(--border-accent);
    font-weight: 700;
    position: relative;
}
.ticker-nav__item--active::before {
    content: '';
    position: absolute;
    left: -1px;
    top: 12%;
    bottom: 12%;
    width: 3px;
    background: var(--accent);
    border-radius: 0 3px 3px 0;
}
.ticker-nav__item--active .ticker-nav__ticker {
    color: var(--accent);
}
.ticker-nav__item--active .ticker-nav__name {
    color: var(--accent-hover);
    opacity: 1;
}

/* 모바일 가로 스크롤 칩에서도 active 강조 */
@media (max-width: 1023px) {
    .ticker-nav__item--active::before {
        left: 8%;
        right: 8%;
        top: auto;
        bottom: 0;
        width: auto;
        height: 2px;
        border-radius: 2px 2px 0 0;
    }
}

/* anchor scroll offset 조정 (cat-bar 높이 추가) */
.company-main [id] {
    scroll-margin-top: 160px;
}

/* 종목 페이지 추가 정정 v2 (2026-05-22) — 책 CTA 위치 이동 + DuPont 정렬 */

/* 종목 페이지에서 우측 rail 책 CTA 숨김 (좌측 ticker-nav 하단으로 이동했음) */
body:has(.company-page) .page-rail .rail-cta {
    display: none !important;
}

/* ticker-nav 안 rail-cta 위치 조정 (PC 데스크탑만) */
@media (min-width: 1024px) {
    .ticker-nav .rail-cta {
        margin-top: var(--space-md, 1rem);
        padding-top: var(--space-md, 1rem);
        border-top: 1px solid var(--border-light);
        position: static;
    }
}
@media (max-width: 1023px) {
    /* 모바일 가로 스크롤 칩에선 책 CTA 숨김 (어색) */
    .ticker-nav .rail-cta {
        display: none;
    }
}

/* DuPont 분해 — 수평 정렬 강제 (nowrap + 좁으면 가로 스크롤) */
.dupont__grid {
    flex-wrap: nowrap !important;
    overflow-x: auto;
    overflow-y: visible;
    padding: var(--space-xs) 0;
    scrollbar-width: thin;
}
.dupont__item,
.dupont__op {
    flex-shrink: 0;
}
.dupont__item {
    min-width: 70px;
    padding: var(--space-xs) var(--space-sm);
}
.dupont__label {
    display: block;
    font-size: var(--fs-xs, 0.8125rem);
    color: var(--text-tertiary);
    margin-bottom: 2px;
    white-space: nowrap;
}
.dupont__value {
    display: block;
    font-size: var(--fs-sm, 0.9375rem);
    color: var(--text-primary);
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-weight: 600;
    white-space: nowrap;
}
.dupont__op {
    color: var(--text-tertiary);
    font-size: var(--fs-sm);
    padding: 0 2px;
}

/* sidebar-panel 자체에 overflow 차단 — DuPont 상단 잘림 방지 */
.sidebar-panel {
    overflow: visible !important;
}

/* 스크롤바 시각 숨김 — 스크롤 동작은 유지 (2026-05-22)                   */
.ticker-nav,
.ticker-nav__list,
.category-anchor-nav__list,
.dupont__grid,
.page-rail,
.cat-bar,
.news-stream,
.news-grid {
    scrollbar-width: none;          /* Firefox */
    -ms-overflow-style: none;       /* IE/Edge */
}
.ticker-nav::-webkit-scrollbar,
.ticker-nav__list::-webkit-scrollbar,
.category-anchor-nav__list::-webkit-scrollbar,
.dupont__grid::-webkit-scrollbar,
.page-rail::-webkit-scrollbar,
.cat-bar::-webkit-scrollbar,
.news-stream::-webkit-scrollbar,
.news-grid::-webkit-scrollbar {
    width: 0;
    height: 0;
    background: transparent;
    display: none;
}

/* 종목 페이지 — 우측 page-rail 전체 숨김 (좌측 ticker-nav 안 책 CTA로 통합) */
/* 이전: .rail-cta 만 숨김 → 광고 slot/배경 남음. 전체 숨김으로 정정.        */
body:has(.company-page) .page-rail {
    display: none !important;
}

/* bottom-nav 시각 톤 정리 (2026-05-22) — 진한 검은 배경 완화              */

/* footer margin-bottom 정리 — bottom-nav 60px만 비워두면 충분 */
@media (max-width: 768px) {
    .has-bottom-nav .footer {
        margin-bottom: 60px;
    }
    .has-bottom-nav {
        background: var(--bg-primary, #1F2027);
    }
    /* 페이지 끝 — body 배경이 footer 아래로 무한 노출되는 거 차단 */
    body.has-bottom-nav {
        background: var(--bg-primary);
        min-height: 100vh;
    }
}

/* 종목 페이지 푸터 빈 영역 차단 (2026-05-22 추가)                        */

/* body 배경이 footer 아래로 무한 노출되는 거 차단 — 모든 페이지 */
html, body {
    background: var(--bg-primary, #1F2027);
}

/* main 영역 최소 height (viewport 채움) */
.main {
    min-height: calc(100vh - var(--header-height) - 100px);
}

/* footer 자체 배경·여백 정리 */
.footer {
    background: var(--bg-primary, #1F2027);
    border-top: 1px solid var(--border-light);
    padding: var(--space-xl) 0;
    margin-top: var(--space-xl);
}

/* disclaimer 다음 page 끝까지 추가 빈 영역 없게 */
.company-page,
.news-detail-page {
    padding-bottom: 0;
    margin-bottom: 0;
}

/* bottom-nav__item base — layout + reset + tone (2026-05-24 단일 정본 복원) */
.bottom-nav__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    color: var(--text-tertiary);
    text-decoration: none;          /* anchor 언더라인 제거 */
    background: none;
    border: none;
    font-family: 'Pretendard', sans-serif;
    position: relative;             /* active::after 점 위치용 */
    transition: color 0.2s;
}
.bottom-nav__icon {
    stroke: var(--text-tertiary);
    fill: none;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.bottom-nav__label {
    font-size: 0.7rem;
    color: var(--text-tertiary);
    line-height: 1;
}
.bottom-nav__item:hover,
.bottom-nav__item--active,
.bottom-nav__item[aria-current="page"] {
    color: var(--accent);
}
.bottom-nav__item--active .bottom-nav__icon,
.bottom-nav__item[aria-current="page"] .bottom-nav__icon {
    stroke: var(--accent);
}
.bottom-nav__item--active .bottom-nav__label,
.bottom-nav__item[aria-current="page"] .bottom-nav__label {
    color: var(--accent);
}
/* active 상단 점 표시 */
.bottom-nav__item--active::after,
.bottom-nav__item[aria-current="page"]::after {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 20px;
    height: 2px;
    background: var(--accent);
    border-radius: 1px;
}

/* bottom-nav PC 강제 숨김 (2026-05-22) — viewport 경계 명확 + !important */

/* 기본: 숨김 */

/* 모바일 only (≤768px)에서 표시 */

/* PC에선 has-bottom-nav main padding-bottom 제거 (빈 공간 차단) */
@media (min-width: 769px) {
    .has-bottom-nav .main {
        padding-bottom: var(--space-xl, 2rem);
    }
    .has-bottom-nav .footer {
        margin-bottom: 0;
    }
}

/* 종목 페이지 모바일 최적화 v3 (2026-05-22) — 종합 정리                  */

/* ────────────────── 태블릿·모바일 (≤1023) ────────────────── */
@media (max-width: 1023px) {
    /* ticker-nav 헤딩 숨김 — 모바일에선 가로 칩만 */
    .ticker-nav__title { display: none; }
    .ticker-nav {
        background: transparent;
        border: none;
        padding: var(--space-xs) 0;
        margin: 0;
    }
    .ticker-nav__list {
        padding: 4px 0;
        margin: 0;
    }
}

/* ────────────────── 모바일 (≤768) ────────────────── */
@media (max-width: 768px) {
    /* cat-bar 모바일 컴팩트 */
    .cat-bar {
        margin: 0 calc(-1 * var(--space-md, 1rem)) var(--space-md);
        padding: var(--space-xs) var(--space-md);
        top: var(--header-height);
    }
    .cat-bar__meta {
        flex-wrap: nowrap;
        overflow-x: auto;
        scrollbar-width: none;
        -ms-overflow-style: none;
        gap: var(--space-xs);
        font-size: var(--fs-xs, 0.8125rem);
        margin-bottom: 4px;
        padding-bottom: 4px;
        white-space: nowrap;
    }
    .cat-bar__meta::-webkit-scrollbar { display: none; }
    .cat-bar__ticker { font-size: var(--fs-sm); }
    .cat-bar__name { font-size: var(--fs-xs); }
    .cat-bar__sector, .cat-bar__fcf {
        font-size: 0.7rem;
        color: var(--text-tertiary);
    }
    .cat-bar__fcf { font-size: 0.7rem; }

    /* anchor nav 모바일 fit */
    .category-anchor-nav__list {
        gap: 0;
    }
    .category-anchor-nav__link {
        padding: var(--space-xs) var(--space-sm);
        font-size: var(--fs-xs);
    }

    /* company-page 모바일 gap */
    .company-page {
        gap: var(--space-sm);
        margin-top: var(--space-xs);
    }

    /* anchor scroll margin 모바일 조정 */
    .company-main [id] {
        scroll-margin-top: 130px;
    }

    /* main 모바일 padding 정리 — bottom-nav 60 + 여유 */
    .has-bottom-nav .main {
        padding-bottom: 80px;
    }

    /* bottom-nav 시각 — 4메뉴 fit + 컴팩트 아이콘 (2026-05-24) */
    .bottom-nav__item {
        flex: 1;
        gap: 2px;
        padding: 4px 6px;
    }
    .bottom-nav__icon {
        width: 18px;
        height: 18px;
    }
    .bottom-nav__label {
        font-size: 0.66rem;
        line-height: 1;
    }
    .has-bottom-nav .footer {
        margin-bottom: 56px;
    }

    /* 종목 페이지 본문 안 영역 모바일 정리 */
    .company-hero {
        padding: var(--space-md) 0;
    }
    .company-hero__identity {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--space-sm);
    }
    .metrics-grid {
        grid-template-columns: 1fr 1fr !important;
        gap: var(--space-sm);
    }

    /* DuPont 분해 모바일에서 더 컴팩트 */
    .sidebar-panel {
        padding: var(--space-sm);
    }
    .dupont__item { min-width: 60px; padding: 6px 8px; }
    .dupont__label { font-size: 0.7rem; }
    .dupont__value { font-size: var(--fs-xs); }

    /* ticker-hub 모바일 정리 */
    .ticker-hub { gap: var(--space-md); }
    .ticker-hub__title { font-size: var(--fs-md); }

    /* news-grid 모바일 1열 (이미 적용)에서 카드 height 정리 */
    .news-stream,
    .news-grid {
        gap: var(--space-sm);
    }
}

/* ────────────────── 작은 모바일 (≤480) ────────────────── */
@media (max-width: 480px) {
    .cat-bar__name { display: none; }   /* 너무 좁으면 회사명 숨김 (ticker만) */
    .metrics-grid { grid-template-columns: 1fr !important; }
}

/* 종목 페이지 모바일 최적화 v4 (2026-05-22) — company-detail 1열 강제   */
/* 핵심 원인: company-detail.css는 PC 8:5 2열, 모바일 정책 없음          */

/* 2열 → 모바일 1열 + 좌측 요약 static (2026-05-24 __aside/__body 재명명) */
@media (max-width: 1023px) {
    .company-detail {
        grid-template-columns: 1fr !important;
        gap: var(--space-lg, 1.5rem) !important;
    }
    .company-detail__aside {
        position: static !important;
        top: auto !important;
        align-self: stretch !important;
        max-height: none !important;
        overflow-y: visible !important;
    }
    .company-detail__aside,
    .company-detail__body {
        min-width: 0;
    }
}

/* 재무 테이블 모바일 가로 스크롤 (이미 overflow-x:auto, 좀 더 명확) */
@media (max-width: 768px) {
    .financial-table__wrapper {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        margin: 0 calc(-1 * var(--space-md, 1rem));
        padding: 0 var(--space-md);
    }
    .financial-table {
        font-size: var(--fs-xs, 0.8125rem);
        min-width: 480px;          /* 너무 좁게 압축되지 않게 */
    }
    .financial-table th,
    .financial-table td {
        padding: var(--space-xs) var(--space-sm);
    }

    /* detail-section 모바일 padding 정리 */
    .detail-section {
        padding: var(--space-md) 0;
    }
    .detail-section__title {
        font-size: var(--fs-md, 1rem) !important;
        line-height: 1.4;
    }

    /* 10-K 원문 링크 박스 모바일 */
    .tenk-link {
        gap: var(--space-sm);
    }
    .tenk-link__badge {
        font-size: 0.7rem;
    }

    /* MD&A·리스크 분석 본문 모바일 가독성 */
    .analysis-block__content {
        font-size: var(--fs-sm, 0.9375rem);
        line-height: 1.7;
    }

    /* sidebar-panel 모바일 — sidebar 안 패널들 (DuPont 등) */
    .sidebar-panel + .sidebar-panel {
        margin-top: var(--space-md);
    }
    .sidebar-panel__title {
        font-size: var(--fs-md);
    }

    /* breadcrumb 모바일 컴팩트 */
    .breadcrumb {
        font-size: var(--fs-xs);
        padding: var(--space-xs) 0;
    }
}

/* viewport overflow 강제 차단 (2026-05-22) — 콘텐츠가 모바일 폭 초과 차단 */
/* 증상: 모바일에서 PC 폭으로 렌더링 → 자동 zoom out → @media 적용 어긋남  */
html, body {
    overflow-x: hidden;
    max-width: 100%;
}

@media (max-width: 1023px) {
    .main,
    .company-page,
    .company-main,
    .news-detail-page {
        max-width: 100%;
        overflow-x: hidden;
    }
    /* 그리드·flex 자식이 100% 초과하지 않게 */
    .company-page > *,
    .company-main > * {
        min-width: 0;
        max-width: 100%;
    }
    /* 단, 의도된 가로 스크롤 영역은 예외 (재무 테이블, ticker-nav 칩 등) */
    .financial-table__wrapper,
    .ticker-nav__list,
    .category-anchor-nav__list,
    .cat-bar__meta,
    .dupont__grid,
    .news-stream,
    .news-grid {
        overflow-x: auto;
    }
    .financial-table {
        max-width: none;   /* min-width 480 그대로 — overflow-x로 스와이프 */
    }
}

/* 종목 페이지 레이아웃 v5 (2026-05-22) — PC·모바일 일관 상단 가로 슬라이드 */
/* 변경:                                                                  */
/*  - company-page grid (좌측 nav + 우측) → block (단일 column)           */
/*  - ticker-nav 좌측 사이드 → 상단 가로 슬라이드 (PC·모바일 동일)         */
/*  - ticker-nav sticky 상단 (header 아래) + cat-bar sticky 그 아래        */

.company-page {
    display: block !important;
    grid-template-columns: none !important;
}

/* ticker-nav — 모든 viewport에서 상단 가로 슬라이드 sticky */
.ticker-nav {
    position: sticky !important;
    top: var(--header-height) !important;
    z-index: 7 !important;
    background: var(--bg-primary, #1F2027) !important;
    border-bottom: 1px solid var(--border-light) !important;
    margin: 0 calc(-1 * var(--space-lg, 1.5rem)) 0 !important;
    padding: 8px var(--space-lg, 1.5rem) !important;
    max-height: none !important;
    overflow-y: visible !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.ticker-nav__title {
    display: none !important;
}

.ticker-nav__list {
    display: flex !important;
    flex-direction: row !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    gap: var(--space-xs, 4px) !important;
    margin: 0 !important;
    padding: 0 !important;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.ticker-nav__list::-webkit-scrollbar {
    display: none;
}

.ticker-nav__li {
    flex-shrink: 0;
}

.ticker-nav__item {
    flex-direction: row !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 6px var(--space-sm) !important;
    white-space: nowrap !important;
    border-radius: 6px !important;
}
.ticker-nav__item--active {
    background: var(--accent-dim) !important;
    color: var(--accent) !important;
    border-color: var(--border-accent) !important;
}
.ticker-nav__item--active::before {
    display: none !important;   /* 좌측 bar 패턴 제거 (가로 슬라이드용으로) */
}

.ticker-nav__ticker {
    font-size: var(--fs-sm) !important;
}
.ticker-nav__name {
    font-size: var(--fs-xs, 0.8125rem) !important;
    margin-top: 0 !important;
    opacity: 0.7;
}

/* cat-bar top 조정 — ticker-nav (높이 약 40~48px) 아래로 */
.cat-bar {
    top: calc(var(--header-height) + 48px) !important;
}

/* anchor scroll-margin 조정 — header 56 + ticker-nav 48 + cat-bar 60 = 164 */
.company-main [id] {
    scroll-margin-top: 170px !important;
}

@media (max-width: 768px) {
    /* 모바일에서 ticker-nav 약간 더 컴팩트 */
    .ticker-nav {
        padding: 6px var(--space-md, 1rem) !important;
        margin: 0 calc(-1 * var(--space-md, 1rem)) 0 !important;
    }
    .ticker-nav__item {
        padding: 5px var(--space-sm) !important;
    }
    .ticker-nav__name {
        display: inline !important;
        font-size: 0.7rem !important;
    }
    .cat-bar {
        top: calc(var(--header-height) + 42px) !important;
    }
    .company-main [id] {
        scroll-margin-top: 160px !important;
    }
}

/* bottom-nav 글로벌 fixed 강제 (2026-05-22) — 모든 페이지·viewport 일관   */
/*                                                                       */
/* 원인: body { overflow-x: hidden } 이 모바일 브라우저에서 fixed 부모를  */
/*       body로 만들어 bottom-nav가 viewport가 아닌 body 끝에 정렬됨.    */
/* 해결: overflow-x: hidden → clip (fixed positioning에 영향 없음).      */

/* overflow 정책 — fixed positioning 호환 */
html {
    overflow-x: clip;
}
body {
    overflow-x: clip !important;
    overflow-y: auto;
    /* 직전 max-width 100% 제거 — fixed bottom 영향 가능 */
    max-width: none;
}

/* bottom-nav 절대 보장 — viewport 하단 fixed */

/* bottom-nav 표시 정책 — 모바일만 (강제) */

/* main 모바일 padding-bottom — bottom-nav 가리지 않게 */
@media (max-width: 768px) {
    body.has-bottom-nav .main {
        padding-bottom: calc(60px + var(--space-lg, 1.5rem));
    }
}

/* bottom-nav fixed 보장 — body overflow 제거 (2026-05-22 최종)            */
/* 일부 모바일 브라우저(Safari iOS)에서 body의 overflow-x:clip 도          */
/* fixed positioning 부모를 깨뜨림. body는 default overflow로 두고        */
/* 가로 overflow는 .main 등 wrapper에서 차단.                              */

/* body·html에서 overflow 관련 속성 모두 제거 (fixed 호환) */
html {
    overflow-x: visible !important;
}
body {
    overflow-x: visible !important;
    overflow-y: visible !important;
    max-width: none !important;
    /* transform·filter·perspective 등 fixed 부모로 만드는 속성 ❌ */
}

/* 가로 overflow 차단은 main wrapper 또는 자식에서 */
/* ⚠️ max-width: 100vw 제거 (2026-05-24) — 라인 152의 max-width: var(--content-width)
   1200px 가운데 정렬을 갈아엎고 있었음. overflow-x: clip 만으로 가로 스크롤 차단 충분. */
.main {
    overflow-x: clip;
}
.company-page,
.company-main,
.news-detail-page {
    overflow-x: clip;
    max-width: 100%;
}

/* bottom-nav viewport 기준 fixed 보장 — !important + 모든 brwoser */

/* 모바일에서만 표시 (PC ≥769 숨김) */

/* 하단 모바일 네비 (통합 — 구 11개 분산 블록 대체).
   ⚠️ position:fixed + inset/width:100vw + body overflow:visible 는 iOS Safari 에서
   fixed 부모가 깨지는 문제의 최종 해법이다. 값 변경 시 iOS 실기기 회귀 확인 필수. */
.bottom-nav {
    position: fixed !important;
    inset: auto 0 0 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    z-index: 9999 !important;
    margin: 0 !important;
    display: none !important;
    background: rgba(31, 32, 39, 0.85) !important;
    border-top: 1px solid var(--border) !important;
    box-shadow: none !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    transform: translateZ(0);
}
@media (max-width: 768px) {
    .bottom-nav { display: flex !important; height: 56px; }
}
@media (min-width: 769px) {
    .bottom-nav { display: none !important; }
}
