/* ====== 기본 세팅 ====== */
    :root{
      --bg:#f7f8fa;
      --card:#ffffff;
      --text:#1a1f36;
      --muted:#6b7280;
      --border:#e5e7eb;
      --accent:#2563eb;        /* 파랑 포인트 */
      --accent-weak:#eff6ff;
      --ok:#059669;            /* 초록 포인트 */
      --warn:#d97706;          /* 주황 포인트 */
      --danger:#b91c1c;        /* 빨강 포인트 */
      --table-zebra:#fafafa;
    }
    *, *::before, *::after { box-sizing:border-box; }
    html, body { margin:0; padding:0; }
    body{
      font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,Apple Color Emoji,Segoe UI Emoji;
      color:var(--text);
      background:var(--bg);
      line-height:1.6;
    }

    /* ====== 공용 강조 유틸 ====== */
    .em-red   { color:var(--danger); font-weight:900; }
    .em-blue  { color:var(--accent); font-weight:800; }
    .em-green { color:var(--ok);     font-weight:800; }
    .strong   { font-weight:800; }

    /* ====== 레이아웃 ====== */
    .container{
      max-width:1100px;
      margin:0 auto;
      padding:24px 16px 64px;
    }
    header.site-header{
      text-align:center;
      margin-top:16px; /* mt-3 유사 여백 */
      margin-bottom:20px;
    }
    .brand{
      font-size:18px;
      color:var(--muted);
      letter-spacing:.02em;
      margin:0 0 6px 0;
    }
    .page-title{
      font-size:28px;
      font-weight:900;
      margin:0;
    }

    /* ====== 카드/섹션 ====== */
    .card{
      background:var(--card);
      border:1px solid var(--border);
      border-radius:14px;
      padding:22px;
      box-shadow:0 4px 20px rgba(0,0,0,.04);
      margin-top:18px;
    }
    .section-title{
      font-size:20px;
      font-weight:850;
      margin:0 0 10px 0;
      color:var(--accent);
    }
    p.lead{
      margin:10px 0 0 0;
      color:var(--muted);
    }

    /* ====== 콜아웃 ====== */
    .callout{
      background:var(--accent-weak);
      border:1px solid #dbeafe;
      border-radius:12px;
      padding:14px 16px;
      margin-top:14px;
    }
    .callout strong{ color:var(--accent); }

    /* ====== 뱃지 ====== */
    .badge{
      display:inline-block;
      padding:2px 8px;
      border-radius:999px;
      font-size:12px;
      border:1px solid var(--border);
      background:#fff;
      color:var(--muted);
      margin-left:6px;
      vertical-align:middle;
    }

    /* ====== 표 영역 (가로 스크롤 대응) ====== */
    .table-wrap{
      margin-top:14px;
      border:1px solid var(--border);
      border-radius:12px;
      overflow:hidden;
      background:#fff;
    }
    .table-scroll{
      overflow-x:auto;
      -webkit-overflow-scrolling:touch;
    }
    table{
      width:100%;
      border-collapse:collapse;
      min-width:780px; /* 모바일에서 가로 스크롤 가능 */
    }
    caption{
      text-align:left;
      padding:12px 16px;
      font-weight:900;
      background:#fafafa;
      border-bottom:1px solid var(--border);
    }
    thead th{
      text-align:left;
      font-weight:800;
      background:#f3f4f6;
      border-bottom:1px solid var(--border);
      padding:12px 14px;
      position:sticky;
      top:0;
      z-index:1;
      white-space:nowrap;
    }
    tbody tr:nth-child(odd) td{ background:var(--table-zebra); }
    tbody td{
      border-bottom:1px solid var(--border);
      padding:12px 14px;
      vertical-align:top;
    }
    tbody tr:last-child td{ border-bottom:none; }

    /* 등급 강조 */
    .rc{ font-weight:800; }
    .rc-low { color:#374151; font-weight:800; }   /* RC1~2 */
    .rc-3plus{ color:var(--ok); font-weight:900; } /* RC3 이상 */
    .rc-high { color:var(--warn); font-weight:850; }/* RC4~6 */
    .time{ white-space:nowrap; }

    /* ====== 리스트 ====== */
    .keypoints{
      margin:10px 0 0 0;
      padding-left:18px;
    }
    .keypoints li{ margin:6px 0; }

    /* ====== 반응형 타이틀 크기 조정 ====== */
    @media (min-width:768px){
      .page-title{ font-size:34px; }
    }