/* nb-skin.css — NB SEO Tools (nb5.mhna98.com) 사이트 전용 스킨. 생성: _shared/skins/make_skins.py — 직접 고치지 말고 생성기를 고친다 */
/* 콘셉트: 검색 순위표 — 에디토리얼 대형 제목 + 순위 목록형 카드 | hero=editorial card=rows sect=open win=browser motif=lines */
:root { --sk-head: "Gothic A1", Pretendard, "Malgun Gothic", sans-serif; --sk-r: 16px; }
html:not([data-theme="light"]) { --dark: #070a07; }
.hero h1, .tools-head h2, .channel-hub > h2, .ws-head h3, .site-blueprint h2, .brand strong, .ft-brand strong, main.latest-posts > article > h1, main.latest-posts > article h2, .affiliate-deals .section-head > span, .latest-posts > .section-head > span, .blog-thumb strong, .nbp-win b { font-family: var(--sk-head) !important; }
html:not([data-theme="light"]) body { background: repeating-linear-gradient(0deg, color-mix(in srgb, var(--text), transparent 94%) 0 1px, transparent 1px 32px), radial-gradient(1100px 520px at 85% -5%, color-mix(in srgb, var(--brand), transparent 80%), transparent 60%), var(--dark) !important; }
html[data-theme="light"] body { background: repeating-linear-gradient(0deg, color-mix(in srgb, var(--text), transparent 94%) 0 1px, transparent 1px 32px), radial-gradient(1100px 520px at 85% -5%, color-mix(in srgb, var(--brand), transparent 86%), transparent 60%), #f5f6f9 !important; }
body:has(.site-header) :is(.latest-posts, .channel-hub, .tools-section, .affiliate-deals) { border-radius: calc(var(--sk-r) + 6px) !important; }
body .tool-grid > .tool-card, body .blog-mini, body .workspace-panel { border-radius: var(--sk-r) !important; }
body .hero .hero-grid { text-align: left; }
body .hero .hero-copy { max-width: none; margin: 0; }
body .hero .hero-copy > p:not(.eyebrow) { margin-left: 0; margin-right: 0; }
body .hero .hero-actions, body .hero .hero-stats { justify-content: flex-start; }

/* 에디토리얼: 제목이 가로 전체를 쓰는 대형 활자, 아래 줄에 설명·버튼 | 미리보기 */
@media (min-width: 861px) {
  body .hero .hero-grid {
    grid-template-columns: minmax(0, 1.2fr) minmax(320px, 0.8fr);
    grid-template-areas: "eb eb" "h1 h1" "p art" "act art" "st art";
    column-gap: 56px; row-gap: 0; align-items: start;
  }
  body .hero .hero-copy { display: contents; }
  body .hero .hero-copy > .eyebrow { grid-area: eb; }
  body .hero .hero-grid h1 { grid-area: h1; font-size: clamp(44px, 6.4vw, 88px) !important; line-height: 1.04 !important; margin-bottom: 28px; }
  body .hero .hero-copy > p:not(.eyebrow) { grid-area: p; }
  body .hero .hero-actions { grid-area: act; }
  body .hero .hero-stats { grid-area: st; }
  body .hero .hero-art { grid-area: art; min-height: 300px; align-self: stretch; }
}
/* 목록형: 카드 상자 대신 줄 + 화살표 (PC). 모바일은 nb-polish 의 2열 칸 유지 */
@media (min-width: 641px) {
  body .tool-grid { gap: 0 !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; border-top: 1px solid var(--line); }
  body .tool-grid > .tool-card {
    border: 0 !important; border-bottom: 1px solid var(--line) !important; border-radius: 0 !important;
    background: transparent !important; box-shadow: none !important; min-height: 78px; padding-right: 64px !important;
  }
  body .tool-grid > .tool-card:nth-child(odd) { border-right: 1px solid var(--line) !important; }
  body .tool-grid > .tool-card::after {
    content: ""; position: absolute; right: 22px; top: 50%; width: 9px; height: 9px;
    border-top: 2px solid currentColor; border-right: 2px solid currentColor; opacity: 0.45;
    transform: translateY(-50%) rotate(45deg); transition: transform 0.25s ease, opacity 0.2s ease;
  }
  body .tool-grid > .tool-card:hover { transform: none !important; background: color-mix(in srgb, var(--brand), transparent 92%) !important; }
  body .tool-grid > .tool-card:hover::after { opacity: 1; transform: translate(4px, -50%) rotate(45deg); }
  body .tool-grid > .tool-card.is-active { box-shadow: inset 3px 0 0 var(--brand) !important; background: color-mix(in srgb, var(--brand), transparent 90%) !important; }
  body .tool-grid > .tool-card .tool-star { right: 40px !important; top: 50% !important; transform: translateY(-50%); }
}
/* 열린 섹션: 상자 없이 굵은 위 선 + 왼쪽 정렬 머리글 */
body:has(.site-header) :is(.latest-posts, .channel-hub, .tools-section, .affiliate-deals) {
  background: transparent !important; border: 0 !important; border-top: 2px solid color-mix(in srgb, var(--text), transparent 70%) !important;
  border-radius: 0 !important; box-shadow: none !important; padding-left: 0 !important; padding-right: 0 !important;
}
body:has(.site-header) .tools-section::before { display: none !important; }
body:has(.site-header) .tools-head { text-align: left !important; }
body:has(.site-header) .tools-head h2 { margin-top: 12px; }
/* 브라우저 창: 주소창 */
.nbp-art .nbp-win b {
  flex: 1; padding: 6px 14px !important; margin-right: 30%; border-radius: 999px;
  background: color-mix(in srgb, var(--text), transparent 92%); font-size: 12.5px !important;
}
.nbp-art .nbp-win b::before { content: "https://"; opacity: 0.5; font-weight: 600; }
.nbp-art .nbp-wico { display: none; }
.hero .eyebrow::before { content: "#1"; width: auto; height: auto; background: none; font-size: 13px; color: var(--brand); }
.tools-head > span::before { border-radius: 2px !important; }
@media (prefers-reduced-motion: reduce) { .nbp-art .nbp-rows::before, .hero .eyebrow::before { animation: none !important; } }
html.perf-lite .nbp-art .nbp-rows::before, html.perf-lite .hero .eyebrow::before { animation: none !important; }