/* Nenne 하우스 광고 카드. AdSense 영역과 구분되는 흰 카드, 문구는 두 줄만. */
.nenne-card { box-sizing: border-box; container-type: inline-size; margin: 16px 0; padding: 14px 16px; border: 1px solid #E5E5EA; border-radius: 16px; background: #FFF; color: #1C1C1E; font-family: Pretendard, 'Pretendard Variable', sans-serif; text-align: left; }
.nenne-card .nenne-main { display: flex; align-items: center; gap: 16px; }
.nenne-icon-tile { flex: none; display: inline-flex; padding: 4px; border: 1px solid #E5E5EA; border-radius: 18px; background: #FFF; }
.nenne-icon { display: block; width: 72px; height: 72px; border-radius: 14px; object-fit: contain; }
.nenne-icon--fallback { display: inline-flex; align-items: center; justify-content: center; background: #1C1C1E; color: #FFF; font-weight: 800; }
.nenne-copy { flex: 1; min-width: 0; }
.nenne-card .nenne-heading { margin: 0; font-size: 18px; line-height: 1.3; }
.nenne-heading strong { font-weight: 800; }
.nenne-heading span { font-weight: 600; }
.nenne-card .nenne-tagline { margin: 4px 0 0; color: #48484F; font-size: 14px; line-height: 1.35; }
.nenne-badges { flex: none; display: flex; align-items: center; gap: 8px; }
.nenne-badge { display: inline-flex; flex: none; }
.nenne-badge img { display: block; height: 40px; width: auto; max-width: none; }
.nenne-card a.nenne-button { display: inline-flex; flex: none; justify-content: center; align-items: center; min-height: 40px; padding: 0 16px; border-radius: 12px; background: #1C1C1E; color: #FFF; font-size: 14px; font-weight: 700; line-height: 1.2; text-decoration: none; }
.nenne-card a.nenne-auto { display: none; }
.nenne-card a.nenne-qr { display: flex; flex: none; flex-direction: column; align-items: center; gap: 2px; color: #8E8E93; text-decoration: none; }
.nenne-qr img { display: block; width: 76px; height: 76px; }
.nenne-qr span { max-width: 96px; font-size: 9px; line-height: 1.15; text-align: center; }
.nenne-card .nenne-disclose { margin: 0 0 10px; color: #6B6B73; font-size: 12px; line-height: 1.4; }
.nenne-thumb { display: block; width: 100%; height: auto; max-height: 180px; object-fit: cover; border-radius: 10px; margin-bottom: 12px; }
/* 아티클 본문처럼 좁은 데스크톱 폭에서는 배지를 세로로 쌓는다. */
@container (max-width: 700px) {
  .nenne-badges { flex-direction: column; align-items: flex-start; gap: 6px; }
  .nenne-badge img { height: 36px; }
}
.app-chip.nenne-chip { background: #1C1C1E; animation: none; box-shadow: 0 4px 12px #0002; }
.nenne-chip[hidden] { display: none !important; }
.nenne-chip .nenne-icon { width: 24px; height: 24px; border-radius: 7px; }
a[data-nenne-placement] { text-decoration: none; }
/* 사이드 카드는 세로 구성, 플레이 툴바 팝오버는 작은 가로 구성. */
.nenne-card--rail .nenne-main { flex-direction: column; align-items: flex-start; gap: 14px; }
.nenne-card--rail .nenne-copy { flex: none; width: 100%; }
.nenne-card--rail .nenne-heading { font-size: 16px; }
.nenne-card--rail .nenne-tagline { margin-top: 6px; font-size: 13px; }
.nenne-card--rail .nenne-badges { order: 3; flex-direction: column; align-items: flex-start; gap: 8px; }
.nenne-card--rail .nenne-badge img { height: 40px; }
.nenne-card--rail a.nenne-qr { order: 2; align-self: center; gap: 5px; }
.nenne-card--rail .nenne-qr img { width: 120px; height: 120px; }
.nenne-card--rail .nenne-qr span { max-width: 150px; font-size: 11px; }
.nenne-toolbar { position: relative; flex: none; align-self: center; }
.nenne-toolbar-toggle { display: inline-flex; align-items: center; gap: 7px; height: 40px; padding: 0 12px 0 7px; border: 1px solid #E5E5EA; border-radius: 999px; background: #FFF; color: #1C1C1E; font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; white-space: nowrap; }
.nenne-toolbar-toggle .nenne-icon { width: 24px; height: 24px; border-radius: 6px; }
.nenne-popover { position: absolute; z-index: 40; top: calc(100% + 10px); right: 0; width: 340px; max-width: calc(100vw - 32px); max-height: calc(100dvh - 180px); overflow-y: auto; border-radius: 16px; box-shadow: 0 8px 24px #0002; }
.nenne-popover[hidden] { display: none; }
.nenne-popover-content { box-sizing: border-box; display: flex; align-items: center; gap: 12px; padding: 12px; border: 1px solid #E5E5EA; border-radius: inherit; background: #FFF; color: #1C1C1E; text-align: left; }
.nenne-popover .nenne-qr { display: flex; flex: none; width: 96px; flex-direction: column; align-items: center; gap: 4px; color: #8E8E93; text-decoration: none; }
.nenne-popover .nenne-qr img { width: 88px; height: 88px; }
.nenne-popover .nenne-qr span { max-width: 96px; font-size: 9px; line-height: 1.2; }
.nenne-popover-copy { flex: 1; min-width: 0; }
.nenne-popover .nenne-tagline { margin: 0 0 10px; color: #48484F; font-size: 12px; line-height: 16px; white-space: nowrap; }
.nenne-popover .nenne-badges { flex-direction: column; align-items: flex-start; gap: 10px; }
/* App Store 최소 40px, Google Play 최소 28px 및 다른 스토어 이상 크기. */
.nenne-popover .nenne-badge img { height: 40px; }
.nenne-popover .nenne-button { display: inline-flex; align-items: center; min-height: 40px; color: inherit; }
@media (max-width: 640px) {
  .nenne-toolbar { display: none; }
  .nenne-card { padding: 10px 12px; }
  .nenne-card .nenne-main { gap: 10px; }
  .nenne-card a.nenne-qr, .nenne-card .nenne-badges { display: none; }
  .nenne-card a.nenne-auto { display: inline-flex; }
  .nenne-icon-tile { padding: 2px; border-radius: 12px; }
  .nenne-icon { width: 40px; height: 40px; border-radius: 9px; }
  .nenne-card .nenne-heading { font-size: 15px; }
  .nenne-card .nenne-tagline { margin-top: 2px; font-size: 11.5px; letter-spacing: -0.01em; }
  .nenne-card a.nenne-button { padding: 0 12px; font-size: 13px; }
}
