/* Morning Digest — 모바일 최적화 + 향상(스켈레톤·접이식). styles.css 뒤에 로드. */

/* ───────────── 스켈레톤 (첫 페인트) ───────────── */
.sk{ display:block; border-radius:5px;
  background:linear-gradient(90deg, rgba(26,28,34,.05), rgba(26,28,34,.12), rgba(26,28,34,.05));
  background-size:200% 100%; animation:shimmer 1.3s ease-in-out infinite; }
@keyframes shimmer{ to{ background-position:-200% 0; } }
@media (prefers-reduced-motion:reduce){ .sk{ animation:none; } }
.sk-stat{ width:64px; height:46px; }
.sk-line{ height:16px; margin:4px 0 14px; }
.sk-row{ height:18px; margin:0 0 12px; max-width:40em; }
.skel-ins{ margin-top:18px; }
.sk-ins{ height:62px; margin:14px 0; border-radius:6px; }
#catalog .sk-line{ height:14px; margin-bottom:14px; }

/* ───────────── 접이식 패널 (볼것/검증필요): 모바일 접기, 데스크톱 펼침 ───────────── */
details.panel > summary{ list-style:none; cursor:pointer; font-size:16px; font-weight:700;
  padding-bottom:8px; border-bottom:1px solid var(--line); display:flex; align-items:center; gap:8px; }
details.panel > summary::-webkit-details-marker{ display:none; }
details.panel > summary::after{ content:"＋"; margin-left:auto; color:var(--accent); font-weight:700; font-size:18px; }
details.panel[open] > summary::after{ content:"－"; }
details.panel .field-hint{ font-weight:600; }
@media (min-width:761px){
  details.panel > summary{ cursor:default; pointer-events:none; }
  details.panel > summary::after{ display:none; }
  details.panel > .panel-body{ display:block !important; }
}


/* 1) 긴 영문 제목·URL이 가로 스크롤을 만들지 않도록 (한글은 keep-all 유지, 라틴/URL만 분절) */
.ci-title, .cat-src-name, .cat-src-pub, .cat-src-blurb,
.ins-lead, .ins-body, .ins-quote, .focal-lead, .focal-body, .focal-quote,
.src .src-name, .ws-title, .ws-reason, .lc li, .hero-lead, .signal-body p,
.chip-label, .sub-desc, .cat-desc { overflow-wrap:anywhere; }

/* 2) 탭 하이라이트 톤(클레이 계열, 과하지 않게) */
a, label, .btn, .btn-ghost, summary { -webkit-tap-highlight-color:rgba(204,120,92,.18); }

/* 3) 노치/홈인디케이터 안전영역 — 좌우 패딩 보정 */
@supports (padding:max(0px)){
  .mast, .hero, section, .foot{
    padding-left:max(var(--gut), env(safe-area-inset-left));
    padding-right:max(var(--gut), env(safe-area-inset-right));
  }
}

/* ───────────── 폰/소형 태블릿 (≤760px) ───────────── */
@media (max-width:760px){
  body{ font-size:16px; }

  /* iOS 입력 포커스 시 자동 확대 방지 = 입력 글자 16px 이상 */
  textarea, .url-row input, .form-grid input, #gateInput{ font-size:16px; }

  /* 카탈로그 항목 탭 타깃 확대 (행 전체가 라벨이라 어디를 눌러도 토글) */
  .cat-item{ padding:7px 0; gap:11px; align-items:center; }
  .cat-item input{ width:20px; height:20px; }
  .src-all{ width:22px; height:22px; }
  .cat-source{ padding:14px 15px; }

  /* 출처 검증 링크 = 손가락으로 또렷이 누르게 */
  .src{ gap:9px; margin-top:7px; font-size:13.5px; }
  .src-jump, .src-doc{ padding:8px 13px; border-radius:4px; }

  /* 칩 삭제 버튼 키우기 */
  .chip{ padding:8px 10px 8px 13px; }
  .chip-x{ font-size:18px; padding:2px 6px; }

  /* 간격·여백 모바일 조정 */
  .sec{ margin-top:44px; }
  .mast{ padding-top:26px; }
  .sub-inner{ padding:30px 22px; }

  /* 게이트 폼: 좁은 화면에서 버튼이 줄바꿈되도록 */
  #gateForm{ flex-wrap:wrap; }
  #gateForm .btn{ width:100%; }

  /* 번호 제거로 들여쓰기 축소 (좌측 룰러만 유지) */
  .insight{ padding-left:16px; }
  .insight.high{ padding-left:16px; }

  /* 탭 타깃 보강 */
  .med-toggle, .quote-more, .dc-btn{ min-height:40px; }
  .quote-more{ display:flex; align-items:center; }
  .quote-more[hidden]{ display:none !important; }   /* flex가 UA [hidden]를 덮어쓰지 않도록 */
  .focal-card{ padding:18px 16px; }
  .focal-lead{ font-size:19px; }
}

/* ───────────── 초소형 (≤380px) ───────────── */
@media (max-width:380px){
  .ht-n{ font-size:32px; }
  .ht-arrow{ font-size:26px; }
  .mast-title{ font-size:36px; }
  .legend{ display:block; margin-top:6px; }
}