/* nb-skin.css — NB Webmaster Tools (nb10.mhna98.com) 사이트 전용 스킨. 생성: _shared/skins/make_skins.py — 직접 고치지 말고 생성기를 고친다 */
/* 콘셉트: 상황판 — 벤토 그리드 히어로 + 주사선 | hero=bento card=tile sect=panel win=browser motif=scan */
:root { --sk-head: "Orbit", Pretendard, "Malgun Gothic", sans-serif; --sk-r: 18px; }
html:not([data-theme="light"]) { --dark: #06090a; }
.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; }
.hero h1, .tools-head h2, .channel-hub > h2, main.latest-posts > article > h1, .blog-thumb strong { font-weight: 400 !important; letter-spacing: -0.01em !important; }
html:not([data-theme="light"]) body { background: repeating-linear-gradient(0deg, color-mix(in srgb, var(--text), transparent 96%) 0 1px, transparent 1px 4px), 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 96%) 0 1px, transparent 1px 4px), 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; }

/* 벤토: 제목 타일 + 미리보기 타일 + 숫자 타일 4칸 */
body .hero .hero-grid { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 14px; align-items: stretch; }
body .hero .hero-copy { display: contents; }
body .hero .hero-grid::before {
  content: ""; grid-column: 1 / 8; grid-row: 1 / 5; z-index: 0;
  border: 1px solid var(--line); border-radius: calc(var(--sk-r) + 8px);
  background: color-mix(in srgb, var(--dark, #070b12), #fff 5%);
}
html[data-theme="light"] body .hero .hero-grid::before { background: rgba(255, 255, 255, 0.8); }
body .hero .hero-copy > * { grid-column: 1 / 8; position: relative; z-index: 1; padding-left: clamp(20px, 2.6vw, 34px); padding-right: clamp(20px, 2.6vw, 34px); }
body .hero .hero-copy > .eyebrow { grid-row: 1; padding-top: clamp(20px, 2.6vw, 32px); margin: 0; }
body .hero .hero-grid h1 { grid-row: 2; margin: 10px 0 8px; }
body .hero .hero-copy > p:not(.eyebrow) { grid-row: 3; margin: 0; }
body .hero .hero-actions { grid-row: 4; margin: 0; padding-top: 18px; padding-bottom: clamp(20px, 2.6vw, 32px); }
body .hero .hero-art { grid-column: 8 / 13; grid-row: 1 / 5; min-height: 320px; }
body .hero .hero-stats {
  grid-column: 1 / 13; grid-row: 5; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px; margin: 0; padding: 0 !important; border: 0;
}
body .hero .hero-stats > div {
  padding: 16px 20px; border: 1px solid var(--line); border-radius: calc(var(--sk-r) + 4px);
  background: color-mix(in srgb, var(--dark, #070b12), #fff 5%);
}
html[data-theme="light"] body .hero .hero-stats > div { background: rgba(255, 255, 255, 0.8); }
@media (max-width: 860px) {
  body .hero .hero-grid { grid-template-columns: minmax(0, 1fr); }
  body .hero .hero-grid::before, body .hero .hero-copy > * { grid-column: 1 / -1; }
  body .hero .hero-art { grid-column: 1 / -1; grid-row: 6; }
  body .hero .hero-stats { grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
}
/* 브라우저 창: 주소창 */
.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: ""; width: 8px; height: 8px; border-radius: 50%; background: #22c55e; box-shadow: 0 0 0 4px rgba(34, 197, 94, 0.25); animation: nbSkPulse 2s ease-in-out infinite; }
@keyframes nbSkPulse { 50% { opacity: 0.4; } }
@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; }
