*, *::before, *::after {
      box-sizing: border-box; margin: 0; padding: 0;
      font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, sans-serif;
    }

    :root {
      /* v2.8.17: 노션 스타일 디자인 토큰 — 중립(배경·텍스트·보더·라운드·그림자)을 노션 팔레트로,
         브랜드 파랑 액센트는 유지(점진 적용). 텍스트 대비는 노션 검증값 사용. */
      --blue-deep:  #0c1fb8;
      --blue-mid:   #1a3de8;   /* 브랜드 블루 액센트 유지(하드코딩 일관성) */
      --blue-light: #4a70f5;
      --cyan:       #00c8ee;
      --cyan-light: #a0eeff;
      --bg:         #f7f7f5;   /* 노션 따뜻한 라이트 그레이 */
      --bg-card:    #ffffff;
      --border:     rgba(55,53,47,0.10);  /* 노션 보더(웜그레이) */
      --txt-hi:     #37352f;   /* 노션 본문 거의 검정(웜) */
      --txt-mid:    #6b6a66;   /* 노션 보조 텍스트 */
      --txt-lo:     #9b9a97;   /* 노션 옅은 텍스트 */
      --radius:     10px;      /* 노션 모던 라운드(작게) */
      --sh-sm:      0 1px 3px rgba(15,15,15,0.06);
      --sh-md:      0 4px 16px rgba(15,15,15,0.10);
      --sh-lg:      0 12px 40px rgba(15,15,15,0.14);

      /* Canonical v1 tokens. Stage 1 is additive: legacy variables above remain the active UI contract. */
      --ic-blue: #1a3de8;
      --ic-blue-hover: #1533c4;
      --ic-blue-soft: rgba(26,61,232,0.08);
      --ic-gray-900: #37352f;
      --ic-gray-600: #6b6a66;
      --ic-gray-400: #9b9a97;
      --ic-gray-200: rgba(55,53,47,0.12);
      --ic-gray-100: #f1f1ef;
      --ic-bg: #f7f7f5;
      --ic-surface: #ffffff;
      --ic-success: #16a34a;
      --ic-warning: #d97706;
      --ic-danger: #dc2626;
      --fs-xs: 12px;
      --fs-sm: 13px;
      --fs-base: 14px;
      --fs-lg: 16px;
      --fs-xl: 20px;
      --fs-2xl: 24px;
      --r-sm: 6px;
      --r-md: 10px;
      --r-full: 999px;
      --sh-1: 0 1px 3px rgba(15,15,15,0.06);
      --sh-2: 0 8px 24px rgba(15,15,15,0.10);
    }
    [data-theme="dark"] {
      /* v2.8.21: 노션 다크(웜 차콜) — GitHub식 푸른-검정 → 따뜻한 차콜 + 또렷한 보더 */
      --bg:         #191919;
      --bg-card:    #242424;
      --border:     rgba(255,255,255,0.11);
      --txt-hi:     #e6e6e4;
      --txt-mid:    #9b9b97;
      --txt-lo:     #6b6b69;
      --sh-sm:      0 1px 3px rgba(0,0,0,0.4);
      --sh-md:      0 4px 16px rgba(0,0,0,0.5);

      /* Dark canonical tokens are opt-in only; no existing selector consumes them in Stage 1. */
      --ic-bg: #191919;
      --ic-surface: #242424;
      --ic-gray-900: #e6e6e4;
      --ic-gray-600: #9b9b97;
      --ic-gray-400: #6b6b69;
      --ic-gray-200: rgba(255,255,255,0.11);
      --ic-gray-100: #2d333b;
      --sh-1: 0 1px 3px rgba(0,0,0,0.4);
      --sh-2: 0 8px 24px rgba(0,0,0,0.5);
    }
    /* v2.8.21: 노션 다크 — LIVE 방문배너를 파랑 그라데이션 → 플랫 차콜 카드(작은 색 액센트만 유지) */
    [data-theme="dark"] .ic-visitor-strip { background: var(--bg-card); border: 1px solid var(--border); box-shadow: none; }
    [data-theme="dark"] .side-nav {
      background: #161b22;
      border-right-color: rgba(255,255,255,0.06);
    }
    [data-theme="dark"] .side-nav-header {
      background: linear-gradient(180deg, #161b22 0%, #0d1117 100%);
      border-bottom-color: rgba(255,255,255,0.06);
    }
    [data-theme="dark"] .side-nav-header img,
    [data-theme="dark"] .foot-logo {
      filter: brightness(0) invert(1);
    }

    /* ── 다크모드 전체 오버라이드 ── */
    /* 모달 배경 */
    [data-theme="dark"] .kn-modal-box,
    [data-theme="dark"] .nl-viewer-box,
    [data-theme="dark"] .rc-viewer-box { background: #161b22; }

    [data-theme="dark"] .kn-modal-close,
    [data-theme="dark"] .nl-viewer-close,
    [data-theme="dark"] .rc-viewer-close { background: #21262d; color: #8b949e; }
    [data-theme="dark"] .kn-modal-close:hover { background: #dc2626; color: #fff; }
    [data-theme="dark"] .nl-viewer-close:hover,
    [data-theme="dark"] .rc-viewer-close:hover { background: #30363d; color: #e6edf3; }

    [data-theme="dark"] .kn-modal-cover { background: #21262d; }

    /* 보험지식 모달 텍스트 */
    [data-theme="dark"] .kn-modal-title { color: #e6edf3; }
    [data-theme="dark"] .kn-modal-date  { color: #6e7681; }
    [data-theme="dark"] .kn-modal-content {
      color: #c9d1d9;
      border-bottom-color: rgba(255,255,255,0.08);
    }
    /* 보험지식 표 */
    [data-theme="dark"] .kn-table th,
    [data-theme="dark"] .kn-table td { border-color: rgba(255,255,255,0.1); color: #c9d1d9; }
    [data-theme="dark"] .kn-table th { background: rgba(255,255,255,0.05); color: #79c0ff; }
    [data-theme="dark"] .kn-table tr:nth-child(even) td { background: rgba(255,255,255,0.03); }

    /* 댓글 */
    [data-theme="dark"] .kn-comments-title { color: #e6edf3; }
    [data-theme="dark"] .kn-comment-item  { border-bottom-color: rgba(255,255,255,0.06); }
    [data-theme="dark"] .kn-comment-author { color: #79c0ff; }
    [data-theme="dark"] .kn-comment-text  { color: #c9d1d9; }
    [data-theme="dark"] .kn-comment-date  { color: #6e7681; }
    [data-theme="dark"] .kn-comment-form input,
    [data-theme="dark"] .kn-comment-form textarea {
      background: #21262d; color: #e6edf3;
      border-color: rgba(255,255,255,0.1);
    }
    [data-theme="dark"] .kn-comment-form input:focus,
    [data-theme="dark"] .kn-comment-form textarea:focus { background: #2d333b; border-color: #58a6ff; }
    [data-theme="dark"] .kn-comment-status { color: #3fb950; }

    /* 채용공고 뷰어 */
    [data-theme="dark"] .rc-viewer-company { color: #6e7681; }
    [data-theme="dark"] .rc-viewer-title   { color: #e6edf3; }
    [data-theme="dark"] .rc-viewer-date    { color: #6e7681; }
    [data-theme="dark"] .rc-viewer-body    { color: #c9d1d9; }

    /* 문의 폼 */
    [data-theme="dark"] .contact-wrap {
      background: #161b22;
      border-color: rgba(255,255,255,0.08);
    }
    [data-theme="dark"] .contact-input,
    [data-theme="dark"] .contact-select,
    [data-theme="dark"] .contact-textarea {
      background: #21262d; color: #e6edf3;
      border-color: rgba(255,255,255,0.1);
    }
    [data-theme="dark"] .contact-input:focus,
    [data-theme="dark"] .contact-select:focus,
    [data-theme="dark"] .contact-textarea:focus { background: #2d333b; border-color: #58a6ff; }
    [data-theme="dark"] .contact-select option { background: #21262d; color: #e6edf3; }

    /* 커뮤니티 히어로 */
    [data-theme="dark"] .comm-hero--crew    { background: linear-gradient(135deg, #1a1f2e 0%, #161b2e 60%, #141e2e 100%); }
    [data-theme="dark"] .comm-hero--manager { background: linear-gradient(135deg, #1e1520 0%, #1a1220 60%, #1a1525 100%); }
    [data-theme="dark"] .comm-hero-logo     { background: #21262d; }
    [data-theme="dark"] .comm-block         { background: #161b22; border-color: rgba(255,255,255,0.06); }
    [data-theme="dark"] .comm-block-title   { color: #e6edf3; }
    [data-theme="dark"] .comm-block-text    { color: #8b949e; }
    [data-theme="dark"] .comm-cond-item     { background: #1c2128; border-color: rgba(255,255,255,0.06); }
    [data-theme="dark"] .comm-cond-item--manager { background: #1e1525; border-color: rgba(192,38,211,0.12); }
    [data-theme="dark"] .comm-cond-label    { color: #8b949e; }
    [data-theme="dark"] .comm-cond-value    { color: #e6edf3; }
    [data-theme="dark"] .comm-kakao-btn     { color: #191919; }   /* 카카오는 항상 노란배경에 검은 글자 */

    /* 소식지/청구서류 검색창 */
    [data-theme="dark"] .nlcf-search {
      background: #21262d; color: #e6edf3;
      border-color: rgba(255,255,255,0.1);
    }
    [data-theme="dark"] .nlcf-search-clear { background: #21262d; }
    [data-theme="dark"] .nlcf-search-clear:hover { background: #30363d; }

    /* 홈피드 카드 */
    [data-theme="dark"] .hf-card-title  { color: #e6edf3; }
    [data-theme="dark"] .hf-card-date   { color: #6e7681; }
    [data-theme="dark"] .hf-card-label  { color: #8b949e; }
    [data-theme="dark"] .hf-thumb-none  { background: #21262d; }

    /* 카드뉴스 모달 */
    [data-theme="dark"] .cn-modal-body  { background: #161b22; }
    [data-theme="dark"] .cn-modal-title { color: #e6edf3; }
    [data-theme="dark"] .cn-slide-counter { color: #8b949e; }

    /* 소식지/청구서류 뷰어 */
    [data-theme="dark"] .nl-viewer-box { background: #161b22; }

    /* ── 카드납 가이드 모달 ── */
    [data-theme="dark"] .cg-modal        { background: #161b22; }
    [data-theme="dark"] .cg-close        { background: #21262d; color: #8b949e; }
    [data-theme="dark"] .cg-close:hover  { background: #30363d; }
    [data-theme="dark"] .cg-search-input { background: #21262d; color: #e6edf3; border-color: rgba(255,255,255,0.1); }
    [data-theme="dark"] .cg-search-input:focus { background: #2d333b; border-color: #58a6ff; }
    [data-theme="dark"] .cg-tab          { background: #21262d; border-color: rgba(255,255,255,0.1); color: #8b949e; }
    [data-theme="dark"] .cg-tab.active   { background: var(--blue-mid); border-color: var(--blue-mid); color: #fff; }
    [data-theme="dark"] .cg-co           { border-color: rgba(255,255,255,0.07); }
    [data-theme="dark"] .cg-co-head      { background: #1c2128; }
    [data-theme="dark"] .cg-co-head:hover{ background: #21262d; }
    [data-theme="dark"] .cg-co-body      { background: #161b22; border-top-color: rgba(255,255,255,0.07); }
    [data-theme="dark"] .cg-row          { border-bottom-color: rgba(255,255,255,0.06); }
    [data-theme="dark"] .cg-row-val      { color: #c9d1d9; }
    [data-theme="dark"] .cg-badge.ok     { background: rgba(21,128,61,0.2);  color: #4ade80; }
    [data-theme="dark"] .cg-badge.no     { background: rgba(220,38,38,0.2);  color: #f87171; }
    [data-theme="dark"] .cg-note         { background: rgba(224,92,0,0.15);  color: #fb923c; }
    [data-theme="dark"] .cg-disclaimer   { background: #1c2128; border-top-color: rgba(255,255,255,0.07); color: #6e7681; }
    [data-theme="dark"] .cg-disclaimer b { color: #fb923c; }

    html { height: 100%; }
    body {
      font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, sans-serif;
      background: var(--bg);
      color: var(--txt-hi);
      box-sizing: border-box;
      /* v2.17.9: iOS Safari에서 100vh가 툴바 뒤로 넘쳐 하단 푸터가 가리던 문제 → dvh */
      height: 100vh;
      height: 100dvh;
      /* v2.17.9: 노치/홈인디케이터 safe-area — 상단 알림배너·하단 푸터 가림 방지(노치 없으면 env=0이라 무변화) */
      padding-top: env(safe-area-inset-top, 0px);
      padding-bottom: env(safe-area-inset-bottom, 0px);
      overflow: hidden;
      display: flex;
      flex-direction: column;
    }

    @keyframes blink { 0%,100%{opacity:1} 50%{opacity:0.2} }

    /* 브랜드 로고 이미지 */
    .logo-wrap {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 130px;
      height: 130px;
      flex-shrink: 0;
    }
    .logo-wrap img {
      width: 100%;
      height: 100%;
      object-fit: contain;
      mix-blend-mode: multiply;
    }


    /* 로고 없을 때 SVG 폴백 */
    .logo-fallback {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 12px;
    }
    .logo-fallback-name {
      font-family: 'Pretendard', sans-serif;
      font-weight: 900;
      font-size: clamp(32px, 6vw, 56px);
      letter-spacing: 0.02em;
      background: linear-gradient(135deg, var(--blue-deep) 0%, var(--blue-mid) 50%, var(--cyan) 100%);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }
    .logo-fallback-slogan {
      font-size: 16px;
      font-weight: 400;
      color: var(--txt-mid);
      letter-spacing: 0.06em;
    }


    /* ══════════════════════════════
       CONTENT
    ══════════════════════════════ */
    /* ══════ 홈 대시보드 ══════ */
    .dash-hero {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding-bottom: 14px;
      border-bottom: 1.5px solid var(--border);
      margin-bottom: 16px;
    }
    .dash-hero-left { display: flex; align-items: center; gap: 10px; }
    .dash-hero-eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--blue-mid);
      background: rgba(26,61,232,0.07);
      padding: 3px 10px;
      border-radius: 100px;
    }
    .dash-hero-eyebrow span { width:5px;height:5px;border-radius:50%;background:var(--cyan);display:inline-block; }
    .dash-hero h1 {
      font-size: 1rem;
      font-weight: 700;
      color: var(--txt-hi);
      line-height: 1.3;
      letter-spacing: -0.01em;
    }
    .dash-hero h1 em {
      font-style: normal;
      background: linear-gradient(90deg, var(--blue-mid), var(--cyan));
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }
    .dash-hero-sub { display: none; }
    .dash-hero-stats { display: none; }

    /* 기능 카드 그리드 */
    .dash-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 12px;
    }
    .dash-card {
      background: var(--bg-card);
      border: 1.5px solid var(--border);
      border-radius: 12px;
      padding: 16px 16px 14px;
      cursor: pointer;
      position: relative;
      overflow: hidden;
      transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
      display: flex;
      flex-direction: column;
    }
    .dash-card::before {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 3px;
      background: var(--card-accent, var(--blue-mid));
      opacity: 0;
      transition: opacity 0.18s ease;
    }
    .dash-card:hover {
      transform: translateY(-3px);
      box-shadow: 0 10px 28px rgba(12,31,184,0.12);
      border-color: rgba(26,61,232,0.25);
    }
    .dash-card:hover::before { opacity: 1; }
    .dash-card-icon {
      width: 36px; height: 36px;
      border-radius: 9px;
      display: flex; align-items: center; justify-content: center;
      font-size: 18px;
      margin-bottom: 10px;
      background: var(--card-icon-bg, rgba(26,61,232,0.07));
      flex-shrink: 0;
    }
    .dash-card-title {
      font-size: 0.85rem;
      font-weight: 700;
      color: var(--txt-hi);
      margin-bottom: 10px;
      line-height: 1.3;
    }
    .dash-card-desc { display: none; }

    /* ── 홈 카드 미리보기 ── */
    .dash-card-preview {
      flex: 1;
      min-height: 0;
      display: flex;
      flex-direction: column;
      gap: 2px;
      margin: 4px 0 6px;
      overflow: hidden;
    }
    .dcp-item {
      display: flex;
      align-items: center;
      gap: 5px;
      width: 100%;
      padding: 4px 6px;
      border-radius: 6px;
      background: none;
      border: none;
      cursor: pointer;
      text-align: left;
      transition: background 0.15s;
      flex-shrink: 1;
      min-height: 0;
    }
    .dcp-item:hover { background: rgba(26,61,232,0.07); }
    .dcp-item-label {
      flex: 1;
      font-size: 11px;
      font-weight: 500;
      color: var(--txt-mid);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      line-height: 1.35;
    }
    .dcp-item-time {
      font-size: 10px;
      color: var(--txt-lo);
      flex-shrink: 0;
    }
    .dcp-item-new {
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: #1a3de8;
      flex-shrink: 0;
      margin-right: 1px;
    }
    .dcp-skeleton {
      height: 20px;
      border-radius: 5px;
      background: linear-gradient(90deg, #edf0fa 25%, #f4f6ff 50%, #edf0fa 75%);
      background-size: 200% 100%;
      animation: dcp-shimmer 1.4s ease-in-out infinite;
      flex-shrink: 1;
    }
    @keyframes dcp-shimmer {
      0%   { background-position: 200% 0; }
      100% { background-position: -200% 0; }
    }
    .dash-card-footer {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-top: auto;
    }
    .dash-card-tag {
      font-size: 0.68rem;
      font-weight: 700;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: var(--card-accent, var(--blue-mid));
      opacity: 0.7;
    }
    .dash-card-arrow {
      width: 22px; height: 22px;
      border-radius: 50%;
      background: rgba(26,61,232,0.06);
      display: flex; align-items: center; justify-content: center;
      transition: background 0.15s, transform 0.15s;
      flex-shrink: 0;
    }
    .dash-card:hover .dash-card-arrow {
      background: var(--card-accent, var(--blue-mid));
      transform: translateX(2px);
    }
    .dash-card:hover .dash-card-arrow svg { stroke: #fff; }
    .dash-card-arrow svg {
      width: 11px; height: 11px;
      stroke: var(--txt-lo);
      transition: stroke 0.15s;
    }

    /* 소개 스트립 — 숨김 (한 화면 레이아웃) */
    .dash-about { display: none; }

    @media (max-width: 1100px) {
      .dash-grid { grid-template-columns: repeat(4, 1fr); }
    }
    @media (max-width: 820px) {
      .dash-grid { grid-template-columns: repeat(2, 1fr); }
    }
    @media (max-width: 520px) {
      .dash-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
      .dash-card { padding: 14px 12px 12px; }
      .dash-card-icon { width:32px;height:32px;font-size:16px;margin-bottom:8px; }
    }

    .content {
      flex: 1 1 0;
      min-height: 0;
      overflow-y: auto;
      overflow-x: hidden;
      scrollbar-width: none;
      -ms-overflow-style: none;
      max-width: 1360px;
      width: 100%;
      margin: 0 auto;
      padding: 24px 32px 24px;
    }
    .content::-webkit-scrollbar { display: none; }

    /* Controls */
    .controls {
      display: flex;
      align-items: center;
      gap: 12px;
      margin-bottom: 40px;
      flex-wrap: wrap;
    }
    .search-box {
      flex: 1; min-width: 220px;
      position: relative;
    }
    .search-box svg {
      position: absolute;
      left: 14px; top: 50%;
      transform: translateY(-50%);
      color: var(--txt-lo);
      pointer-events: none;
      width: 16px; height: 16px;
    }
    #search {
      width: 100%;
      background: var(--bg-card);
      border: 1.5px solid var(--border);
      color: var(--txt-hi);
      font-family: 'Pretendard', sans-serif;
      font-size: 14px;
      padding: 11px 14px 11px 42px;
      border-radius: 10px;
      outline: none;
      box-shadow: var(--sh-sm);
      transition: border-color .2s, box-shadow .2s;
    }
    #search::placeholder { color: var(--txt-lo); }
    #search:focus {
      border-color: var(--blue-light);
      box-shadow: 0 0 0 3px rgba(74,112,245,0.12), var(--sh-sm);
    }
    .tabs { display: flex; gap: 8px; }
    .tab {
      font-family: 'Pretendard', sans-serif;
      font-size: 13px; font-weight: 500;
      padding: 9px 22px;
      border-radius: 100px;
      border: 1.5px solid var(--border);
      background: var(--bg-card);
      color: var(--txt-mid);
      cursor: pointer;
      white-space: nowrap;
      box-shadow: var(--sh-sm);
      transition: all .2s;
    }
    .tab:hover { border-color: var(--blue-light); color: var(--blue-mid); }
    .tab.active {
      background: linear-gradient(135deg, var(--blue-mid) 0%, var(--cyan) 100%);
      border-color: transparent;
      color: #fff;
      box-shadow: 0 4px 18px rgba(26,61,232,0.32);
    }

    /* Section */
    .section { margin-bottom: 52px; }
    .section-head {
      display: flex;
      align-items: center;
      gap: 14px;
      margin-bottom: 18px;
    }
    .sec-num {
      font-family: 'Pretendard', sans-serif;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.2em;
      color: var(--txt-lo);
    }
    .sec-title {
      font-family: 'Pretendard', sans-serif;
      font-size: 22px;
      font-weight: 700;
      letter-spacing: -0.02em;
      color: var(--txt-hi);
      padding-left: 10px;
      border-left: 4px solid var(--blue-mid);
      line-height: 1.2;
    }
    .sec-line { flex: 1; height: 1.5px; background: var(--border); border-radius: 1px; }
    .sec-badge {
      font-family: 'Pretendard', sans-serif;
      font-size: 11px; font-weight: 700;
      color: var(--blue-mid);
      background: rgba(26,61,232,0.08);
      border: 1.5px solid rgba(26,61,232,0.15);
      padding: 3px 12px;
      border-radius: 4px;
    }

    /* Grid */
    .grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
      gap: 14px;
    }

    /* Card */
    .card {
      position: relative;
      display: block;
      text-decoration: none;
      background: var(--bg-card);
      border: 1.5px solid var(--border);
      border-radius: var(--radius);
      padding: 22px 20px 20px;
      overflow: hidden;
      box-shadow: var(--sh-sm);
      transition:
        transform .3s cubic-bezier(0.34,1.56,0.64,1),
        box-shadow .28s ease,
        border-color .25s ease;
      animation: cardIn .5s ease backwards;
    }
    @keyframes cardIn {
      from { opacity:0; transform:translateY(16px) scale(.98); }
      to   { opacity:1; transform:translateY(0) scale(1); }
    }
    .card::before {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 3px;
      background: var(--c, var(--blue-mid));
      opacity: 0.85;
      transition: height .25s, opacity .25s;
    }
    .card::after {
      content: '';
      position: absolute;
      bottom: -20px; left: 50%; transform: translateX(-50%);
      width: 50%; height: 40px;
      border-radius: 50%;
      background: var(--c, var(--blue-light));
      filter: blur(18px);
      opacity: 0;
      transition: opacity .3s;
    }
    .card:hover {
      transform: translateY(-6px) scale(1.015);
      border-color: color-mix(in srgb, var(--c, var(--blue-mid)) 55%, transparent);
      box-shadow: var(--sh-lg),
        0 0 0 1px color-mix(in srgb, var(--c, var(--blue-mid)) 20%, transparent);
    }
    .card:hover::before { height: 4px; opacity: 1; }
    .card:hover::after  { opacity: 0.45; }

    .c-badge {
      display: inline-flex;
      align-items: center; justify-content: center;
      width: 46px; height: 46px;
      border-radius: 13px;
      margin-bottom: 16px;
      position: relative; z-index: 1;
      overflow: hidden;
      background: #fff;
      border: 1.5px solid var(--border);
      box-shadow: 0 2px 8px rgba(0,0,0,0.06);
      transition: transform .3s cubic-bezier(0.34,1.56,0.64,1), box-shadow .25s;
    }
    .c-badge img {
      width: 100%; height: 100%;
      object-fit: contain;
      padding: 5px;
    }
    .c-badge-text {
      font-family: 'Pretendard', sans-serif;
      font-weight: 900;
      font-size: 13px; color: #fff;
      display: none;
    }
    .c-badge.no-img {
      background: var(--c, var(--blue-mid));
      border-color: transparent;
      box-shadow: 0 4px 14px color-mix(in srgb, var(--c, var(--blue-mid)) 35%, transparent);
    }
    .c-badge.no-img .c-badge-text { display: flex; }
    .card:hover .c-badge {
      transform: scale(1.1) rotate(-3deg);
      box-shadow: 0 8px 22px rgba(0,0,0,0.12);
    }
    .card:hover .c-badge.no-img {
      box-shadow: 0 8px 22px color-mix(in srgb, var(--c, var(--blue-mid)) 45%, transparent);
    }
    .c-name {
      font-size: 15px; font-weight: 700;
      color: var(--txt-hi);
      margin-bottom: 5px;
      position: relative; z-index: 1;
    }
    .c-type {
      font-size: 11px; color: var(--txt-lo);
      letter-spacing: 0.05em;
      position: relative; z-index: 1;
    }
    .c-arrow {
      position: absolute; right: 16px; bottom: 16px;
      width: 30px; height: 30px;
      border-radius: 8px;
      border: 1.5px solid var(--border);
      background: var(--bg);
      display: flex; align-items: center; justify-content: center;
      color: var(--txt-lo); font-size: 13px;
      transition: all .25s;
    }
    .card:hover .c-arrow {
      background: var(--c, var(--blue-mid));
      border-color: transparent; color: #fff;
      transform: translate(2px, -2px);
      box-shadow: 0 4px 12px color-mix(in srgb, var(--c, var(--blue-mid)) 40%, transparent);
    }

    /* Card info grid */
    .c-info-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 8px 12px;
      margin-top: 12px;
      padding-top: 10px;
      border-top: 1px dashed var(--border);
      position: relative; z-index: 1;
    }
    .c-info-item {
      display: flex; flex-direction: column; gap: 1px;
    }
    .c-info-label {
      font-size: 9px; font-weight: 700;
      color: var(--txt-lo);
      letter-spacing: 0.06em;
      text-transform: uppercase;
    }
    .c-info-val {
      font-size: 12px; color: var(--txt-hi);
      font-weight: 500; line-height: 1.4;
    }
    .c-info-link { cursor: pointer; }
    .c-info-link .c-info-val {
      color: var(--blue-mid); font-weight: 600;
    }
    .c-info-link:hover .c-info-val {
      color: var(--cyan); text-decoration: underline;
    }

    /* ── 사이드 메뉴 ── */
    :root { --side-w: 240px; }
    body { padding-left: var(--side-w); transition: padding-left .28s ease; }
    /* v2.10.1: PC 사이드바 접기 (#1) — 콘텐츠 영역 확장, localStorage 유지, 모바일 무영향 */
    body.sidebar-collapsed:not(.ic-mobile) { padding-left: 0 !important; }
    body.sidebar-collapsed:not(.ic-mobile) .side-nav { transform: translateX(-100%) !important; }
    body.sidebar-collapsed:not(.ic-mobile) .left-nav-group { left: 0; }
    .pc-side-toggle { display: none; position: fixed; top: 14px; left: calc(var(--side-w) - 17px); z-index: 260; width: 34px; height: 34px; border-radius: 9px; background: var(--bg-card); border: 1px solid var(--border); color: var(--txt-mid); cursor: pointer; align-items: center; justify-content: center; font-size: 16px; box-shadow: var(--sh-sm); transition: left .28s ease, background .15s, color .15s; }
    .pc-side-toggle:hover { color: var(--blue-mid); border-color: var(--blue-mid); }
    /* 접힘 시: 사이드바가 사라지므로 토글을 화면 좌측 끝으로 옮겨 다시 펼칠 수 있게 함 */
    body.sidebar-collapsed:not(.ic-mobile) .pc-side-toggle { left: 8px; }
    @media (min-width: 1025px) { body:not(.ic-mobile) .pc-side-toggle { display: flex; } }
    body.ic-mobile .pc-side-toggle { display: none !important; }
    .side-nav {
      position: fixed;
      top: 0; left: 0; bottom: 0;
      width: var(--side-w);
      background: #ffffff;
      border-right: 1.5px solid rgba(12,31,184,0.08);
      box-shadow: 2px 0 20px rgba(12,31,184,0.05);
      z-index: 200;
      display: flex;
      flex-direction: column;
      /* 브라우저 줌(Ctrl +/-) 시 내부 콘텐츠가 뷰포트 높이를 넘기면 사이드바 자체가 스크롤되도록 (푸터/배너 잘림 방지) */
      overflow-y: auto;
      overflow-x: hidden;
      scrollbar-width: none;            /* Firefox */
      -ms-overflow-style: none;         /* IE/Edge legacy */
      transition: transform .28s ease;
    }
    .side-nav::-webkit-scrollbar { width: 0; height: 0; display: none; }
    /* v2.13.5: 새 브랜드 — 헤더/푸터 인라인 SVG 로고(테마 인지, 기존 img invert 영향 없음) */
    .side-brand { display: inline-flex; align-items: center; gap: 9px; }
    .side-brand-inf { width: 36px; height: auto; flex-shrink: 0; filter: drop-shadow(0 3px 7px rgba(26,61,232,0.22)); }
    .side-brand-text { display: flex; flex-direction: column; line-height: 1.02; text-align: left; }
    .side-brand-name { font-size: 16px; font-weight: 900; letter-spacing: 0.01em; color: #0f172a; white-space: nowrap; }
    [data-theme="dark"] .side-brand-name { color: #f0f4f8; }
    .side-brand-tag { font-size: 8px; font-weight: 800; letter-spacing: 0.13em; color: #1f7bff; margin-top: 2px; }
    [data-theme="dark"] .side-brand-tag { color: #6ea8ff; }
    body.ic-mobile .side-brand-inf { width: 32px; }
    .foot-brand { gap: 7px; opacity: 0.72; }
    .foot-brand .side-brand-inf { width: 26px; filter: none; }
    .foot-brand .side-brand-name { font-size: 13px; color: #64748b; }
    [data-theme="dark"] .foot-brand .side-brand-name { color: #94a3b8; }
    .side-nav-header {
      display: flex; align-items: center; justify-content: center;
      padding: 22px 16px 18px;
      border-bottom: 1px solid rgba(12,31,184,0.07);
      background: linear-gradient(180deg, #ffffff 0%, #f7faff 100%);
    }
    .side-nav-header img {
      width: 100%;
      max-width: 200px;
      height: auto;
      display: block;
      object-fit: contain;
    }
    .menu-tabs {
      display: flex;
      flex-direction: column;
      gap: 4px;
      padding: 14px 12px 8px;
      flex-shrink: 0;
      scrollbar-width: thin;
      scrollbar-color: rgba(12,31,184,0.15) transparent;
    }
    .side-nav-footer {
      padding: 12px 14px 16px;
      border-top: 1px solid rgba(12,31,184,0.07);
      background: #fafbff;
    }
    /* 사이드바 커뮤니티 참여 버튼 */
    .side-comm-section {
      padding: 8px 12px;
      border-top: 1px solid rgba(12,31,184,0.07);
    }
    .side-comm-label {
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--txt-lo);
      padding: 6px 4px 4px;
      display: block;
    }
    .side-comm-btn {
      display: flex;
      align-items: center;
      gap: 8px;
      width: 100%;
      padding: 9px 10px;
      border-radius: 9px;
      border: none;
      background: none;
      cursor: pointer;
      text-decoration: none;
      color: var(--txt-mid);
      font-family: 'Pretendard', sans-serif;
      font-size: 13px;
      font-weight: 600;
      transition: background 0.15s, color 0.15s;
      text-align: left;
    }
    .side-comm-btn:hover {
      background: rgba(26,61,232,0.07);
      color: var(--blue-mid);
    }
    .side-comm-btn .scb-icon {
      width: 32px;
      height: 32px;
      border-radius: 8px;
      overflow: hidden;
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      background: rgba(12,31,184,0.05);
    }
    .side-comm-btn .scb-icon img {
      width: 100%; height: 100%;
      object-fit: contain;
      display: block;
    }
    .side-comm-btn .scb-text { flex: 1; line-height: 1.2; }
    .side-comm-btn .scb-name { font-size: 12px; font-weight: 700; display: block; }
    .side-comm-btn .scb-sub { font-size: 10px; color: var(--txt-lo); display: block; }
    .side-comm-btn .scb-arrow {
      font-size: 12px;
      color: var(--txt-lo);
      flex-shrink: 0;
      transition: transform 0.15s;
    }
    .side-comm-btn:hover .scb-arrow { transform: translateX(2px); color: var(--blue-mid); }

    /* v2.1.37: CREW 300 사이드바 강조 — 카카오 옐로우 + LIVE 배지 + pulse */
    .side-comm-btn.kakao {
      background: linear-gradient(135deg, #FEE500 0%, #FAE100 60%, #FFC700 100%);
      color: #1a1a1a;
      padding: 11px 11px;
      border-radius: 12px;
      margin-bottom: 8px;
      box-shadow: 0 3px 12px rgba(254,229,0,0.45), 0 1px 3px rgba(0,0,0,0.08);
      position: relative;
      overflow: hidden;
      animation: scb-crew-pulse 2.6s ease-in-out infinite;
    }
    .side-comm-btn.kakao::before {
      content: '';
      position: absolute;
      top: 0; left: -120%;
      width: 60%; height: 100%;
      background: linear-gradient(110deg, transparent 0%, rgba(255,255,255,0.55) 50%, transparent 100%);
      animation: scb-crew-shine 3.8s ease-in-out infinite;
      pointer-events: none;
    }
    .side-comm-btn.kakao:hover {
      background: linear-gradient(135deg, #FEE500 0%, #FFD000 100%);
      color: #1a1a1a;
      transform: translateY(-1px);
      box-shadow: 0 5px 16px rgba(254,229,0,0.65);
      animation: none;
    }
    .side-comm-btn.kakao .scb-icon {
      background: #fff;
      box-shadow: 0 1px 3px rgba(0,0,0,0.12);
    }
    .side-comm-btn.kakao .scb-name { font-size: 13px; font-weight: 800; letter-spacing: -0.01em; }
    .side-comm-btn.kakao .scb-sub  { font-size: 10px; color: #5b4900; font-weight: 600; }
    .side-comm-btn.kakao .scb-arrow {
      color: #1a1a1a;
      font-weight: 800;
      font-size: 14px;
      animation: scb-arrow-bounce 1.6s ease-in-out infinite;
    }
    /* LIVE 배지 */
    .side-comm-btn.kakao .scb-live {
      display: inline-flex;
      align-items: center;
      gap: 3px;
      font-size: 9px;
      font-weight: 800;
      background: #ef4444;
      color: #fff;
      padding: 2px 6px;
      border-radius: 999px;
      margin-right: 4px;
      box-shadow: 0 1px 4px rgba(239,68,68,0.4);
      letter-spacing: 0.04em;
    }
    .side-comm-btn.kakao .scb-live::before {
      content: '';
      width: 5px; height: 5px;
      background: #fff;
      border-radius: 50%;
      animation: scb-live-dot 1.2s ease-in-out infinite;
    }
    @keyframes scb-crew-pulse {
      0%,100% { transform: scale(1); }
      50%     { transform: scale(1.025); }
    }
    @keyframes scb-crew-shine {
      0%,55%  { transform: translateX(0); }
      85%,100% { transform: translateX(433%); }
    }
    @keyframes scb-arrow-bounce {
      0%,100% { transform: translateX(0); }
      50%     { transform: translateX(3px); }
    }
    @keyframes scb-live-dot {
      0%,100% { opacity: 1; transform: scale(1); }
      50%     { opacity: 0.5; transform: scale(0.75); }
    }

    /* v2.1.41: 홈 방문자 카운터 강조 띠 — 사회적 증명 + 첫인상 강화 */
    .ic-visitor-strip {
      display: flex;
      align-items: center;
      gap: 14px;
      padding: 11px 18px;
      margin: 0 0 14px;
      background: linear-gradient(95deg, #1a3de8 0%, #4a70f5 55%, #5b8cff 100%);
      color: #fff;
      border-radius: 14px;
      box-shadow: 0 4px 16px rgba(26,61,232,0.30), 0 1px 3px rgba(0,0,0,0.06);
      position: relative;
      overflow: hidden;
      font-size: 13px;
    }
    .ic-visitor-strip::before {
      content: '';
      position: absolute;
      top: 0; left: -120%;
      width: 50%; height: 100%;
      background: linear-gradient(110deg, transparent 0%, rgba(255,255,255,0.18) 50%, transparent 100%);
      animation: vs-shine 5s ease-in-out infinite;
      pointer-events: none;
    }
    @keyframes vs-shine {
      0%, 70% { transform: translateX(0); }
      95%,100% { transform: translateX(540%); }
    }
    .vs-live {
      display: inline-flex; align-items: center; gap: 5px;
      font-size: 10.5px; font-weight: 800;
      background: #ef4444; color: #fff;
      padding: 3px 9px; border-radius: 999px;
      letter-spacing: 0.05em;
      flex-shrink: 0;
      box-shadow: 0 2px 6px rgba(239,68,68,0.5);
    }
    .vs-live::before {
      content: '';
      width: 6px; height: 6px;
      background: #fff;
      border-radius: 50%;
      animation: scb-live-dot 1.2s ease-in-out infinite;
    }
    .vs-main { flex: 1; min-width: 0; display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
    .vs-main-text { font-weight: 700; }
    .vs-num {
      font-size: 19px; font-weight: 900;
      letter-spacing: -0.02em;
      color: #fff;
      background: linear-gradient(135deg, #ffff00, #ffd000);
      -webkit-background-clip: text;
      background-clip: text;
      -webkit-text-fill-color: transparent;
      padding: 0 2px;
    }
    .vs-stats {
      display: flex; align-items: center; gap: 10px;
      flex-shrink: 0;
      font-size: 11.5px;
      font-weight: 600;
      opacity: 0.95;
    }
    .vs-stat-item { display: inline-flex; align-items: center; gap: 4px; }
    .vs-stat-item strong { font-weight: 800; color: #ffd000; font-variant-numeric: tabular-nums; }
    .vs-stat-divider { opacity: 0.4; }
    @media (max-width: 768px) {
      .ic-visitor-strip { padding: 9px 13px; font-size: 12px; gap: 10px; }
      .vs-num { font-size: 16px; }
      .vs-stats { font-size: 10.5px; gap: 7px; }
    }
    @media (max-width: 480px) {
      .vs-stats { display: none; } /* 모바일 좁은 화면: 핵심 메시지만 */
    }

    /* v2.1.37: 홈 대시보드 Hero CTA — CREW 300 참여 유도 띠 */
    .crew-hero-cta {
      display: flex;
      align-items: center;
      gap: 16px;
      padding: 14px 22px;
      background: linear-gradient(135deg, #FEE500 0%, #FAE100 55%, #FFC700 100%);
      border-radius: 16px;
      margin: 0 0 18px;
      box-shadow: 0 6px 22px rgba(254,229,0,0.40), 0 2px 6px rgba(0,0,0,0.05);
      color: #1a1a1a;
      text-decoration: none;
      position: relative;
      overflow: hidden;
      transition: transform 0.18s ease, box-shadow 0.18s ease;
      cursor: pointer;
    }
    .crew-hero-cta::after {
      content: '';
      position: absolute;
      top: 0; left: -120%;
      width: 50%; height: 100%;
      background: linear-gradient(110deg, transparent 0%, rgba(255,255,255,0.45) 50%, transparent 100%);
      animation: crew-hero-shine 4.2s ease-in-out infinite;
      pointer-events: none;
    }
    .crew-hero-cta:hover {
      transform: translateY(-2px);
      box-shadow: 0 10px 30px rgba(254,229,0,0.60);
    }
    .crew-hero-icon {
      width: 52px; height: 52px;
      border-radius: 14px;
      background: #fff;
      flex-shrink: 0;
      display: flex; align-items: center; justify-content: center;
      box-shadow: 0 2px 8px rgba(0,0,0,0.10);
      overflow: hidden;
    }
    .crew-hero-icon img { width: 90%; height: 90%; object-fit: contain; }
    .crew-hero-body { flex: 1; min-width: 0; }
    .crew-hero-top {
      display: flex; align-items: center; gap: 8px;
      margin-bottom: 3px;
    }
    .crew-hero-live {
      display: inline-flex; align-items: center; gap: 4px;
      background: #ef4444; color: #fff;
      font-size: 10px; font-weight: 800;
      padding: 2px 8px; border-radius: 999px;
      letter-spacing: 0.04em;
      box-shadow: 0 2px 6px rgba(239,68,68,0.4);
    }
    .crew-hero-live::before {
      content: '';
      width: 6px; height: 6px;
      background: #fff;
      border-radius: 50%;
      animation: scb-live-dot 1.2s ease-in-out infinite;
    }
    .crew-hero-count {
      font-size: 11px; font-weight: 700;
      color: #5b4900;
      background: rgba(255,255,255,0.45);
      padding: 2px 8px; border-radius: 999px;
    }
    .crew-hero-title {
      font-size: 17px;
      font-weight: 800;
      letter-spacing: -0.02em;
      color: #1a1a1a;
      line-height: 1.3;
    }
    .crew-hero-sub {
      font-size: 12px;
      font-weight: 600;
      color: #5b4900;
      margin-top: 2px;
    }
    .crew-hero-action {
      flex-shrink: 0;
      background: #1a1a1a;
      color: #FEE500;
      font-weight: 800;
      font-size: 13px;
      padding: 9px 14px;
      border-radius: 999px;
      display: inline-flex;
      align-items: center;
      gap: 4px;
      box-shadow: 0 2px 8px rgba(0,0,0,0.18);
      transition: transform 0.15s;
    }
    .crew-hero-cta:hover .crew-hero-action {
      transform: translateX(3px);
      background: #000;
    }
    @keyframes crew-hero-shine {
      0%,60% { transform: translateX(0); }
      88%,100% { transform: translateX(560%); }
    }
    /* 모바일에선 컴팩트 */
    @media (max-width: 768px) {
      .crew-hero-cta { padding: 12px 14px; gap: 12px; border-radius: 14px; }
      .crew-hero-icon { width: 44px; height: 44px; border-radius: 12px; }
      .crew-hero-title { font-size: 14.5px; }
      .crew-hero-sub { font-size: 11px; }
      .crew-hero-action { font-size: 11.5px; padding: 7px 11px; }
    }
    @media (max-width: 480px) {
      .crew-hero-action span.cha-text { display: none; } /* 좁은 화면: 화살표만 */
    }
    /* 다크모드 */
    [data-theme="dark"] .crew-hero-cta {
      box-shadow: 0 6px 22px rgba(254,229,0,0.30), 0 2px 6px rgba(0,0,0,0.30);
    }

    /* 사이드바 푸터 */
    .side-footer {
      padding: 10px 12px 16px;
      border-top: 1px solid rgba(12,31,184,0.07);
      display: flex;
      flex-direction: column;
      gap: 4px;
      margin-top: auto;
    }
    .side-footer-link {
      display: flex;
      align-items: center;
      gap: 7px;
      padding: 8px 10px;
      border-radius: 8px;
      font-family: 'Pretendard', sans-serif;
      font-size: 12px;
      font-weight: 500;
      color: var(--txt-mid);
      text-decoration: none;
      background: none;
      border: none;
      cursor: pointer;
      width: 100%;
      text-align: left;
      transition: background 0.15s, color 0.15s;
    }
    #pwa-install-btn {
      background: linear-gradient(135deg, #1a3de8, #4a70f5);
      color: #fff !important;
      font-weight: 700;
      font-size: 13px;
      border-radius: 10px;
      padding: 10px 12px;
      justify-content: center;
      box-shadow: 0 2px 12px rgba(26,61,232,0.30);
      border: none;
      animation: pwa-pulse 2.4s ease-in-out infinite;
    }
    #pwa-install-btn:hover {
      background: linear-gradient(135deg, #1530c4, #3a60e5);
      box-shadow: 0 4px 18px rgba(26,61,232,0.45);
      animation: none;
    }
    @keyframes pwa-pulse {
      0%, 100% { opacity: 1; }
      50%       { opacity: 0.78; }
    }
    .side-footer-link:hover { background: rgba(26,61,232,0.06); color: var(--blue-mid); }
    .side-stats {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 6px 10px;
      font-size: 11px;
      color: var(--txt-lo);
      font-family: 'Pretendard', sans-serif;
    }
    .side-stats-dot {
      width: 6px; height: 6px;
      border-radius: 50%;
      background: var(--cyan);
      animation: blink 2.4s ease-in-out infinite;
      flex-shrink: 0;
    }
    .side-theme-toggle {
      display: flex;
      gap: 4px;
      padding: 6px 10px;
    }
    .side-theme-btn {
      flex: 1;
      font-family: 'Pretendard', sans-serif;
      font-size: 11px;
      font-weight: 600;
      padding: 6px 4px;
      border-radius: 6px;
      border: 1px solid rgba(12,31,184,0.12);
      background: none;
      color: var(--txt-lo);
      cursor: pointer;
      transition: all 0.15s;
    }
    .side-theme-btn.active {
      background: var(--blue-mid);
      color: #fff;
      border-color: var(--blue-mid);
    }
    .side-footer-copy {
      font-size: 10px;
      color: var(--txt-lo);
      padding: 4px 10px 0;
      font-family: 'Pretendard', sans-serif;
    }

    .side-contact {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 12px 14px;
      border-radius: 12px;
      background: linear-gradient(135deg, var(--blue-mid), #4a6ef5);
      color: #fff;
      text-decoration: none;
      font-weight: 700;
      font-size: 14px;
      box-shadow: 0 6px 18px rgba(26,61,232,0.25);
      transition: transform .18s ease, box-shadow .18s ease;
    }
    .side-contact:hover { transform: translateY(-2px); box-shadow: 0 10px 26px rgba(26,61,232,0.33); }
    .side-contact-icon { font-size: 18px; }

    /* 현재 위치 인디케이터 */
    .side-cur-indicator {
      margin: 2px 10px 6px;
      padding: 9px 12px;
      background: rgba(26,61,232,0.05);
      border-left: 2px solid rgba(26,61,232,0.25);
      border-radius: 0 6px 6px 0;
      display: flex;
      align-items: center;
      gap: 8px;
    }
    .sci-arrow {
      color: var(--blue-mid);
      font-size: 14px;
      line-height: 1;
      opacity: 0.6;
    }
    .sci-label {
      font-family: 'Pretendard', sans-serif;
      font-size: 12px;
      font-weight: 500;
      color: var(--txt-lo);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .menu-tab {
      font-family: 'Pretendard', sans-serif;
      font-size: 14px;
      font-weight: 600;
      color: var(--txt-mid);
      background: none;
      border: 1.5px solid transparent;
      padding: 11px 14px;
      cursor: pointer;
      text-align: left;
      border-radius: 10px;
      transition: all .18s ease;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .menu-tab.active {
      background: linear-gradient(135deg, rgba(26,61,232,0.10), rgba(0,200,238,0.08));
      color: var(--blue-mid);
      border-color: rgba(26,61,232,0.22);
      font-weight: 700;
      box-shadow: 0 2px 10px rgba(26,61,232,0.08);
    }
    .menu-tab:not(.active):hover {
      background: rgba(26,61,232,0.05);
      color: var(--blue-mid);
    }
    .menu-tab { position: relative; }
    .menu-badge {
      display: none;
      margin-left: 6px;
      padding: 1px 8px;
      border-radius: 100px;
      background: #dc2626;
      color: #fff;
      font-family: 'Pretendard', sans-serif;
      font-size: 10px;
      font-weight: 800;
      letter-spacing: 0.02em;
      vertical-align: middle;
      min-width: 20px;
      text-align: center;
      box-shadow: 0 2px 8px rgba(220,38,38,0.35);
    }
    .menu-badge.show { display: inline-block; }

    /* 서브메뉴 */
    .menu-tab-group { display: flex; flex-direction: column; }
    .menu-tab-parent { display: flex; align-items: center; justify-content: space-between; }
    .menu-tab-arrow { font-size: 11px; opacity: .5; transition: transform .2s ease; flex-shrink: 0; margin-left: 4px; }
    .menu-tab-parent[data-expanded="true"] .menu-tab-arrow { transform: rotate(90deg); opacity: .8; }
    .sub-menu { display: none; flex-direction: column; gap: 2px; padding: 2px 0 2px 14px; margin-top: 2px; }
    .sub-menu.open { display: flex; }
    .sub-menu-item {
      font-family: 'Pretendard', sans-serif; font-size: 13px; font-weight: 500;
      color: var(--txt-mid); background: none; border: none;
      padding: 9px 12px; border-radius: 8px; cursor: pointer; text-align: left;
      transition: background .15s, color .15s;
      border-left: 2px solid rgba(26,61,232,0.15);
    }
    .sub-menu-item:hover { background: rgba(26,61,232,0.06); color: var(--blue-mid); }
    .sub-menu-item.active { background: rgba(26,61,232,0.08); color: var(--blue-mid); border-left-color: var(--blue-mid); font-weight: 700; }
    .menu-tab-kakao { text-decoration: none; display: block; }

    /* 운영자 문의 폼 */
    .contact-wrap { max-width: 600px; margin: 0 auto; background: #fff; border: 1.5px solid rgba(12,31,184,0.10); border-radius: 18px; padding: 32px 28px 28px; box-shadow: 0 4px 24px rgba(12,31,184,0.07); }
    .contact-icon { font-size: 36px; margin-bottom: 10px; }
    .contact-title { font-family: 'Pretendard', sans-serif; font-size: 20px; font-weight: 800; color: var(--txt-hi); margin-bottom: 6px; }
    .contact-desc { font-family: 'Pretendard', sans-serif; font-size: 14px; color: var(--txt-lo); margin-bottom: 24px; line-height: 1.6; }
    .contact-form { display: flex; flex-direction: column; gap: 16px; }
    .contact-field { display: flex; flex-direction: column; gap: 6px; }
    .contact-label { font-family: 'Pretendard', sans-serif; font-size: 13px; font-weight: 700; color: var(--txt-mid); }
    .contact-input, .contact-select, .contact-textarea { font-family: 'Pretendard', sans-serif; font-size: 14px; padding: 11px 14px; border-radius: 10px; border: 1.5px solid rgba(12,31,184,0.14); background: #f8f9ff; color: var(--txt-hi); outline: none; transition: border-color .18s, box-shadow .18s; }
    .contact-select { cursor: pointer; }
    .contact-textarea { resize: vertical; min-height: 110px; line-height: 1.6; }
    .contact-input:focus, .contact-select:focus, .contact-textarea:focus { border-color: var(--blue-mid); box-shadow: 0 0 0 3px rgba(26,61,232,0.10); background: #fff; }
    .contact-submit { font-family: 'Pretendard', sans-serif; font-size: 15px; font-weight: 800; padding: 14px 24px; border-radius: 12px; background: linear-gradient(135deg, var(--blue-mid), #4a6ef5); color: #fff; border: none; cursor: pointer; box-shadow: 0 6px 18px rgba(26,61,232,0.25); transition: transform .18s, box-shadow .18s; margin-top: 4px; }
    .contact-submit:hover { transform: translateY(-2px); box-shadow: 0 10px 26px rgba(26,61,232,0.33); }
    .contact-submit:disabled { opacity: .55; cursor: default; transform: none; }
    .contact-success { display: none; text-align: center; padding: 28px 0 8px; }
    .contact-success-icon { font-size: 48px; margin-bottom: 10px; }
    .contact-success-msg { font-family: 'Pretendard', sans-serif; font-size: 17px; font-weight: 700; color: var(--blue-mid); margin-bottom: 8px; }
    .contact-success-sub { font-family: 'Pretendard', sans-serif; font-size: 13px; color: var(--txt-lo); }
    .contact-reset { margin-top: 16px; font-family: 'Pretendard', sans-serif; font-size: 13px; color: var(--blue-mid); background: none; border: none; cursor: pointer; text-decoration: underline; font-weight: 600; }


    /* 히어로 배너 */
    .comm-hero {
      display: grid; grid-template-columns: auto 1fr; gap: 28px; align-items: center;
      padding: 32px 32px; border-radius: 22px;
      border: 1.5px solid rgba(26,61,232,0.12);
      position: relative; overflow: hidden;
    }
    .comm-hero--crew { background: linear-gradient(135deg, #eef3ff 0%, #ddf0ff 60%, #e8f8ff 100%); }
    .comm-hero--manager { background: linear-gradient(135deg, #fff1f4 0%, #ffe8f8 60%, #f3e8ff 100%); }
    .comm-hero::after {
      content: ''; position: absolute; right: -40px; top: -40px;
      width: 180px; height: 180px; border-radius: 50%;
      opacity: .06;
    }
    .comm-hero--crew::after { background: var(--blue-mid); }
    .comm-hero--manager::after { background: #c026d3; }
    .comm-hero-logo {
      width: 100px; height: 100px; border-radius: 24px; overflow: hidden; flex-shrink: 0;
      background: #fff; box-shadow: 0 10px 30px rgba(26,61,232,0.16);
      display: flex; align-items: center; justify-content: center;
    }
    .comm-hero-logo img { width: 100%; height: 100%; object-fit: cover; }
    .comm-hero-logo-fb { font-family: 'Pretendard', sans-serif; font-size: 18px; font-weight: 900; color: var(--blue-mid); }
    .comm-hero-info { min-width: 0; }
    .comm-hero-tag {
      display: inline-block; font-family: 'Pretendard', sans-serif;
      font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
      padding: 3px 12px; border-radius: 100px; margin-bottom: 10px;
    }
    .comm-hero--crew .comm-hero-tag { background: rgba(26,61,232,0.10); color: var(--blue-mid); }
    .comm-hero--manager .comm-hero-tag { background: rgba(192,38,211,0.10); color: #a21caf; }
    .comm-hero-name {
      font-family: 'Pretendard', sans-serif; font-size: 28px; font-weight: 900;
      color: var(--txt-hi); letter-spacing: -.03em; margin-bottom: 8px;
    }
    .comm-hero-tagline {
      font-family: 'Pretendard', sans-serif; font-size: 15px; font-weight: 600;
      color: var(--txt-mid); margin-bottom: 16px;
    }
    .comm-hero-join {
      display: inline-flex; align-items: center; gap: 8px;
      padding: 12px 24px; border-radius: 12px; font-family: 'Pretendard', sans-serif;
      font-size: 15px; font-weight: 900; text-decoration: none;
      background: linear-gradient(135deg, #fee500, #ffcc00); color: #191919;
      box-shadow: 0 4px 16px rgba(254,229,0,0.40);
      transition: transform .18s, box-shadow .18s;
    }
    .comm-hero-join:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(254,229,0,0.55); }

    /* 본문 2열 */
    .comm-body { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
    @media (max-width: 720px) { .comm-body { grid-template-columns: 1fr; } .comm-hero { grid-template-columns: 1fr; text-align: center; } .comm-hero-logo { margin: 0 auto; } }

    /* 소개 블록 */
    .comm-block {
      background: #fff; border: 1.5px solid rgba(12,31,184,0.08);
      border-radius: 18px; padding: 24px;
    }
    .comm-block-title {
      font-family: 'Pretendard', sans-serif; font-size: 13px; font-weight: 800;
      color: var(--blue-mid); letter-spacing: .06em; text-transform: uppercase;
      margin-bottom: 14px; display: flex; align-items: center; gap: 7px;
    }
    .comm-block-title::before { content: ''; display: block; width: 3px; height: 14px; background: var(--blue-mid); border-radius: 2px; }
    .comm-block--manager .comm-block-title { color: #a21caf; }
    .comm-block--manager .comm-block-title::before { background: #a21caf; }
    .comm-desc-text {
      font-family: 'Pretendard', sans-serif; font-size: 14px; color: var(--txt-mid);
      line-height: 1.85; word-break: keep-all;
    }

    /* 특징 리스트 */
    .comm-features { display: flex; flex-direction: column; gap: 14px; }
    .comm-feature-item { display: flex; align-items: flex-start; gap: 12px; }
    .comm-feature-icon {
      width: 38px; height: 38px; border-radius: 10px; flex-shrink: 0;
      display: flex; align-items: center; justify-content: center; font-size: 18px;
      background: rgba(26,61,232,0.07);
    }
    .comm-block--manager .comm-feature-icon { background: rgba(192,38,211,0.07); }
    .comm-feature-text { flex: 1; min-width: 0; }
    .comm-feature-name {
      font-family: 'Pretendard', sans-serif; font-size: 13px; font-weight: 800;
      color: var(--txt-hi); margin-bottom: 2px;
    }
    .comm-feature-desc {
      font-family: 'Pretendard', sans-serif; font-size: 12px; color: var(--txt-lo); line-height: 1.5;
    }

    /* 참여 조건 바 */
    .comm-cond-bar {
      display: flex; gap: 12px; flex-wrap: wrap;
    }
    .comm-cond-item {
      flex: 1; min-width: 120px; display: flex; align-items: center; gap: 10px;
      background: #f8f9ff; border: 1.5px solid rgba(12,31,184,0.09);
      border-radius: 12px; padding: 12px 14px;
    }
    .comm-cond-item--manager { background: #fdf4ff; border-color: rgba(192,38,211,0.09); }
    .comm-cond-emoji { font-size: 20px; }
    .comm-cond-label { font-family: 'Pretendard', sans-serif; font-size: 11px; font-weight: 600; color: var(--txt-lo); margin-bottom: 2px; }
    .comm-cond-val { font-family: 'Pretendard', sans-serif; font-size: 13px; font-weight: 800; color: var(--txt-hi); }

    /* 전체 CTA 버튼 */
    .comm-cta-full {
      display: flex; align-items: center; justify-content: center; gap: 12px;
      padding: 20px; border-radius: 16px;
      background: linear-gradient(135deg, #fee500, #ffcc00);
      font-family: 'Pretendard', sans-serif; font-size: 17px; font-weight: 900;
      color: #191919; text-decoration: none;
      box-shadow: 0 6px 24px rgba(254,229,0,0.40);
      transition: transform .18s, box-shadow .18s;
    }
    .comm-cta-full:hover { transform: translateY(-3px); box-shadow: 0 10px 32px rgba(254,229,0,0.55); }

    @media (max-width: 600px) { .contact-wrap { padding: 24px 16px 20px; } .comm-hero { padding: 22px 18px; } .comm-hero-name { font-size: 22px; } }

    /* 햄버거 버튼 (모바일) */
    .side-toggle {
      display: none;
      position: fixed;
      top: 14px; left: 14px;
      width: 42px; height: 42px;
      border-radius: 12px;
      background: #ffffff;
      border: 1.5px solid rgba(12,31,184,0.12);
      box-shadow: 0 4px 14px rgba(12,31,184,0.12);
      z-index: 600;
      cursor: pointer;
      align-items: center; justify-content: center;
      padding: 0;
      line-height: 1;
    }
    .side-toggle svg {
      display: block;
      width: 20px; height: 20px;
      stroke: var(--blue-mid);
      fill: none;
      stroke-width: 2;
      stroke-linecap: round;
    }
    .side-backdrop {
      display: none;
      position: fixed; inset: 0;
      background: rgba(8,15,48,0.5);
      backdrop-filter: blur(2px);
      z-index: 199;
    }
    .side-backdrop.open { display: block; }

    @media (max-width: 900px) {
      body { padding-left: 0; }
      .side-nav { transform: translateX(-100%); }
      .side-nav.open { transform: translateX(0); box-shadow: 6px 0 28px rgba(0,0,0,0.2); }
      .side-toggle { display: flex; }
    }

    /* ── 모바일 사이드 메뉴 전용 조정 ── */
    @media (max-width: 480px) {
      /* 폭: 화면의 80%, 최대 280px */
      .side-nav {
        width: min(80vw, 280px);
        overflow-y: auto;            /* 작은 폰 대비 스크롤 허용 */
        overflow-x: hidden;
        scrollbar-width: none;       /* Firefox: 스크롤바 숨김 */
      }
      .side-nav::-webkit-scrollbar { display: none; }  /* Chrome/Safari: 스크롤바 숨김 */

      /* 헤더 로고 최소화 */
      .side-nav-header { padding: 10px 14px 8px; flex-shrink: 0; }
      .side-nav-header img { max-width: 130px; }

      /* 메뉴 탭 압축 */
      .menu-tabs { padding: 6px 10px 4px; gap: 2px; flex-shrink: 0; }
      .menu-tab  { padding: 7px 10px; font-size: 12px; }
      .sub-menu-item { padding: 5px 10px 5px 26px; font-size: 11px; }

      /* v2.1.26: 파트너사 프로모션 배너 CSS 제거 */
      .side-comm-label { padding: 2px 4px 3px; font-size: 9px; }

      /* 커뮤니티 참여 */
      .side-comm-section { padding: 4px 10px; flex-shrink: 0; }
      .side-comm-btn { padding: 6px 8px; font-size: 11px; }
      .side-comm-btn .scb-icon { width: 26px; height: 26px; font-size: 13px; }

      /* 푸터 압축 */
      .side-footer { padding: 4px 10px 8px; flex-shrink: 0; }
      .side-footer-link { font-size: 11px; padding: 4px 8px; }
      .side-stats { font-size: 10px; padding: 3px 8px; }
      .side-theme-toggle { padding: 3px 8px; gap: 3px; }

      .side-theme-btn { font-size: 10px; padding: 4px 2px; }
      .side-footer-copy { display: none; }
    }

    /* 소식지 타입 섹션 (생명/손해) */
    .nl-type-section {
      margin-bottom: 40px;
    }
    .nl-type-section:last-child { margin-bottom: 0; }

    /* 보험사 그룹 */
    .nl-company-group {
      margin-bottom: 24px;
    }
    .nl-company-name {
      font-size: 15px;
      font-weight: 700;
      color: var(--txt-hi);
      margin-bottom: 12px;
      padding-bottom: 8px;
      border-bottom: 1px dashed var(--border);
      display: flex;
      align-items: center;
      gap: 8px;
    }
    /* 소식지/청구서류 검색창 */
    .nlcf-search-wrap {
      position: relative;
      margin-bottom: 22px;
      max-width: 520px;
    }
    .nlcf-search {
      width: 100%;
      padding: 12px 40px 12px 16px;
      border: 1.5px solid rgba(12,31,184,0.14);
      border-radius: 12px;
      font-size: 14px;
      font-family: inherit;
      background: #fff;
      color: var(--txt-hi);
      outline: none;
      box-shadow: 0 2px 10px rgba(12,31,184,0.05);
      transition: border-color .18s ease, box-shadow .18s ease;
    }
    .nlcf-search:focus {
      border-color: var(--blue-mid);
      box-shadow: 0 4px 18px rgba(26,61,232,0.12);
    }
    .nlcf-search-clear {
      position: absolute;
      top: 50%; right: 10px;
      transform: translateY(-50%);
      width: 26px; height: 26px;
      border-radius: 50%;
      border: none;
      background: #eef1fb;
      color: var(--txt-mid);
      font-size: 12px;
      cursor: pointer;
      display: none;
      align-items: center; justify-content: center;
    }
    .nlcf-search-clear:hover { background: #dbe1f7; color: var(--txt-hi); }
    .nlcf-search-wrap.has-value .nlcf-search-clear { display: flex; }

    .nl-items-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
      gap: 12px;
    }
    .nl-card {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 8px;
      background: var(--bg-card);
      border: 1.5px solid var(--border);
      border-radius: 14px;
      padding: 18px 12px;
      cursor: pointer;
      transition: transform .25s, box-shadow .25s, border-color .25s;
      text-decoration: none;
      color: inherit;
    }
    .nl-card:hover {
      transform: translateY(-4px);
      box-shadow: var(--sh-md);
      border-color: var(--blue-light);
    }
    .nl-card-icon {
      font-size: 32px;
    }
    .nl-card-title {
      font-size: 12px;
      font-weight: 600;
      color: var(--txt-mid);
      text-align: center;
      line-height: 1.4;
      word-break: keep-all;
    }
    .nl-card-date {
      font-family: 'Pretendard', sans-serif;
      font-size: 9px;
      color: var(--txt-lo);
    }

    /* 소식지 뷰어 (이미지/PDF) */
    .nl-viewer-overlay {
      display: none;
      position: fixed;
      inset: 0;
      background: rgba(0,0,0,0.85);
      z-index: 10000;
      justify-content: center;
      align-items: center;
      padding: 16px;
      overflow: auto;
      -webkit-overflow-scrolling: touch;
    }
    .nl-viewer-overlay.open { display: flex; }
    .nl-viewer-content {
      position: relative;
      max-width: 90vw;
      max-height: 90vh;
    }
    .nl-viewer-content img {
      max-width: 90vw;
      max-height: 85vh;
      border-radius: 12px;
      box-shadow: 0 20px 60px rgba(0,0,0,0.4);
    }
    .nl-viewer-content iframe {
      width: min(800px, 90vw);
      height: 85vh;
      border: none;
      border-radius: 12px;
      box-shadow: 0 20px 60px rgba(0,0,0,0.4);
    }
    /* v2.1.0: 새 탭에서 열기 fallback */
    .nl-viewer-ext {
      position: absolute;
      top: -16px; left: 0;
      padding: 6px 12px;
      background: #fff;
      color: #1a3de8;
      border-radius: 18px;
      font-size: 12px;
      font-weight: 700;
      text-decoration: none;
      box-shadow: 0 4px 12px rgba(0,0,0,0.25);
      z-index: 2;
      white-space: nowrap;
    }
    .nl-viewer-ext:hover { background: #1a3de8; color: #fff; }
    @media (max-width: 768px) {
      .nl-viewer-ext {
        position: fixed;
        top: 10px; left: 10px;
        font-size: 11px;
        padding: 8px 12px;
        z-index: 11;
      }
    }
    .nl-viewer-close {
      position: absolute;
      top: -16px; right: -16px;
      width: 36px; height: 36px;
      border-radius: 50%;
      background: #fff;
      border: none;
      font-size: 18px;
      cursor: pointer;
      box-shadow: 0 4px 12px rgba(0,0,0,0.3);
      display: flex; align-items: center; justify-content: center;
      transition: background .2s;
      z-index: 2;
    }
    .nl-viewer-close:hover { background: #ef4444; color: #fff; }

    /* ── 모바일: 전체화면 + 확대/스크롤 가능하게 ── */
    @media (max-width: 768px) {
      .nl-viewer-overlay {
        padding: 0;
        align-items: flex-start;
        justify-content: flex-start;
      }
      .nl-viewer-content {
        position: static;
        width: 100vw;
        max-width: 100vw;
        max-height: none;
        min-height: 100vh;
        display: block;
        padding: 44px 0 20px;
        overflow: visible;
      }
      .nl-viewer-content img {
        display: block;
        width: 100%;
        max-width: none;
        max-height: none;
        height: auto;
        border-radius: 0;
        box-shadow: none;
        /* 핀치 줌 허용 */
        touch-action: pinch-zoom;
      }
      .nl-viewer-content iframe {
        width: 100vw;
        height: calc(100vh - 44px);
        border-radius: 0;
        box-shadow: none;
      }
      .nl-viewer-close {
        position: fixed;
        top: 10px;
        right: 10px;
        width: 40px; height: 40px;
        font-size: 20px;
        z-index: 10;
      }
    }

    .nl-empty {
      text-align: center;
      padding: 40px;
      color: var(--txt-lo);
      font-size: 13px;
    }

    /* ══════════════════════════════
       v2.0.3: 사용자 신청 CTA 바 + 모달
    ══════════════════════════════ */
    .submit-cta-bar {
      margin: -6px 0 18px;
      padding: 14px 16px;
      border-radius: 14px;
      background: linear-gradient(135deg, rgba(26,61,232,0.06), rgba(219,39,119,0.06));
      border: 1px dashed rgba(26,61,232,0.25);
      display: flex; align-items: center; justify-content: space-between;
      gap: 12px; flex-wrap: wrap;
    }
    .submit-cta-bar {
      position: relative;
      border: 1.5px solid rgba(245,158,11,0.42);
      background: linear-gradient(135deg, rgba(245,158,11,0.12), rgba(219,39,119,0.08), rgba(26,61,232,0.06));
      box-shadow: 0 10px 28px rgba(245,158,11,0.12);
    }
    .submit-cta-bar::before {
      content: "UPLOAD";
      position: absolute;
      top: -9px;
      left: 14px;
      padding: 2px 7px;
      border-radius: 999px;
      background: #f59e0b;
      color: #fff;
      font-size: 9px;
      font-weight: 900;
      letter-spacing: 0.08em;
      line-height: 1.2;
    }
    .submit-cta-text {
      display: flex; align-items: center; gap: 8px;
      color: var(--txt-hi); font-size: 13.5px; font-weight: 600;
      flex: 1; min-width: 200px;
    }
    .submit-cta-btn {
      padding: 10px 18px;
      border-radius: 10px;
      background: linear-gradient(135deg, #f59e0b, #f97316 46%, #db2777);
      color: #fff; border: none;
      font-size: 13px; font-weight: 700; cursor: pointer;
      box-shadow: 0 8px 20px rgba(249,115,22,0.28);
      transition: transform .15s, box-shadow .15s;
      white-space: nowrap;
    }
    .submit-cta-btn:hover { transform: translateY(-1px); box-shadow: 0 10px 26px rgba(249,115,22,0.36); }
    body.ic-mobile .submit-cta-bar {
      border: 2px solid rgba(249,115,22,0.64);
      box-shadow: 0 12px 28px rgba(249,115,22,0.18);
    }
    body.ic-mobile .submit-cta-btn {
      width: 100%;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 3px;
      min-height: 48px;
      padding: 10px 14px;
      font-size: 13.5px;
      font-weight: 900;
      letter-spacing: 0;
      white-space: normal;
      line-height: 1.2;
      box-shadow: 0 12px 26px rgba(219,39,119,0.26);
    }
    body.ic-mobile .submit-cta-btn::before {
      content: "7~8월 등록비 인하 이벤트";
      display: block;
      font-size: 10.5px;
      font-weight: 900;
      line-height: 1.1;
      color: rgba(255,255,255,0.92);
    }

    /* v2.0.4: PC 홈 대시보드 공고 등록 CTA */
    .home-submit-cta {
      margin: 18px 0;
      padding: 16px 18px;
      border-radius: 16px;
      background: linear-gradient(135deg, rgba(26,61,232,0.08), rgba(219,39,119,0.08));
      border: 1.5px dashed rgba(26,61,232,0.28);
      display: flex; align-items: center; justify-content: space-between;
      gap: 16px; flex-wrap: wrap;
    }
    .hsc-head { display: flex; align-items: center; gap: 12px; flex: 1; min-width: 220px; }
    .hsc-icon { font-size: 28px; }
    .hsc-title { font-size: 14.5px; font-weight: 800; color: var(--txt-hi); margin-bottom: 2px; }
    .hsc-sub { font-size: 11.5px; color: var(--txt-lo); }
    .hsc-buttons { display: flex; gap: 8px; flex-wrap: wrap; }
    .hsc-btn {
      display: inline-flex; align-items: center; gap: 8px;
      padding: 10px 16px;
      border-radius: 10px;
      border: none;
      font-size: 13px; font-weight: 700;
      cursor: pointer;
      color: #fff;
      box-shadow: 0 4px 12px rgba(0,0,0,0.1);
      transition: transform .12s, box-shadow .12s;
      white-space: nowrap;
    }
    .hsc-btn.recruit { background: linear-gradient(135deg, #1a3de8, #4f6df0); }
    .hsc-btn.lecture { background: linear-gradient(135deg, #db2777, #ec4899); }
    .hsc-btn:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0,0,0,0.18); }
    @media (max-width: 720px) {
      .home-submit-cta { flex-direction: column; align-items: stretch; }
      .hsc-buttons { justify-content: stretch; }
      .hsc-btn { flex: 1; justify-content: center; }
    }
    [data-theme="dark"] .home-submit-cta { border-color: rgba(124,158,255,0.32); }


    /* v2.1.7: 견적 모달 — 차량 박스 / 칩 / 견적 박스 / 요약 */
    .rq-vehicle {
      display: flex; align-items: center; gap: 12px;
      padding: 12px;
      background: linear-gradient(135deg, rgba(26,61,232,0.06), rgba(159,122,234,0.06));
      border: 1.5px solid rgba(26,61,232,0.22);
      border-radius: 12px;
      margin-bottom: 16px;
    }
    .rq-vehicle-thumb {
      width: 88px; height: 64px;
      border-radius: 8px;
      background: linear-gradient(135deg, #eef2ff, #e0e7ff);
      flex-shrink: 0; overflow: hidden;
      display: flex; align-items: center; justify-content: center;
      color: #4f6df0; font-size: 28px;
    }
    .rq-vehicle-thumb img { width: 100%; height: 100%; object-fit: cover; }
    .rq-vehicle-info { flex: 1; min-width: 0; }
    .rq-vehicle-name {
      font-size: 14.5px; font-weight: 800; color: var(--txt-hi);
      line-height: 1.35;
    }
    .rq-vehicle-meta {
      font-size: 11.5px; color: var(--txt-lo); margin-top: 2px;
    }
    .rq-vehicle-tags {
      display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px;
    }
    .rq-vehicle-tag {
      font-size: 10.5px; font-weight: 700;
      padding: 2px 7px; border-radius: 4px;
      background: rgba(79,109,240,0.10);
      color: #4f6df0;
    }

    .rq-chip-grid {
      display: flex; flex-wrap: wrap; gap: 6px;
    }
    .rq-chip {
      padding: 8px 14px;
      border-radius: 999px;
      border: 1.5px solid var(--border, rgba(0,0,0,0.12));
      background: var(--bg-card, #fff);
      color: var(--txt-mid);
      font-size: 12.5px; font-weight: 700;
      cursor: pointer;
      transition: all .12s;
    }
    .rq-chip:hover {
      border-color: #1a3de8; color: #1a3de8;
    }
    .rq-chip.active {
      background: #1a3de8; color: #fff; border-color: #1a3de8;
    }
    [data-theme="dark"] .rq-chip {
      background: #161b22;
      color: #c9d1d9;
      border-color: rgba(255,255,255,0.12);
    }
    [data-theme="dark"] .rq-chip.active {
      background: #4f6df0; border-color: #4f6df0;
    }

    .rq-quote-box {
      margin: 18px 0 4px;
      padding: 18px 20px;
      border-radius: 14px;
      background: linear-gradient(135deg, #1a3de8 0%, #4f6df0 60%, #db2777 130%);
      color: #fff;
      text-align: center;
      box-shadow: 0 10px 28px rgba(26,61,232,0.22);
    }
    .rq-quote-label {
      font-size: 11.5px; font-weight: 700;
      letter-spacing: 0.08em;
      opacity: 0.85;
      margin-bottom: 4px;
    }
    .rq-quote-amount {
      font-size: 30px; font-weight: 900;
      letter-spacing: -0.02em;
      font-variant-numeric: tabular-nums;
      line-height: 1.1;
    }
    .rq-quote-note {
      font-size: 10.5px;
      opacity: 0.75;
      margin-top: 6px;
    }

    .rq-summary {
      padding: 14px 16px;
      border-radius: 12px;
      background: var(--bg-soft, #f5f7fb);
      border: 1px solid var(--border, rgba(0,0,0,0.07));
      margin-bottom: 16px;
    }
    [data-theme="dark"] .rq-summary {
      background: #161b22;
      border-color: rgba(255,255,255,0.07);
    }
    .rq-summary-name {
      font-size: 13.5px; font-weight: 800; color: var(--txt-hi);
      margin-bottom: 8px;
    }
    .rq-summary-rows {
      display: flex; flex-wrap: wrap; gap: 4px 12px;
      font-size: 11.5px; color: var(--txt-mid);
      margin-bottom: 8px;
      line-height: 1.6;
    }
    .rq-summary-rows > span > strong { color: var(--txt-hi); }
    .rq-summary-price {
      display: flex; align-items: center; justify-content: space-between;
      padding-top: 8px;
      border-top: 1px dashed var(--border, rgba(0,0,0,0.10));
      font-size: 12.5px; color: var(--txt-mid); font-weight: 700;
    }
    .rq-summary-price strong {
      font-size: 17px; color: #1a3de8; font-weight: 900;
      font-variant-numeric: tabular-nums;
    }

    .rq-modal { max-width: 580px; }

    /* v2.1.8: 계약조건 헤더 + 고정 제공 블록 */
    .rq-section-head {
      display: flex; align-items: center; gap: 8px;
      margin: 4px 0 10px;
      padding: 8px 0 6px;
      border-bottom: 1.5px solid var(--border, rgba(0,0,0,0.10));
    }
    .rq-section-icon { font-size: 16px; line-height: 1; }
    .rq-section-title {
      font-size: 14px; font-weight: 800; letter-spacing: -0.01em;
      color: var(--txt-hi);
    }
    .rq-fixed-grid {
      display: grid; grid-template-columns: 1fr 1fr; gap: 8px;
      margin-bottom: 4px;
    }
    .rq-fixed-row {
      display: flex; flex-direction: column; gap: 2px;
      padding: 10px 12px;
      background: linear-gradient(135deg, rgba(16,185,129,0.06), rgba(79,109,240,0.04));
      border: 1px solid rgba(16,185,129,0.18);
      border-radius: 10px;
    }
    .rq-fixed-label {
      font-size: 10.5px; font-weight: 700;
      color: #10b981; letter-spacing: 0.04em;
    }
    .rq-fixed-val {
      font-size: 13.5px; font-weight: 800; color: var(--txt-hi);
    }
    [data-theme="dark"] .rq-fixed-row {
      background: linear-gradient(135deg, rgba(16,185,129,0.10), rgba(79,109,240,0.07));
      border-color: rgba(16,185,129,0.28);
    }
    @media (max-width: 480px) {
      .rq-fixed-grid { grid-template-columns: 1fr; }
    }

    /* 보증/선납 input — sm-field 안 input 스타일 그대로 사용됨 */
    #rq-deposit-input {
      width: 100%;
      padding: 10px 12px;
      border: 1.5px solid var(--border, rgba(0,0,0,0.12));
      border-radius: 10px;
      font-size: 13.5px; font-family: inherit;
      background: var(--bg-card, #fff); color: var(--txt-hi);
      box-sizing: border-box;
    }
    #rq-deposit-input:focus {
      outline: none; border-color: #1a3de8;
      box-shadow: 0 0 0 3px rgba(26,61,232,0.12);
    }

    @media (max-width: 480px) {
      .rq-vehicle-thumb { width: 72px; height: 54px; font-size: 24px; }
      .rq-vehicle-name { font-size: 13.5px; }
      .rq-chip { padding: 7px 12px; font-size: 11.5px; }
      .rq-quote-amount { font-size: 26px; }
    }

    /* v2.1.10: 명함 업로드 (견적 모달 Step 2) */
    .rq-card-upload {
      display: flex; align-items: center; gap: 12px;
      padding: 14px 16px;
      border: 1.5px dashed rgba(26,61,232,0.30);
      border-radius: 12px;
      background: linear-gradient(135deg, rgba(26,61,232,0.04), rgba(159,122,234,0.04));
      cursor: pointer;
      transition: all .15s;
    }
    .rq-card-upload:hover {
      border-color: #1a3de8;
      background: linear-gradient(135deg, rgba(26,61,232,0.08), rgba(159,122,234,0.08));
    }
    .rq-card-upload-icon { font-size: 28px; flex-shrink: 0; }
    .rq-card-upload-text { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
    .rq-card-upload-main { font-size: 13px; font-weight: 700; color: var(--txt-hi); }
    .rq-card-upload-sub { font-size: 11px; color: var(--txt-lo); }
    .rq-card-preview-box {
      position: relative;
      display: inline-block;
      border-radius: 10px;
      border: 1px solid var(--border, rgba(0,0,0,0.10));
      overflow: hidden;
      background: var(--bg-soft, #f5f7fb);
    }
    .rq-card-preview-clear {
      position: absolute;
      top: 6px; right: 6px;
      width: 24px; height: 24px;
      border-radius: 50%;
      border: none;
      background: rgba(220,38,38,0.92);
      color: #fff;
      font-size: 13px; font-weight: 700;
      cursor: pointer;
      box-shadow: 0 2px 8px rgba(0,0,0,0.25);
      display: flex; align-items: center; justify-content: center;
      line-height: 1;
    }
    .rq-card-preview-clear:hover { background: #dc2626; }
    .rq-card-preview-name {
      font-size: 11.5px; color: var(--txt-mid);
      margin-top: 4px;
    }
    [data-theme="dark"] .rq-card-upload {
      background: linear-gradient(135deg, rgba(124,158,255,0.06), rgba(167,139,250,0.06));
      border-color: rgba(124,158,255,0.30);
    }

    .sm-time-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 6px;
    }
    .sm-time-btn {
      padding: 8px 6px; border-radius: 8px;
      border: 1.5px solid var(--border, rgba(0,0,0,0.12));
      background: var(--bg-card, #fff);
      color: var(--txt-mid);
      font-size: 12px; font-weight: 600;
      cursor: pointer;
      transition: all .12s;
    }
    .sm-time-btn:hover { border-color: #1a3de8; color: #1a3de8; }
    .sm-time-btn.active {
      background: #1a3de8; color: #fff;
      border-color: #1a3de8;
    }
    [data-theme="dark"] .sm-time-btn {
      background: #161b22;
      color: #e6edf3;
      border-color: rgba(255,255,255,0.12);
    }
    @media (max-width: 480px) {
      .sm-time-grid { grid-template-columns: repeat(2, 1fr); }
    }

    .sm-overlay {
      display: none;
      position: fixed; inset: 0;
      background: rgba(8,15,48,0.6);
      backdrop-filter: blur(4px);
      z-index: 10500;
      align-items: center; justify-content: center;
      padding: 16px;
      overflow-y: auto;
    }
    .sm-overlay.open { display: flex; }
    .sm-modal {
      background: var(--bg-card, #fff);
      border-radius: 18px;
      max-width: 540px; width: 100%;
      max-height: calc(100dvh - 32px);
      overflow-y: auto;
      box-shadow: 0 24px 72px rgba(0,0,0,0.35);
      position: relative;
    }
    .sm-head {
      padding: 22px 24px 14px;
      border-bottom: 1px solid var(--border, rgba(0,0,0,0.06));
      display: flex; align-items: center; justify-content: space-between;
    }
    .sm-title { font-size: 17px; font-weight: 700; color: var(--txt-hi); margin: 0; }
    .sm-close {
      background: transparent; border: none; cursor: pointer;
      font-size: 20px; color: var(--txt-lo); padding: 4px 8px; border-radius: 8px;
    }
    .sm-close:hover { background: rgba(0,0,0,0.06); color: var(--txt-hi); }
    .sm-body { padding: 20px 24px 24px; }
    .sm-step { display: none; }
    .sm-step.active { display: block; }
    /* v2.124.0: 선착순 무료 공고 프로모 광고 배너 (모달 최상단 히어로 — 프로모 활성 시 JS가 노출) */
    .sm-free-banner {
      display: none;               /* 기본 숨김 — 프로모 잔여분이 있을 때만 JS가 표시 */
      position: relative;
      overflow: hidden;
      margin: 0 0 12px;
      padding: 14px 15px;
      border-radius: 12px;
      background: linear-gradient(120deg, #1a3de8 0%, #7c3aed 52%, #db2777 100%);
      box-shadow: 0 6px 18px rgba(124,58,237,0.28);
      color: #fff;
    }
    .sm-free-banner::after {
      content: "";
      position: absolute; inset: 0; z-index: 0;
      background: linear-gradient(100deg, transparent 32%, rgba(255,255,255,0.24) 48%, transparent 64%);
      transform: translateX(-120%);
      animation: smFreeShine 3.8s ease-in-out infinite;
      pointer-events: none;
    }
    .sm-free-inner { position: relative; z-index: 1; }
    .sm-free-badge {
      display: inline-flex; align-items: center; gap: 6px;
      padding: 3px 10px; border-radius: 999px;
      background: rgba(255,255,255,0.22);
      font-size: 10.5px; font-weight: 800; letter-spacing: 0.02em;
    }
    .sm-free-dot {
      width: 6px; height: 6px; border-radius: 50%; background: #4ade80;
      box-shadow: 0 0 0 0 rgba(74,222,128,0.7);
      animation: smFreePulse 1.8s ease-out infinite;
    }
    .sm-free-title { display: block; margin-top: 8px; font-size: 15.5px; font-weight: 850; line-height: 1.3; }
    .sm-free-sub { display: block; margin-top: 5px; font-size: 11.5px; font-weight: 650; color: rgba(255,255,255,0.94); line-height: 1.5; }
    .sm-free-sub b { font-weight: 850; }
    .sm-free-strike { text-decoration: line-through; opacity: 0.72; font-weight: 700; }
    @keyframes smFreeShine { 0%, 58% { transform: translateX(-120%); } 100% { transform: translateX(120%); } }
    @keyframes smFreePulse {
      0% { box-shadow: 0 0 0 0 rgba(74,222,128,0.6); }
      70% { box-shadow: 0 0 0 7px rgba(74,222,128,0); }
      100% { box-shadow: 0 0 0 0 rgba(74,222,128,0); }
    }
    @media (prefers-reduced-motion: reduce) {
      .sm-free-banner::after { animation: none; display: none; }
      .sm-free-dot { animation: none; }
    }

    .sm-event-banner {
      margin: 0 0 12px;
      padding: 11px 13px;
      border-radius: 10px;
      background: linear-gradient(135deg, rgba(219,39,119,0.14), rgba(245,158,11,0.14));
      border: 1px solid rgba(219,39,119,0.30);
      color: var(--txt-hi, #0f172a);
      line-height: 1.45;
    }
    .sm-event-banner strong {
      display: block;
      font-size: 13px;
      font-weight: 850;
      letter-spacing: 0;
    }
    .sm-event-banner span {
      display: block;
      margin-top: 3px;
      font-size: 11.5px;
      font-weight: 650;
      color: var(--txt-mid, #475569);
    }
    .sm-field { margin-bottom: 14px; }
    .sm-field label {
      display: block;
      font-size: 12.5px; font-weight: 600;
      color: var(--txt-mid); margin-bottom: 6px;
    }
    .sm-field label .req { color: #e11d48; }
    .sm-field input[type="text"], .sm-field input[type="tel"], .sm-field textarea {
      width: 100%;
      padding: 10px 12px;
      border: 1.5px solid var(--border, rgba(0,0,0,0.12));
      border-radius: 10px;
      font-size: 13.5px; font-family: inherit;
      background: var(--bg-card, #fff); color: var(--txt-hi);
      box-sizing: border-box;
    }
    .sm-field input:focus, .sm-field textarea:focus {
      outline: none; border-color: #1a3de8;
      box-shadow: 0 0 0 3px rgba(26,61,232,0.12);
    }
    .sm-field textarea { min-height: 110px; resize: vertical; line-height: 1.55; }
    .sm-file-wrap {
      position: relative;
      border: 1.5px dashed var(--border, rgba(0,0,0,0.12));
      border-radius: 10px;
      padding: 14px; text-align: center; cursor: pointer;
      font-size: 12.5px; color: var(--txt-lo);
    }
    .sm-file-wrap input[type="file"] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
    .sm-file-name { color: var(--txt-hi); font-weight: 600; }
    .sm-actions { display: flex; gap: 10px; margin-top: 18px; flex-wrap: wrap; }
    .sm-btn {
      flex: 1; padding: 12px 16px; border-radius: 10px; border: none;
      font-size: 14px; font-weight: 700; cursor: pointer; min-width: 130px;
    }
    .sm-btn-primary { background: linear-gradient(135deg, #1a3de8, #db2777); color: #fff; }
    .sm-btn-primary:hover { transform: translateY(-1px); }
    .sm-btn-primary:disabled { opacity: 0.6; cursor: not-allowed; transform: none; }
    .sm-btn-secondary { background: var(--bg-soft, #f1f3f9); color: var(--txt-mid); }
    .sm-status { margin-top: 10px; font-size: 12.5px; color: var(--txt-lo); min-height: 18px; }
    .sm-status.error { color: #e11d48; font-weight: 600; }
    .sm-status.success { color: #059669; font-weight: 600; }
    .sm-pay-box {
      background: linear-gradient(135deg, rgba(26,61,232,0.06), rgba(219,39,119,0.06));
      border: 1.5px solid rgba(26,61,232,0.18);
      border-radius: 14px;
      padding: 20px 18px; margin-bottom: 14px;
    }
    .sm-pay-box h4 { margin: 0 0 12px; font-size: 15px; color: var(--txt-hi); }
    .sm-pay-row {
      display: flex; align-items: center; justify-content: space-between;
      padding: 10px 0;
      border-bottom: 1px dashed rgba(0,0,0,0.08);
      gap: 10px;
    }
    .sm-pay-row:last-of-type { border-bottom: none; }
    .sm-pay-label { font-size: 12px; color: var(--txt-lo); font-weight: 600; }
    .sm-pay-val { font-size: 14.5px; color: var(--txt-hi); font-weight: 700; font-variant-numeric: tabular-nums; text-align: right; }
    .sm-pay-amount { color: #db2777; font-size: 18px; }
    .sm-promo-free { text-decoration: line-through; color: #94a3b8; }
    .sm-promo-note { display: block; margin-top: 2px; font-size: 11px; color: var(--txt-lo); font-weight: 600; }
    .sm-copy-btn {
      margin-left: 8px;
      padding: 4px 10px;
      font-size: 11px; font-weight: 700;
      background: #fff; color: #1a3de8;
      border: 1px solid #1a3de8; border-radius: 6px; cursor: pointer;
    }
    .sm-copy-btn.copied { background: #059669; color: #fff; border-color: #059669; }
    .sm-pay-warn {
      margin-top: 12px;
      padding: 10px 12px;
      background: rgba(245,158,11,0.1);
      border-left: 3px solid #f59e0b;
      border-radius: 6px;
      font-size: 12px; color: var(--txt-hi); line-height: 1.55;
    }
    .sm-done-icon { font-size: 56px; text-align: center; margin-bottom: 12px; }
    .sm-done-title {
      text-align: center; font-size: 17px; font-weight: 700;
      color: var(--txt-hi); margin-bottom: 12px;
    }
    .sm-done-msg {
      text-align: center; font-size: 13.5px; line-height: 1.65;
      color: var(--txt-mid); margin-bottom: 8px;
    }
    [data-theme="dark"] .sm-modal { background: #1a1d2b; }
    [data-theme="dark"] .sm-event-banner {
      background: linear-gradient(135deg, rgba(219,39,119,0.20), rgba(245,158,11,0.16));
      border-color: rgba(244,114,182,0.38);
    }
    [data-theme="dark"] .sm-field input,
    [data-theme="dark"] .sm-field textarea {
      background: #0f1119; color: #e5e7eb; border-color: rgba(255,255,255,0.12);
    }

    /* v2.0.3: 커뮤니티 fallback toast */
    .comm-fallback-toast {
      position: fixed; left: 50%; bottom: 24px;
      transform: translateX(-50%) translateY(20px);
      background: rgba(20,24,40,0.96);
      color: #fff;
      padding: 14px 18px; border-radius: 14px;
      max-width: 360px; width: calc(100vw - 32px);
      box-shadow: 0 12px 40px rgba(0,0,0,0.35);
      z-index: 9999;
      font-size: 13px; line-height: 1.5;
      opacity: 0; pointer-events: none;
      transition: opacity .25s ease, transform .25s ease;
    }
    .comm-fallback-toast.show {
      opacity: 1;
      transform: translateX(-50%) translateY(0);
      pointer-events: auto;
    }
    .comm-fallback-toast strong { color: #ffd54a; }
    .comm-fallback-toast a { color: #7ec9ff; text-decoration: underline; font-weight: 600; }
    .comm-fallback-toast .cft-close {
      position: absolute; top: 6px; right: 8px;
      background: transparent; border: none;
      color: #aaa; font-size: 16px; cursor: pointer; line-height: 1;
    }

    /* ══════════════════════════════
       카드뉴스 대시보드 (타일)
    ══════════════════════════════ */
    .cn-dash-head {
      display: flex;
      align-items: baseline;
      gap: 12px;
      margin-bottom: 16px;
    }
    .cn-tile-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
      gap: 14px;
      margin-bottom: 8px;
    }
    .cn-tile {
      position: relative;
      display: block;
      background: var(--bg-card);
      border: 1.5px solid var(--border);
      border-radius: var(--radius);
      overflow: hidden;
      cursor: pointer;
      box-shadow: var(--sh-sm);
      transition: transform .3s cubic-bezier(0.34,1.56,0.64,1),
                  box-shadow .28s ease,
                  border-color .25s ease;
      text-align: left;
      padding: 0;
      font: inherit;
      color: inherit;
    }
    .cn-tile:hover {
      transform: translateY(-4px);
      border-color: var(--blue-light);
      box-shadow: var(--sh-lg);
    }
    .cn-tile-thumb {
      width: 100%;
      aspect-ratio: 4 / 3;
      background: linear-gradient(135deg, #e8eeff, #f5f8ff);
      overflow: hidden;
      display: flex;
      align-items: center;
      justify-content: center;
      position: relative;
    }
    .cn-tile-thumb img {
      width: 100%; height: 100%;
      object-fit: cover;
      -webkit-user-drag: none;
      -webkit-user-select: none;
      user-select: none;
      pointer-events: none;
    }
    .cn-tile-thumb .cn-tile-fallback {
      font-size: 42px; color: var(--blue-light);
    }
    .cn-tile-count {
      position: absolute;
      top: 10px; right: 10px;
      background: rgba(12,31,184,0.9);
      color: #fff;
      font-family: 'Pretendard', sans-serif;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.05em;
      padding: 4px 10px;
      border-radius: 100px;
      backdrop-filter: blur(6px);
    }
    .cn-tile-body {
      padding: 14px 16px 16px;
    }
    .cn-tile-title {
      font-size: 14px;
      font-weight: 700;
      color: var(--txt-hi);
      line-height: 1.35;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
      margin-bottom: 6px;
      word-break: keep-all;
    }
    .cn-tile-date {
      font-family: 'Pretendard', sans-serif;
      font-size: 10px;
      color: var(--txt-lo);
      letter-spacing: 0.08em;
    }
    @media (max-width: 768px) {
      .cn-tile-grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
    }

    /* ══════════════════════════════
       카드뉴스 모달 (팝업 캐러셀)
    ══════════════════════════════ */
    .cn-modal {
      display: none;
      position: fixed;
      inset: 0;
      background: rgba(8,15,48,0.78);
      backdrop-filter: blur(4px);
      z-index: 10001;
      justify-content: center;
      align-items: center;
      padding: 24px;
    }
    .cn-modal.open { display: flex; }
    .cn-modal-body {
      position: relative;
      width: min(960px, 100%);
      max-height: 92vh;
      overflow-y: auto;
      background: #fff;
      border-radius: 18px;
      padding: 22px;
      box-shadow: 0 30px 80px rgba(0,0,0,0.5);
    }
    .cn-modal-close {
      position: absolute;
      top: 12px; right: 12px;
      width: 36px; height: 36px;
      border-radius: 50%;
      background: var(--bg);
      border: 1.5px solid var(--border);
      color: var(--txt-mid);
      font-size: 16px;
      cursor: pointer;
      display: flex; align-items: center; justify-content: center;
      transition: background .2s, color .2s;
      z-index: 3;
    }
    .cn-modal-close:hover { background: #ef4444; color: #fff; border-color: #ef4444; }

    /* 공유 버튼 (상단 링크 복사) */
    .cn-share-btn {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 7px 12px;
      border-radius: 999px;
      border: 1.5px solid var(--border);
      background: #e6ecff;
      color: var(--blue-mid);
      font-size: 12px;
      font-weight: 600;
      cursor: pointer;
      transition: transform 0.15s ease, background 0.15s ease, border-color 0.15s ease;
    }
    .cn-share-btn:hover {
      transform: translateY(-1px);
      background: #d5defd;
      border-color: rgba(26,61,232,0.28);
    }
    .cn-share-top { margin-left: auto; }
    .cn-share-btn.copied {
      background: #dcfce7;
      border-color: #16a34a;
      color: #15803d;
    }
    .cn-share-btn.copy-fail {
      background: #fee2e2;
      border-color: #dc2626;
      color: #b91c1c;
    }
    .cn-share-toast {
      position: fixed;
      left: 50%; bottom: 48px;
      transform: translate(-50%, 12px);
      background: #15803d;
      color: #fff;
      padding: 12px 22px;
      border-radius: 999px;
      font-size: 14px;
      font-weight: 600;
      letter-spacing: 0.01em;
      box-shadow: 0 10px 32px rgba(22,163,74,0.35);
      z-index: 10002;
      opacity: 0;
      transition: opacity 0.25s ease, transform 0.25s ease;
      pointer-events: none;
    }
    .cn-share-toast.show { opacity: 1; transform: translate(-50%, 0); }

    /* 캐러셀 내부 */
    .cn-wrap {
      margin-bottom: 0;
    }
    .cn-head {
      display: flex;
      align-items: center;
      gap: 12px;
      margin-bottom: 14px;
      padding-right: 52px; /* 닫기(✕) 버튼과 겹치지 않도록 여백 확보 */
      flex-wrap: wrap;
    }
    .cn-title-txt {
      font-family: 'Pretendard', sans-serif;
      font-size: 18px;
      font-weight: 700;
      letter-spacing: -0.01em;
      color: var(--txt-hi);
      padding-left: 10px;
      border-left: 4px solid var(--blue-mid);
      line-height: 1.2;
    }
    .cn-sub {
      font-family: 'Pretendard', sans-serif;
      font-size: 10px;
      color: var(--txt-lo);
      letter-spacing: 0.1em;
    }
    .cn-stage {
      position: relative;
      background: linear-gradient(135deg, #ffffff 0%, #f5f8ff 100%);
      border: 1.5px solid var(--border);
      border-radius: 18px;
      padding: 22px;
      box-shadow: var(--sh-md);
      overflow: hidden;
    }
    .cn-viewport {
      position: relative;
      width: 100%;
      aspect-ratio: 4 / 3;
      max-height: 540px;
      overflow: hidden;
      border-radius: 12px;
      background: #f0f3fa;
      /* v2.40.0: 모달 내부 전용 줌을 위해 네이티브 터치 제스처를 JS가 전담(핀치/팬/스와이프) */
      touch-action: none;
    }
    .cn-track {
      display: flex;
      height: 100%;
      width: 100%;
      transition: transform .45s cubic-bezier(0.22,0.61,0.36,1);
    }
    .cn-slide {
      flex: 0 0 100%;
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 0;
      background: #f0f3fa;
    }
    .cn-slide img {
      max-width: 100%;
      max-height: 100%;
      object-fit: contain;
      border-radius: 10px;
      user-select: none;
      -webkit-user-drag: none;
      cursor: zoom-in;
      transform-origin: center center;
      transition: transform .18s cubic-bezier(0.22,0.61,0.36,1);
      /* v2.41.0: will-change:transform 제거 — 이 속성이 이미지를 저해상도 래스터로 레이어에 고정해
         줌 시 원본(3200px 고화질)에서 재래스터되지 못하고 뿌옇게 보였음. 제거하면 정지 줌에서
         브라우저가 원본 해상도로 다시 렌더 → 선명. (image-rendering 기본=auto 고품질 보간) */
    }
    /* v2.40.0: 카드뉴스 모달 내부 줌(핀치/더블탭/휠/＋－버튼/드래그팬). position:fixed 모달이라
       네이티브 핀치줌이 내용을 확대 못하던 문제 해결. 이미지에만 transform → 복사방지 guard는 유지. */
    .cn-slide img.cn-zoomed  { cursor: grab; }
    .cn-slide img.cn-grabbing { cursor: grabbing; transition: none; }
    .cn-zoom-ctrl {
      position: absolute;
      right: 14px; bottom: 14px;
      z-index: 4;
      display: none;
      flex-direction: column;
      gap: 6px;
    }
    .cn-modal.open .cn-zoom-ctrl { display: flex; }
    .cn-zoom-ctrl button {
      width: 40px; height: 40px;
      border-radius: 11px;
      background: rgba(255,255,255,0.96);
      border: 1.5px solid var(--border);
      color: var(--blue-mid);
      font-size: 20px; font-weight: 800; line-height: 1;
      cursor: pointer;
      display: flex; align-items: center; justify-content: center;
      box-shadow: 0 4px 14px rgba(12,31,184,0.18);
      transition: background .15s, color .15s, transform .15s, opacity .15s;
    }
    .cn-zoom-ctrl button:hover:not(:disabled) { background: var(--blue-mid); color: #fff; transform: translateY(-1px); }
    .cn-zoom-ctrl button:disabled { opacity: .38; cursor: not-allowed; }
    [data-theme="dark"] .cn-zoom-ctrl button { background: #21262d; color: #58a6ff; border-color: rgba(255,255,255,0.12); }
    .cn-zoom-hint {
      position: absolute;
      left: 50%; bottom: 14px;
      transform: translateX(-50%);
      z-index: 4;
      background: rgba(8,15,48,0.62);
      color: #fff;
      font-size: 11.5px; font-weight: 600; letter-spacing: .02em;
      padding: 6px 12px;
      border-radius: 999px;
      pointer-events: none;
      opacity: 0;
      transition: opacity .35s;
      white-space: nowrap;
    }
    .cn-zoom-hint.show { opacity: 1; }
    .cn-slide iframe {
      width: 100%;
      height: 100%;
      border: none;
      border-radius: 10px;
      background: #fff;
    }
    /* 복사/캡처 방지 오버레이 */
    .cn-slide { position: relative; }
    .cn-guard {
      position: absolute;
      inset: 0;
      border-radius: 10px;
      pointer-events: auto;
      -webkit-user-select: none;
      user-select: none;
      background-image:
        repeating-linear-gradient(
          -30deg,
          rgba(26,61,232,0.06) 0 2px,
          transparent 2px 180px
        ),
        radial-gradient(circle at 20% 20%, rgba(26,61,232,0.04), transparent 40%),
        radial-gradient(circle at 80% 80%, rgba(26,61,232,0.04), transparent 40%);
      mix-blend-mode: multiply;
    }
    .cn-guard::before {
      content: "INSURECONNECT · 복사·캡처 금지";
      position: absolute;
      inset: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      font-family: 'Pretendard', sans-serif;
      font-size: clamp(14px, 2vw, 22px);
      font-weight: 700;
      color: rgba(26,61,232,0.10);
      transform: rotate(-24deg);
      letter-spacing: 0.12em;
      white-space: nowrap;
      pointer-events: none;
    }
    /* 선택/드래그 완전 차단 */
    .cn-modal, .cn-modal * {
      -webkit-user-select: none !important;
      -moz-user-select: none !important;
      -ms-user-select: none !important;
      user-select: none !important;
      -webkit-user-drag: none;
      -webkit-touch-callout: none;
    }
    .cn-nav {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      width: 44px; height: 44px;
      border-radius: 50%;
      background: rgba(255,255,255,0.95);
      border: 1.5px solid var(--border);
      color: var(--blue-mid);
      font-size: 18px;
      font-weight: 700;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 6px 20px rgba(12,31,184,0.16);
      transition: transform .2s, background .2s;
      z-index: 2;
    }
    .cn-nav:hover { background: var(--blue-mid); color: #fff; transform: translateY(-50%) scale(1.08); }
    .cn-nav:disabled { opacity: 0.35; cursor: not-allowed; transform: translateY(-50%); background: rgba(255,255,255,0.95); color: var(--txt-lo); }
    .cn-prev { left: 32px; }
    .cn-next { right: 32px; }

    .cn-footer {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      margin-top: 14px;
      flex-wrap: wrap;
    }
    .cn-dots {
      display: flex;
      gap: 6px;
      flex-wrap: wrap;
    }
    .cn-dot {
      width: 9px; height: 9px;
      border-radius: 50%;
      background: rgba(12,31,184,0.18);
      cursor: pointer;
      transition: background .2s, transform .2s;
      border: none;
      padding: 0;
    }
    .cn-dot.active {
      background: var(--blue-mid);
      transform: scale(1.25);
    }
    .cn-counter {
      font-family: 'Pretendard', sans-serif;
      font-size: 12px;
      color: var(--txt-mid);
      letter-spacing: 0.1em;
    }
    .cn-set-switcher {
      display: flex;
      gap: 6px;
      flex-wrap: wrap;
    }
    .cn-set-btn {
      font-family: 'Pretendard', sans-serif;
      font-size: 11px;
      font-weight: 500;
      color: var(--txt-mid);
      background: #fff;
      border: 1.5px solid var(--border);
      border-radius: 100px;
      padding: 5px 12px;
      cursor: pointer;
      transition: all .2s;
    }
    .cn-set-btn:hover { border-color: var(--blue-light); color: var(--blue-mid); }
    .cn-set-btn.active {
      background: linear-gradient(135deg, var(--blue-mid), var(--cyan));
      color: #fff;
      border-color: transparent;
    }

    /* v2.42.0: 전산 「최근 사용」 칩 (매일 진입 습관) */
    #sec-recent-jeonsan .section-head { margin-bottom: 12px; }
    .rj-clear { margin-left: auto; background: none; border: none; color: var(--txt-lo); font-size: 12px; cursor: pointer; padding: 4px 6px; }
    .rj-clear:hover { color: var(--blue-mid); text-decoration: underline; }
    .rj-row { display: flex; gap: 10px; flex-wrap: wrap; }
    .rj-chip {
      display: inline-flex; align-items: center; gap: 8px;
      padding: 9px 14px 9px 10px;
      background: var(--bg-card); border: 1.5px solid var(--border); border-radius: 12px;
      cursor: pointer; text-decoration: none; color: var(--txt-hi);
      font-size: 13.5px; font-weight: 700; box-shadow: var(--sh-sm);
      transition: border-color .15s, transform .15s, box-shadow .15s;
    }
    .rj-chip:hover { border-color: var(--blue-mid); transform: translateY(-1px); box-shadow: var(--sh-md); }
    .rj-chip img { width: 22px; height: 22px; border-radius: 6px; object-fit: contain; background: #fff; }
    .rj-chip .rj-fallback { width: 22px; height: 22px; border-radius: 6px; display: flex; align-items: center; justify-content: center; font-size: 10px; font-weight: 800; color: #fff; background: var(--blue-mid); }
    .rj-chip .rj-arrow { color: var(--txt-lo); font-size: 12px; }

    /* v2.43.0: 내 고객 (미니 CRM) */
    .cl-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:16px; flex-wrap:wrap; }
    .cl-title { font-size:1.15rem; font-weight:800; color:var(--txt-hi); }
    .cl-sub { font-size:12.5px; color:var(--txt-mid); margin-top:4px; line-height:1.5; }
    .cl-add-btn { background:linear-gradient(135deg,var(--blue-mid),var(--cyan)); color:#fff; border:none; border-radius:10px; padding:10px 16px; font-size:14px; font-weight:800; cursor:pointer; white-space:nowrap; box-shadow:0 4px 14px rgba(26,61,232,.28); }
    .cl-add-btn:hover { transform:translateY(-1px); }
    .cl-gate { background:var(--bg-card); border:1.5px solid var(--border); border-radius:14px; padding:24px; text-align:center; }
    .cl-gate p { color:var(--txt-mid); font-size:14px; margin-bottom:14px; line-height:1.6; }
    .cl-gate-btn { display:inline-block; background:#FEE500; color:#191600; font-weight:800; padding:11px 20px; border-radius:10px; text-decoration:none; }
    .cl-renew-banner { background:linear-gradient(135deg,rgba(245,158,11,.12),rgba(239,68,68,.10)); border:1.5px solid rgba(245,158,11,.35); color:#b45309; border-radius:12px; padding:12px 16px; font-size:13.5px; font-weight:700; margin-bottom:14px; }
    [data-theme="dark"] .cl-renew-banner { color:#fbbf24; }
    .cl-form-wrap { background:var(--bg-card); border:1.5px solid var(--border); border-radius:14px; padding:16px; margin-bottom:16px; box-shadow:var(--sh-sm); }
    .cl-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
    .cl-f { display:flex; flex-direction:column; gap:5px; font-size:12px; font-weight:700; color:var(--txt-mid); }
    .cl-f-wide { grid-column:1 / -1; }
    .cl-req { color:#ef4444; }
    .cl-f input, .cl-f textarea { font-family:inherit; font-size:14px; color:var(--txt-hi); background:var(--bg); border:1.5px solid var(--border); border-radius:9px; padding:9px 11px; outline:none; }
    .cl-f input:focus, .cl-f textarea:focus { border-color:var(--blue-mid); }
    .cl-form-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:14px; }
    .cl-btn-ghost { background:none; border:1.5px solid var(--border); color:var(--txt-mid); border-radius:9px; padding:9px 16px; font-size:13.5px; font-weight:700; cursor:pointer; }
    .cl-btn-primary { background:var(--blue-mid); color:#fff; border:none; border-radius:9px; padding:9px 18px; font-size:13.5px; font-weight:800; cursor:pointer; }
    .cl-btn-primary:disabled { opacity:.5; }
    .cl-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:12px; }
    .cl-card { background:var(--bg-card); border:1.5px solid var(--border); border-radius:14px; padding:14px 16px; box-shadow:var(--sh-sm); }
    .cl-card-top { display:flex; align-items:center; gap:8px; justify-content:space-between; }
    .cl-name { font-size:15px; font-weight:800; color:var(--txt-hi); }
    .cl-dday { font-size:11px; font-weight:800; padding:3px 9px; border-radius:999px; white-space:nowrap; }
    .cl-dday.ok { background:rgba(26,61,232,.10); color:var(--blue-mid); }
    .cl-dday.soon { background:rgba(245,158,11,.16); color:#b45309; }
    .cl-dday.over { background:rgba(239,68,68,.14); color:#dc2626; }
    .cl-meta { font-size:12.5px; color:var(--txt-mid); margin-top:5px; font-weight:600; }
    .cl-info { display:flex; flex-wrap:wrap; gap:10px; margin-top:8px; font-size:12.5px; color:var(--txt-mid); }
    .cl-info a { color:var(--blue-mid); text-decoration:none; }
    .cl-memo { font-size:12.5px; color:var(--txt-mid); margin-top:9px; padding-top:9px; border-top:1px dashed var(--border); line-height:1.5; white-space:pre-wrap; word-break:break-word; }
    .cl-card-actions { display:flex; gap:6px; justify-content:flex-end; margin-top:10px; }
    .cl-card-actions button { background:none; border:1px solid var(--border); color:var(--txt-lo); border-radius:8px; padding:5px 12px; font-size:12px; font-weight:700; cursor:pointer; }
    .cl-card-actions button:hover { color:var(--blue-mid); border-color:var(--blue-mid); }
    .cl-card-actions button.del:hover { color:#dc2626; border-color:#dc2626; }
    .cl-empty { text-align:center; color:var(--txt-lo); font-size:14px; padding:40px 20px; line-height:1.7; }
    .cl-share-cta { display:block; margin-top:18px; padding:14px 16px; border-radius:12px; background:linear-gradient(135deg,rgba(26,61,232,.07),rgba(0,200,238,.05)); border:1.5px solid rgba(26,61,232,.2); color:var(--txt-hi); font-size:13px; font-weight:600; text-decoration:none; text-align:center; line-height:1.5; }
    .cl-share-cta:hover { border-color:var(--blue-mid); }
    .cl-share-cta b { color:var(--blue-mid); }
    @media (max-width:480px){ .cl-form-grid{grid-template-columns:1fr;} }

    /* v2.46.0: 현장 인수 Q&A */
    .uw-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:14px; flex-wrap:wrap; }
    .uw-title { font-size:1.15rem; font-weight:800; color:var(--txt-hi); }
    .uw-sub { font-size:12.5px; color:var(--txt-mid); margin-top:4px; line-height:1.5; }
    .uw-ask-btn { background:linear-gradient(135deg,var(--blue-mid),var(--cyan)); color:#fff; border:none; border-radius:10px; padding:10px 16px; font-size:14px; font-weight:800; cursor:pointer; white-space:nowrap; box-shadow:0 4px 14px rgba(26,61,232,.28); }
    .uw-ask-form { background:var(--bg-card); border:1.5px solid var(--border); border-radius:14px; padding:16px; margin-bottom:14px; box-shadow:var(--sh-sm); }
    .uw-ask-grid { display:grid; grid-template-columns:1fr 1.4fr; gap:10px; margin-bottom:10px; }
    .uw-ask-form input, .uw-ask-form textarea { width:100%; font-family:inherit; font-size:14px; color:var(--txt-hi); background:var(--bg); border:1.5px solid var(--border); border-radius:9px; padding:9px 11px; outline:none; }
    .uw-ask-form input:focus, .uw-ask-form textarea:focus { border-color:var(--blue-mid); }
    .uw-ask-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:10px; }
    .uw-btn-ghost { background:none; border:1.5px solid var(--border); color:var(--txt-mid); border-radius:9px; padding:9px 16px; font-size:13.5px; font-weight:700; cursor:pointer; }
    .uw-btn-primary { background:var(--blue-mid); color:#fff; border:none; border-radius:9px; padding:9px 18px; font-size:13.5px; font-weight:800; cursor:pointer; }
    .uw-btn-primary:disabled { opacity:.5; }
    .uw-search-box { margin-bottom:14px; }
    .uw-list { display:flex; flex-direction:column; gap:10px; }
    .uw-card { background:var(--bg-card); border:1.5px solid var(--border); border-radius:14px; padding:14px 16px; box-shadow:var(--sh-sm); }
    .uw-q-head { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
    .uw-ins { font-size:11.5px; font-weight:800; color:var(--blue-mid); background:rgba(26,61,232,.08); padding:3px 9px; border-radius:999px; }
    .uw-topic { font-size:15px; font-weight:800; color:var(--txt-hi); }
    .uw-body { font-size:13px; color:var(--txt-mid); margin-top:6px; line-height:1.5; white-space:pre-wrap; word-break:break-word; }
    .uw-tally { display:flex; align-items:center; gap:8px; margin-top:10px; flex-wrap:wrap; }
    .uw-v { font-size:12px; font-weight:800; padding:3px 9px; border-radius:999px; }
    .uw-v.p { background:rgba(21,128,61,.12); color:#15803d; }
    .uw-v.c { background:rgba(245,158,11,.16); color:#b45309; }
    .uw-v.x { background:rgba(239,68,68,.14); color:#dc2626; }
    .uw-expand { margin-left:auto; background:none; border:1px solid var(--border); color:var(--txt-mid); border-radius:8px; padding:5px 12px; font-size:12px; font-weight:700; cursor:pointer; }
    .uw-expand:hover { color:var(--blue-mid); border-color:var(--blue-mid); }
    .uw-answers { margin-top:12px; padding-top:12px; border-top:1px dashed var(--border); }
    .uw-ans-row { display:flex; align-items:flex-start; gap:8px; padding:6px 0; font-size:13px; flex-wrap:wrap; }
    .uw-ans-v { font-size:11.5px; font-weight:800; padding:2px 8px; border-radius:999px; white-space:nowrap; }
    .uw-ans-v.possible { background:rgba(21,128,61,.12); color:#15803d; }
    .uw-ans-v.conditional { background:rgba(245,158,11,.16); color:#b45309; }
    .uw-ans-v.impossible { background:rgba(239,68,68,.14); color:#dc2626; }
    .uw-ans-note { flex:1; min-width:120px; color:var(--txt-hi); }
    .uw-ans-by { font-size:11.5px; color:var(--txt-lo); }
    .uw-ans-form { margin-top:10px; }
    .uw-verdict-pick { display:flex; gap:6px; margin-bottom:8px; flex-wrap:wrap; }
    .uw-vbtn { border:1.5px solid var(--border); background:var(--bg); border-radius:8px; padding:7px 12px; font-size:12.5px; font-weight:800; cursor:pointer; }
    .uw-vbtn.p { color:#15803d; } .uw-vbtn.p:hover { background:rgba(21,128,61,.1); border-color:#15803d; }
    .uw-vbtn.c { color:#b45309; } .uw-vbtn.c:hover { background:rgba(245,158,11,.12); border-color:#b45309; }
    .uw-vbtn.x { color:#dc2626; } .uw-vbtn.x:hover { background:rgba(239,68,68,.1); border-color:#dc2626; }
    .uw-note-in { width:100%; font-family:inherit; font-size:13px; color:var(--txt-hi); background:var(--bg); border:1.5px solid var(--border); border-radius:8px; padding:8px 11px; outline:none; }
    .uw-note-in:focus { border-color:var(--blue-mid); }
    .uw-empty, .uw-empty-sm, .uw-loading { text-align:center; color:var(--txt-lo); font-size:13.5px; padding:24px 16px; }
    .uw-empty-sm, .uw-loading { padding:10px; font-size:12.5px; }
    @media (max-width:480px){ .uw-ask-grid{grid-template-columns:1fr;} }

    /* v2.48.0: 보장 분석 */
    .cov-head { margin-bottom:14px; }
    .cov-title { font-size:1.15rem; font-weight:800; color:var(--txt-hi); }
    .cov-sub { font-size:12.5px; color:var(--txt-mid); margin-top:4px; line-height:1.5; }
    .cov-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:10px; }
    .cov-item { background:var(--bg-card); border:1.5px solid var(--border); border-radius:12px; padding:12px 14px; box-shadow:var(--sh-sm); }
    .cov-item-label { font-size:13.5px; font-weight:800; color:var(--txt-hi); }
    .cov-item-tip { font-size:11px; color:var(--txt-lo); margin-top:2px; }
    .cov-amt { margin-top:8px; display:flex; align-items:center; gap:6px; }
    .cov-amt input { width:100%; font-family:inherit; font-size:14px; color:var(--txt-hi); background:var(--bg); border:1.5px solid var(--border); border-radius:8px; padding:8px 10px; outline:none; text-align:right; }
    .cov-amt input:focus { border-color:var(--blue-mid); }
    .cov-amt-unit { font-size:12px; color:var(--txt-mid); white-space:nowrap; }
    .cov-has { display:flex; gap:6px; margin-top:8px; }
    .cov-has-btn { flex:1; border:1.5px solid var(--border); background:var(--bg); color:var(--txt-mid); border-radius:8px; padding:7px; font-size:12.5px; font-weight:700; cursor:pointer; }
    .cov-has-btn.on { background:var(--blue-mid); color:#fff; border-color:var(--blue-mid); }
    .cov-actions { display:flex; gap:8px; justify-content:flex-end; margin-top:16px; }
    .cov-reset { background:none; border:1.5px solid var(--border); color:var(--txt-mid); border-radius:10px; padding:11px 18px; font-size:14px; font-weight:700; cursor:pointer; }
    .cov-analyze { background:linear-gradient(135deg,var(--blue-mid),var(--cyan)); color:#fff; border:none; border-radius:10px; padding:11px 24px; font-size:14px; font-weight:800; cursor:pointer; box-shadow:0 4px 14px rgba(26,61,232,.28); }
    .cov-result { margin-top:18px; }
    .cov-score { display:flex; align-items:center; gap:14px; background:var(--bg-card); border:1.5px solid var(--border); border-radius:14px; padding:16px 18px; margin-bottom:14px; box-shadow:var(--sh-sm); }
    .cov-score-num { font-size:30px; font-weight:900; line-height:1; }
    .cov-score-txt { font-size:13px; color:var(--txt-mid); line-height:1.5; }
    .cov-rows { display:flex; flex-direction:column; gap:8px; }
    .cov-row { display:flex; align-items:center; gap:10px; background:var(--bg-card); border:1.5px solid var(--border); border-radius:10px; padding:10px 14px; flex-wrap:wrap; }
    .cov-row-st { font-size:12px; font-weight:800; padding:3px 9px; border-radius:999px; white-space:nowrap; }
    .cov-row-st.ok { background:rgba(21,128,61,.12); color:#15803d; }
    .cov-row-st.low { background:rgba(245,158,11,.16); color:#b45309; }
    .cov-row-st.none { background:rgba(239,68,68,.14); color:#dc2626; }
    .cov-row-label { font-size:13.5px; font-weight:700; color:var(--txt-hi); flex:1; min-width:90px; }
    .cov-row-detail { font-size:12px; color:var(--txt-mid); }
    .cov-summary { margin-top:14px; background:linear-gradient(135deg,rgba(26,61,232,.06),rgba(0,200,238,.05)); border:1.5px solid rgba(26,61,232,.18); border-radius:12px; padding:14px 16px; font-size:13px; color:var(--txt-hi); line-height:1.6; }
    .cov-summary b { color:var(--blue-mid); }
    .cov-disclaimer { margin-top:18px; font-size:11.5px; color:var(--txt-lo); line-height:1.6; }
    .cov-client-bar { background:linear-gradient(135deg,rgba(26,61,232,.08),rgba(0,200,238,.05)); border:1.5px solid rgba(26,61,232,.2); border-radius:12px; padding:11px 14px; margin-bottom:12px; font-size:13px; color:var(--txt-hi); line-height:1.7; }
    .cov-clear-client { background:#fff; border:1px solid var(--border); color:var(--txt-mid); border-radius:7px; padding:3px 10px; font-size:11.5px; font-weight:700; cursor:pointer; }
    [data-theme="dark"] .cov-clear-client { background:#21262d; }
    .cov-save-client { background:#15803d; color:#fff; border:none; border-radius:10px; padding:11px 18px; font-size:14px; font-weight:800; cursor:pointer; box-shadow:0 4px 14px rgba(21,128,61,.25); }
    @media (max-width:480px){ .cov-grid{grid-template-columns:1fr;} }

    /* v2.55.0: 실시간 채팅 */
    .chat-head { margin-bottom:12px; }
    .chat-title { font-size:1.15rem; font-weight:800; color:var(--txt-hi); display:flex; align-items:center; gap:8px; }
    .chat-on { font-size:9px; color:#22c55e; }
    .chat-sub { font-size:12.5px; color:var(--txt-mid); margin-top:4px; }
    .chat-gate { background:var(--bg-card); border:1.5px solid var(--border); border-radius:14px; padding:24px; text-align:center; }
    .chat-gate p { color:var(--txt-mid); font-size:14px; margin-bottom:14px; }
    .chat-gate-btn { display:inline-block; background:#FEE500; color:#191600; font-weight:800; padding:11px 20px; border-radius:10px; text-decoration:none; }
    .chat-log { height:min(58vh,520px); overflow-y:auto; background:var(--bg-card); border:1.5px solid var(--border); border-radius:14px; padding:14px; display:flex; flex-direction:column; gap:9px; }
    .chat-msg { display:flex; gap:8px; align-items:flex-start; max-width:84%; }
    .chat-msg.mine { align-self:flex-end; flex-direction:row-reverse; }
    .chat-ava { width:30px; height:30px; border-radius:50%; background:var(--blue-mid); color:#fff; font-weight:800; font-size:12px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
    .chat-bubble { background:var(--bg); border:1px solid var(--border); border-radius:12px; padding:8px 12px; }
    .chat-msg.mine .chat-bubble { background:var(--blue-mid); border-color:var(--blue-mid); }
    .chat-nick { font-size:11px; font-weight:800; color:var(--blue-mid); margin-bottom:2px; }
    .chat-msg.mine .chat-nick { display:none; }
    .chat-body { font-size:13.5px; color:var(--txt-hi); line-height:1.45; white-space:pre-wrap; word-break:break-word; }
    .chat-msg.mine .chat-body { color:#fff; }
    .chat-body a { color:var(--blue-mid); text-decoration:underline; word-break:break-all; }
    .chat-msg.mine .chat-body a { color:#fff; }
    /* v2.100.0: 자동응답 봇 말풍선 */
    .chat-msg.bot .chat-ava { background:#0f766e; }
    .chat-msg.bot .chat-nick { color:#0f766e; }
    .chat-msg.bot .chat-bubble { background:#ecfdf5; border-color:#99f6e4; }
    [data-theme="dark"] .chat-msg.bot .chat-bubble { background:rgba(13,148,136,.14); border-color:#134e4a; }
    .chat-time { font-size:10px; color:var(--txt-lo); margin-top:3px; }
    .chat-input-bar { display:flex; gap:8px; margin-top:12px; }
    .chat-input-bar input { flex:1; min-width:0; font-family:inherit; font-size:14px; color:var(--txt-hi); background:var(--bg-card); border:1.5px solid var(--border); border-radius:12px; padding:12px 14px; outline:none; }
    .chat-input-bar input:focus { border-color:var(--blue-mid); }
    .chat-input-bar button { background:var(--blue-mid); color:#fff; border:none; border-radius:12px; padding:0 20px; font-size:14px; font-weight:800; cursor:pointer; flex-shrink:0; }
    .chat-empty { text-align:center; color:var(--txt-lo); font-size:13px; padding:30px; margin:auto; }

    @media (max-width: 768px) {
      /* v2.41.0: 가로형 카드뉴스가 화면 폭을 더 쓰도록 패딩 축소 */
      .cn-stage { padding: 8px; }
      .cn-modal-body { padding: 12px 12px 14px; }
      .cn-nav {
        top: auto;
        bottom: 14px;
        width: 34px;
        height: 34px;
        font-size: 14px;
        opacity: .78;
        transform: none;
        background: rgba(255,255,255,0.82);
        backdrop-filter: blur(8px);
        box-shadow: 0 4px 14px rgba(12,31,184,0.12);
      }
      .cn-nav:hover { transform: scale(1.04); }
      .cn-nav:disabled { transform: none; opacity: .28; }
      .cn-prev { left: calc(50% - 44px); }
      .cn-next { left: calc(50% + 10px); right: auto; }
      /* v2.41.0: 가로형(16:9) 카드뉴스가 세로(3:4) 박스에 갇혀 얇은 띠로 작아지던 문제 해결 →
         가로 박스로 바꿔 화면 폭을 꽉 채움. 세부 글씨는 핀치/더블탭 줌(고화질·최대 6배)으로 확대. */
      .cn-viewport { aspect-ratio: 16 / 9; max-height: 82vh; }
      .cn-footer { padding-bottom: 48px; }
    }

    /* Ripple */
    .ripple {
      position: absolute; border-radius: 50%;
      transform: scale(0);
      animation: rippleAnim .55s linear forwards;
      background: rgba(26,61,232,0.08);
      pointer-events: none;
    }
    @keyframes rippleAnim { to { transform:scale(4); opacity:0; } }

    .card.hidden { display: none; }

    /* 뒤로가기 바 */
    .back-bar {
      flex-shrink: 0;
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 0 32px;
      height: 40px;
      background: var(--bg-card);
      border-bottom: 1px solid var(--border);
    }
    .back-btn {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-size: 13px;
      font-weight: 600;
      color: var(--blue-mid);
      background: none;
      border: none;
      cursor: pointer;
      padding: 4px 10px;
      border-radius: 8px;
      transition: background 0.15s;
      white-space: nowrap;
    }
    .back-btn:hover { background: rgba(26,61,232,0.08); }
    .back-btn svg { width: 14px; height: 14px; stroke: var(--blue-mid); flex-shrink: 0; }
    .back-bar-sep { font-size: 13px; color: var(--border); }
    .back-bar-title {
      font-size: 13px;
      font-weight: 600;
      color: var(--txt-mid);
    }
    @media (max-width: 768px) {
      .back-bar { padding: 0 16px; }
    }

    /* Footer */
    footer {
      flex-shrink: 0;
      max-width: 1360px;
      width: 100%;
      margin: 0 auto;
      padding: 0 32px 20px;
    }
    .foot-inner {
      border-top: 1.5px solid var(--border);
      padding-top: 14px;
      display: flex;
      align-items: center;
      gap: 18px;
      flex-wrap: wrap;
    }
    .foot-logo {
      max-width: 120px;
      height: auto;
      opacity: 0.65;
      display: block;
      transition: opacity 0.2s;
      flex-shrink: 0;
    }
    .foot-logo:hover { opacity: 1; }

    /* 오른쪽 텍스트 묶음 */
    .foot-right {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 4px;
      text-align: right;
    }
    /* 정책 링크 네비 */
    .foot-links {
      display: inline-flex;
      align-items: center;
      flex-wrap: wrap;
      justify-content: flex-end;
      gap: 0 2px;
    }
    .foot-links a {
      font-size: 12.5px;
      font-weight: 600;
      color: var(--txt-mid);
      text-decoration: none;
      padding: 3px 7px;
      border-radius: 6px;
      transition: color 0.15s, background 0.15s;
    }
    .foot-links a:hover {
      color: var(--blue-mid);
      background: rgba(26,61,232,0.06);
    }
    .foot-note {
      font-size: 11px;
      color: var(--txt-lo);
      line-height: 1.5;
      margin: 0;
    }
    .foot-info {
      display: flex;
      align-items: center;
      gap: 10px;
      flex-wrap: wrap;
      justify-content: flex-end;
    }
    .foot-info span,
    .foot-info a {
      font-size: 11.5px;
      color: var(--txt-lo);
      text-decoration: none;
      white-space: nowrap;
      transition: color 0.15s;
    }
    .foot-info a:hover { color: var(--blue-mid); }
    .foot-sep {
      font-size: 11px;
      color: var(--border);
      user-select: none;
    }

    @media (max-width: 640px) {
      .foot-inner {
        flex-direction: column;
        align-items: center;
        gap: 10px;
        text-align: center;
      }
      .foot-right { text-align: center; align-items: center; }
      .foot-links { justify-content: center; }
      .foot-info { justify-content: center; }
    }
    @media (max-width: 480px) {
      footer { padding: 0 16px 14px; }
      .foot-logo { max-width: 100px; }
      .foot-links a { font-size: 11.5px; padding: 3px 5px; }
      .foot-note { font-size: 10.5px; }
      .foot-info span, .foot-info a { font-size: 11px; }
    }

    /* Responsive */
    @media (max-width: 768px) {
      .content  { padding: 16px 16px 16px; }
      .controls { flex-direction: column; }
      .search-box { min-width: 0; }
      .tabs { justify-content: center; flex-wrap: wrap; }
      .grid { grid-template-columns: repeat(auto-fill, minmax(155px, 1fr)); gap: 10px; }
      .card { padding: 16px 14px; }

      footer { padding: 0 16px 16px; }
      .foot-inner { flex-direction: column; align-items: center; text-align: center; }
      .foot-info { justify-content: center; }

      .logo-wrap { width: 72px; height: 72px; }
    }

    /* 480px 이하: 모바일 전용 레이아웃 세부 조정 */
    @media (max-width: 480px) {
      /* 상단: 햄버거 버튼(42px)이 콘텐츠 위에 뜨므로 padding-top 확보 (홈화면 전용) */
      body:not(.has-back-bar) .content { padding-top: 60px; }
      /* back-bar가 있을 때는 back-bar가 상단 공간을 제공하므로 기본 패딩 사용 */
      body.has-back-bar .content { padding-top: 16px; }

      /* 홈피드: 카드 2열, 간격 축소 */
      .home-feed {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
      }

      /* 툴 그리드: 1열로 */
      .tools-grid { grid-template-columns: 1fr; }

      /* 전산/채용 그리드 1열 */
      .grid { grid-template-columns: 1fr; }

      /* 소식지/청구서류 카드 그리드 좁게 */
      .nl-items-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
      .nl-card { padding: 12px 8px; }

      /* 대시보드 헤더 작게 */
      .dash-hero h1 { font-size: 0.9rem; }

      /* 뒤로가기 바 텍스트 잘림 방지 */
      .back-bar-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: calc(100vw - 120px); }
    }
    /* ══════════════════════════════
       실무 도구 카드
    ══════════════════════════════ */
    .tools-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
      gap: 14px;
    }
    .tool-card {
      display: flex;
      align-items: center;
      gap: 14px;
      background: var(--bg-card);
      border: 1.5px solid var(--border);
      border-radius: var(--radius);
      padding: 16px 18px;
      text-decoration: none;
      color: inherit;
      box-shadow: var(--sh-sm);
      transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
    }
    .tool-card:hover {
      transform: translateY(-3px);
      box-shadow: var(--sh-md);
      border-color: rgba(26,61,232,0.28);
    }
    .tool-card-icon {
      font-size: 28px;
      width: 48px;
      height: 48px;
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      background: #f0f5ff;
      border-radius: 12px;
    }
    .tool-card-body {
      flex: 1;
      min-width: 0;
    }
    .tool-card-name {
      font-weight: 700;
      font-size: 14.5px;
      color: var(--txt-hi);
      line-height: 1.3;
      margin-bottom: 3px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .tool-card-sub {
      font-size: 12px;
      color: var(--txt-mid);
      line-height: 1.4;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .tool-card-arrow {
      font-size: 16px;
      color: var(--blue-light);
      flex-shrink: 0;
      transition: transform 0.2s ease;
    }
    .tool-card:hover .tool-card-arrow {
      transform: translateX(4px);
    }
    .tool-card.coming-soon {
      opacity: 0.6;
      cursor: default;
      pointer-events: none;
      border-style: dashed;
      border-color: rgba(26,61,232,0.18);
      background: rgba(248,249,252,0.7);
    }
    .tool-card.coming-soon .tool-card-icon {
      background: #eef0f6;
      filter: grayscale(0.3);
    }
    /* ── 링크복사 버튼 ── */
    .tool-card-copy {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 32px;
      height: 32px;
      border: none;
      background: transparent;
      cursor: pointer;
      color: var(--txt-mid);
      border-radius: 6px;
      flex-shrink: 0;
      opacity: 0;
      transition: opacity 0.2s, color 0.2s, background 0.2s;
      padding: 0;
    }
    .tool-card:hover .tool-card-copy {
      opacity: 1;
    }
    @media (hover: none), (pointer: coarse) {
      .tool-card-copy { opacity: 1; }
    }
    .tool-card-copy:hover {
      color: var(--blue-light);
      background: rgba(26,61,232,0.07);
    }
    .tool-card-copy.copied {
      color: #059669;
      opacity: 1;
    }
    /* ── 딥링크 하이라이트 ── */
    @keyframes toolHighlight {
      0%   { outline: 3px solid transparent; }
      30%  { outline: 3px solid rgba(26,61,232,0.5); }
      100% { outline: 3px solid transparent; }
    }
    .tool-card-highlight {
      animation: toolHighlight 2s ease-out forwards;
      outline-offset: 2px;
    }
    .coming-soon-badge {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.04em;
      color: #fff;
      background: linear-gradient(90deg, #8b9ccc, #6b7eb8);
      border-radius: 20px;
      padding: 2px 8px;
      margin-top: 4px;
    }

    /* ══════════════════════════════
       모바일: 소식지 / 청구서류 카드 확장 (카드뉴스 타일 스타일)
    ══════════════════════════════ */
    @media (max-width: 768px) {
#page-newsletter .nl-items-grid,
      #page-claimform .nl-items-grid,
      #page-recruit .nl-items-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
      }
      #page-newsletter .nl-card,
      #page-claimform .nl-card,
      #page-recruit .nl-card {
        padding: 20px 14px;
        border-radius: 16px;
        gap: 10px;
        box-shadow: 0 2px 14px rgba(12,31,184,0.06);
      }
      #page-newsletter .nl-card-icon,
      #page-claimform .nl-card-icon,
      #page-recruit .nl-card-icon {
        font-size: 40px;
      }
      #page-newsletter .nl-card-title,
      #page-claimform .nl-card-title,
      #page-recruit .nl-card-title {
        font-size: 13px;
        font-weight: 700;
        color: var(--txt-hi);
      }
      #page-newsletter .nl-card-date,
      #page-claimform .nl-card-date,
      #page-recruit .nl-card-date {
        font-size: 10px;
      }
    }
    @media (max-width: 480px) {
      .logo-wrap { width: 60px; height: 60px; }
    }

    /* ── 채용공고 카드 (카드뉴스 스타일 썸네일) & 팝업 ── */
    .rc-card-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
      gap: 14px;
    }

    /* v2.1.21: 모바일 홈 list-item 링크 복사 버튼 (채용/강의 공통) */
    .ic-m-list-item { position: relative; }
    .ic-m-list-copy {
      position: absolute;
      top: 8px; right: 8px;
      width: 32px; height: 32px;
      border: none; border-radius: 50%;
      background: rgba(0,0,0,0.06);
      color: var(--txt-mid);
      display: flex; align-items: center; justify-content: center;
      cursor: pointer;
      z-index: 3;
      transition: background .15s, color .15s, transform .15s;
    }
    .ic-m-list-copy svg { width: 14px; height: 14px; }
    .ic-m-list-copy:hover,
    .ic-m-list-copy:active { background: rgba(0,0,0,0.12); color: var(--txt-hi); transform: scale(1.06); }
    .ic-m-list-copy.copied { background: #10b981; color: #fff; }
    [data-theme="dark"] .ic-m-list-copy { background: rgba(255,255,255,0.07); }
    [data-theme="dark"] .ic-m-list-copy:hover { background: rgba(255,255,255,0.14); }
    .ic-m-list-item.has-copy .ic-m-list-body { padding-right: 38px; }

    /* 채용공고 카드 링크복사 버튼 (rc-card + ic-job-card 공통) */
    .rc-card-copy,
    .ic-job-copy {
      position: absolute;
      top: 8px;
      right: 8px;
      z-index: 5;
      width: 30px;
      height: 30px;
      border: none;
      border-radius: 50%;
      background: rgba(0,0,0,0.55);
      backdrop-filter: blur(6px);
      color: #fff;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: background 0.18s, transform 0.18s, opacity 0.18s;
      opacity: 0;
      padding: 0;
    }
    .rc-card:hover .rc-card-copy,
    .ic-job-card:hover .ic-job-copy { opacity: 1; }
    /* 터치 디바이스에선 항상 보임 */
    @media (hover: none), (pointer: coarse) {
      .rc-card-copy, .ic-job-copy { opacity: 1; }
    }
    .rc-card-copy:hover,
    .ic-job-copy:hover {
      background: var(--blue-mid);
      transform: scale(1.08);
    }
    .rc-card-copy.copied,
    .ic-job-copy.copied {
      background: #10b981 !important;
      opacity: 1 !important;
    }
    .rc-card-copy svg,
    .ic-job-copy svg { width: 14px; height: 14px; }
    /* PDF 미리보기 iframe 위에서도 클릭 가능하도록 z-index 보장 */
    .rc-card-thumb, .ic-job-thumb { position: relative; }
    .rc-card {
      position: relative;
      display: block;
      background: var(--bg-card);
      border: 1.5px solid var(--border);
      border-radius: var(--radius);
      overflow: hidden;
      cursor: pointer;
      box-shadow: var(--sh-sm);
      transition: transform .3s cubic-bezier(0.34,1.56,0.64,1),
                  box-shadow .28s ease,
                  border-color .25s ease;
      text-align: left;
      padding: 0;
      font: inherit;
      color: inherit;
    }
    .rc-card:hover {
      transform: translateY(-4px);
      border-color: var(--blue-light);
      box-shadow: var(--sh-lg);
    }
    .rc-card-thumb {
      width: 100%;
      aspect-ratio: 4 / 3;
      background: linear-gradient(135deg, #e8eeff, #f5f8ff);
      overflow: hidden;
      display: flex;
      align-items: center;
      justify-content: center;
      position: relative;
    }
    .rc-card-thumb img {
      width: 100%; height: 100%;
      object-fit: cover;
      display: block;
    }
    .rc-card-thumb iframe {
      width: 100%; height: 100%;
      border: 0;
      pointer-events: none;
      transform: scale(1.02);
      transform-origin: top center;
      background: #fff;
    }
    .rc-card-thumb-fallback {
      font-size: 44px;
      color: var(--blue-light);
      display: flex; flex-direction: column; align-items: center; gap: 4px;
    }
    .rc-card-thumb-fallback small {
      font-size: 11px;
      color: var(--txt-lo);
      font-family: 'Pretendard', sans-serif;
      letter-spacing: 0.06em;
    }
    .rc-card-type-badge {
      position: absolute;
      top: 10px; right: 10px;
      background: rgba(12,31,184,0.9);
      color: #fff;
      font-family: 'Pretendard', sans-serif;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.05em;
      padding: 4px 10px;
      border-radius: 100px;
      backdrop-filter: blur(6px);
    }
    /* v2.11.0: 공고 상단노출(featured) 배지(좌상단) + 카드 골드 강조 */
    .rc-card-feat-badge {
      position: absolute;
      top: 10px; left: 10px; z-index: 2;
      background: linear-gradient(135deg, #f59e0b, #f97316);
      color: #fff;
      font-family: 'Pretendard', sans-serif;
      font-size: 10px; font-weight: 800;
      letter-spacing: 0.02em;
      padding: 4px 10px;
      border-radius: 100px;
      box-shadow: 0 3px 10px rgba(245,158,11,0.45);
    }
    .rc-card.rc-featured {
      border-color: #f59e0b !important;
      box-shadow: 0 0 0 2px rgba(245,158,11,0.35), 0 12px 28px rgba(245,158,11,0.18);
    }
    [data-theme="dark"] .rc-card.rc-featured {
      box-shadow: 0 0 0 2px rgba(245,158,11,0.45), 0 12px 28px rgba(0,0,0,0.45);
    }
    .rc-card-body {
      padding: 14px 16px 16px;
      display: flex; flex-direction: column; gap: 6px;
    }
    .rc-card-company {
      align-self: flex-start;
      font-size: 11px;
      font-weight: 700;
      color: var(--blue-mid);
      background: rgba(26,61,232,0.08);
      padding: 2px 8px;
      border-radius: 999px;
    }
    .rc-card-title {
      font-size: 14px;
      font-weight: 700;
      color: var(--txt-hi);
      line-height: 1.35;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
      word-break: keep-all;
    }
    .rc-card-date {
      font-family: 'Pretendard', sans-serif;
      font-size: 10px;
      color: var(--txt-lo);
      letter-spacing: 0.08em;
    }
    @media (max-width: 768px) {
      .rc-card-grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
      .rc-card-body { padding: 10px 12px 12px; }
      .rc-card-title { font-size: 12.5px; }
    }
    /* 팝업 */
    .rc-viewer {
      position: fixed; inset: 0;
      background: rgba(0,0,0,0.55);
      z-index: 10000;
      display: none;
      align-items: center; justify-content: center;
      padding: 20px;
    }
    .rc-viewer.open { display: flex; }
    .rc-viewer-body {
      position: relative;
      background: var(--bg-card);
      width: min(720px, 100%);
      max-height: 88vh;
      overflow-y: auto;
      border-radius: 18px;
      padding: 32px 28px 28px;
      box-shadow: 0 24px 60px rgba(0,0,0,0.28);
      animation: rcPop 0.22s ease-out;
    }
    @keyframes rcPop {
      from { transform: scale(0.96) translateY(8px); opacity: 0; }
      to   { transform: scale(1) translateY(0); opacity: 1; }
    }
    .rc-viewer-close {
      position: absolute; top: 14px; right: 14px;
      width: 34px; height: 34px; border-radius: 50%;
      border: none; background: #f3f4f6; color: #374151;
      font-size: 18px; cursor: pointer;
      display: flex; align-items: center; justify-content: center;
      transition: background 0.2s;
    }
    .rc-viewer-close:hover { background: #e5e7eb; }
    .rc-viewer-head {
      border-bottom: 1px solid rgba(12,31,184,0.10);
      padding-bottom: 14px; margin-bottom: 16px;
      display: flex; flex-direction: column; gap: 6px;
    }
    .rc-viewer-company {
      align-self: flex-start;
      font-size: 12px; font-weight: 700;
      color: var(--blue-mid);
      background: rgba(26,61,232,0.08);
      padding: 3px 10px; border-radius: 999px;
    }
    .rc-viewer-title {
      margin: 0; font-size: 20px; font-weight: 800; color: var(--txt-hi); line-height: 1.3;
    }
    .rc-viewer-date {
      font-size: 12px; color: var(--txt-lo); font-family: 'Pretendard', sans-serif;
    }
    .rc-viewer-desc {
      font-size: 14.5px; line-height: 1.7; color: var(--txt-mid); white-space: pre-wrap;
      word-break: break-word;
    }
    .rc-viewer-empty {
      font-size: 14px; color: var(--txt-lo); text-align: center; padding: 20px 0;
    }
    /* v2.1.29: 외부 신청 폼 링크 (구글폼/네이버폼 등) */
    .rc-viewer-form {
      display: flex; align-items: center; justify-content: center; gap: 6px;
      margin: 16px 0 0;
      padding: 12px 18px;
      background: linear-gradient(135deg, #1a3de8, #4f6df0);
      color: #fff !important;
      border-radius: 12px;
      font-size: 14px; font-weight: 800;
      text-decoration: none;
      letter-spacing: -0.01em;
      box-shadow: 0 6px 18px rgba(26,61,232,0.28);
      transition: transform .12s, box-shadow .12s;
    }
    .rc-viewer-form:hover {
      transform: translateY(-1px);
      box-shadow: 0 10px 26px rgba(26,61,232,0.38);
    }

    .rc-viewer-file {
      margin-top: 18px; padding-top: 16px;
      border-top: 1px dashed rgba(12,31,184,0.15);
      display: flex; flex-direction: column; gap: 12px;
    }
    .rc-viewer-file-link {
      align-self: flex-start;
      background: linear-gradient(135deg, var(--blue-deep), var(--blue-mid));
      color: #fff; font-weight: 700; font-size: 13.5px;
      padding: 10px 18px; border-radius: 999px;
      text-decoration: none;
    }
    .rc-viewer-img {
      width: 100%; border-radius: 10px;
      border: 1px solid rgba(12,31,184,0.10);
    }
    @media (max-width: 640px) {
      .rc-viewer-body { padding: 26px 18px 20px; border-radius: 14px; }
      .rc-viewer-title { font-size: 17px; }
      .rc-card-grid { grid-template-columns: 1fr; }
    }

    /* ══════════════════════════════
       보험지식 페이지
    ══════════════════════════════ */
    .kn-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
      gap: 22px;
    }
    .kn-card {
      background: var(--bg-card);
      border: 1.5px solid var(--border);
      border-radius: var(--radius);
      overflow: hidden;
      cursor: pointer;
      box-shadow: var(--sh-sm);
      transition: transform .3s cubic-bezier(0.34,1.56,0.64,1),
                  box-shadow .28s ease,
                  border-color .25s ease;
    }
    .kn-card:hover {
      transform: translateY(-5px);
      border-color: var(--blue-light);
      box-shadow: var(--sh-lg);
    }
    .kn-card-cover {
      width: 100%; aspect-ratio: 16/9;
      background: linear-gradient(135deg, #e8eeff 0%, #f5f8ff 100%);
      overflow: hidden;
      display: flex; align-items: center; justify-content: center;
      font-size: 52px;
    }
    .kn-card-cover img {
      width: 100%; height: 100%; object-fit: cover; display: block;
    }
    .kn-card-body {
      padding: 18px 18px 16px;
      display: flex; flex-direction: column; gap: 8px;
    }
    .kn-card-title {
      font-size: 15px; font-weight: 700;
      color: var(--txt-hi); line-height: 1.4;
    }
    .kn-card-excerpt {
      font-size: 12px; color: var(--txt-mid);
      line-height: 1.6;
      display: -webkit-box; -webkit-line-clamp: 2;
      -webkit-box-orient: vertical; overflow: hidden;
    }
    .kn-card-date {
      font-size: 11px; color: var(--txt-lo);
      margin-top: 4px;
    }

    /* 보험지식 모달 */
    .kn-modal-overlay {
      position: fixed; inset: 0; z-index: 2000;
      background: rgba(10,15,40,0.72);
      backdrop-filter: blur(6px);
      display: none;
      align-items: center; justify-content: center;
      padding: 20px;
      overflow-y: auto;
    }
    .kn-modal-overlay.open { display: flex; }
    .kn-modal-box {
      background: #fff;
      border-radius: 20px;
      width: 100%; max-width: 680px;
      max-height: 90vh;
      overflow-y: auto;
      position: relative;
      box-shadow: 0 24px 80px rgba(0,0,0,0.28);
      animation: kn-slidein .25s cubic-bezier(0.34,1.2,0.64,1);
    }
    @keyframes kn-slidein {
      from { opacity:0; transform: translateY(28px) scale(0.97); }
      to   { opacity:1; transform: translateY(0) scale(1); }
    }
    .kn-modal-close {
      position: sticky; top: 14px; float: right; right: 14px;
      margin: 14px 14px 0 0;
      width: 34px; height: 34px; border-radius: 50%;
      border: none; background: #f1f5f9; cursor: pointer;
      font-size: 18px; color: #475569;
      display: flex; align-items: center; justify-content: center;
      transition: background .2s;
      z-index: 10;
    }
    .kn-modal-close:hover { background: #e2e8f0; }
    .kn-modal-cover {
      width: 100%;
      height: auto;
      object-fit: contain;
      border-radius: 20px 20px 0 0;
      display: block;
      background: #f1f5f9;
    }
    .kn-modal-inner { padding: 28px 30px 32px; }
    .kn-modal-title {
      font-size: 22px; font-weight: 800;
      color: #0f172a; line-height: 1.35;
      margin-bottom: 6px;
    }
    .kn-modal-date { font-size: 12px; color: #94a3b8; margin-bottom: 22px; }
    .kn-modal-content {
      font-size: 15px; color: #1e293b;
      line-height: 1.85;
      border-bottom: 1px solid #e2e8f0;
      padding-bottom: 28px; margin-bottom: 28px;
    }
    .kn-modal-content p { margin: 0 0 2px; }
    /* ── 보험지식 인라인 표 ── */
    .kn-table-wrap { overflow-x: auto; margin: 16px 0; -webkit-overflow-scrolling: touch; }
    .kn-table { border-collapse: collapse; width: 100%; min-width: 400px; font-size: 13px; line-height: 1.5; }
    .kn-table th,
    .kn-table td {
      border: 1px solid rgba(100,116,139,0.3);
      padding: 8px 12px; text-align: left; color: #334155;
      vertical-align: top; word-break: break-word;
    }
    .kn-table th {
      background: #f1f5f9; font-weight: 700; color: #1e40af;
    }
    .kn-table tr:nth-child(even) td { background: #f8fafc; }
    /* v2.8.6: (제거) prefers-color-scheme 기반 kn-table 다크 스타일 — OS가 다크면 앱 라이트모드에서도 적용돼 흰 배경에 밝은 글씨가 안 보이던 원인. 다크는 [data-theme="dark"]로만 처리(v2.8.5). */
    .kn-modal-content .kn-inline-img {
      max-width: 100%; border-radius: 12px;
      margin: 16px 0; display: block;
      box-shadow: 0 4px 20px rgba(0,0,0,0.10);
    }

    /* 댓글 */
    .kn-comments-title {
      font-size: 15px; font-weight: 700;
      color: #0f172a; margin-bottom: 16px;
    }
    .kn-comment-item {
      padding: 14px 0;
      border-bottom: 1px solid #f1f5f9;
    }
    .kn-comment-author {
      font-size: 13px; font-weight: 700;
      color: #1d4ed8; margin-bottom: 5px;
    }
    .kn-comment-text {
      font-size: 13px; color: #334155;
      line-height: 1.7; white-space: pre-wrap;
    }
    .kn-comment-date { font-size: 11px; color: #94a3b8; margin-top: 5px; }
    .kn-comment-form {
      margin-top: 20px;
      display: flex; flex-direction: column; gap: 10px;
    }
    .kn-comment-form input,
    .kn-comment-form textarea {
      width: 100%; padding: 11px 14px;
      border: 1.5px solid #e2e8f0; border-radius: 10px;
      font-size: 14px; font-family: inherit;
      color: #0f172a; background: #f8fafc;
      transition: border-color .2s;
      resize: vertical;
    }
    .kn-comment-form input:focus,
    .kn-comment-form textarea:focus {
      outline: none; border-color: #2563eb;
      background: #fff;
    }
    .kn-comment-form textarea { min-height: 80px; }
    /* v2.8.5: 보험지식 모달 다크모드 텍스트 — 앱 수동 테마 토글([data-theme])에 대응 (기존 prefers-color-scheme는 OS만 반응해 글씨가 안 보였음) */
    [data-theme="dark"] .kn-modal-title,
    [data-theme="dark"] .kn-comments-title { color: #e6edf3; }
    [data-theme="dark"] .kn-modal-content { color: #c9d3e0; border-bottom-color: rgba(255,255,255,0.10); }
    [data-theme="dark"] .kn-comment-item { border-bottom-color: rgba(255,255,255,0.08); }
    [data-theme="dark"] .kn-comment-text { color: #c9d3e0; }
    [data-theme="dark"] .kn-comment-author { color: #7dd3fc; }
    [data-theme="dark"] .kn-comment-form input,
    [data-theme="dark"] .kn-comment-form textarea { color: #e6edf3; background: #0d1117; border-color: rgba(255,255,255,0.12); }
    [data-theme="dark"] .kn-comment-form input:focus,
    [data-theme="dark"] .kn-comment-form textarea:focus { background: #161b22; border-color: #7dd3fc; }
    [data-theme="dark"] .kn-table th, [data-theme="dark"] .kn-table td { border-color: rgba(125,211,252,0.2); color: #e2e8f0; }
    [data-theme="dark"] .kn-table th { background: rgba(125,211,252,0.08); color: #7dd3fc; }
    [data-theme="dark"] .kn-table tr:nth-child(even) td { background: rgba(255,255,255,0.02); }
    .kn-comment-submit {
      align-self: flex-end;
      padding: 10px 24px;
      background: linear-gradient(135deg, var(--blue-mid), var(--blue-deep));
      color: #fff; border: none; border-radius: 10px;
      font-size: 14px; font-weight: 700; cursor: pointer;
      transition: opacity .2s;
    }
    .kn-comment-submit:hover { opacity: 0.88; }
    .kn-comment-status { font-size: 13px; color: #16a34a; margin-top: 4px; }
    .kn-empty { text-align: center; padding: 60px 20px; color: var(--txt-mid); font-size: 15px; }
    .kn-copy-btn {
      display: inline-flex; align-items: center; gap: 6px;
      padding: 7px 14px; border-radius: 8px;
      border: 1.5px solid #cbd5e1; background: #f8fafc;
      color: #475569; font-size: 12px; font-weight: 600;
      cursor: pointer; white-space: nowrap;
      transition: border-color .2s, background .2s, color .2s;
      font-family: inherit;
    }
    .kn-copy-btn:hover { border-color: #2563eb; color: #2563eb; background: #eff6ff; }
    .kn-copy-btn.copied { border-color: #16a34a; color: #16a34a; background: #f0fdf4; }
    @media (max-width: 640px) {
      .kn-modal-inner { padding: 20px 18px 24px; }
      .kn-modal-title { font-size: 18px; }
      .kn-grid { grid-template-columns: 1fr; }
    }

    /* ══════════════════════════════
       실비 계산기 모달
    ══════════════════════════════ */
    #shilbi-overlay {
      display: none;
      position: fixed;
      inset: 0;
      background: rgba(10,20,60,0.55);
      backdrop-filter: blur(4px);
      z-index: 3000;
      align-items: center;
      justify-content: center;
      padding: 16px;
    }
    #shilbi-overlay.open { display: flex; }
    .shilbi-modal {
      background: #fff;
      border-radius: 20px;
      width: 100%;
      max-width: 560px;
      max-height: 90vh;
      overflow-y: auto;
      box-shadow: 0 24px 64px rgba(10,20,60,0.22);
      animation: shilbiIn .22s cubic-bezier(.4,0,.2,1);
    }
    @keyframes shilbiIn {
      from { opacity:0; transform: translateY(16px) scale(.97); }
      to   { opacity:1; transform: none; }
    }
    .shilbi-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 22px 24px 0;
    }
    .shilbi-header h2 {
      font-size: 18px;
      font-weight: 800;
      color: var(--txt-hi);
      display: flex;
      align-items: center;
      gap: 8px;
    }
    .shilbi-close {
      width: 32px; height: 32px;
      border-radius: 50%;
      border: none;
      background: #f1f3f8;
      cursor: pointer;
      font-size: 18px;
      line-height: 1;
      color: var(--txt-mid);
      display: flex; align-items: center; justify-content: center;
      transition: background .15s;
    }
    .shilbi-close:hover { background: #e2e6f0; }

    /* 세대 탭 */
    .shilbi-gen-tabs {
      display: flex;
      gap: 6px;
      padding: 16px 24px 0;
      overflow-x: auto;
      scrollbar-width: none;
    }
    .shilbi-gen-tabs::-webkit-scrollbar { display: none; }
    .sgt {
      flex-shrink: 0;
      padding: 7px 14px;
      border-radius: 20px;
      border: 1.5px solid;
      font-size: 13px;
      font-weight: 700;
      cursor: pointer;
      transition: all .18s;
    }
    /* 세대별 색상 (비활성: 연한 배경+컬러 텍스트 / 활성: 진한 배경+흰 텍스트) */
    .sgt[data-gen="1"]        { background:#fff8ed; border-color:#f59e0b; color:#b45309; }
    .sgt[data-gen="1"].active { background:#f59e0b; border-color:#f59e0b; color:#fff; }
    .sgt[data-gen="2"]        { background:#ecfdf5; border-color:#10b981; color:#047857; }
    .sgt[data-gen="2"].active { background:#10b981; border-color:#10b981; color:#fff; }
    .sgt[data-gen="3"]        { background:#f5f3ff; border-color:#8b5cf6; color:#6d28d9; }
    .sgt[data-gen="3"].active { background:#8b5cf6; border-color:#8b5cf6; color:#fff; }
    .sgt[data-gen="4"]        { background:#eff6ff; border-color:#3b82f6; color:#1d4ed8; }
    .sgt[data-gen="4"].active { background:#3b82f6; border-color:#3b82f6; color:#fff; }
    .sgt[data-gen="sick"]        { background:#fff1f2; border-color:#f43f5e; color:#be123c; }
    .sgt[data-gen="sick"].active { background:#f43f5e; border-color:#f43f5e; color:#fff; }

    /* 폼 영역 */
    .shilbi-body { padding: 18px 24px 0; }
    .shilbi-row {
      margin-bottom: 16px;
    }
    .shilbi-label {
      font-size: 12px;
      font-weight: 700;
      color: var(--txt-mid);
      text-transform: uppercase;
      letter-spacing: .04em;
      margin-bottom: 7px;
    }
    .shilbi-seg {
      display: flex;
      gap: 6px;
      flex-wrap: wrap;
    }
    .seg-btn {
      padding: 7px 14px;
      border-radius: 10px;
      border: 1.5px solid #dde2f0;
      background: #f8f9fc;
      font-size: 13px;
      font-weight: 600;
      color: var(--txt-mid);
      cursor: pointer;
      transition: all .15s;
    }
    .seg-btn.active {
      border-color: var(--blue-mid);
      background: #eef2ff;
      color: var(--blue-mid);
    }
    .shilbi-input-wrap {
      position: relative;
    }
    .shilbi-input-wrap input {
      width: 100%;
      padding: 11px 52px 11px 14px;
      border: 1.5px solid #dde2f0;
      border-radius: 10px;
      font-size: 15px;
      font-weight: 600;
      color: var(--txt-hi);
      background: #f8f9fc;
      outline: none;
      transition: border-color .15s, background .15s;
      box-sizing: border-box;
    }
    .shilbi-input-wrap input:focus {
      border-color: var(--blue-mid);
      background: #fff;
    }
    .shilbi-input-unit {
      position: absolute;
      right: 14px;
      top: 50%;
      transform: translateY(-50%);
      font-size: 13px;
      font-weight: 600;
      color: var(--txt-mid);
      pointer-events: none;
    }
    .shilbi-sub-row {
      display: none;
    }
    .shilbi-sub-row.visible { display: block; }

    /* 결과 카드 */
    .shilbi-result {
      margin: 18px 24px 24px;
      border-radius: 14px;
      background: linear-gradient(135deg, #1a3de8 0%, #3b5bff 100%);
      padding: 18px 20px 16px;
      color: #fff;
    }
    .shilbi-result.empty {
      background: #f1f3f8;
    }
    .shilbi-result-empty-msg {
      text-align: center;
      font-size: 13px;
      color: var(--txt-mid);
      padding: 8px 0;
    }

    /* 3단 계산 흐름 */
    .shilbi-calc-flow {
      display: flex;
      align-items: stretch;
      gap: 0;
      margin-bottom: 14px;
    }
    .shilbi-calc-item {
      flex: 1;
      background: rgba(255,255,255,.13);
      border-radius: 10px;
      padding: 10px 10px 10px;
      text-align: center;
      min-width: 0;
    }
    .shilbi-calc-item.highlight {
      background: rgba(255,255,255,.25);
      box-shadow: 0 0 0 2px rgba(255,255,255,.45);
    }
    .shilbi-calc-item-label {
      font-size: 10px;
      font-weight: 700;
      opacity: .75;
      letter-spacing: .04em;
      margin-bottom: 5px;
      white-space: nowrap;
    }
    .shilbi-calc-item-val {
      font-size: 17px;
      font-weight: 900;
      letter-spacing: -.3px;
      white-space: nowrap;
    }
    .shilbi-calc-item.deduct .shilbi-calc-item-val {
      color: #ffd166;
    }
    .shilbi-calc-item.payout .shilbi-calc-item-val {
      font-size: 20px;
      color: #fff;
    }
    .shilbi-calc-arrow {
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 0 6px;
      font-size: 16px;
      opacity: .6;
      flex-shrink: 0;
    }

    /* 보장률 바 */
    .shilbi-rate-row {
      display: flex;
      align-items: center;
      gap: 10px;
    }
    .shilbi-rate-label {
      font-size: 11px;
      font-weight: 700;
      opacity: .8;
      white-space: nowrap;
    }
    .shilbi-rate-bar-wrap {
      flex: 1;
      height: 7px;
      background: rgba(255,255,255,.2);
      border-radius: 99px;
      overflow: hidden;
    }
    .shilbi-rate-bar-fill {
      height: 100%;
      background: rgba(255,255,255,.85);
      border-radius: 99px;
      transition: width .4s ease;
    }
    .shilbi-rate-pct {
      font-size: 13px;
      font-weight: 900;
      white-space: nowrap;
    }

    .shilbi-basis {
      margin: 0 24px 24px;
      background: #f4f6fb;
      border-radius: 10px;
      padding: 12px 14px;
      font-size: 12px;
      color: var(--txt-mid);
      line-height: 1.7;
    }
    .shilbi-basis strong { color: var(--txt-hi); }
    .shilbi-notice {
      margin: 0 24px 20px;
      font-size: 11px;
      color: #aaa;
      line-height: 1.6;
      text-align: center;
    }

    /* 2세대 차수 / 플랜 선택 */
    .shilbi-indent {
      padding-left: 0;
      margin-top: 6px;
    }
    @media (max-width: 400px) {
      .shilbi-calc-item-val { font-size: 14px; }
      .shilbi-calc-item.payout .shilbi-calc-item-val { font-size: 16px; }
      .shilbi-calc-arrow { padding: 0 3px; font-size: 13px; }
    }

    /* ══════════════════════════════
       카드납 가이드 모달
    ══════════════════════════════ */
    #cg-overlay {
      display: none; position: fixed; inset: 0;
      background: rgba(10,20,60,0.55); backdrop-filter: blur(4px);
      z-index: 3000; align-items: center; justify-content: center; padding: 16px;
    }
    #cg-overlay.open { display: flex; }
    .cg-modal {
      background: #fff; border-radius: 20px;
      width: 100%; max-width: 640px; max-height: 90vh;
      display: flex; flex-direction: column;
      box-shadow: 0 24px 64px rgba(10,20,60,0.22);
      animation: shilbiIn .22s cubic-bezier(.4,0,.2,1);
    }
    .cg-header {
      display: flex; align-items: center; justify-content: space-between;
      padding: 22px 24px 0; flex-shrink: 0;
    }
    .cg-header h2 {
      font-size: 18px; font-weight: 800; color: var(--txt-hi);
      display: flex; align-items: center; gap: 8px;
    }
    .cg-close {
      width: 32px; height: 32px; border-radius: 50%; border: none;
      background: #f1f3f8; cursor: pointer; font-size: 18px; color: var(--txt-mid);
      display: flex; align-items: center; justify-content: center;
      transition: background .15s;
    }
    .cg-close:hover { background: #e2e6f0; }
    .cg-search-wrap { padding: 14px 24px 0; flex-shrink: 0; }
    .cg-search-input {
      width: 100%; padding: 11px 16px; border: 2px solid var(--border);
      border-radius: 12px; font-size: 14px; font-weight: 500;
      color: var(--txt-hi); background: #f7f9ff; outline: none;
      transition: border-color .18s;
    }
    .cg-search-input:focus { border-color: var(--blue-mid); background: #fff; }
    .cg-search-input::placeholder { color: var(--txt-lo); }
    .cg-tabs {
      display: flex; gap: 8px; padding: 12px 24px 0; flex-shrink: 0;
    }
    .cg-tab {
      flex: 1; padding: 9px 0; border-radius: 12px; border: 1.5px solid #dde3f0;
      background: #f7f9ff; font-size: 13px; font-weight: 700;
      color: var(--txt-mid); cursor: pointer; transition: all .15s; text-align: center;
    }
    .cg-tab.active { background: var(--blue-mid); border-color: var(--blue-mid); color: #fff; }
    .cg-count { padding: 8px 24px 2px; font-size: 12px; color: var(--txt-lo); font-weight: 500; flex-shrink: 0; }
    .cg-count b { color: var(--blue-mid); }
    .cg-list { overflow-y: auto; flex: 1; padding: 4px 16px 8px; }
    /* 회사 아코디언 */
    .cg-co {
      border: 1.5px solid #edf0fa; border-radius: 12px;
      margin-bottom: 8px; overflow: hidden;
    }
    .cg-co-head {
      display: flex; align-items: center; gap: 8px;
      padding: 12px 14px; cursor: pointer; background: #fff;
      transition: background .12s; user-select: none;
    }
    .cg-co-head:hover { background: #f7f9ff; }
    .cg-co-name { font-size: 14px; font-weight: 800; color: var(--txt-hi); flex: 1; }
    .cg-badge {
      font-size: 11px; font-weight: 700; padding: 3px 8px;
      border-radius: 20px; flex-shrink: 0;
    }
    .cg-badge.ok  { background: #dcfce7; color: #15803d; }
    .cg-badge.no  { background: #fee2e2; color: #dc2626; }
    .cg-chevron { font-size: 11px; color: var(--txt-lo); flex-shrink: 0; transition: transform .18s; }
    .cg-co.open .cg-chevron { transform: rotate(180deg); }
    .cg-co-body {
      display: none; padding: 0 14px 12px;
      border-top: 1px solid #edf0fa; background: #fafbff;
    }
    .cg-co.open .cg-co-body { display: block; }
    .cg-row { display: flex; gap: 8px; padding: 6px 0; font-size: 12.5px; border-bottom: 1px solid #f0f3fa; align-items: flex-start; }
    .cg-row:last-child { border-bottom: none; }
    .cg-row-label {
      flex-shrink: 0; width: 56px; font-weight: 700;
      color: var(--txt-lo); padding-top: 1px;
    }
    .cg-row-val { color: var(--txt-hi); font-weight: 500; line-height: 1.5; flex: 1; }
    .cg-chips { display: flex; flex-wrap: wrap; gap: 4px; }
    .cg-chip {
      font-size: 11px; font-weight: 700; padding: 2px 7px;
      border-radius: 6px; color: #fff;
    }
    .cg-chip.kb     { background: #8b1c3c; }
    .cg-chip.lotte  { background: #ed1b2e; }
    .cg-chip.shinhan{ background: #0046ff; }
    .cg-chip.bc     { background: #e85f00; }
    .cg-chip.samsung{ background: #1428a0; }
    .cg-chip.nh     { background: #00843d; }
    .cg-chip.hyundai{ background: #00287a; }
    .cg-chip.hana   { background: #009b6c; }
    .cg-chip.citi   { background: #003a8c; }
    .cg-chip.woori  { background: #005bab; }
    .cg-chip.all    { background: #6b7280; }
    .cg-chip.special{ background: #7c3aed; }
    .cg-note {
      margin-top: 4px; font-size: 11.5px; color: #e05c00;
      background: #fff7ed; padding: 4px 8px; border-radius: 6px;
      font-weight: 600;
    }
    .cg-disclaimer {
      flex-shrink: 0; padding: 10px 20px 14px;
      border-top: 1px solid #f0f3fa; font-size: 11px;
      color: var(--txt-lo); line-height: 1.6;
      background: #fafbff; border-radius: 0 0 20px 20px;
    }
    .cg-disclaimer b { color: #e05c00; }

    /* ══════════════════════════════
       수술명 검색 모달
    ══════════════════════════════ */
    /* v2.19.0: 담보 빠른조회 모달 — 사용자용 보험사·담보 검색(공개 approved). 수술검색 모달 톤 미러링 */
    #cov-overlay {
      display: none; position: fixed; inset: 0;
      background: rgba(10,20,60,0.55); backdrop-filter: blur(4px);
      z-index: 3000; align-items: center; justify-content: center; padding: 16px;
    }
    #cov-overlay.open { display: flex; }
    .cov-modal {
      background: #fff; border-radius: 20px; width: 100%; max-width: 680px;
      max-height: 90vh; display: flex; flex-direction: column;
      box-shadow: 0 24px 64px rgba(10,20,60,0.22);
      animation: shilbiIn .22s cubic-bezier(.4,0,.2,1);
    }
    .cov-header { display: flex; align-items: center; justify-content: space-between; padding: 22px 24px 0; flex-shrink: 0; }
    .cov-header h2 { font-size: 18px; font-weight: 800; color: var(--txt-hi); display: flex; align-items: center; gap: 8px; }
    .cov-close { width: 32px; height: 32px; border-radius: 50%; border: none; background: #f1f3f8; cursor: pointer; font-size: 18px; color: var(--txt-mid); display: flex; align-items: center; justify-content: center; transition: background .15s; }
    .cov-close:hover { background: #e2e6f0; }
    .cov-search-wrap { padding: 16px 24px 0; flex-shrink: 0; }
    .cov-search-input { width: 100%; padding: 12px 16px; border: 2px solid var(--border); border-radius: 12px; font-size: 15px; font-weight: 500; color: var(--txt-hi); background: #f7f9ff; outline: none; transition: border-color .18s; }
    .cov-search-input:focus { border-color: var(--blue-mid); background: #fff; }
    .cov-search-input::placeholder { color: var(--txt-lo); }
    .cov-sort { display: flex; gap: 6px; padding: 10px 24px 0; flex-shrink: 0; }
    .cov-sort-btn { padding: 5px 12px; border-radius: 20px; border: 1.5px solid #dde3f0; background: #f7f9ff; font-size: 11.5px; font-weight: 700; color: var(--txt-mid); cursor: pointer; transition: all .15s; }
    .cov-sort-btn.active { border-color: var(--blue-mid); background: var(--blue-mid); color: #fff; }
    [data-theme="dark"] .cov-sort-btn { background: #0f1422; border-color: rgba(148,163,184,0.2); }
    .cov-rank { display: inline-flex; align-items: center; justify-content: center; min-width: 30px; height: 20px; font-size: 11.5px; font-weight: 800; color: #1a3de8; flex-shrink: 0; }
    [data-theme="dark"] .cov-rank { color: #a5b4fc; }
    .cov-count { padding: 10px 24px 4px; font-size: 12px; color: var(--txt-lo); font-weight: 500; flex-shrink: 0; }
    .cov-count b { color: var(--blue-mid); }
    .cov-list { overflow-y: auto; flex: 1; padding: 4px 16px 8px; }
    .cov-item { padding: 11px 12px; border-bottom: 1px solid #f0f3fa; border-radius: 10px; transition: background .12s; }
    .cov-item:hover { background: #f7f9ff; }
    .cov-item:last-child { border-bottom: none; }
    .cov-item-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
    .cov-name { font-size: 15px; font-weight: 800; color: var(--txt-hi); }
    .cov-insurer { flex-shrink: 0; font-size: 11px; font-weight: 800; color: #0369a1; background: #e0f2fe; border-radius: 6px; padding: 3px 8px; }
    .cov-product { font-size: 12.5px; color: var(--txt-mid); margin-top: 3px; }
    .cov-pills { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
    .cov-pill { font-size: 11.5px; font-weight: 600; color: var(--txt-mid); background: #f1f5fb; border: 1px solid #e6ebf5; border-radius: 7px; padding: 3px 9px; }
    .cov-pill b { color: var(--txt-hi); font-weight: 800; }
    .cov-pill.amt { background: #eef9f1; border-color: #cdeed7; }
    .cov-pill.amt b { color: #15803d; }
    .cov-empty, .cov-loading { padding: 40px 24px; text-align: center; color: var(--txt-lo); font-size: 14px; font-weight: 500; line-height: 1.6; }
    .cov-foot { flex-shrink: 0; padding: 12px 24px 20px; border-top: 1px solid #f0f3fa; }
    .cov-foot-note { font-size: 11.5px; color: var(--txt-lo); margin-bottom: 8px; line-height: 1.5; }
    .cov-ai-btn { width: 100%; padding: 11px; border: none; border-radius: 12px; background: linear-gradient(135deg,#1a3de8,#7c3aed); color: #fff; font-size: 13px; font-weight: 800; cursor: pointer; transition: filter .15s; }
    .cov-ai-btn:hover { filter: brightness(1.08); }
    [data-theme="dark"] .cov-modal { background: #161c2e; }
    [data-theme="dark"] .cov-insurer { color: #7dd3fc; background: rgba(2,132,199,0.18); }
    [data-theme="dark"] .cov-pill { background: rgba(148,163,184,0.12); border-color: rgba(148,163,184,0.2); }
    [data-theme="dark"] .cov-pill.amt { background: rgba(34,197,94,0.14); border-color: rgba(34,197,94,0.28); }
    [data-theme="dark"] .cov-pill.amt b { color: #4ade80; }
    [data-theme="dark"] .cov-item:hover { background: rgba(148,163,184,0.08); }
    [data-theme="dark"] .cov-search-input { background: #0f1422; }
    [data-theme="dark"] .cov-close { background: rgba(148,163,184,0.14); }
    @media (max-width: 768px) {
      .cov-modal { max-width: 100%; max-height: 92vh; border-radius: 16px; }
      .cov-name { font-size: 14px; }
    }

    #surg-overlay {
      display: none;
      position: fixed;
      inset: 0;
      background: rgba(10,20,60,0.55);
      backdrop-filter: blur(4px);
      z-index: 3000;
      align-items: center;
      justify-content: center;
      padding: 16px;
    }
    #surg-overlay.open { display: flex; }
    .surg-modal {
      background: #fff;
      border-radius: 20px;
      width: 100%;
      max-width: 620px;
      max-height: 90vh;
      display: flex;
      flex-direction: column;
      box-shadow: 0 24px 64px rgba(10,20,60,0.22);
      animation: shilbiIn .22s cubic-bezier(.4,0,.2,1);
    }
    .surg-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 22px 24px 0;
      flex-shrink: 0;
    }
    .surg-header h2 {
      font-size: 18px;
      font-weight: 800;
      color: var(--txt-hi);
      display: flex;
      align-items: center;
      gap: 8px;
    }
    .surg-close {
      width: 32px; height: 32px;
      border-radius: 50%;
      border: none;
      background: #f1f3f8;
      cursor: pointer;
      font-size: 18px;
      color: var(--txt-mid);
      display: flex; align-items: center; justify-content: center;
      transition: background .15s;
    }
    .surg-close:hover { background: #e2e6f0; }
    .surg-search-wrap {
      padding: 16px 24px 0;
      flex-shrink: 0;
    }
    .surg-search-input {
      width: 100%;
      padding: 12px 16px;
      border: 2px solid var(--border);
      border-radius: 12px;
      font-size: 15px;
      font-weight: 500;
      color: var(--txt-hi);
      background: #f7f9ff;
      outline: none;
      transition: border-color .18s;
    }
    .surg-search-input:focus {
      border-color: var(--blue-mid);
      background: #fff;
    }
    .surg-search-input::placeholder { color: var(--txt-lo); }
    .surg-filter-row {
      display: flex;
      gap: 6px;
      padding: 10px 24px 0;
      overflow-x: auto;
      scrollbar-width: none;
      flex-shrink: 0;
    }
    .surg-filter-row::-webkit-scrollbar { display: none; }
    .surg-filter-btn {
      flex-shrink: 0;
      padding: 5px 13px;
      border-radius: 20px;
      border: 1.5px solid #dde3f0;
      background: #f7f9ff;
      font-size: 12px;
      font-weight: 700;
      color: var(--txt-mid);
      cursor: pointer;
      transition: all .15s;
    }
    .surg-filter-btn.active   { border-color: var(--blue-mid); background: var(--blue-mid); color: #fff; }
    .surg-filter-btn[data-j="1"].active { background:#10b981; border-color:#10b981; }
    .surg-filter-btn[data-j="2"].active { background:#3b82f6; border-color:#3b82f6; }
    .surg-filter-btn[data-j="3"].active { background:#f59e0b; border-color:#f59e0b; }
    .surg-filter-btn[data-j="4"].active { background:#ef4444; border-color:#ef4444; }
    .surg-filter-btn[data-j="5"].active { background:#7c3aed; border-color:#7c3aed; }
    .surg-count {
      padding: 8px 24px 4px;
      font-size: 12px;
      color: var(--txt-lo);
      font-weight: 500;
      flex-shrink: 0;
    }
    .surg-count b { color: var(--blue-mid); }
    .surg-list {
      overflow-y: auto;
      flex: 1;
      padding: 0 16px 8px;
    }
    .surg-item {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 10px 8px;
      border-bottom: 1px solid #f0f3fa;
      transition: background .12s;
      border-radius: 8px;
    }
    .surg-item:hover { background: #f7f9ff; }
    .surg-item:last-child { border-bottom: none; }
    .surg-jong-badge {
      flex-shrink: 0;
      width: 40px;
      height: 24px;
      border-radius: 6px;
      font-size: 12px;
      font-weight: 800;
      display: flex; align-items: center; justify-content: center;
      color: #fff;
    }
    .surg-jong-badge[data-j="1"] { background: #10b981; }
    .surg-jong-badge[data-j="2"] { background: #3b82f6; }
    .surg-jong-badge[data-j="3"] { background: #f59e0b; }
    .surg-jong-badge[data-j="4"] { background: #ef4444; }
    .surg-jong-badge[data-j="5"] { background: #7c3aed; }
    .surg-name {
      flex: 1;
      font-size: 14px;
      font-weight: 600;
      color: var(--txt-hi);
      line-height: 1.4;
    }
    .surg-cat {
      font-size: 11px;
      color: var(--txt-lo);
      background: #f0f3fa;
      padding: 2px 8px;
      border-radius: 10px;
      font-weight: 500;
      flex-shrink: 0;
      max-width: 90px;
      text-align: center;
    }
    .surg-empty {
      text-align: center;
      padding: 40px 20px;
      color: var(--txt-lo);
      font-size: 14px;
    }
    .surg-info {
      flex-shrink: 0;
      padding: 10px 24px 14px;
      border-top: 1px solid #f0f3fa;
    }
    .surg-info-title {
      font-size: 11px;
      font-weight: 700;
      color: var(--txt-lo);
      margin-bottom: 6px;
      text-transform: uppercase;
      letter-spacing: .04em;
    }
    .surg-info-pills {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
    }
    .surg-info-pill {
      display: flex;
      align-items: center;
      gap: 5px;
      font-size: 11px;
      font-weight: 500;
      color: var(--txt-mid);
    }
    .surg-info-dot {
      width: 10px; height: 10px;
      border-radius: 3px;
      flex-shrink: 0;
    }

    /* ── 홈 피드 ── */
    #page-home, #page-latest { overflow-y: auto; }
    /* 홈 대시보드에서 AdSense는 표시 (구글 검토에 필요) */

    /* ══════════════════════════════
       홈 대시보드 - Hero / 기능 / 신뢰 / 푸터
    ══════════════════════════════ */
    /* ═══════ 상단 영역: 좌측(인기콘텐츠 + 허브+즐겨찾기) | 우측(모임방순위) ═══════ */
    /* v2.73.0: 뉴스|대화순위(높이 일치) 1행 + 진행중 공고 전체너비 2행 — 대화순위 여백 제거 */
    /* v2.98.0: 대화순위를 삼따AI/자유게시판 행으로 이동 → 뉴스가 단독 전체너비. 인슈어커넥트 뉴스 5열 확장 */
    .ic-top-row {
      display: block;
      margin: 0 0 18px;
    }
    .ic-top-row > #home-news-monitor { min-width: 0; margin-bottom: 0 !important; }
    /* 인슈어커넥트 뉴스: 대화순위가 빠진 자리만큼 전체너비 5열로 확장 */
    #home-news-grid { grid-template-columns: repeat(5, 1fr); }
    @media (max-width: 1180px) { #home-news-grid { grid-template-columns: repeat(4, 1fr); } }
    @media (max-width: 920px)  { #home-news-grid { grid-template-columns: repeat(3, 1fr); } }

    /* ════════════════════════════════════════════
       MOBILE 전용 홈 (방식 2: JS 감지 시 노출)
       body.ic-mobile 일 때만 활성화
       ════════════════════════════════════════════ */
    body.ic-mobile #page-home { display: none !important; }
    /* v2.17.1: 모바일 홈이 짧아 위로 몰리던 문제 → 세로 중앙 정렬(safe: 길면 위 정렬+스크롤, 잘림 없음) */
    body.ic-mobile #page-home-mobile { display: flex !important; flex-direction: column; gap: 14px; }
    /* v2.17.7: 모바일 홈 하단 푸터 (margin-top:auto로 하단 고정 → 콘텐츠가 화면 채움) */
    /* v2.17.9: 모바일 홈 하단 푸터(.m-home-footer) 삭제 — 기존 글로벌 <footer>와 중복이라 제거 */
    /* v2.5.4: 서브페이지로 이동 시 모바일 홈을 강제로 숨김 (홈 콘텐츠가 위에 남아 "반만 열리는" 문제 해결) */
    body.ic-mobile.nav-subpage #page-home-mobile { display: none !important; }
    body:not(.ic-mobile) #page-home-mobile { display: none !important; }

    /* v2.6.0: 모바일 전용 로그인 게이트 (홈 진입 전 카카오 로그인) */
    #m-login-gate { display: none; }
    /* v2.8.6: PC·모바일 공통 로그인 게이트 (이전엔 max-width:900px 모바일 한정) — SSR 콘텐츠 페이지(/insurance·/company·/board 등)는 게이트 없음(SEO 유지) -->
       로그인 미설정·네트워크 실패 시 게이트 미노출(가두지 않음) */
    #m-login-gate:not(.mlg-hidden) {
      display: flex; position: fixed; inset: 0; z-index: 99999;
      align-items: flex-start; justify-content: center; padding: 30px 20px; overflow-y: auto;
      background: linear-gradient(160deg, #1a3de8 0%, #00c8ee 100%);
    }
    .mlg-card { width: 100%; max-width: 580px; margin: auto; background: #fff; border-radius: 24px; padding: 34px 30px 26px; text-align: center; box-shadow: 0 30px 70px rgba(8,20,80,0.42); border: 1px solid rgba(255,255,255,0.5); }
    [data-theme="dark"] .mlg-card { background: #131826; border-color: rgba(255,255,255,0.06); }
    /* v2.13.4: 새 브랜드 로고 — 투명 SVG(라이트/다크 모두 자연스럽게) */
    .mlg-brand { margin-bottom: 22px; }
    .mlg-inf { width: 98px; height: auto; display: block; margin: 0 auto 10px; filter: drop-shadow(0 6px 14px rgba(26,61,232,0.28)); }
    .mlg-wordmark { font-size: 20px; font-weight: 900; letter-spacing: 0.045em; color: #0f172a; line-height: 1; }
    [data-theme="dark"] .mlg-wordmark { color: #f0f4f8; }
    .mlg-tagline { display: inline-block; font-size: 11px; font-weight: 800; letter-spacing: 0.16em; color: #1f7bff; margin-top: 7px; padding: 3px 11px; border-radius: 999px; background: rgba(31,123,255,0.10); }
    [data-theme="dark"] .mlg-tagline { color: #6ea8ff; background: rgba(31,123,255,0.18); }
    .mlg-title { font-size: 21px; font-weight: 900; color: #0f172a; margin: 0 0 8px; letter-spacing: -0.02em; }
    [data-theme="dark"] .mlg-title { color: #e6edf3; }
    .mlg-sub { font-size: 14px; line-height: 1.6; color: #64748b; margin: 0 0 26px; }
    [data-theme="dark"] .mlg-sub { color: #94a3b8; }
    .mlg-kakao { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; box-sizing: border-box; background: #FEE500; color: #191600; text-decoration: none; font-weight: 900; font-size: 16px; padding: 16px; border-radius: 14px; box-shadow: 0 8px 20px rgba(254,229,0,0.45); }
    .mlg-kakao:active { transform: scale(0.98); }
    .mlg-note { margin: 18px 0 0; font-size: 11px; color: #cbd5e1; line-height: 1.5; }
    [data-theme="dark"] .mlg-note { color: #475569; }
    /* v2.15.8: 로그인 게이트 = 홍보 랜딩 (주요기능 소개 + 이미지 → 신규가입 유도) */
    .mlg-stats { display:flex; justify-content:center; gap:20px; margin:18px 0 2px; flex-wrap:wrap; }
    .mlg-stat b { font-size:17px; font-weight:900; color:#1a3de8; display:block; }
    [data-theme="dark"] .mlg-stat b { color:#6ea8ff; }
    .mlg-stat span { font-size:11px; color:#64748b; }
    [data-theme="dark"] .mlg-stat span { color:#94a3b8; }
    .mlg-secttl { font-size:12.5px; font-weight:800; letter-spacing:.01em; color:#1f7bff; text-align:left; margin:24px 0 11px; display:flex; align-items:center; gap:8px; }
    .mlg-secttl::before { content:''; width:4px; height:15px; border-radius:2px; background:linear-gradient(#1f7bff,#1a3de8); flex-shrink:0; }
    [data-theme="dark"] .mlg-secttl { color:#6ea8ff; }
    .mlg-feats { display:grid; grid-template-columns:1fr 1fr; gap:9px; text-align:left; }
    .mlg-feat { display:flex; gap:10px; align-items:flex-start; padding:12px 13px; border-radius:14px; background:#f6f9ff; border:1px solid #e6eeff; }
    [data-theme="dark"] .mlg-feat { background:#0f1726; border-color:#1e2a44; }
    .mlg-feat-ic { font-size:21px; line-height:1; flex-shrink:0; }
    .mlg-feat-t { font-size:13px; font-weight:800; color:#0f172a; }
    [data-theme="dark"] .mlg-feat-t { color:#e6edf3; }
    .mlg-feat-d { font-size:11px; color:#64748b; margin-top:2px; line-height:1.45; }
    [data-theme="dark"] .mlg-feat-d { color:#94a3b8; }
    .mlg-media { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
    .mlg-media figure { margin:0; border-radius:14px; overflow:hidden; border:1px solid #e6eeff; background:#f6f9ff; }
    [data-theme="dark"] .mlg-media figure { border-color:#1e2a44; background:#0f1726; }
    .mlg-media img, .mlg-media .mlg-illus { width:100%; height:108px; display:block; }
    .mlg-media figcaption { font-size:11.5px; font-weight:700; color:#334155; padding:8px 10px; }
    [data-theme="dark"] .mlg-media figcaption { color:#cbd5e1; }
    .mlg-divider { height:1px; background:linear-gradient(90deg,transparent,#e2e8f0,transparent); margin:22px 0 0; }
    [data-theme="dark"] .mlg-divider { background:linear-gradient(90deg,transparent,#1e2a44,transparent); }
    .mlg-kakao.secondary { margin-top:18px; }
    .mlg-social { display:inline-flex; align-items:center; gap:8px; margin:14px auto 0; padding:7px 14px; border-radius:999px; background:#ecfdf5; border:1px solid #a7f3d0; font-size:12px; font-weight:700; color:#065f46; }
    [data-theme="dark"] .mlg-social { background:rgba(16,185,129,.12); border-color:rgba(16,185,129,.3); color:#6ee7b7; }
    .mlg-social .dot { width:8px; height:8px; border-radius:50%; background:#10b981; animation:mlgPulse 1.8s infinite; flex-shrink:0; }
    @keyframes mlgPulse { 0%,100%{opacity:1} 60%{opacity:0.5} }
    .mlg-social b { color:inherit; font-weight:900; }
    .mlg-invite { margin:0 0 18px; padding:11px 14px; border-radius:12px; background:linear-gradient(135deg,#fef3c7,#fde68a); border:1px solid #fbbf24; color:#92400e; font-size:13px; font-weight:700; }
    [data-theme="dark"] .mlg-invite { background:linear-gradient(135deg,rgba(245,158,11,.18),rgba(249,115,22,.12)); border-color:rgba(245,158,11,.4); color:#fcd34d; }
    .mlg-invite b { font-weight:900; }
    @media (max-width:480px){ .mlg-feats{grid-template-columns:1fr;} .mlg-card{padding:28px 18px 22px;} }

    /* v2.52.0: 로그인 게이트 2-컬럼 랜딩 리디자인 */
    .lg2-card { width:100%; max-width:980px; margin:auto; background:#fff; border-radius:28px; box-shadow:0 30px 80px rgba(8,20,80,0.45); overflow:hidden; display:grid; grid-template-columns:1.12fr 1fr; }
    [data-theme="dark"] .lg2-card { background:#131826; }
    .lg2-left { padding:40px 38px; background:linear-gradient(170deg,#eef3ff 0%,#f8faff 55%,#fff 100%); }
    [data-theme="dark"] .lg2-left { background:#0f1726; }
    .lg2-right { padding:46px 42px; display:flex; flex-direction:column; }
    .lg2-brand { display:flex; align-items:center; gap:11px; margin-bottom:20px; }
    .lg2-brand .mlg-tagline { letter-spacing:.12em; }
    .lg2-hero { font-size:46px; font-weight:900; line-height:1.04; letter-spacing:-0.035em; color:#0b1530; margin:6px 0 18px; }
    [data-theme="dark"] .lg2-hero { color:#eef2ff; }
    .lg2-hero-accent { color:#1a3de8; }
    .lg2-lead { font-size:14.5px; line-height:1.7; color:#475569; margin:0 0 20px; }
    [data-theme="dark"] .lg2-lead { color:#94a3b8; }
    .lg2-bullets { list-style:none; padding:0; margin:0 0 24px; display:flex; flex-direction:column; gap:11px; }
    .lg2-bullets li { font-size:14px; font-weight:700; color:#1e293b; display:flex; align-items:center; gap:10px; }
    [data-theme="dark"] .lg2-bullets li { color:#cbd5e1; }
    .lg2-bullets li::before { content:'✓'; flex-shrink:0; width:22px; height:22px; border-radius:50%; background:#1a3de8; color:#fff; font-size:12px; font-weight:900; display:flex; align-items:center; justify-content:center; }
    .lg2-chat { background:#fff; border:1px solid #e6edfb; border-radius:18px; padding:14px; box-shadow:0 10px 30px rgba(12,31,184,.08); margin-bottom:26px; }
    [data-theme="dark"] .lg2-chat { background:#0c1424; border-color:#1e2a44; }
    .lg2-chat-head { display:flex; align-items:center; justify-content:space-between; font-size:12.5px; color:#334155; padding-bottom:10px; margin-bottom:6px; border-bottom:1px solid #f1f5f9; }
    [data-theme="dark"] .lg2-chat-head { color:#cbd5e1; border-color:#1e2a44; }
    .lg2-chat-on { font-size:10.5px; color:#16a34a; font-weight:700; display:inline-flex; align-items:center; gap:5px; }
    .lg2-chat-on i { width:6px; height:6px; border-radius:50%; background:#22c55e; display:inline-block; }
    .lg2-chat-msg { display:flex; gap:9px; align-items:flex-start; padding:7px 2px; }
    .lg2-chat-ava { width:30px; height:30px; border-radius:50%; color:#fff; font-weight:800; font-size:12px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
    .lg2-chat-msg b { font-size:12px; color:#0f172a; display:block; }
    [data-theme="dark"] .lg2-chat-msg b { color:#e6edf3; }
    .lg2-chat-msg p { font-size:12px; color:#64748b; margin:2px 0 0; line-height:1.4; }
    .lg2-chat-input { margin-top:8px; background:#f1f5f9; border-radius:10px; padding:10px 13px; font-size:12px; color:#94a3b8; }
    [data-theme="dark"] .lg2-chat-input { background:#1a2336; }
    .lg2-sectitle { font-size:16px; font-weight:800; color:#0b1530; margin:4px 0 14px; }
    [data-theme="dark"] .lg2-sectitle { color:#eef2ff; }
    .lg2-sectitle b { color:#1a3de8; }
    .lg2-svc { display:grid; grid-template-columns:repeat(4,1fr); gap:9px; margin-bottom:22px; }
    .lg2-svc-card { background:#fff; border:1px solid #e8eefb; border-radius:14px; padding:15px 10px; text-align:center; box-shadow:0 4px 14px rgba(12,31,184,.05); }
    [data-theme="dark"] .lg2-svc-card { background:#0c1424; border-color:#1e2a44; }
    .lg2-svc-card>span:first-child { font-size:25px; display:block; margin-bottom:8px; }
    .lg2-svc-card b { font-size:12.5px; font-weight:800; color:#0f172a; display:block; margin-bottom:5px; }
    [data-theme="dark"] .lg2-svc-card b { color:#e6edf3; }
    .lg2-svc-card .d { font-size:10.5px; color:#94a3b8; line-height:1.4; display:block; }
    .lg2-quote { background:#fff; border:1px solid #e8eefb; border-radius:16px; padding:18px 20px; box-shadow:0 4px 14px rgba(12,31,184,.05); }
    [data-theme="dark"] .lg2-quote { background:#0c1424; border-color:#1e2a44; }
    .lg2-quote p { font-size:13.5px; line-height:1.6; color:#334155; font-weight:600; margin:0 0 13px; }
    [data-theme="dark"] .lg2-quote p { color:#cbd5e1; }
    .lg2-quote p::before { content:'“'; color:#1a3de8; font-weight:900; margin-right:1px; }
    .lg2-quote-by { display:flex; align-items:center; gap:10px; }
    .lg2-ava { width:38px; height:38px; border-radius:50%; background:linear-gradient(135deg,#1a3de8,#22d3ee); color:#fff; font-weight:900; font-size:15px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
    .lg2-quote-by b { font-size:13px; color:#0f172a; display:block; }
    [data-theme="dark"] .lg2-quote-by b { color:#e6edf3; }
    .lg2-quote-by span:last-child { font-size:11.5px; color:#94a3b8; }
    .lg2-explore { margin-top:22px; padding-top:18px; border-top:1px dashed #dbe3f5; display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
    [data-theme="dark"] .lg2-explore { border-color:#1e2a44; }
    .lg2-explore-lbl { font-size:11.5px; color:#94a3b8; font-weight:700; }
    .lg2-explore a { font-size:12px; font-weight:700; color:#1a3de8; text-decoration:none; background:rgba(26,61,232,.07); padding:6px 11px; border-radius:999px; }
    /* v2.99.0: 비로그인 공개 보험 콘텐츠(홈에서 본문·내부링크 노출 — AdSense 콘텐츠 요건/탐색성) */
    .lg2-pub { margin:2px 0 0; }
    .lg2-pub-h { font-size:16px; font-weight:800; color:#0b1530; margin:0 0 8px; letter-spacing:-0.01em; }
    [data-theme="dark"] .lg2-pub-h { color:#eef2ff; }
    .lg2-pub-lead { font-size:13px; line-height:1.7; color:#475569; margin:0 0 14px; }
    [data-theme="dark"] .lg2-pub-lead { color:#94a3b8; }
    .lg2-pub-lead b { color:#1e293b; font-weight:800; }
    [data-theme="dark"] .lg2-pub-lead b { color:#cbd5e1; }
    .lg2-posts { list-style:none; padding:0; margin:0 0 13px; background:#fff; border:1px solid #e8eefb; border-radius:14px; overflow:hidden; box-shadow:0 4px 14px rgba(12,31,184,.05); }
    [data-theme="dark"] .lg2-posts { background:#0c1424; border-color:#1e2a44; }
    .lg2-posts li { border-bottom:1px solid #f1f5f9; }
    [data-theme="dark"] .lg2-posts li { border-color:#1a2336; }
    .lg2-posts li:last-child { border-bottom:none; }
    .lg2-posts a { display:block; padding:11px 14px; font-size:13px; font-weight:600; color:#1e293b; text-decoration:none; line-height:1.45; }
    [data-theme="dark"] .lg2-posts a { color:#cbd5e1; }
    .lg2-posts a:hover { background:#f6f9ff; color:#1a3de8; }
    [data-theme="dark"] .lg2-posts a:hover { background:#0f1a30; }
    .lg2-cats { display:flex; flex-wrap:wrap; gap:7px; margin:0 0 12px; }
    .lg2-cats a { font-size:12px; font-weight:700; color:#1a3de8; text-decoration:none; background:rgba(26,61,232,.07); padding:6px 11px; border-radius:999px; }
    [data-theme="dark"] .lg2-cats a { background:rgba(26,61,232,.16); color:#9db4ff; }
    .lg2-cats-all { display:inline-block; font-size:13px; font-weight:800; color:#1a3de8; text-decoration:none; }
    .lg2-cats-all:hover { text-decoration:underline; }
    .lg2-faq { display:flex; flex-direction:column; gap:8px; }
    .lg2-faq details { background:#fff; border:1px solid #e8eefb; border-radius:12px; padding:11px 14px; box-shadow:0 4px 14px rgba(12,31,184,.04); }
    [data-theme="dark"] .lg2-faq details { background:#0c1424; border-color:#1e2a44; }
    .lg2-faq summary { font-size:13px; font-weight:800; color:#0f172a; cursor:pointer; list-style:none; }
    [data-theme="dark"] .lg2-faq summary { color:#e6edf3; }
    .lg2-faq summary::-webkit-details-marker { display:none; }
    .lg2-faq summary::before { content:'Q '; color:#1a3de8; font-weight:900; }
    .lg2-faq p { font-size:12.5px; line-height:1.65; color:#475569; margin:9px 0 0; }
    [data-theme="dark"] .lg2-faq p { color:#94a3b8; }
    .lg2-faq a { color:#1a3de8; font-weight:700; text-decoration:none; }
    .lg2-rlogo { text-align:center; margin-bottom:28px; }
    .lg2-rlogo .mlg-inf { width:80px; margin:0 auto 8px; filter:drop-shadow(0 6px 14px rgba(26,61,232,0.28)); }
    .lg2-rtitle { font-size:26px; font-weight:900; color:#0b1530; text-align:center; margin:0 0 12px; letter-spacing:-0.02em; }
    [data-theme="dark"] .lg2-rtitle { color:#eef2ff; }
    .lg2-rsub { font-size:14px; line-height:1.65; color:#64748b; text-align:center; margin:0 0 26px; }
    [data-theme="dark"] .lg2-rsub { color:#94a3b8; }
    .lg2-right .mlg-kakao { font-size:16.5px; padding:17px; }
    .lg2-nosignup { font-size:12.5px; color:#94a3b8; text-align:center; margin:14px 0 0; }
    .lg2-badges { margin-top:auto; padding-top:28px; display:grid; grid-template-columns:repeat(3,1fr); gap:12px; border-top:1px solid #eef2f9; }
    [data-theme="dark"] .lg2-badges { border-color:#1e2a44; }
    .lg2-badge { text-align:center; }
    .lg2-badge>span:first-child { font-size:21px; display:block; margin-bottom:7px; }
    .lg2-badge b { font-size:11.5px; font-weight:800; color:#0f172a; display:block; margin-bottom:5px; }
    [data-theme="dark"] .lg2-badge b { color:#e6edf3; }
    .lg2-badge .d { font-size:10px; color:#94a3b8; line-height:1.4; display:block; }
    .lg2-rfooter { margin-top:24px; padding-top:18px; border-top:1px solid #f1f5f9; font-size:11px; color:#94a3b8; text-align:center; line-height:1.7; }
    [data-theme="dark"] .lg2-rfooter { border-color:#1e2a44; color:#64748b; }
    .lg2-rfooter a { color:#1a3de8; text-decoration:none; }
    @media (max-width:880px){
      .lg2-card { grid-template-columns:1fr; max-width:480px; }
      .lg2-right { order:-1; padding:34px 24px 26px; }
      .lg2-left { padding:28px 24px 32px; }
      .lg2-hero { font-size:36px; }
    }
    @media (max-width:420px){ .lg2-svc{grid-template-columns:1fr 1fr;} .lg2-hero{font-size:32px;} }

    /* v2.6.0: 자주 쓰는 핵심 메뉴 그리드 (3열, 크게) */
    .ic-m-core-grid { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
    /* v2.6.8: 이모지 제거 → 단순 텍스트 버튼 */
    .ic-m-core-card { position: relative; flex: 0 0 calc((100% - 20px) / 3); box-sizing: border-box; display: flex; align-items: center; justify-content: center; min-height: 48px; padding: 12px 8px; border: 1px solid var(--border, rgba(12,31,184,0.10)); border-radius: 12px; background: var(--bg-card, #fff); cursor: pointer; font-family: inherit; text-decoration: none; color: inherit; transition: background .15s, border-color .15s; }
    /* v2.6.5: 빠른 메뉴 NEW 표시 (새 포스팅/업로드 알림 점) */
    .cc-new { position: absolute; top: 7px; right: 9px; width: 9px; height: 9px; border-radius: 999px; background: #ef4444; box-shadow: 0 0 0 2px #fff; display: none; }
    [data-theme="dark"] .cc-new { box-shadow: 0 0 0 2px #161b22; }
    .cc-new.show { display: block; animation: ccNewPulse 1.6s ease-in-out infinite; }
    @keyframes ccNewPulse { 0%,100% { transform: scale(1); opacity: 1; } 50% { transform: scale(1.25); opacity: 0.75; } }
    /* v2.17.2: 다크모드에서 빠른메뉴 카드가 배경과 구분 안 되던 문제 → 배경 밝게 + 테두리 또렷이 */
    [data-theme="dark"] .ic-m-core-card { background: #1e2738; border-color: rgba(255,255,255,0.20); box-shadow: 0 1px 2px rgba(0,0,0,0.3); }
    [data-theme="dark"] .ic-m-core-card:hover { background: #273248; border-color: rgba(99,102,241,0.6); }
    .ic-m-core-card .cc-lb { font-size: 13px; font-weight: 700; color: var(--txt-hi, #0f172a); letter-spacing: -0.01em; text-align: center; line-height: 1.25; }
    [data-theme="dark"] .ic-m-core-card .cc-lb { color: #e6edf3; }
    .ic-m-core-card:active { background: var(--bg-card-hi, #f4f7ff); border-color: var(--blue-light, #4a70f5); }

    /* v2.6.1: 모바일 2열 섹션 (채용공고 + 강의 한 행) */
    .ic-m-two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; align-items: start; margin-bottom: 22px; }
    .ic-m-two-col > .ic-m-section { margin-bottom: 0; min-width: 0; }
    .ic-m-two-col .ic-m-section-head { font-size: 12.5px; gap: 4px; }
    .ic-m-two-col .ic-m-more { font-size: 10.5px; }


    /* v2.8.27: 모바일 로그인 계정 카드 (PC 사이드바 계정 카드 이식) */
    .m-account-card { display: flex; flex-direction: column; gap: 10px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 12px; padding: 12px; box-shadow: var(--sh-sm); margin: 0 0 14px; }
    .m-account-card #ic-auth-m { padding-bottom: 10px; border-bottom: 1px solid var(--border); }
    .m-account-card .side-submit-single, .m-account-card .side-search-btn { width: 100%; margin: 0; }
    /* v2.11.0 fix: body.ic-mobile .side-submit-single(특이도 0,2,1)가 위 규칙(0,2,0)을 이겨 좌우 14px 마진+width:100%로 카드 밖 이탈 → 더 높은 특이도(0,3,1)로 마진 0 강제 */
    body.ic-mobile .m-account-card .side-submit-single,
    body.ic-mobile .m-account-card .side-search-btn { width: 100%; margin: 0; }
    body.ic-mobile .m-account-card .m-posting-cta {
      flex: 1.45 1 0 !important;
      min-height: 46px !important;
      padding: 8px 7px !important;
      border-radius: 11px !important;
      background: linear-gradient(135deg, #f59e0b 0%, #f97316 46%, #db2777 100%) !important;
      color: #fff !important;
      font-weight: 900 !important;
      font-size: 13px !important;
      line-height: 1.15 !important;
      letter-spacing: 0 !important;
      white-space: normal !important;
      box-shadow: 0 11px 24px rgba(249,115,22,0.34), 0 0 0 1px rgba(255,255,255,0.24) inset !important;
      display: flex !important;
      flex-direction: column !important;
      align-items: center !important;
      justify-content: center !important;
      gap: 3px !important;
    }
    body.ic-mobile .m-account-card .m-posting-cta::before {
      content: "7~8월 등록비 이벤트";
      display: block;
      font-size: 10px;
      font-weight: 900;
      color: rgba(255,255,255,0.92);
      line-height: 1.05;
    }
    body.ic-mobile .m-account-card .m-posting-cta:active {
      transform: scale(0.98);
    }
    @media (prefers-reduced-motion: no-preference) {
      body.ic-mobile .m-account-card .m-posting-cta {
        animation: mPostingCtaPulse 2.4s ease-in-out infinite;
      }
    }
    @keyframes mPostingCtaPulse {
      0%, 100% { box-shadow: 0 11px 24px rgba(249,115,22,0.34), 0 0 0 1px rgba(255,255,255,0.24) inset; }
      50% { box-shadow: 0 14px 30px rgba(219,39,119,0.42), 0 0 0 1px rgba(255,255,255,0.34) inset; }
    }
    /* v2.12.2: 계정카드 — 유틸 3열(앱공유·운영자문의·파트너전용) + 하단(빠른검색·방문통계) 2열 */
    .m-acc-util3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6px; }
    .m-acc-util { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; padding: 9px 4px; border-radius: 9px; background: var(--bg); border: 1px solid var(--border); color: var(--txt-mid); font-size: 11px; font-weight: 700; text-decoration: none; cursor: pointer; font-family: inherit; text-align: center; }
    .m-acc-util span { font-size: 16px; line-height: 1; }
    .m-acc-util:hover { border-color: var(--blue-mid); color: var(--blue-mid); }
    .m-acc-bottom2 { display: grid; grid-template-columns: 1.05fr 1fr; gap: 6px; align-items: stretch; }
    body.ic-mobile .m-acc-bottom2 .side-search-btn { margin: 0 !important; width: 100% !important; height: 100%; box-sizing: border-box; padding: 9px 10px !important; justify-content: center; gap: 6px !important; }
    .m-acc-bottom2 .side-search-btn .ssb-label { flex: 0 0 auto; text-align: center; }
    /* v2.12.3: 로그인 행 우측 테마(화면전환) 미니 토글 */
    .m-acc-theme { display: inline-flex; gap: 3px; flex-shrink: 0; margin-left: 6px; }
    .m-acc-theme .ic-m-theme-btn { width: 26px; height: 26px; font-size: 12.5px; border-radius: 7px; padding: 0; display: inline-flex; align-items: center; justify-content: center; }
    .m-acc-visit { display: flex; align-items: center; justify-content: center; gap: 4px; padding: 9px 8px; border-radius: 9px; background: var(--bg); border: 1px solid var(--border); font-size: 11.5px; color: var(--txt-mid); white-space: nowrap; }
    .m-acc-visit strong { color: var(--txt-hi); font-weight: 800; }
    .m-acc-visit .ic-m-stats-dot { flex-shrink: 0; }

    .ic-m-hero {
      padding: 18px 16px 18px;
      background: linear-gradient(135deg, #1a3de8 0%, #00c8ee 100%);
      color: #fff;
      margin: -16px -16px 18px;
      border-radius: 0 0 24px 24px;
      box-shadow: 0 8px 24px rgba(26,61,232,0.20);
      position: relative;
      overflow: hidden;
      /* v2.0.4: 시계 + 로고 가로 배치 */
      display: flex;
      align-items: center;
      gap: 12px;
    }
    /* v2.0.4: 헤더 컴팩트 시계 (로고 왼쪽) */
    .ic-m-hero-clock {
      position: relative;
      z-index: 2;
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding: 8px 12px;
      background: rgba(255,255,255,0.18);
      border-radius: 12px;
      backdrop-filter: blur(8px);
      -webkit-backdrop-filter: blur(8px);
      min-width: 88px;
      box-shadow: inset 0 0 0 1px rgba(255,255,255,0.18);
    }
    .ic-m-hero-clock-time {
      font: 800 18px/1 'Pretendard', sans-serif;
      letter-spacing: 0.02em;
      color: #fff;
      font-variant-numeric: tabular-nums;
      text-shadow: 0 1px 2px rgba(0,0,0,0.18);
    }
    .ic-m-hero-clock-time .ic-clock-colon { animation: colonBlink 1s steps(2, end) infinite; }
    .ic-m-hero-clock-date {
      font: 600 10.5px/1 'Pretendard', sans-serif;
      color: rgba(255,255,255,0.88);
      margin-top: 4px;
      font-variant-numeric: tabular-nums;
    }
    .ic-m-hero-clock-day { font-weight: 700; }
    .ic-m-hero::before {
      content: '';
      position: absolute;
      top: -40%; right: -20%;
      width: 200px; height: 200px;
      background: radial-gradient(circle, rgba(255,255,255,0.16), transparent 70%);
      pointer-events: none;
    }
    .ic-m-hero::after {
      content: '';
      position: absolute;
      bottom: -50%; left: -10%;
      width: 180px; height: 180px;
      background: radial-gradient(circle, rgba(255,255,255,0.10), transparent 70%);
      pointer-events: none;
    }
    .ic-m-hero-logo {
      position: relative;
      max-width: 100%;
      max-height: 52px;
      width: auto;
      height: auto;
      display: block;
      margin: 0;
      padding: 8px 14px;
      background: #ffffff;
      border-radius: 12px;
      box-shadow: 0 4px 16px rgba(0,0,0,0.15);
      box-sizing: content-box;
      flex: 1;
      min-width: 0;
      object-fit: contain;
    }
    .ic-m-hero-logo-wrap {
      flex: 1; min-width: 0;
      display: flex; justify-content: flex-end; align-items: center;
    }
    [data-theme="dark"] .ic-m-hero-logo {
      background: #ffffff; /* 다크모드에서도 흰 카드 유지 (로고 검정 텍스트 가독성) */
    }

    .ic-m-section { margin-bottom: 22px; }
    .ic-m-section-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 10px;
      font-size: 14px;
      font-weight: 800;
      color: var(--txt-hi);
      letter-spacing: -0.01em;
      padding: 0 4px;
    }
    .ic-m-more {
      font-size: 11.5px;
      font-weight: 700;
      color: var(--blue-mid);
      background: transparent;
      border: none;
      cursor: pointer;
      padding: 4px 6px;
    }
    .ic-m-menu-grid {
      display: grid;
      grid-template-columns: repeat(5, 1fr);
      gap: 8px;
    }
    @media (max-width: 380px) { .ic-m-menu-grid { grid-template-columns: repeat(4, 1fr); } }
    .ic-m-menu-card {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 5px;
      padding: 12px 4px;
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 12px;
      cursor: pointer;
      font-family: inherit;
      transition: transform 0.12s, box-shadow 0.15s, border-color 0.15s;
    }
    .ic-m-menu-card:active { transform: scale(0.95); }
    .ic-m-menu-icon { font-size: 22px; }
    .ic-m-menu-label { font-size: 11px; font-weight: 700; color: var(--txt-hi); letter-spacing: -0.01em; }

    .ic-m-list { display: flex; flex-direction: column; gap: 8px; }
    .ic-m-list-item {
      display: flex;
      gap: 12px;
      align-items: center;
      padding: 10px 12px;
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 12px;
      cursor: pointer;
      transition: transform 0.12s;
    }
    .ic-m-list-item:active { transform: scale(0.98); }
    .ic-m-list-thumb {
      width: 56px; height: 56px; flex-shrink: 0;
      border-radius: 10px; overflow: hidden;
      background: var(--bg);
      display: flex; align-items: center; justify-content: center;
      font-size: 20px;
    }
    .ic-m-list-thumb img { width: 100%; height: 100%; object-fit: cover; }
    .ic-m-list-body { flex: 1; min-width: 0; }
    .ic-m-list-title {
      font-size: 13.5px; font-weight: 700; color: var(--txt-hi);
      overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
      margin-bottom: 2px;
    }
    .ic-m-list-meta {
      font-size: 11px; color: var(--txt-lo);
      overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    }
    .ic-m-list-skel {
      height: 80px;
      border-radius: 12px;
      background: linear-gradient(90deg, var(--bg) 0%, var(--bg-card) 50%, var(--bg) 100%);
      background-size: 200% 100%;
      animation: jobsSkel 1.4s ease-in-out infinite;
    }
    .ic-m-list-empty {
      padding: 24px 12px;
      text-align: center;
      color: var(--txt-lo);
      font-size: 13px;
      background: var(--bg);
      border-radius: 12px;
    }
    .ic-m-rank-row {
      display: flex; gap: 10px; align-items: center;
      padding: 9px 12px;
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 10px;
    }
    .ic-m-rank-medal {
      width: 24px; height: 24px;
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      font-weight: 900; font-size: 12px; flex-shrink: 0;
    }
    .ic-m-rank-medal.r1 { background: linear-gradient(135deg,#f59e0b,#fbbf24); color:#7c3000; }
    .ic-m-rank-medal.r2 { background: rgba(26,61,232,0.15); color: var(--blue-mid); }
    .ic-m-rank-medal.r3 { background: rgba(26,61,232,0.07); color: var(--txt-mid); }
    .ic-m-rank-medal.rn { background: rgba(0,0,0,0.04); color: var(--txt-lo); }
    .ic-m-rank-name { flex: 1; font-size: 13px; font-weight: 700; color: var(--txt-hi); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .ic-m-rank-cnt { font-size: 11.5px; color: var(--txt-lo); font-weight: 700; }
    /* 모바일 검색 바 */
    .ic-m-search-section { margin-top: -10px; }
    .ic-m-search-bar {
      display: flex;
      align-items: center;
      gap: 10px;
      width: 100%;
      padding: 13px 16px;
      background: var(--bg-card);
      border: 1.5px solid var(--border);
      border-radius: 14px;
      cursor: pointer;
      font-family: inherit;
      box-shadow: 0 2px 8px rgba(12,31,184,0.04);
      transition: border-color 0.18s, box-shadow 0.18s;
    }
    .ic-m-search-bar:active { border-color: var(--blue-mid); }
    .ic-m-search-icon { font-size: 16px; }
    .ic-m-search-text { color: var(--txt-lo); font-size: 13.5px; }

    /* 모바일 시계 카드 */
    .ic-m-clock-card {
      padding: 16px 18px;
      background: linear-gradient(135deg, var(--blue-mid) 0%, var(--blue-deep) 100%);
      color: #fff;
      border-radius: 16px;
      position: relative;
      overflow: hidden;
      box-shadow: 0 8px 22px rgba(26,61,232,0.20);
    }
    .ic-m-clock-card::before {
      content: '';
      position: absolute;
      top: -30%; right: -10%;
      width: 130px; height: 130px;
      background: radial-gradient(circle, rgba(255,255,255,0.18), transparent 70%);
    }
    .ic-m-clock-head {
      position: relative;
      display: flex; align-items: center; justify-content: space-between;
      font-size: 10.5px; letter-spacing: 0.08em; opacity: 0.92;
      margin-bottom: 6px; font-weight: 700;
    }
    .ic-m-clock-dot {
      display: inline-block; width: 7px; height: 7px;
      background: #4ade80; border-radius: 50%;
      box-shadow: 0 0 6px rgba(74,222,128,0.7);
      margin-right: 6px;
      animation: clockDotPulse 2s ease-in-out infinite;
    }
    .ic-m-clock-label { flex: 1; }
    .ic-m-clock-time {
      position: relative;
      font-size: 34px; font-weight: 800;
      font-variant-numeric: tabular-nums;
      line-height: 1; display: flex; align-items: baseline; gap: 1px;
    }
    .ic-m-clock-colon { animation: colonBlink 1s steps(2, end) infinite; }
    .ic-m-clock-seconds { font-size: 15px; font-weight: 600; opacity: 0.7; margin-left: 6px; }
    .ic-m-clock-date {
      position: relative;
      font-size: 11.5px; margin-top: 8px;
      display: flex; align-items: center; gap: 6px; opacity: 0.95;
    }
    .ic-m-clock-day {
      background: rgba(255,255,255,0.18);
      padding: 2px 8px; border-radius: 8px;
      font-weight: 700; font-size: 10.5px;
    }

    /* 모바일 배너 카드 — PC 사이드바와 같은 글로우·shine 효과 */
    .ic-m-banner-card {
      display: block;
      width: 100%;
      padding: 0;
      background: var(--bg-card);
      border: 1.5px solid rgba(99,179,237,0.35);
      border-radius: 14px;
      overflow: hidden;
      cursor: pointer;
      font-family: inherit;
      position: relative;
      animation: promo-glow 3s ease-in-out infinite;
    }
    .ic-m-banner-card::before {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0; bottom: 0;
      background: linear-gradient(105deg, transparent 40%, rgba(255,255,255,0.18) 50%, transparent 60%);
      transform: translateX(-100%) skewX(-18deg);
      animation: promo-shine 3.5s ease-in-out infinite;
      pointer-events: none;
      z-index: 1;
    }
    /* 모바일 배너 thumb — 풀너비, aspect-ratio 동적 */
    .ic-m-banner-thumb {
      position: relative;
      width: 100%;
      aspect-ratio: 16 / 10;
      overflow: hidden;
      background: rgba(26,61,232,0.06);
      display: block;
    }
    [data-theme="dark"] .ic-m-banner-thumb { background: rgba(74,112,245,0.10); }
    /* v2.1.26: .side-cn-card 모바일 애니메이션 오버라이드 제거 */
    .ic-m-banner-meta {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 10px 14px;
      border-top: 1px solid var(--border);
    }
    .ic-m-banner-label {
      font-size: 9.5px; font-weight: 800;
      padding: 2px 7px;
      background: linear-gradient(135deg, #a78bfa, #6366f1);
      color: #fff;
      border-radius: 8px;
      letter-spacing: 0.06em;
    }
    .ic-m-banner-title {
      flex: 1; font-size: 12.5px; font-weight: 700;
      color: var(--txt-hi);
      overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    }
    .ic-m-banner-count {
      font-size: 10.5px; color: var(--txt-lo); font-weight: 600;
    }

    /* 모바일 커뮤니티 그리드 */
    .ic-m-comm-grid { display: flex; flex-direction: column; gap: 8px; }
    /* v2.0.4: 모바일 홈 — 공고 등록 CTA */
    .ic-m-submit-grid {
      display: grid;
      grid-template-columns: 1fr;
      gap: 10px;
    }
    .ic-m-submit-card {
      display: flex; align-items: center; gap: 12px;
      padding: 14px 16px;
      background: linear-gradient(135deg, rgba(26,61,232,0.08), rgba(219,39,119,0.08));
      border: 1.5px dashed rgba(26,61,232,0.35);
      border-radius: 14px;
      color: var(--txt-hi);
      cursor: pointer;
      text-align: left;
      transition: transform 0.12s, box-shadow 0.12s;
      font-family: inherit;
    }
    .ic-m-submit-card:active { transform: scale(0.98); }
    .ic-m-submit-card.lecture { border-color: rgba(219,39,119,0.4); }
    .ic-m-submit-icon { font-size: 28px; flex-shrink: 0; }
    .ic-m-submit-body { flex: 1; min-width: 0; }
    .ic-m-submit-title { font-size: 14px; font-weight: 800; margin-bottom: 2px; }
    .ic-m-submit-sub   { font-size: 11px; color: var(--txt-lo); }
    .ic-m-submit-arrow { font-size: 18px; color: var(--txt-lo); flex-shrink: 0; }

    .ic-m-comm-btn {
      display: flex; align-items: center; gap: 12px;
      padding: 14px 16px;
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 14px;
      text-decoration: none;
      color: var(--txt-hi);
      transition: transform 0.12s;
    }
    .ic-m-comm-btn:active { transform: scale(0.98); }
    .ic-m-comm-icon {
      font-size: 24px;
      flex-shrink: 0;
      width: 40px; height: 40px;
      display: flex; align-items: center; justify-content: center;
      border-radius: 10px;
      overflow: hidden;
      background: #fff;
    }
    .ic-m-comm-icon img,
    .ic-m-comm-icon picture {
      width: 100%; height: 100%;
      object-fit: cover;
      display: block;
    }
    .ic-m-comm-icon picture img { width: 100%; height: 100%; object-fit: cover; }
    .ic-m-comm-body { flex: 1; min-width: 0; }
    .ic-m-comm-title { font-size: 14px; font-weight: 800; margin-bottom: 2px; }
    .ic-m-comm-sub   { font-size: 11.5px; color: var(--txt-lo); }
    .ic-m-comm-arrow { color: var(--blue-mid); font-size: 16px; font-weight: 700; }

    /* 모바일 도구 그리드 */
    .ic-m-tools-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 8px;
    }
    .ic-m-tool-btn {
      display: flex; flex-direction: column; align-items: center; gap: 5px;
      padding: 14px 6px;
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 12px;
      text-decoration: none;
      color: var(--txt-hi);
      font-family: inherit;
      cursor: pointer;
      font-size: 11.5px; font-weight: 700;
      transition: transform 0.12s;
    }
    .ic-m-tool-btn:active { transform: scale(0.95); }
    .ic-m-tool-btn span:first-child { font-size: 22px; }

    /* 모바일 통계 + 테마 (맨 아래) */
    .ic-m-bottom {
      display: flex; align-items: center; justify-content: space-between;
      padding-top: 6px;
    }
    .ic-m-stats-row {
      font-size: 11.5px; color: var(--txt-mid);
      display: flex; align-items: center; gap: 4px;
    }
    .ic-m-stats-row strong { color: var(--txt-hi); font-weight: 800; margin: 0 2px; }
    .ic-m-stats-dot {
      width: 6px; height: 6px; background: #4ade80;
      border-radius: 50%; margin-right: 5px;
      box-shadow: 0 0 5px rgba(74,222,128,0.6);
    }
    .ic-m-theme-row { display: flex; gap: 4px; }
    .ic-m-theme-btn {
      width: 32px; height: 32px;
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 10px;
      cursor: pointer; font-size: 14px;
      font-family: inherit;
    }
    .ic-m-theme-btn.active {
      background: var(--blue-mid); border-color: var(--blue-mid); color: #fff;
    }

    /* 모바일 모드일 때 PC 전용 요소 모두 숨김 */
    body.ic-mobile .right-nav-group { display: none !important; }
    body.ic-mobile .live-monitor { display: none !important; }
    /* 모바일에서 사이드바·햄버거·백드롭 완전 숨김 (열리지 않음) */
    body.ic-mobile .side-nav,
    body.ic-mobile .side-toggle,
    body.ic-mobile #side-backdrop,
    body.ic-mobile .mobile-bottom-nav,
    body.ic-mobile .mobile-bottom-nav-toggle { display: none !important; }
    /* 콘텐츠 패딩 조정 (햄버거·하단 nav 사라졌으니) */
    body.ic-mobile .content { padding-top: 12px !important; padding-bottom: 40px !important; }
    body.ic-mobile .back-bar { left: 0 !important; }

    /* ════════════════════════════════════════════
       MOBILE 전용 사이드바 (깔끔하게 풀스크린)
       ════════════════════════════════════════════ */
    body.ic-mobile .side-nav {
      width: 88vw !important;
      max-width: 360px !important;
      box-shadow: 0 0 32px rgba(0,0,0,0.20);
      overflow-y: auto !important;
      -webkit-overflow-scrolling: touch;
    }
    body.ic-mobile .side-nav-header {
      padding: 18px 16px 14px !important;
    }
    body.ic-mobile .side-nav-header img {
      max-height: 38px !important;
      width: auto !important;
    }
    body.ic-mobile .menu-tab {
      padding: 13px 16px !important;
      font-size: 14.5px !important;
      font-weight: 700 !important;
      gap: 10px !important;
    }
    body.ic-mobile .sub-menu-item {
      padding: 11px 16px 11px 36px !important;
      font-size: 13px !important;
    }
    /* 빠른 검색 버튼 — 모바일에서 더 크게 */
    body.ic-mobile .side-search-btn {
      width: calc(100% - 24px) !important;
      margin: 10px 12px 8px !important;
      padding: 12px 14px !important;
      font-size: 13.5px !important;
      gap: 10px !important;
    }
    /* 시계 — 모바일 사이드바에서 더 보기 좋게 */
    body.ic-mobile .side-clock {
      margin: 8px 12px 12px !important;
      padding: 14px 16px 12px !important;
    }
    body.ic-mobile .side-clock-time { font-size: 30px !important; }
    body.ic-mobile .side-clock-time .ic-clock-seconds { font-size: 14px !important; }
    /* v2.1.26: 모바일 사이드바 배너 카드 CSS 제거 (배너 기능 폐지) */
    /* 커뮤니티 섹션 */
    body.ic-mobile .side-comm-section { padding: 10px 12px !important; }
    body.ic-mobile .side-comm-btn {
      padding: 11px 12px !important;
      font-size: 12.5px !important;
      gap: 8px !important;
    }
    body.ic-mobile .side-comm-btn img { width: 36px !important; height: 36px !important; }
    /* 푸터 링크 */
    body.ic-mobile .side-footer { padding: 8px 12px 14px !important; }
    body.ic-mobile .side-footer-link {
      padding: 10px 12px !important;
      font-size: 13px !important;
    }
    body.ic-mobile .side-stats {
      padding: 8px 12px !important;
      font-size: 11.5px !important;
    }

    /* ════════════════════════════════════════════
       MOBILE 전용 페이지 컴포넌트 (Phase 2)
       채용공고·강의·소식지·청구서류·카드뉴스·보험지식 카드 통일
       ════════════════════════════════════════════ */
    body.ic-mobile .content {
      padding: 12px 14px 80px;
    }
    body.ic-mobile .section-head {
      margin-bottom: 14px !important;
      padding: 0 4px;
    }
    body.ic-mobile .section-head .sec-num { display: none; }
    body.ic-mobile .section-head .sec-title {
      font-size: 16px;
      font-weight: 800;
      color: var(--txt-hi);
      letter-spacing: -0.01em;
    }

    /* 모바일에서 채용공고/강의 카드 그리드 → 1열 큰 카드 */
    body.ic-mobile .rc-card-grid {
      grid-template-columns: 1fr;
      gap: 12px;
    }
    body.ic-mobile .rc-card {
      display: flex;            /* v2.6.5: 누락된 display:flex 추가 — flex-direction:row가 적용되어 [썸네일|본문] 가로 배치 (우측 빈 여백 제거) */
      flex-direction: row;
      align-items: center;
      max-height: 120px;
    }
    body.ic-mobile .rc-card-thumb {
      width: 110px;
      height: 110px;
      align-self: stretch;
      flex-shrink: 0;
      aspect-ratio: 1;
    }
    body.ic-mobile .rc-card-body {
      flex: 1;
      min-width: 0;
      justify-content: center;
      padding: 10px 14px;
    }
    body.ic-mobile .rc-card-title {
      -webkit-line-clamp: 2;
      font-size: 14px;
      line-height: 1.35;
    }
    body.ic-mobile .rc-card-company { font-size: 11px; }
    body.ic-mobile .rc-card-date { font-size: 10.5px; }

    /* 모바일에서 소식지·청구서류 카드 그리드 → 2열 */
    body.ic-mobile .nl-items-grid {
      grid-template-columns: repeat(2, 1fr) !important;
      gap: 10px;
    }
    body.ic-mobile .nl-card {
      padding: 14px 10px;
    }
    body.ic-mobile .nl-card-icon { font-size: 32px; margin-bottom: 6px; }
    body.ic-mobile .nl-card-title { font-size: 12.5px; }
    body.ic-mobile .nl-card-date  { font-size: 10px; }

    /* 모바일에서 보험사 전산·GA 카드 → 2열 */
    body.ic-mobile .grid {
      grid-template-columns: repeat(2, 1fr) !important;
      gap: 10px;
    }
    body.ic-mobile .card { padding: 14px 10px; }
    body.ic-mobile .c-badge { width: 48px; height: 48px; }
    body.ic-mobile .c-name { font-size: 13px; }
    body.ic-mobile .c-type { font-size: 10px; }

    /* v2.0.3: 모바일에서 카드뉴스(최신)·보험지식 그리드 → 2열 */
    body.ic-mobile .cn-tile-grid {
      grid-template-columns: repeat(2, 1fr) !important;
      gap: 10px;
    }
    body.ic-mobile .cn-tile-title { font-size: 12.5px; }

    body.ic-mobile .kn-card-grid {
      grid-template-columns: repeat(2, 1fr) !important;
      gap: 10px;
    }
    body.ic-mobile .kn-card { padding: 12px 10px; }
    body.ic-mobile .kn-card-title { font-size: 13px; line-height: 1.35; }
    body.ic-mobile .kn-card-meta { font-size: 10px; }
    /* 매우 작은 화면(<360px)에서는 1열로 폴백 */
    @media (max-width: 359px) {
      body.ic-mobile .cn-tile-grid,
      body.ic-mobile .kn-card-grid {
        grid-template-columns: 1fr !important;
      }
    }

    /* 모바일 검색 input — 풀 너비 */
    body.ic-mobile .ic-search-input,
    body.ic-mobile .nlcf-search-wrap,
    body.ic-mobile .ic-search-wrap {
      max-width: 100%;
    }
    body.ic-mobile .ic-search-input {
      font-size: 15px;
      padding: 12px 16px 12px 42px;
    }

    /* 모바일에서 모달 — 풀 화면 (sb-modal / promo-popup 제거됨) */
    body.ic-mobile .cn-modal,
    body.ic-mobile #rc-viewer,
    body.ic-mobile .kn-modal,
    body.ic-mobile #home-popup-overlay {
      padding: 0 !important;
    }
    body.ic-mobile .cn-modal-body,
    body.ic-mobile #rc-viewer .rc-viewer-card,
    body.ic-mobile .kn-modal-card,
    body.ic-mobile #home-popup-overlay > .hp-modal {
      max-width: 100% !important;
      max-height: 100dvh !important;
      border-radius: 0 !important;
      width: 100% !important;
      height: 100dvh !important;
    }

    /* 모바일에서 sidebar는 햄버거로 열고 닫는 기존 동작 유지하되,
       데스크탑 사이드바 콘텐츠는 보이게 (생략) */

    /* ════════════════════════════════════════════
       통일된 검색 input 디자인 (.ic-search-input)
       ════════════════════════════════════════════ */
    input.ic-search-input,
    .ic-search-input {
      width: 100%;
      padding: 11px 16px 11px 40px;
      font-size: 14px;
      font-family: inherit;
      color: var(--txt-hi);
      background-color: var(--bg-card);
      background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238fa5cc' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='11' cy='11' r='7'/><line x1='21' y1='21' x2='16.65' y2='16.65'/></svg>");
      background-repeat: no-repeat;
      background-position: 12px center;
      background-size: 18px 18px;
      border: 1.5px solid var(--border);
      border-radius: 12px;
      outline: none;
      transition: border-color 0.18s, box-shadow 0.18s;
      box-shadow: 0 1px 3px rgba(12,31,184,0.04);
      letter-spacing: -0.01em;
      box-sizing: border-box;
    }
    input.ic-search-input::placeholder,
    .ic-search-input::placeholder {
      color: var(--txt-lo);
      letter-spacing: -0.01em;
    }
    input.ic-search-input:focus,
    .ic-search-input:focus {
      border-color: var(--blue-mid);
      box-shadow: 0 0 0 3px rgba(26,61,232,0.10), 0 2px 8px rgba(26,61,232,0.06);
    }
    [data-theme="dark"] input.ic-search-input,
    [data-theme="dark"] .ic-search-input {
      border-color: rgba(255,255,255,0.08);
    }
    .ic-search-wrap {
      position: relative;
      width: 100%;
      max-width: 520px;
      margin: 0 0 14px;
    }

    /* v2.1.25: 즐겨찾기 floating popup — 홈에서 마우스로 드래그 이동 가능
       (구) .ic-hero-fav 컨테이너는 제거, #home-fav-section 이 #fav-float-popup 안으로 이동 */
    .fav-float-popup {
      position: fixed;
      top: 96px;
      right: 28px;
      width: 280px;
      max-height: min(62vh, 540px);
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 16px;
      box-shadow: 0 16px 48px rgba(0,0,0,0.20);
      display: flex;
      flex-direction: column;
      z-index: 250;
      overflow: hidden;
      user-select: none;
      transition: box-shadow .2s, opacity .2s;
    }
    .fav-float-popup.dragging {
      box-shadow: 0 24px 64px rgba(0,0,0,0.32);
      opacity: 0.96;
      transition: none;
    }
    .fav-float-handle {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 10px 12px 10px 10px;
      background: linear-gradient(135deg, rgba(26,61,232,0.10), rgba(159,122,234,0.08));
      border-bottom: 1px solid var(--border);
      cursor: grab;
      touch-action: none;   /* 모바일 드래그용 — 스크롤 차단 */
    }
    .fav-float-handle:active,
    .fav-float-popup.dragging .fav-float-handle { cursor: grabbing; }
    .fav-float-grip {
      font-size: 14px;
      letter-spacing: -2px;
      color: var(--txt-lo);
      font-weight: 800;
      line-height: 1;
      padding: 0 2px;
    }
    .fav-float-title {
      font-size: 12.5px;
      font-weight: 800;
      color: var(--txt-hi);
      letter-spacing: 0.04em;
      flex: 1;
    }
    .fav-float-count {
      font-size: 10px;
      font-weight: 800;
      padding: 2px 7px;
      border-radius: 10px;
      background: rgba(26,61,232,0.12);
      color: var(--blue-mid);
    }
    [data-theme="dark"] .fav-float-count {
      background: rgba(124,158,255,0.18);
      color: #93c5fd;
    }
    .fav-float-close {
      background: transparent;
      border: none;
      font-size: 20px;
      line-height: 1;
      color: var(--txt-lo);
      cursor: pointer;
      width: 26px; height: 26px;
      border-radius: 6px;
      padding: 0;
      transition: background .12s, color .12s;
    }
    .fav-float-close:hover { background: rgba(0,0,0,0.08); color: var(--txt-hi); }
    [data-theme="dark"] .fav-float-close:hover { background: rgba(255,255,255,0.08); }
    .fav-float-body {
      flex: 1;
      min-height: 0;
      overflow-y: auto;
      padding: 12px;
    }
    /* 다시 열기용 FAB */
    .fav-float-reopener {
      position: fixed;
      top: 120px;
      right: 16px;
      width: 48px;
      height: 48px;
      border-radius: 50%;
      border: 1px solid var(--border);
      background: var(--bg-card);
      font-size: 22px;
      cursor: pointer;
      box-shadow: 0 6px 20px rgba(0,0,0,0.18);
      z-index: 250;
      transition: transform .15s, box-shadow .15s;
    }
    .fav-float-reopener:hover {
      transform: scale(1.06);
      box-shadow: 0 8px 26px rgba(0,0,0,0.24);
    }
    /* v2.36.0: 즐겨찾기 플로팅 팝업 제거(사용자 요청) — 데스크톱 포함 전체 숨김. 즐겨찾기 기능(실무도구 ☆·실무도구 페이지)은 유지. */
    .fav-float-popup,
    .fav-float-reopener { display: none !important; }

    /* #home-fav-section 본문 — popup 내부에 들어가는 형태 */
    #fav-float-popup #home-fav-section {
      display: flex;
      flex-direction: column;
      min-height: 0;
      background: transparent;
      border: none;
      padding: 0;
      box-shadow: none;
    }
    #fav-float-popup #home-fav-empty {
      flex: 1;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 8px;
      text-align: center;
      padding: 16px 12px;
      background: var(--bg);
      border-radius: 12px;
      min-height: 180px;
    }
    #fav-float-popup .fav-onboard-icon { font-size: 32px; }
    #fav-float-popup .fav-onboard-title { font-size: 13px; font-weight: 800; color: var(--txt-hi); }
    #fav-float-popup .fav-onboard-desc { font-size: 11.5px; color: var(--txt-mid); line-height: 1.5; }
    #fav-float-popup .fav-onboard-btn {
      padding: 7px 14px;
      font-size: 12px;
      font-weight: 700;
      background: var(--blue-mid);
      color: #fff;
      border-radius: 8px;
      border: none;
      cursor: pointer;
      font-family: inherit;
      margin-top: 4px;
    }
    /* 즐겨찾기 그리드 (popup 컴팩트 1열) */
    #fav-float-popup #home-fav-grid {
      grid-template-columns: 1fr !important;
      gap: 6px !important;
      overflow-y: auto;
      overflow-x: hidden;
      padding-right: 2px;
    }
    /* 추천 도구 카드 (사용자의 즐겨찾기가 적을 때 자동 패딩) */
    #fav-float-popup #home-fav-grid .tool-card.fav-recommended {
      opacity: 0.78;
      background: linear-gradient(135deg, rgba(245,158,11,0.04), transparent) !important;
      border-color: rgba(245,158,11,0.18) !important;
      position: relative;
    }
    #fav-float-popup #home-fav-grid .tool-card.fav-recommended:hover {
      opacity: 1;
      border-color: rgba(245,158,11,0.45) !important;
    }
    .fav-rec-badge {
      flex-shrink: 0;
      font-size: 9px; font-weight: 800;
      color: #f59e0b;
      background: rgba(245,158,11,0.14);
      padding: 2px 6px;
      border-radius: 4px;
      letter-spacing: -0.01em;
      line-height: 1.3;
    }
    [data-theme="dark"] .fav-rec-badge {
      color: #fbbf24;
      background: rgba(251,191,36,0.16);
    }
    .fav-rec-divider {
      grid-column: 1 / -1;
      display: flex; align-items: center; gap: 8px;
      font-size: 10px; font-weight: 700;
      letter-spacing: 0.03em;
      color: #f59e0b;
      padding: 6px 2px 2px;
      margin-top: 4px;
    }
    .fav-rec-divider::before,
    .fav-rec-divider::after {
      content: '';
      flex: 1;
      height: 1px;
      background: linear-gradient(90deg, transparent, rgba(245,158,11,0.30), transparent);
    }
    [data-theme="dark"] .fav-rec-divider { color: #fbbf24; }
    #fav-float-popup #home-fav-grid .tool-card,
    #fav-float-popup #home-fav-grid .portal-card {
      padding: 7px 10px !important;
      gap: 9px !important;
      min-height: auto !important;
      border-width: 1px !important;
      border-radius: 10px !important;
      box-shadow: none !important;
      min-width: 0 !important;
    }
    #fav-float-popup #home-fav-grid .tool-card-icon,
    #fav-float-popup #home-fav-grid .portal-card-logo {
      width: 30px !important;
      height: 30px !important;
      font-size: 16px !important;
      border-radius: 8px !important;
      flex-shrink: 0;
    }
    #fav-float-popup #home-fav-grid .tool-card-body {
      min-width: 0;
      overflow: hidden;
    }
    #fav-float-popup #home-fav-grid .tool-card-name,
    #fav-float-popup #home-fav-grid .portal-card-name {
      font-size: 12px !important;
      font-weight: 700 !important;
      margin-bottom: 0 !important;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    /* 좁은 카드에서는 부가 설명·화살표·복사버튼 숨김 */
    #fav-float-popup #home-fav-grid .tool-card-sub,
    #fav-float-popup #home-fav-grid .tool-card-arrow,
    #fav-float-popup #home-fav-grid .tool-card-copy,
    #fav-float-popup #home-fav-grid .portal-card-sub,
    #fav-float-popup #home-fav-grid .portal-card-meta {
      display: none !important;
    }
    /* 별 버튼(즐겨찾기 해제)은 작게 유지 */
    #fav-float-popup #home-fav-grid .ic-fav-star {
      width: 22px !important;
      height: 22px !important;
      font-size: 13px !important;
      flex-shrink: 0;
    }
    /* 스크롤바 슬림 */
    #fav-float-popup #home-fav-grid::-webkit-scrollbar { width: 4px; }
    #fav-float-popup #home-fav-grid::-webkit-scrollbar-thumb {
      background: rgba(26,61,232,0.18);
      border-radius: 2px;
    }

    /* ═══════ 하단 영역: 채용공고 | 시계 ═══════ */
    .ic-bottom-row {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 280px;
      gap: 14px;
      align-items: stretch;
      margin: 0 0 22px;
    }
    .ic-bottom-row > .ic-jobs { margin-bottom: 0; }
    .ic-bottom-row > .ic-clock { height: 100%; margin: 0; }
    @media (max-width: 900px) {
      .ic-bottom-row { grid-template-columns: 1fr; }
    }
    /* v2.1.25: .ic-hero (통합 정보 허브 카드) 섹션 제거됨 — 관련 CSS 도 함께 삭제 */

    /* iPhone 시계 위젯 스타일 */
    .ic-clock {
      position: relative;
      padding: 22px 24px;
      background: linear-gradient(135deg, #0c1fb8 0%, #1a3de8 55%, #4a70f5 100%);
      border-radius: 18px;
      color: #fff;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      gap: 14px;
      min-height: 200px;
      overflow: hidden;
      box-shadow: 0 10px 30px rgba(12,31,184,0.25);
    }
    .ic-clock::before {
      content: '';
      position: absolute;
      inset: 0;
      background:
        radial-gradient(circle at 20% 0%, rgba(255,255,255,0.18), transparent 50%),
        radial-gradient(circle at 100% 100%, rgba(0,240,255,0.20), transparent 55%);
      pointer-events: none;
    }
    .ic-clock-head {
      position: relative;
      display: flex;
      align-items: center;
      justify-content: space-between;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      opacity: 0.78;
    }
    .ic-clock-head .ic-clock-dot {
      width: 7px; height: 7px;
      background: #4ade80;
      border-radius: 50%;
      box-shadow: 0 0 8px rgba(74,222,128,0.7);
      animation: clockPulse 2s ease-in-out infinite;
    }
    @keyframes clockPulse {
      0%, 100% { opacity: 1; }
      50%       { opacity: 0.45; }
    }
    .ic-clock-time {
      position: relative;
      font-size: clamp(2.8rem, 4vw, 3.4rem);
      font-weight: 300;
      letter-spacing: -0.025em;
      line-height: 1;
      font-variant-numeric: tabular-nums;
      font-feature-settings: 'tnum';
      text-align: center;
    }
    .ic-clock-time .ic-clock-colon {
      display: inline-block;
      animation: colonBlink 1s steps(2, end) infinite;
    }
    .ic-clock-time .ic-clock-seconds {
      font-size: 0.42em;
      font-weight: 400;
      opacity: 0.65;
      vertical-align: super;
      margin-left: 4px;
      letter-spacing: 0;
    }
    @keyframes colonBlink {
      50% { opacity: 0.35; }
    }
    .ic-clock-date {
      position: relative;
      font-size: 13px;
      font-weight: 600;
      letter-spacing: -0.01em;
      opacity: 0.92;
      text-align: center;
    }
    .ic-clock-date .ic-clock-day {
      display: inline-block;
      padding: 1.5px 8px;
      background: rgba(255,255,255,0.16);
      border-radius: 10px;
      margin-right: 6px;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.04em;
    }
    /* v2.1.25: .ic-hero-* (히어로 카드 타이틀/서브/PILL/CTA) 관련 CSS 일괄 제거 */

    .ic-section-title {
      font-size: 1.1rem;
      font-weight: 800;
      color: var(--txt-hi);
      margin: 0 0 14px;
      letter-spacing: -0.01em;
    }
    .ic-features { margin: 0 0 22px; }
    .ic-section-sub {
      font-size: 0.85rem;
      color: var(--txt-mid);
      margin: -6px 0 14px;
      line-height: 1.55;
    }
    .ic-section-sub strong {
      color: var(--blue-mid);
      font-weight: 700;
    }
    .ic-features-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 12px;
    }
    @media (max-width: 900px) { .ic-features-grid { grid-template-columns: repeat(3, 1fr); } }
    @media (max-width: 640px) { .ic-features-grid { grid-template-columns: repeat(2, 1fr); } }
    /* 정보 안내성 카드 — 클릭 불가, hover transform 없음 */
    .ic-feat-card {
      display: flex;
      flex-direction: column;
      gap: 4px;
      padding: 14px 14px 12px;
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 14px;
      box-shadow: var(--sh-sm);
      cursor: default;
      user-select: none;
      min-height: 110px;
      justify-content: flex-start;
    }
    .ic-feat-card .ic-feat-desc { flex: 1; }
    .ic-feat-icon { font-size: 26px; line-height: 1; margin-bottom: 6px; }
    .ic-feat-name {
      font-size: 0.95rem;
      font-weight: 800;
      color: var(--txt-hi);
      letter-spacing: -0.01em;
    }
    .ic-feat-desc {
      font-size: 0.78rem;
      color: var(--txt-mid);
      line-height: 1.45;
      margin-top: 2px;
    }

    /* ══════════════════════════════
       홈 대시보드: 채용공고 쇼케이스 (광고 스타일)
    ══════════════════════════════ */
    .ic-jobs { margin: 0 0 24px; }
    .ic-jobs-head {
      display: flex; align-items: center; gap: 12px;
      margin-bottom: 14px;
    }
    .ic-jobs-title {
      display: flex; align-items: center; gap: 8px;
      font-size: 1.05rem; font-weight: 800;
      color: var(--txt-hi);
      letter-spacing: -0.01em;
    }
    .ic-jobs-pill {
      display: inline-flex; align-items: center; gap: 4px;
      font-size: 10.5px; font-weight: 800;
      padding: 3px 10px; border-radius: 12px;
      background: linear-gradient(135deg, #ef4444, #f97316);
      color: #fff;
      letter-spacing: 0.08em;
      box-shadow: 0 2px 8px rgba(239,68,68,0.30);
      animation: jobsPulse 2.2s ease-in-out infinite;
    }
    /* v2.96.2: box-shadow 애니 → opacity(합성). 정적 box-shadow는 .ic-jobs-pill에 유지. 매 프레임 repaint 제거 */
    @keyframes jobsPulse {
      0%, 100% { opacity: 1; }
      50%       { opacity: 0.7; }
    }
    .ic-jobs-spacer { flex: 1; }
    .ic-jobs-all {
      display: inline-flex; align-items: center; gap: 4px;
      font-size: 12px; font-weight: 700;
      color: var(--blue-mid);
      text-decoration: none;
      padding: 6px 12px; border-radius: 8px;
      background: rgba(26,61,232,0.06);
      transition: all 0.15s;
      cursor: pointer; border: none;
      font-family: inherit;
    }
    .ic-jobs-all:hover {
      background: rgba(26,61,232,0.12);
      transform: translateX(2px);
    }
    .ic-jobs-grid {
      display: grid;
      /* v2.0.7/8: 채용·강의 각각 내부 2열 (좌우 섹션이 가로로 배치되어 총 4열) */
      grid-template-columns: repeat(2, 1fr);
      gap: 12px;
    }
    @media (max-width: 480px) { .ic-jobs-grid { grid-template-columns: 1fr; } }

    /* v2.0.8: 채용공고 + 강의 가로 페어 (PC) / v2.62.0: 모임 추가 → 3열 */
    .ic-jobs-pair {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 14px;
      margin: 18px 0 24px;
    }
    .ic-jobs-pair > .ic-jobs { margin: 0; min-width: 0; }
    @media (max-width: 1024px) {
      .ic-jobs-pair { grid-template-columns: 1fr; gap: 22px; }
    }
    .ic-top-jobs-row {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 300px;
      gap: 14px;
      align-items: start;
      margin: 18px 0 24px;
    }
    .ic-top-jobs-left {
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 14px;
    }
    .ic-top-jobs-left > .ic-jobs-pair,
    .ic-top-jobs-left > .ic-featured {
      margin: 0;
    }
    @media (max-width: 1024px) {
      .ic-top-jobs-row { grid-template-columns: 1fr; }
    }
    .ic-featured {
      padding: 14px 16px;
      border-radius: 16px;
      border: 1px solid #f2c94c;
      background: linear-gradient(135deg, rgba(255,215,64,0.10), rgba(255,179,0,0.05));
      box-shadow: var(--sh-sm);
    }
    [data-theme="dark"] .ic-featured {
      border-color: rgba(242,201,76,0.45);
      background: linear-gradient(135deg, rgba(242,201,76,0.12), rgba(255,179,0,0.06));
    }
    .ic-featured-head {
      display: flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 10px;
    }
    .ic-featured-title {
      font-size: 16px;
      font-weight: 800;
      color: var(--txt-hi);
    }
    .ic-featured-pill {
      font-size: 10.5px;
      font-weight: 800;
      color: #7a5600;
      background: #ffd740;
      padding: 2px 8px;
      border-radius: 999px;
      letter-spacing: 0.06em;
    }
    .ic-featured-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 12px;
    }
    @media (max-width: 1024px) { .ic-featured-grid { grid-template-columns: repeat(2, 1fr); } }
    @media (max-width: 480px) { .ic-featured-grid { grid-template-columns: 1fr; } }
    .ic-job-card {
      position: relative;
      display: flex; flex-direction: column;
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 14px;
      overflow: hidden;
      cursor: pointer;
      text-align: left;
      font-family: inherit;
      padding: 0;
      transition: all 0.2s;
      box-shadow: var(--sh-sm);
    }
    .ic-job-card:hover {
      transform: translateY(-3px);
      box-shadow: 0 10px 24px rgba(0,0,0,0.10);
      border-color: var(--blue-mid);
    }
    .ic-job-card.rc-featured {
      border-color: #f2c94c;
      box-shadow: 0 6px 18px rgba(245,158,11,0.16);
    }
    [data-theme="dark"] .ic-job-card.rc-featured {
      border-color: rgba(242,201,76,0.58);
      box-shadow: 0 6px 18px rgba(242,201,76,0.10);
    }
    .ic-job-thumb {
      position: relative;
      width: 100%;
      aspect-ratio: 4/2.2;
      background: linear-gradient(135deg, #f1f5f9, #e2e8f0);
      overflow: hidden;
      display: flex; align-items: center; justify-content: center;
    }
    [data-theme="dark"] .ic-job-thumb { background: linear-gradient(135deg, #1e293b, #0f172a); }
    .ic-job-thumb img,
    .ic-job-thumb iframe {
      width: 100%; height: 100%;
      object-fit: cover;
      border: none;
      pointer-events: none;
    }
    .ic-job-thumb-fallback {
      font-size: 36px;
      opacity: 0.4;
    }
    .ic-job-new {
      position: absolute;
      top: 8px; left: 8px;
      padding: 3px 8px;
      background: linear-gradient(135deg, #ef4444, #dc2626);
      color: #fff;
      font-size: 9.5px; font-weight: 800;
      letter-spacing: 0.08em;
      border-radius: 10px;
      box-shadow: 0 2px 6px rgba(239,68,68,0.35);
    }
    .ic-job-featured-badge {
      left: auto;
      right: 8px;
      background: linear-gradient(135deg, #f2c94c, #f59e0b);
      color: #4b3500;
      box-shadow: 0 2px 6px rgba(245,158,11,0.32);
    }
    .ic-job-type-badge {
      position: absolute;
      top: 8px; right: 8px;
      padding: 3px 8px;
      background: rgba(0,0,0,0.55);
      backdrop-filter: blur(4px);
      color: #fff;
      font-size: 9.5px; font-weight: 700;
      border-radius: 8px;
      letter-spacing: 0.04em;
    }
    /* v2.1.31: 공유 카운트 배지 — 사회적 증명 */
    .ic-share-badge {
      position: absolute;
      bottom: 8px; right: 8px;
      padding: 3px 8px;
      background: linear-gradient(135deg, #f97316, #ef4444);
      color: #fff;
      font-size: 10px; font-weight: 800;
      border-radius: 999px;
      letter-spacing: 0.02em;
      box-shadow: 0 2px 6px rgba(239,68,68,0.35);
      z-index: 2;
      animation: ic-share-pulse 2.4s ease-in-out infinite;
    }
    @keyframes ic-share-pulse {
      0%,100% { transform: scale(1); }
      50% { transform: scale(1.06); }
    }
    .ic-job-body {
      padding: 9px 11px 11px;
      display: flex; flex-direction: column;
      gap: 2px;
    }
    .ic-job-company {
      font-size: 9.5px; font-weight: 800;
      color: var(--blue-mid);
      letter-spacing: 0.04em;
      text-transform: uppercase;
      overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    }
    .ic-job-title {
      font-size: 12px; font-weight: 700;
      color: var(--txt-hi);
      line-height: 1.35;
      letter-spacing: -0.01em;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
      min-height: 2.7em;
    }
    .ic-job-date {
      font-size: 9.5px;
      color: var(--txt-lo);
      margin-top: 1px;
    }
    /* v2.85.0: 카드 조회수 메타 */
    .ic-job-views { display: inline-flex; align-items: center; gap: 2px; color: var(--txt-lo); font-weight: 600; }
    .ic-job-views svg { opacity: .75; margin-bottom: -1px; }
    .ic-jobs-empty {
      padding: 28px 16px;
      text-align: center;
      color: var(--txt-lo);
      font-size: 13px;
      border: 1px dashed var(--border);
      border-radius: 12px;
    }
    .ic-jobs-skel {
      aspect-ratio: 4/2.6;
      background: linear-gradient(90deg, var(--bg) 0%, var(--bg-card) 50%, var(--bg) 100%);
      background-size: 200% 100%;
      border-radius: 14px;
      animation: jobsSkel 1.4s ease-in-out infinite;
    }
    @keyframes jobsSkel { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }

    /* ══════════════════════════════
       홈 대시보드: 채용공고 + 모임방 대화순위 분할
    ══════════════════════════════ */
    .ic-home-split {
      display: grid;
      grid-template-columns: 1fr 260px;
      gap: 16px;
      margin-bottom: 24px;
      align-items: start;
    }
    @media (max-width: 900px) {
      .ic-home-split { grid-template-columns: 1fr; }
    }
    /* 모임방 대화 순위 패널 */
    .ic-kakao-panel {
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 16px;
      padding: 14px;
      box-shadow: var(--sh-sm);
      display: flex;
      flex-direction: column;
      gap: 10px;
      /* v2.119.0: 좌측 공고 컬럼이 가변 높이가 되어 stretch 제거 — 자연 높이 + sticky */
      align-self: start;
      min-height: 0;
    }
    @media (min-width: 1025px) {
      .ic-kakao-panel { position: sticky; top: 14px; }
    }
    .ic-kakao-head {
      display: flex;
      align-items: center;
      gap: 8px;
    }
    .ic-kakao-title {
      font-size: 0.9rem;
      font-weight: 800;
      color: var(--txt-hi);
      flex: 1;
    }
    .ic-kakao-badge {
      font-size: 9px;
      font-weight: 900;
      padding: 2px 7px;
      border-radius: 10px;
      background: linear-gradient(135deg, #fee500, #f97316);
      color: #1a1a1a;
      letter-spacing: 0.03em;
    }
    .ic-kakao-meta {
      font-size: 10.5px;
      color: var(--txt-lo);
      padding: 6px 10px;
      background: var(--bg);
      border-radius: 8px;
      /* 2행 세로 정렬 (좁은 컬럼에서 텍스트 밀림 방지) */
      display: flex;
      flex-direction: column;
      gap: 2px;
    }
    .ic-kakao-meta-label {
      font-weight: 700;
      color: var(--txt-mid);
      font-size: 11px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .ic-kakao-meta > #home-kakao-period {
      font-size: 10px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .ic-kakao-rank-list {
      display: flex; flex-direction: column; gap: 5px;
      /* v2.119.0: 패널 자연 높이에 맞춰 항목을 위에서부터 자연 흐름으로 배치 */
      flex: 0 1 auto;
      min-height: 0;
      overflow-y: auto;
      scrollbar-width: thin;
    }
    .ic-kakao-panel.has-highlight .ic-kakao-rank-list {
      flex: 0 0 auto;
      max-height: 255px;
    }
    /* 항목 자체도 살짝 키워 빈 공간 없이 채움 */
    .ic-kakao-rank-list > .ic-kakao-rank-item { padding-top: 9px; padding-bottom: 9px; }
    .ic-kakao-rank-list::-webkit-scrollbar { width: 4px; }
    .ic-kakao-rank-list::-webkit-scrollbar-thumb {
      background: rgba(120,120,120,0.25);
      border-radius: 4px;
    }
    /* 업데이트 시각은 카드 하단에 고정 */
    .ic-kakao-updated { margin-top: auto; }
    .ic-kakao-rank-item {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 7px 10px;
      border-radius: 10px;
      background: var(--bg);
    }
    .ic-kakao-rank-medal {
      min-width: 22px;
      height: 22px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 12px;
      font-weight: 900;
      flex-shrink: 0;
    }
    .ic-kakao-rank-medal.r1 { background: linear-gradient(135deg, #f59e0b, #fbbf24); color: #7c3000; }
    .ic-kakao-rank-medal.r2 { background: linear-gradient(135deg, #6b7280, #9ca3af); color: #fff; }
    .ic-kakao-rank-medal.r3 { background: linear-gradient(135deg, #b45309, #d97706); color: #fff; }
    .ic-kakao-rank-medal.rn { background: rgba(26,61,232,0.08); color: var(--txt-lo); font-size: 10px; }
    .ic-kakao-rank-name {
      flex: 1;
      font-size: 0.8rem;
      font-weight: 700;
      color: var(--txt-hi);
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .ic-kakao-rank-cnt {
      font-size: 11px;
      font-weight: 700;
      color: var(--txt-lo);
      white-space: nowrap;
    }
    .ic-kakao-skel {
      height: 36px;
      border-radius: 10px;
      background: linear-gradient(90deg, var(--bg) 0%, var(--bg-card) 50%, var(--bg) 100%);
      background-size: 200% 100%;
      animation: jobsSkel 1.4s ease-in-out infinite;
    }
    .ic-kakao-empty {
      text-align: center;
      padding: 20px 10px;
      color: var(--txt-lo);
      font-size: 12.5px;
      line-height: 1.6;
    }
    .ic-kakao-updated {
      font-size: 10px;
      color: var(--txt-lo);
      text-align: right;
      line-height: 1.5;
      display: flex;
      flex-direction: column;
      gap: 1px;
      margin-top: auto;  /* v2.1.12: 카드 하단에 고정 */
    }
    .ic-kakao-updated > span { display: block; }
    .ic-notice-panel {
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 16px;
      padding: 14px;
      box-shadow: var(--sh-sm);
      display: flex;
      flex-direction: column;
      gap: 10px;
      min-height: 0;
    }
    .ic-notice-head {
      display: flex;
      align-items: center;
      gap: 8px;
    }
    .ic-notice-title {
      font-size: 0.9rem;
      font-weight: 800;
      color: var(--txt-hi);
    }
    .ic-notice-badge {
      font-size: 10px;
      font-weight: 800;
      color: #fff;
      background: linear-gradient(135deg, #7c3aed, #1a3de8);
      padding: 2px 7px;
      border-radius: 999px;
    }
    .ic-notice-body img {
      width: 100%;
      height: auto;
      border-radius: 10px;
      display: block;
    }
    .ic-notice-body figure { margin: 0; }
    .ic-notice-body figcaption {
      font-size: 11.5px;
      color: var(--txt-lo);
      margin-top: 4px;
    }
    .ic-notice-body p {
      font-size: 13px;
      line-height: 1.6;
      white-space: pre-wrap;
      word-break: break-word;
      margin: 0;
    }
    .ic-notice-body table {
      width: 100%;
      border-collapse: collapse;
      font-size: 12px;
      display: block;
      overflow-x: auto;
    }
    .ic-notice-body th,
    .ic-notice-body td {
      border: 1px solid var(--border);
      padding: 6px 8px;
      text-align: left;
      white-space: nowrap;
    }
    .ic-notice-body thead th {
      background: rgba(26,61,232,0.06);
      font-weight: 800;
    }
    [data-theme="dark"] .ic-notice-body thead th {
      background: rgba(99,102,241,0.14);
    }
    .ic-notice-body > * + * { margin-top: 10px; }
    .ic-notice-updated {
      font-size: 10.5px;
      color: var(--txt-lo);
    }
    .ic-kakao-highlight {
      border: 1px solid rgba(254,229,0,0.34);
      border-radius: 12px;
      background: linear-gradient(180deg, rgba(254,229,0,0.10), rgba(249,115,22,0.035));
      padding: 10px;
      display: flex;
      flex-direction: column;
      gap: 8px;
    }
    .ic-kh-head {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 12px;
      font-weight: 900;
      color: var(--txt-hi);
      line-height: 1.25;
    }
    .ic-kh-month {
      margin-left: auto;
      padding: 2px 7px;
      border-radius: 999px;
      background: #fee500;
      color: #1f2937;
      font-size: 10px;
      white-space: nowrap;
    }
    .ic-kh-list {
      display: flex;
      flex-direction: column;
      gap: 7px;
      max-height: 230px;
      overflow-y: auto;
      scrollbar-width: thin;
    }
    .ic-kh-msg {
      opacity: 0;
      transform: translateY(5px);
      animation: khFade .28s ease forwards;
      padding: 8px 9px;
      border-radius: 10px 10px 10px 3px;
      background: var(--bg-card);
      border: 1px solid rgba(0,0,0,0.04);
      box-shadow: 0 2px 8px rgba(0,0,0,0.04);
    }
    [data-theme="dark"] .ic-kh-msg { border-color: rgba(255,255,255,0.06); }
    .ic-kh-who {
      display: flex;
      align-items: center;
      gap: 6px;
      margin-bottom: 3px;
      min-width: 0;
    }
    .ic-kh-name {
      font-size: 10.5px;
      font-weight: 800;
      color: var(--txt-mid);
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .ic-kh-time {
      font-size: 9.5px;
      color: var(--txt-lo);
      white-space: nowrap;
    }
    .ic-kh-text {
      font-size: 11.5px;
      line-height: 1.45;
      color: var(--txt-hi);
      word-break: keep-all;
      overflow-wrap: anywhere;
    }
    .ic-kh-cta {
      display: flex;
      align-items: center;
      justify-content: center;
      min-height: 34px;
      border-radius: 9px;
      background: #fee500;
      color: #1f2937;
      font-size: 11.5px;
      font-weight: 900;
      text-decoration: none;
    }
    @keyframes khFade { to { opacity: 1; transform: none; } }

    /* 신뢰 카드 */
    .ic-trust {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 12px;
      margin: 0 0 22px;
    }
    @media (max-width: 900px) { .ic-trust { grid-template-columns: repeat(2, 1fr); } }
    @media (max-width: 480px) { .ic-trust { grid-template-columns: 1fr; } }
    .ic-trust-card {
      padding: 14px;
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 12px;
      box-shadow: var(--sh-sm);
    }
    .ic-trust-icon { font-size: 22px; display: block; margin-bottom: 6px; line-height: 1; }
    .ic-trust-card strong {
      display: block;
      font-size: 0.92rem;
      color: var(--txt-hi);
      margin-bottom: 4px;
    }
    .ic-trust-card p {
      font-size: 0.8rem;
      color: var(--txt-mid);
      line-height: 1.55;
      margin: 0;
    }
    .ic-trust-card a { color: var(--blue-mid); font-weight: 600; text-decoration: none; }
    .ic-trust-card a:hover { text-decoration: underline; }

    /* 콘텐츠 출처 표기 안내 박스 (소식지/청구서류/카드뉴스 페이지 상단) */
    .content-source-notice {
      display: flex;
      align-items: flex-start;
      gap: 8px;
      padding: 10px 14px;
      margin-bottom: 14px;
      background: rgba(245,158,11,0.06);
      border: 1px solid rgba(245,158,11,0.20);
      border-radius: 10px;
      font-size: 0.82rem;
      color: var(--txt-mid);
      line-height: 1.55;
    }
    .content-source-notice strong { color: var(--txt-hi); font-weight: 700; }
    .csn-icon { flex-shrink: 0; font-size: 14px; line-height: 1.3; }
    [data-theme="dark"] .content-source-notice {
      background: rgba(245,158,11,0.08);
      border-color: rgba(245,158,11,0.25);
    }

    /* (전역 푸터 스타일은 footer/.foot-* 클래스에서 처리 — 기존 footer 통합) */

    /* ══════════════════════════════
       실시간 인기 콘텐츠 모니터
    ══════════════════════════════ */
    .live-monitor {
      background: linear-gradient(135deg, rgba(26,61,232,0.04), rgba(0,200,238,0.04));
      border: 1px solid var(--border);
      border-radius: 16px;
      padding: 14px 18px 16px;
      margin: 0 0 18px;
      box-shadow: var(--sh-sm);
      position: relative;
      overflow: hidden;
    }
    [data-theme="dark"] .live-monitor {
      background: linear-gradient(135deg, rgba(74,112,245,0.10), rgba(0,200,238,0.06));
      border-color: rgba(255,255,255,0.08);
    }
    .lm-header {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-bottom: 12px;
      flex-wrap: wrap;
    }
    .lm-live-badge {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      background: linear-gradient(135deg, #ef4444, #f97316);
      color: #fff;
      font-size: 10px;
      font-weight: 800;
      letter-spacing: 0.08em;
      padding: 3px 9px;
      border-radius: 10px;
      box-shadow: 0 2px 8px rgba(239,68,68,0.30);
    }
    .lm-live-dot {
      width: 6px; height: 6px;
      border-radius: 50%;
      background: #fff;
      box-shadow: 0 0 0 0 rgba(255,255,255,0.7);
      animation: lm-pulse 1.6s ease-in-out infinite;
    }
    @keyframes lm-pulse {
      0%, 100% { opacity: 1; }
      50%      { opacity: 0.45; }
    }
    .lm-title {
      font-size: 14px;
      font-weight: 800;
      color: var(--txt-hi);
      letter-spacing: -0.01em;
    }
    .lm-tabs {
      display: inline-flex;
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 8px;
      padding: 2px;
      margin-left: auto;
    }
    .lm-tab {
      background: transparent;
      border: none;
      padding: 4px 10px;
      font-size: 11px;
      font-weight: 700;
      color: var(--txt-mid);
      cursor: pointer;
      border-radius: 6px;
      transition: all 0.18s;
      font-family: 'Pretendard', sans-serif;
    }
    .lm-tab:hover { color: var(--txt-hi); }
    .lm-tab.active {
      background: var(--blue-mid);
      color: #fff;
    }
    /* v2.1.50: 「누적 순위」 라벨 — 탭 자리에 작은 알약 */
    .lm-period-label {
      display: inline-flex; align-items: center;
      gap: 4px;
      margin-left: auto;
      padding: 4px 10px;
      background: rgba(26,61,232,0.10);
      color: var(--blue-mid);
      font-size: 10.5px; font-weight: 800;
      letter-spacing: 0.04em;
      border-radius: 999px;
    }
    [data-theme="dark"] .lm-period-label {
      background: rgba(74,112,245,0.18);
      color: #a5b4fc;
    }
    .lm-updated {
      font-size: 10.5px;
      color: var(--txt-lo);
      letter-spacing: 0.02em;
    }
    .lm-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 14px;
    }
    .lm-grid.lm-grid-2col { grid-template-columns: repeat(2, 1fr); }
    /* v2.1.38: 4컬럼 — 전산/최신/채용/강의
       v2.1.44: breakpoint 1280→1440 (일반 노트북은 2×2 가 더 깔끔, 23인치+ 만 4열) */
    .lm-grid.lm-grid-4col { grid-template-columns: repeat(4, 1fr); gap: 12px; }
    @media (max-width: 1440px) { .lm-grid.lm-grid-4col { grid-template-columns: repeat(2, 1fr); } }
    @media (max-width: 700px) {
      .lm-grid, .lm-grid.lm-grid-2col, .lm-grid.lm-grid-4col { grid-template-columns: 1fr; }
    }
    .lm-col {
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 12px;
      padding: 12px 14px;
    }
    .lm-col-head {
      display: flex;
      align-items: center;
      gap: 6px;
      margin-bottom: 8px;
      padding-bottom: 8px;
      border-bottom: 1px dashed var(--border);
    }
    .lm-col-icon { font-size: 16px; line-height: 1; }
    .lm-col-name {
      font-size: 12px;
      font-weight: 700;
      color: var(--txt-mid);
      letter-spacing: 0.01em;
    }
    .lm-list {
      list-style: none;
      padding: 0; margin: 0;
      display: flex;
      flex-direction: column;
      gap: 5px;
      min-height: 100px;
    }
    /* v2.1.44: 레이아웃 재설계 — grid 정렬 + 일관된 높이 + 2줄 wrap */
    .lm-item {
      display: grid;
      grid-template-columns: 20px 1fr auto;
      align-items: center;
      gap: 9px;
      padding: 7px 9px;
      border-radius: 8px;
      cursor: pointer;
      transition: background 0.15s;
      min-height: 38px;     /* 1줄 기본 */
    }
    .lm-item:hover { background: rgba(26,61,232,0.06); }
    [data-theme="dark"] .lm-item:hover { background: rgba(74,112,245,0.10); }
    .lm-rank {
      width: 20px; height: 20px;
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 10.5px;
      font-weight: 800;
      border-radius: 5px;
      color: var(--txt-lo);
      background: rgba(0,0,0,0.04);
    }
    [data-theme="dark"] .lm-rank { background: rgba(255,255,255,0.05); }
    .lm-item.lm-rank-1 .lm-rank {
      background: linear-gradient(135deg, #fbbf24, #f59e0b);
      color: #fff;
      box-shadow: 0 2px 6px rgba(251,191,36,0.40);
    }
    .lm-item.lm-rank-2 .lm-rank {
      background: linear-gradient(135deg, #cbd5e1, #94a3b8);
      color: #fff;
    }
    .lm-item.lm-rank-3 .lm-rank {
      background: linear-gradient(135deg, #fb923c, #c2410c);
      color: #fff;
    }
    /* v2.1.44: 한글 단어 단위 줄바꿈, 최대 2줄 wrap, 잘릴 땐 끝 ellipsis */
    .lm-name {
      min-width: 0;        /* grid 1fr 가 overflow 되지 않도록 */
      font-size: 12.5px;
      font-weight: 600;
      color: var(--txt-hi);
      line-height: 1.35;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
      word-break: keep-all;          /* 한글 단어 단위로만 줄바꿈 */
      overflow-wrap: anywhere;       /* 단어가 너무 길면 강제 분리 (예: URL) */
    }
    /* v2.1.44: 일관된 알약 — 폭 변동 최소화 */
    .lm-clicks {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-width: 42px;
      padding: 3px 9px;
      border-radius: 999px;
      background: rgba(26,61,232,0.10);
      color: var(--blue-mid);
      font-size: 11px;
      font-weight: 800;
      letter-spacing: -0.01em;
      flex-shrink: 0;
      font-variant-numeric: tabular-nums;
      white-space: nowrap;
    }
    [data-theme="dark"] .lm-clicks {
      background: rgba(74,112,245,0.20);
      color: #a5b4fc;
    }
    .lm-clicks-unit {
      font-size: 9px;
      opacity: 0.7;
      margin-left: 1px;
      font-weight: 600;
    }
    /* v2.1.44: NEW 배지 — 같은 폼팩터 유지 */
    .lm-clicks.lm-new {
      background: linear-gradient(135deg, #22c55e, #16a34a);
      color: #fff;
      box-shadow: 0 1px 4px rgba(34,197,94,0.40);
    }
    /* 보조 메트릭 (복사 카운트) */
    .lm-secondary {
      display: inline-flex;
      align-items: center;
      gap: 2px;
      margin-left: 6px;
      font-size: 10px;
      font-weight: 600;
      color: var(--neon-purple, #8b5cf6);
      background: rgba(139,92,246,0.10);
      padding: 1px 6px;
      border-radius: 8px;
      flex-shrink: 0;
    }
    [data-theme="dark"] .lm-secondary {
      background: rgba(167,139,250,0.15);
      color: #c4b5fd;
    }
    .lm-na {
      font-size: 11px;
      color: var(--txt-lo);
      font-style: italic;
    }
    .lm-empty {
      font-size: 12px;
      color: var(--txt-lo);
      padding: 16px 4px;
      text-align: center;
      /* v2.1.44: 행 5개 평균과 비슷한 높이로 맞춰 컬럼 간 정렬 안정 */
      min-height: 100px;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .lm-skel {
      height: 28px;
      background: linear-gradient(90deg, rgba(0,0,0,0.04), rgba(0,0,0,0.08), rgba(0,0,0,0.04));
      background-size: 200% 100%;
      animation: lm-shimmer 1.4s infinite;
      border-radius: 7px;
    }
    [data-theme="dark"] .lm-skel {
      background: linear-gradient(90deg, rgba(255,255,255,0.04), rgba(255,255,255,0.08), rgba(255,255,255,0.04));
      background-size: 200% 100%;
    }
    @keyframes lm-shimmer {
      0%   { background-position: 200% 0; }
      100% { background-position: -200% 0; }
    }
    /* 모바일 */
    @media (max-width: 768px) {
      .lm-grid { grid-template-columns: 1fr; gap: 10px; }
      .live-monitor { padding: 12px 14px; }
      .lm-col { padding: 10px 12px; }
    }
    @media (max-width: 480px) {
      .lm-title { font-size: 13px; }
      .lm-tabs { margin-left: 0; }
      .lm-updated { width: 100%; margin-top: -4px; }
    }

    /* ══════════════════════════════
       홈 콘텐츠 피드
    ══════════════════════════════ */
    .home-feed-wrap {
      padding: 4px 0 20px;
    }
    .home-feed-header {
      display: flex;
      align-items: center;
      gap: 8px;
      padding-bottom: 12px;
      border-bottom: 2px solid var(--blue-mid);
      margin-bottom: 16px;
    }
    .home-feed-label {
      font-size: 0.92rem;
      font-weight: 700;
      color: var(--txt-hi);
      letter-spacing: -0.01em;
    }
    .home-feed {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
      gap: 14px;
    }
    .hf-card {
      background: var(--bg-card);
      border: 1.5px solid var(--border);
      border-radius: 12px;
      overflow: hidden;
      cursor: pointer;
      transition: box-shadow 0.16s, transform 0.16s, border-color 0.16s;
      display: flex;
      flex-direction: column;
      /* v2.96.0: 화면 밖 카드는 렌더(layout/paint) 스킵 → 카드가 많아도 스크롤 비용 일정 */
      content-visibility: auto;
      contain-intrinsic-size: auto 260px;
    }
    .hf-card:hover {
      box-shadow: 0 6px 24px rgba(12,31,184,0.14);
      transform: translateY(-2px);
      border-color: rgba(26,61,232,0.28);
    }
    .hf-thumb {
      width: 100%;
      aspect-ratio: 4/3;
      overflow: hidden;
      flex-shrink: 0;
      background: var(--bg-sub);
    }
    .hf-thumb img {
      width: 100%; height: 100%;
      object-fit: cover;
      display: block;
    }
    .hf-thumb-none {
      width: 100%;
      aspect-ratio: 4/3;
      background: linear-gradient(135deg, rgba(26,61,232,0.1) 0%, rgba(26,61,232,0.05) 100%);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 2.2rem;
      flex-shrink: 0;
    }
    [data-theme="dark"] .hf-thumb-none {
      background: linear-gradient(135deg, rgba(26,61,232,0.2) 0%, rgba(26,61,232,0.08) 100%);
    }
    .hf-body {
      padding: 10px 12px 12px;
      display: flex;
      flex-direction: column;
      gap: 5px;
      flex: 1;
    }
    .hf-badge {
      display: inline-flex;
      align-items: center;
      gap: 3px;
      font-size: 0.66rem;
      font-weight: 700;
      letter-spacing: 0.03em;
      padding: 2px 7px;
      border-radius: 20px;
      width: fit-content;
    }
    .hf-badge-news { background: rgba(26,61,232,0.09); color: var(--blue-mid); }
    .hf-badge-knowledge { background: rgba(5,150,105,0.1); color: #059669; }
    [data-theme="dark"] .hf-badge-news { background: rgba(26,61,232,0.22); }
    [data-theme="dark"] .hf-badge-knowledge { background: rgba(5,150,105,0.22); color: #34d399; }
    .hf-title {
      font-size: 0.82rem;
      font-weight: 600;
      color: var(--txt-hi);
      line-height: 1.45;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }
    .hf-date {
      font-size: 0.7rem;
      color: var(--txt-lo);
      margin-top: auto;
      padding-top: 3px;
    }
    .hf-skeleton {
      background: var(--bg-card);
      border: 1.5px solid var(--border);
      border-radius: 12px;
      overflow: hidden;
    }
    .hf-skeleton-thumb {
      width: 100%; aspect-ratio: 4/3;
      background: linear-gradient(90deg, var(--bg-sub) 25%, var(--border) 50%, var(--bg-sub) 75%);
      background-size: 200% 100%;
      animation: hf-shimmer 1.4s ease-in-out infinite;
    }
    .hf-skeleton-body { padding: 10px 12px 14px; display: flex; flex-direction: column; gap: 8px; }
    .hf-skeleton-line { height: 11px; border-radius: 6px; background: var(--bg-sub); animation: hf-shimmer 1.4s ease-in-out infinite; }
    .hf-skeleton-line.long { width: 80%; }
    .hf-skeleton-line.short { width: 45%; }
    @keyframes hf-shimmer { 0%{background-position:200% 0} 100%{background-position:-200% 0} }

    /* ══════════════════════════════════════════════════════════
       v2.96.0: 홈 대시보드 스크롤 성능 — 상시 무한 애니메이션의 repaint/relayout 부하 완화
    ══════════════════════════════════════════════════════════ */
    /* (1) 스크롤 중에는 홈의 장식 애니메이션을 일시정지 → 스크롤 프레임에 메인스레드 양보.
           스크롤이 멈추면(JS가 180ms 후 .ic-scrolling 해제) 자동 재개. transition은 영향 없음. */
    body.ic-scrolling #page-home *, body.ic-scrolling #page-home *::before, body.ic-scrolling #page-home *::after,
    body.ic-scrolling #page-home-mobile *, body.ic-scrolling #page-home-mobile *::before, body.ic-scrolling #page-home-mobile *::after {
      animation-play-state: paused !important;
    }
    /* (2) 모션 최소화 선호 사용자: 모든 무한 장식 애니메이션 사실상 정지(접근성 + 상시 CPU/GPU 부하 제거) */
    @media (prefers-reduced-motion: reduce) {
      *, *::before, *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
      }
    }
    /* v2.96.3: 쇼케이스(채용/강의/모임) 카드도 화면 밖이면 렌더(paint) 스킵 */
    .ic-job-card { content-visibility: auto; contain-intrinsic-size: auto 190px; }

    /* ══════════════════════════════
       우측 고정 네비게이션 버튼 그룹
    ══════════════════════════════ */
    .right-nav-group {
      position: fixed;
      right: 0;
      top: 0;
      bottom: 0;
      z-index: 1100;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: flex-end;
      gap: 5px;
      pointer-events: none;
    }
    /* v2.9.9: Pill 네비 접기 토글 */
    .nav-pills-toggle { position: fixed; top: 12px; right: 10px; z-index: 1200; width: 32px; height: 32px; border-radius: 50%; background: var(--bg-card); border: 1px solid var(--border); color: var(--txt-mid); cursor: pointer; font-size: 17px; font-weight: 800; line-height: 1; display: flex; align-items: center; justify-content: center; box-shadow: var(--sh-sm); transition: background .15s, color .15s, border-color .15s; }
    .nav-pills-toggle:hover { color: var(--blue-mid); border-color: var(--blue-mid); }
    .right-nav-group, .left-nav-group { transition: opacity .2s ease, transform .2s ease; }
    body.nav-pills-collapsed .right-nav-group { opacity: 0; transform: translateX(60px); }
    body.nav-pills-collapsed .left-nav-group { opacity: 0; transform: translateX(-60px); }
    body.nav-pills-collapsed .right-nav-btn, body.nav-pills-collapsed .left-nav-btn { pointer-events: none; }
    body.ic-mobile .nav-pills-toggle { display: none !important; }
    @media (max-width: 1024px) { .nav-pills-toggle { display: none; } }
    /* v2.1.22: 좌측 빨간 PILL nav — 사이드바 오른쪽 / 홈 콘텐츠 왼쪽 */
    .left-nav-group {
      position: fixed;
      left: var(--side-w);
      top: 0;
      bottom: 0;
      z-index: 1100;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: flex-start;
      gap: 5px;
      pointer-events: none;
    }
    .left-nav-btn {
      pointer-events: auto;
      background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
      color: #fff;
      border: none;
      border-radius: 0 12px 12px 0;
      cursor: pointer;
      writing-mode: vertical-rl;
      text-orientation: mixed;
      font-size: 12px;
      font-weight: 800;
      letter-spacing: 0.08em;
      display: flex;
      align-items: center;
      justify-content: center;
      line-height: 1.1;
      box-sizing: border-box;
      width: 36px;
      height: 150px;
      padding: 12px 0;
      white-space: nowrap;
      overflow: hidden;
      transition: background 0.15s, box-shadow 0.15s, transform 0.15s;
      box-shadow: 3px 0 14px rgba(220,38,38,0.30);
      position: relative;
    }
    .left-nav-btn::before {
      content: '';
      position: absolute;
      inset: 0;
      border-radius: 0 12px 12px 0;
      background: linear-gradient(135deg, transparent 0%, rgba(255,255,255,0.18) 50%, transparent 100%);
      opacity: 0;
      transition: opacity 0.15s;
      pointer-events: none;
    }
    .left-nav-btn:hover {
      background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%);
      box-shadow: 5px 0 22px rgba(220,38,38,0.45);
      transform: translateX(2px);
    }
    .left-nav-btn:hover::before { opacity: 1; }
    .left-nav-btn .lnb-icon {
      writing-mode: horizontal-tb;
      font-size: 16px;
      line-height: 1;
      margin-bottom: 2px;
    }
    body.ic-mobile .left-nav-group { display: none !important; }
    @media (max-width: 1024px) {
      /* 1024px 이하에서 사이드바가 슬라이드 메뉴로 바뀌므로 좌측 nav 도 숨김 */
      .left-nav-group { display: none; }
    }
    .right-nav-btn {
      pointer-events: auto;
      background: var(--blue-mid);
      color: #fff;
      border: none;
      border-radius: 10px 0 0 10px;
      cursor: pointer;
      writing-mode: vertical-rl;
      text-orientation: mixed;
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 0.08em;
      display: flex;
      align-items: center;
      justify-content: center;
      line-height: 1.1;
      box-sizing: border-box;
      width: 32px;
      height: 96px;
      padding: 8px 0;
      white-space: nowrap;
      overflow: hidden;
      transition: background 0.15s, box-shadow 0.15s, transform 0.15s;
      box-shadow: -3px 0 12px rgba(26,61,232,0.18);
    }
    .right-nav-btn:hover {
      background: var(--blue-deep);
      box-shadow: -5px 0 20px rgba(26,61,232,0.32);
      transform: translateX(-2px);
    }
    .rnb-icon {
      writing-mode: horizontal-tb;
      font-size: 15px;
      line-height: 1;
    }
    /* ── 모바일: pill버튼 → 하단 네비 바 ── */
    .mobile-bottom-nav {
      display: none;
    }
    .mobile-bottom-nav-toggle {
      display: none;
    }
    @media (max-width: 480px) {
      .right-nav-group { display: none; }

      /* footer는 하단 네비가 대신하므로 모바일에서 숨김 → 콘텐츠 영역 확보 */
      footer { display: none; }

      /* body padding-bottom 제거 (overflow:hidden이라 레이아웃 망가짐) */
      /* 대신 .content에 padding-bottom을 줘서 네비바 뒤로 콘텐츠 안 가리게 함 */
      .content {
        padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px)) !important;
        transition: padding-bottom 0.28s cubic-bezier(0.4,0,0.2,1);
      }
      /* 하단 네비 숨겨진 상태 → padding 줄임 */
      body.mbn-hidden .content {
        padding-bottom: calc(28px + env(safe-area-inset-bottom, 0px)) !important;
      }

      .mobile-bottom-nav {
        display: flex;
        position: fixed;
        bottom: 0; left: 0; right: 0;
        z-index: 1200;
        background: var(--bg-card);
        border-top: 1px solid var(--border);
        box-shadow: 0 -4px 20px rgba(0,0,0,0.12);
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        padding: 0 2px;
        padding-bottom: env(safe-area-inset-bottom, 0px);
        /* 슬라이드 아웃/인 애니메이션 */
        transform: translateY(0);
        transition: transform 0.28s cubic-bezier(0.4,0,0.2,1);
      }
      /* 숨겨진 상태: 바 전체 내림 */
      body.mbn-hidden .mobile-bottom-nav {
        transform: translateY(100%);
      }
      .mobile-bottom-nav::-webkit-scrollbar { display: none; }

      .mobile-bottom-nav-btn {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 3px;
        flex: 1;
        min-width: 52px;
        padding: 8px 4px 6px;
        border: none;
        background: transparent;
        cursor: pointer;
        color: var(--txt-mid);
        font-size: 10px;
        font-weight: 700;
        letter-spacing: 0.02em;
        white-space: nowrap;
        transition: color 0.15s, background 0.15s;
        border-radius: 0;
        font-family: 'Pretendard', sans-serif;
      }
      .mobile-bottom-nav-btn:active { background: rgba(26,61,232,0.08); }
      .mobile-bottom-nav-btn .mbn-icon {
        font-size: 18px;
        line-height: 1;
      }
      .mobile-bottom-nav-btn.mbn-accent {
        color: var(--blue-mid);
      }
      [data-theme="dark"] .mobile-bottom-nav {
        background: #161b22;
        border-top-color: rgba(255,255,255,0.07);
      }

      /* ── 하단 네비 토글 탭 ── */
      .mobile-bottom-nav-toggle {
        display: flex;
        align-items: center;
        justify-content: center;
        position: fixed;
        bottom: calc(72px + env(safe-area-inset-bottom, 0px));
        right: 14px;
        z-index: 1201;
        width: 32px;
        height: 20px;
        background: var(--bg-card);
        border: 1px solid var(--border);
        border-bottom: none;
        border-radius: 8px 8px 0 0;
        cursor: pointer;
        box-shadow: 0 -2px 8px rgba(0,0,0,0.10);
        transition: bottom 0.28s cubic-bezier(0.4,0,0.2,1);
        padding: 0;
        font-size: 10px;
        color: var(--txt-lo);
        line-height: 1;
      }
      /* 바 숨겨진 상태: 탭 위치도 낮춤 */
      body.mbn-hidden .mobile-bottom-nav-toggle {
        bottom: calc(0px + env(safe-area-inset-bottom, 0px));
        border-bottom: 1px solid var(--border);
        border-radius: 8px 8px 0 0;
      }
      [data-theme="dark"] .mobile-bottom-nav-toggle {
        background: #161b22;
        border-color: rgba(255,255,255,0.10);
      }
    }

    /* v2.1.26: 사이드바 파트너사 프로모션 + 모바일 banner override CSS 전체 제거 */

    /* ══════════════════════════════
       우측 실무도구 패널
    ══════════════════════════════ */
    .tfb-emoji { writing-mode: horizontal-tb; font-size: 16px; }
    .tools-panel-backdrop {
      display: none;
      position: fixed; inset: 0;
      background: rgba(0,0,0,0.18);
      z-index: 1150;
    }
    .tools-panel-backdrop.open { display: block; }
    .tools-panel {
      position: fixed;
      top: 0; right: 0; bottom: 0;
      width: 264px;
      background: var(--bg-card);
      border-left: 1px solid var(--border);
      box-shadow: var(--sh-lg);
      z-index: 1200;
      display: flex;
      flex-direction: column;
      transform: translateX(100%);
      transition: transform 0.28s cubic-bezier(0.4,0,0.2,1);
    }
    .tools-panel.open { transform: translateX(0); }
    [data-theme="dark"] .tools-panel {
      background: #161b22;
      border-left-color: rgba(255,255,255,0.06);
    }
    .tools-panel-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 18px 16px 14px;
      border-bottom: 1px solid var(--border);
      font-size: 14px;
      font-weight: 700;
      color: var(--txt-hi);
      flex-shrink: 0;
    }
    .tools-panel-head button {
      background: none; border: none; cursor: pointer;
      color: var(--txt-lo); font-size: 16px;
      padding: 4px 6px; border-radius: 6px;
      transition: background 0.12s, color 0.12s;
    }
    .tools-panel-head button:hover { background: rgba(12,31,184,0.08); color: var(--txt-hi); }
    .tools-panel-list { flex: 1; overflow-y: auto; padding: 6px 0; }
    .tp-item {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 10px 16px;
      text-decoration: none;
      color: var(--txt-hi);
      font-size: 13px;
      font-weight: 500;
      transition: background 0.12s;
      border: none;
      background: none;
      width: 100%;
      text-align: left;
      cursor: pointer;
    }
    .tp-item:hover { background: rgba(26,61,232,0.06); }
    .tp-icon { font-size: 18px; width: 26px; text-align: center; flex-shrink: 0; }
    .tp-name { flex: 1; }
    .tp-arrow { color: var(--txt-lo); font-size: 14px; flex-shrink: 0; }

    /* ══════════════════════════════
       ⚡ 성능 최적화
    ══════════════════════════════ */
    /* 0) content-visibility: auto — 화면 밖 콘텐츠의 렌더링 비용을 브라우저가 알아서 스킵
       Above-the-fold 가 아닌 영역(모달, 푸터, 패널 등)에 적용 */
    .nl-viewer-overlay,
    .cn-modal,
    .kn-modal-overlay,
    /* ══════════════════════════════
       홈 진입 자동 팝업 (관리자 공지)
    ══════════════════════════════ */
    #home-popup-overlay {
      display: none;
      position: fixed;
      inset: 0;
      z-index: 9995; /* v2.17.7: 모바일 고정요소(바텀바/배너)에 가리지 않도록 최상위로 */
      background: rgba(0,0,0,0.78);
      align-items: center;
      justify-content: center;
      padding: 16px;
      backdrop-filter: blur(2px);
    }
    .hp-modal {
      position: relative;
      width: 100%;
      max-width: 640px;
      max-height: 92vh;
      display: flex;
      flex-direction: column;
      background: var(--bg-card);
      border-radius: 16px;
      overflow: hidden;
      box-shadow: 0 20px 60px rgba(0,0,0,0.5);
      animation: hpFadeIn 0.22s ease-out;
    }
    @keyframes hpFadeIn {
      from { opacity: 0; transform: translateY(12px) scale(0.98); }
      to   { opacity: 1; transform: translateY(0) scale(1); }
    }
    .hp-head {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 14px 18px;
      border-bottom: 1px solid var(--border);
      background: linear-gradient(90deg, rgba(176,38,255,0.10), rgba(26,61,232,0.06));
      flex-shrink: 0;
    }
    .hp-head-badge {
      font-size: 10px;
      font-weight: 800;
      letter-spacing: 0.08em;
      padding: 3px 9px;
      border-radius: 10px;
      background: linear-gradient(135deg, #b026ff, #1a3de8);
      color: #fff;
      flex-shrink: 0;
    }
    .hp-head-title {
      font-size: 15px;
      font-weight: 800;
      color: var(--txt-hi);
      flex: 1;
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      letter-spacing: -0.01em;
    }
    .hp-head-close {
      width: 32px; height: 32px;
      border: none;
      background: transparent;
      color: var(--txt-mid);
      font-size: 20px;
      cursor: pointer;
      border-radius: 8px;
      transition: background 0.15s, color 0.15s;
    }
    .hp-head-close:hover { background: rgba(0,0,0,0.06); color: var(--txt-hi); }
    .hp-body {
      flex: 1 1 auto;
      min-height: 0;
      overflow-y: auto;
      padding: 16px 20px 12px;
      color: var(--txt-hi);
      font-size: 14px;
      line-height: 1.65;
    }
    .hp-body p { margin: 0 0 6px; }
    .hp-body p:empty { min-height: 0.6em; }
    .hp-body .kn-table-wrap {
      margin: 10px 0;
      overflow-x: auto;
      border-radius: 8px;
      border: 1px solid var(--border);
    }
    .hp-body .kn-table {
      width: 100%;
      border-collapse: collapse;
      font-size: 13px;
    }
    .hp-body .kn-table th,
    .hp-body .kn-table td {
      border: 1px solid var(--border);
      padding: 7px 10px;
      vertical-align: top;
    }
    .hp-body .kn-table th {
      background: rgba(26,61,232,0.06);
      font-weight: 700;
    }
    .hp-file {
      margin-top: 12px;
      border-top: 1px dashed var(--border);
      padding-top: 12px;
    }
    .hp-file img {
      width: 100%;
      height: auto;
      display: block;
      border-radius: 8px;
      border: 1px solid var(--border);
    }
    .hp-file iframe {
      width: 100%;
      height: 60vh;
      min-height: 360px;
      border: 1px solid var(--border);
      border-radius: 8px;
      background: #fff;
    }
    .hp-foot {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 11px 18px;
      border-top: 1px solid var(--border);
      background: var(--bg);
      flex-shrink: 0;
    }
    .hp-hide-today {
      display: flex;
      align-items: center;
      gap: 7px;
      cursor: pointer;
      color: var(--txt-mid);
      font-size: 13px;
      user-select: none;
    }
    .hp-hide-today input { width: 16px; height: 16px; cursor: pointer; accent-color: var(--blue-mid); }
    .hp-foot-close {
      padding: 8px 18px;
      background: var(--blue-mid);
      color: #fff;
      border: none;
      border-radius: 8px;
      font-weight: 700;
      font-size: 13px;
      cursor: pointer;
      transition: background 0.15s, transform 0.12s;
      font-family: inherit;
    }
    .hp-foot-close:hover { background: var(--blue-deep); transform: translateY(-1px); }
    @media (max-width: 480px) {
      .hp-modal { max-height: 94vh; }
      .hp-body { font-size: 13.5px; padding: 14px 16px 10px; }
      .hp-foot { padding: 9px 14px; }
      .hp-hide-today { font-size: 12px; }
      .hp-foot-close { padding: 7px 14px; font-size: 12.5px; }
    }

    .tools-panel,
    .tools-panel-backdrop,
    #home-popup-overlay {
      content-visibility: auto;
      contain-intrinsic-size: 0 600px;
    }
    /* 사이드 메뉴 사용자 펼치기 전엔 렌더 비용 줄임 */
    @media (max-width: 900px) {
      .side-nav { content-visibility: auto; contain-intrinsic-size: 0 100vh; }
      .side-nav.open { content-visibility: visible; }
    }

    /* 1) 사용자가 모션 최소화 모드면 모든 애니메이션 무력화 (배터리·CPU 절약) */
    @media (prefers-reduced-motion: reduce) {
      *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
      }
      /* 무한 펄스 등 완전 차단 */
      .promo-glow, .lm-live-dot, .glow-shine { animation: none !important; }
    }

    /* v2.1.26: .side-cn-card 모바일 애니메이션 제어 제거 (배너 기능 폐지) */
    /* 3) GPU 가속 권장 */
    .lm-live-dot, .lm-skel { will-change: auto; }

    /* ══════ 보험교재 모달 ══════ */
    #tb-overlay {
      display: none;
      position: fixed; inset: 0;
      background: rgba(8,15,48,0.55);
      z-index: 9000;
      align-items: center;
      justify-content: center;
      padding: 20px;
    }
    #tb-overlay.open { display: flex; }
    .tb-modal {
      background: var(--bg-card);
      border-radius: 18px;
      width: 100%; max-width: 520px;
      max-height: 85vh;
      display: flex; flex-direction: column;
      box-shadow: 0 24px 64px rgba(8,15,48,0.25);
      overflow: hidden;
    }
    .tb-header {
      display: flex; align-items: center; justify-content: space-between;
      padding: 18px 20px 14px;
      border-bottom: 1.5px solid var(--border);
      flex-shrink: 0;
    }
    .tb-header h2 { font-size: 1rem; font-weight: 800; color: var(--txt-hi); }
    .tb-header button {
      background: none; border: none; cursor: pointer;
      font-size: 18px; color: var(--txt-lo); padding: 4px 6px;
      border-radius: 6px; line-height: 1;
    }
    .tb-header button:hover { background: rgba(12,31,184,0.07); color: var(--txt-mid); }
    .tb-body { overflow-y: auto; padding: 14px 16px 20px; flex: 1; }
    .tb-loading { text-align: center; padding: 40px 0; color: var(--txt-lo); font-size: 0.88rem; }
    .tb-empty  { text-align: center; padding: 40px 0; color: var(--txt-lo); font-size: 0.88rem; }
    .tb-list   { display: flex; flex-direction: column; gap: 10px; }
    .tb-item {
      display: flex; align-items: center; gap: 14px;
      padding: 14px 16px;
      background: var(--bg);
      border: 1.5px solid var(--border);
      border-radius: 12px;
      transition: border-color 0.15s, background 0.15s;
    }
    .tb-item:hover { border-color: var(--blue-mid); background: rgba(26,61,232,0.04); }
    .tb-item-icon {
      width: 40px; height: 40px; border-radius: 10px;
      display: flex; align-items: center; justify-content: center;
      font-size: 20px; flex-shrink: 0;
      background: rgba(26,61,232,0.08);
    }
    .tb-item-body { flex: 1; min-width: 0; }
    .tb-item-title {
      font-size: 0.9rem; font-weight: 700; color: var(--txt-hi);
      white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }
    .tb-item-desc {
      font-size: 0.78rem; color: var(--txt-lo); margin-top: 2px;
      white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }
    .tb-item-meta { font-size: 0.75rem; color: var(--txt-lo); margin-top: 3px; }
    .tb-dl-btn {
      flex-shrink: 0;
      display: inline-flex; align-items: center; gap: 5px;
      background: var(--blue-mid); color: #fff;
      border: none; border-radius: 8px;
      padding: 8px 14px; font-size: 0.8rem; font-weight: 700;
      cursor: pointer; text-decoration: none;
      transition: opacity 0.15s;
      font-family: 'Pretendard', sans-serif;
    }
    .tb-dl-btn:hover { opacity: 0.85; }
    @media (max-width: 480px) {
      .tb-modal { max-height: 92vh; border-radius: 14px; }
      .tb-item  { flex-wrap: wrap; }
      .tb-dl-btn { width: 100%; justify-content: center; }
    }

    /* ══════════════════════════════
       즐겨찾기 (별 버튼) — 모든 .tool-card[data-tool-id]에 자동 주입
    ══════════════════════════════ */
    .tool-card { position: relative; }
    .tool-fav-btn {
      position: absolute;
      top: 10px;
      right: 38px;
      width: 26px;
      height: 26px;
      display: flex;
      align-items: center;
      justify-content: center;
      background: transparent;
      border: none;
      border-radius: 6px;
      cursor: pointer;
      color: rgba(120,120,140,0.45);
      font-size: 16px;
      line-height: 1;
      transition: all 0.15s;
      z-index: 2;
    }
    .tool-fav-btn:hover {
      background: rgba(255,193,7,0.12);
      color: #f59e0b;
      transform: scale(1.15);
    }
    .tool-fav-btn.active {
      color: #f59e0b;
      text-shadow: 0 0 8px rgba(245,158,11,0.55);
    }
    .tool-fav-btn.active:hover {
      color: #d97706;
    }
    /* 카드 우측 화살표가 있는 카드에 별 버튼 자리 확보 */
    .tool-card .tool-card-copy { right: 8px; }

    /* 내 즐겨찾기 섹션 */
    #favorites-section { display: none; }
    #favorites-section.has-items { display: block; }
    .fav-section-head {
      display: flex; align-items: center; gap: 10px;
      margin-bottom: 14px;
    }
    .fav-section-head .fav-pill {
      font-size: 10px; font-weight: 700;
      color: #f59e0b;
      background: rgba(245,158,11,0.12);
      padding: 3px 10px; border-radius: 12px;
      letter-spacing: 0.06em;
    }
    .fav-section-head .fav-line {
      flex: 1; height: 1px;
      background: linear-gradient(90deg, rgba(245,158,11,0.35), transparent);
    }
    .fav-empty {
      font-size: 12.5px; color: var(--txt-lo);
      padding: 14px 16px;
      border: 1px dashed rgba(245,158,11,0.30);
      border-radius: 10px;
      background: rgba(245,158,11,0.04);
    }
    /* 홈 대시보드: 즐겨찾기가 비어있을 때 안내 카드 */
    .fav-onboard {
      display: flex; align-items: center; gap: 16px;
      padding: 16px 18px;
      border: 1px dashed rgba(245,158,11,0.35);
      border-radius: 14px;
      background: linear-gradient(135deg, rgba(245,158,11,0.06), rgba(245,158,11,0.02));
    }
    .fav-onboard-icon { font-size: 32px; flex-shrink: 0; }
    .fav-onboard-body { flex: 1; min-width: 0; }
    .fav-onboard-title {
      font-size: 14px; font-weight: 800;
      color: var(--txt-hi);
      margin-bottom: 4px;
    }
    .fav-onboard-desc {
      font-size: 12px; color: var(--txt-mid);
      line-height: 1.5;
    }
    .fav-onboard-desc strong {
      color: #f59e0b;
      background: rgba(245,158,11,0.12);
      padding: 1px 6px;
      border-radius: 4px;
    }
    .fav-onboard-btn {
      flex-shrink: 0;
      padding: 9px 16px;
      background: linear-gradient(135deg, #f59e0b, #f97316);
      color: #fff;
      border: none; border-radius: 8px;
      font-size: 12.5px; font-weight: 700;
      cursor: pointer;
      box-shadow: 0 2px 10px rgba(245,158,11,0.30);
      white-space: nowrap;
    }
    .fav-onboard-btn:hover { box-shadow: 0 4px 14px rgba(245,158,11,0.45); }
    @media (max-width: 640px) {
      .fav-onboard { flex-direction: column; align-items: flex-start; }
      .fav-onboard-btn { width: 100%; padding: 11px; }
    }

    /* ══════════════════════════════
       글로벌 검색 모달 (Ctrl+K / ⌘K)
    ══════════════════════════════ */
    #global-search-overlay {
      display: none;
      position: fixed; inset: 0;
      z-index: 9990;
      background: rgba(0,0,0,0.55);
      backdrop-filter: blur(3px);
      align-items: flex-start;
      justify-content: center;
      padding-top: 8vh;
    }
    #global-search-overlay.open { display: flex; }
    .gs-modal {
      width: 100%; max-width: 620px;
      max-height: 78vh;
      display: flex; flex-direction: column;
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 14px;
      overflow: hidden;
      box-shadow: 0 20px 60px rgba(0,0,0,0.35);
    }
    .gs-input-wrap {
      display: flex; align-items: center; gap: 10px;
      padding: 14px 16px;
      border-bottom: 1px solid var(--border);
      flex-shrink: 0;
    }
    .gs-input-wrap .gs-search-icon { font-size: 18px; color: var(--txt-lo); flex-shrink: 0; }
    .gs-input-wrap input {
      flex: 1;
      border: none; outline: none;
      background: transparent;
      font-size: 16px;
      color: var(--txt-hi);
      font-family: inherit;
      min-width: 0;
    }
    .gs-input-wrap input::placeholder { color: var(--txt-lo); }
    .gs-input-wrap .gs-kbd {
      font-family: 'JetBrains Mono', monospace;
      font-size: 10px; font-weight: 700;
      color: var(--txt-lo);
      background: var(--bg);
      border: 1px solid var(--border);
      border-radius: 4px;
      padding: 2px 6px;
      flex-shrink: 0;
    }
    .gs-results {
      flex: 1; min-height: 0;
      overflow-y: auto;
      padding: 6px 6px 10px;
    }
    .gs-group-head {
      padding: 10px 14px 4px;
      font-size: 10px; font-weight: 700;
      color: var(--txt-lo);
      letter-spacing: 0.10em;
      text-transform: uppercase;
    }
    .gs-item {
      display: flex; align-items: center; gap: 10px;
      padding: 9px 12px;
      border-radius: 8px;
      cursor: pointer;
      color: var(--txt-hi);
      text-decoration: none;
      transition: background 0.12s;
      border: none; background: none;
      width: 100%; text-align: left;
      font-family: inherit; font-size: 13px;
    }
    .gs-item:hover, .gs-item.active {
      background: rgba(26,61,232,0.08);
    }
    .gs-item .gs-icon { font-size: 16px; flex-shrink: 0; }
    .gs-item .gs-text { flex: 1; min-width: 0; }
    .gs-item .gs-name {
      font-weight: 600;
      overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    }
    .gs-item .gs-sub {
      font-size: 11px; color: var(--txt-lo);
      overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    }
    .gs-item .gs-tag {
      font-size: 9.5px; font-weight: 700;
      padding: 2px 7px; border-radius: 10px;
      color: var(--txt-mid);
      background: var(--bg);
      flex-shrink: 0;
    }
    .gs-empty {
      padding: 30px 16px;
      text-align: center;
      color: var(--txt-lo);
      font-size: 13px;
    }
    .gs-hint {
      display: flex; align-items: center; justify-content: space-between;
      padding: 8px 14px;
      border-top: 1px solid var(--border);
      flex-shrink: 0;
      font-size: 10.5px;
      color: var(--txt-lo);
    }
    .gs-hint .gs-kbd { font-size: 9.5px; padding: 1px 5px; }
    /* 검색 버튼 (사이드바) */
    .side-search-btn {
      display: flex; align-items: center; gap: 8px;
      width: calc(100% - 20px); margin: 8px 10px 6px;
      padding: 8px 12px;
      background: var(--bg);
      border: 1px solid var(--border);
      border-radius: 8px;
      color: var(--txt-lo);
      cursor: pointer;
      font-family: inherit; font-size: 12px;
      transition: all 0.15s;
    }
    .side-search-btn:hover {
      border-color: var(--blue-mid);
      color: var(--blue-mid);
      background: rgba(26,61,232,0.04);
    }

    /* v2.1.27: 사이드바 — 내 공고 직접 등록 단일 버튼 (채용/강의 통합) */
    .side-submit-single {
      display: flex; align-items: center; gap: 10px;
      width: calc(100% - 20px);
      margin: 4px 10px 8px;
      padding: 10px 12px;
      background: var(--bg);
      border: 1px solid var(--border);
      border-radius: 10px;
      color: var(--txt-hi);
      cursor: pointer;
      font-family: inherit;
      text-align: left;
      box-shadow: none;
      transition: background .12s, border-color .12s;
    }
    .side-submit-single:hover { background: rgba(26,61,232,0.06); border-color: rgba(26,61,232,0.30); }
    .side-submit-single .sss-icon { color: var(--blue-mid); }
    .side-submit-single .sss-sub { color: var(--txt-mid); opacity: 1; }
    .side-submit-single:hover {
      transform: translateY(-1px);
      box-shadow: 0 6px 18px rgba(219,39,119,0.32);
    }
    .side-submit-single .sss-icon { font-size: 20px; line-height: 1; flex-shrink: 0; }
    .side-submit-single .sss-text { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
    .side-submit-single .sss-title { font-size: 12.5px; font-weight: 800; letter-spacing: -0.01em; }
    .side-submit-single .sss-sub   { font-size: 10.5px; font-weight: 600; opacity: 0.85; }
    /* v2.8.1: 사이드바 계정 그룹 — 로그인/내공고등록/빠른검색을 한 묶음으로 정렬(좌우 인셋 통일) */
    /* v2.8.22: 로그인정보 + 내공고등록 + 빠른검색을 하나의 카드로 묶음 */
    .side-account { margin: 10px 12px 2px; display: flex; flex-direction: column; gap: 10px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 12px; padding: 12px; box-shadow: var(--sh-sm); }
    .side-account #ic-auth { margin: 0; padding-bottom: 10px; border-bottom: 1px solid var(--border); }
    .side-account .side-search-btn,
    .side-account .side-submit-single { width: 100%; margin: 0; }
    /* v2.84.0: 로그인정보 액션 버튼 2열 그리드 (채팅·고객·보장분석·공고등록) */
    .side-quick2 { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
    .side-quick2 .menu-pill { min-height:50px; padding:6px; line-height:1.28; word-break:keep-all; }
    .side-quick2 .menu-pill.is-cta { color:#fff; border-color:transparent; background:linear-gradient(135deg,#f59e0b,#f97316 52%,#db2777); font-weight:900; box-shadow:0 8px 20px rgba(249,115,22,0.24); }
    .side-quick2 .menu-pill.is-cta:hover { color:#fff; filter:brightness(1.04); box-shadow:0 10px 26px rgba(249,115,22,0.34); }
    [data-theme="dark"] .side-quick2 .menu-pill.is-cta { color:#fff; border-color:rgba(251,191,36,0.22); }
    @media (max-width: 480px) {
      .side-submit-single { margin: 4px 14px 8px; padding: 12px 14px; }
      .side-submit-single .sss-title { font-size: 13.5px; }
      .side-submit-single .sss-sub   { font-size: 11.5px; }
    }
    body.ic-mobile .side-submit-single { margin: 6px 14px 10px; padding: 14px 16px; }
    body.ic-mobile .side-submit-single .sss-title { font-size: 14px; }
    body.ic-mobile .side-submit-single .sss-sub   { font-size: 12px; }

    /* 모달 안 채용/강의 모드 토글 */
    .sm-mode-toggle {
      display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px;
      margin-bottom: 18px;
      padding: 4px;
      background: var(--bg-soft, #f1f3f9);
      border-radius: 12px;
      border: 1px solid var(--border, rgba(0,0,0,0.08));
    }
    .sm-mode-btn {
      padding: 10px 8px;
      border-radius: 9px;
      border: none;
      background: transparent;
      color: var(--txt-mid);
      font-family: inherit;
      font-size: 13px; font-weight: 700;
      cursor: pointer;
      display: inline-flex; align-items: center; justify-content: center; gap: 6px;
      transition: all .12s;
    }
    .sm-mode-btn:hover { color: var(--txt-hi); }
    .sm-mode-btn.active.recruit {
      background: linear-gradient(135deg, #1a3de8, #4f6df0);
      color: #fff;
      box-shadow: 0 4px 12px rgba(26,61,232,0.30);
    }
    .sm-mode-btn.active.lecture {
      background: linear-gradient(135deg, #db2777, #ec4899);
      color: #fff;
      box-shadow: 0 4px 12px rgba(219,39,119,0.30);
    }
    .sm-mode-btn.active.meetup {
      background: linear-gradient(135deg, #0d9488, #0ea5e9);
      color: #fff;
      box-shadow: 0 4px 12px rgba(13,148,136,0.30);
    }
    [data-theme="dark"] .sm-mode-toggle {
      background: rgba(255,255,255,0.04);
      border-color: rgba(255,255,255,0.08);
    }

    /* ══════════════ 사이드바 컴팩트 시계 위젯 ══════════════ */
    .side-clock {
      margin: 6px 10px 8px;
      padding: 11px 13px 10px;
      background: linear-gradient(135deg, var(--blue-mid) 0%, var(--blue-deep) 100%);
      color: #fff;
      border-radius: 12px;
      position: relative;
      overflow: hidden;
      box-shadow: 0 4px 14px rgba(26,61,232,0.20);
    }
    .side-clock::before {
      content: '';
      position: absolute;
      top: -40%; right: -20%;
      width: 90px; height: 90px;
      background: radial-gradient(circle, rgba(255,255,255,0.18), transparent 70%);
      pointer-events: none;
    }
    .side-clock-head {
      position: relative;
      display: flex;
      align-items: center;
      justify-content: space-between;
      font-size: 9px;
      font-weight: 700;
      letter-spacing: 0.08em;
      opacity: 0.92;
      margin-bottom: 5px;
    }
    .side-clock-head .ic-clock-dot {
      display: inline-block;
      width: 6px; height: 6px;
      background: #4ade80;
      border-radius: 50%;
      box-shadow: 0 0 6px rgba(74,222,128,0.7);
      margin-right: 5px;
      vertical-align: -1px;
      animation: clockDotPulse 2s ease-in-out infinite;
    }
    @keyframes clockDotPulse {
      0%,100% { opacity: 1; }
      50% { opacity: 0.5; }
    }
    .side-clock-time {
      position: relative;
      font-size: 26px;
      font-weight: 800;
      font-variant-numeric: tabular-nums;
      letter-spacing: 0.01em;
      line-height: 1;
      display: flex;
      align-items: baseline;
      gap: 1px;
    }
    .side-clock-time .ic-clock-colon {
      display: inline-block;
      animation: colonBlink 1s steps(2, end) infinite;
      margin: 0 1px;
    }
    .side-clock-time .ic-clock-seconds {
      font-size: 13px;
      font-weight: 600;
      opacity: 0.7;
      margin-left: 6px;
      letter-spacing: 0;
    }
    .side-clock-date {
      position: relative;
      font-size: 10.5px;
      margin-top: 6px;
      display: flex;
      align-items: center;
      gap: 6px;
      opacity: 0.95;
    }
    .side-clock-date .ic-clock-day {
      background: rgba(255,255,255,0.18);
      padding: 1px 7px;
      border-radius: 8px;
      font-weight: 700;
      font-size: 9.5px;
    }
    /* 모바일 더 컴팩트 */
    @media (max-width: 480px) {
      .side-clock { padding: 9px 11px 8px; margin: 5px 10px 6px; }
      .side-clock-time { font-size: 22px; }
      .side-clock-time .ic-clock-seconds { font-size: 11px; }
      .side-clock-head { font-size: 8.5px; }
      .side-clock-date { font-size: 10px; margin-top: 4px; }
    }
    .side-search-btn .ssb-icon { font-size: 13px; flex-shrink: 0; }
    .side-search-btn .ssb-label { flex: 1; text-align: left; }
    .side-search-btn .ssb-kbd {
      font-family: 'JetBrains Mono', monospace;
      font-size: 9.5px; font-weight: 700;
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 3px;
      padding: 1px 5px;
      color: var(--txt-mid);
      flex-shrink: 0;
    }

    @media (max-width: 480px) {
      .tool-fav-btn { width: 22px; height: 22px; font-size: 14px; right: 32px; top: 8px; }
      #global-search-overlay { padding-top: 4vh; padding-left: 12px; padding-right: 12px; }
      .gs-modal { max-height: 90vh; }
      .gs-input-wrap input { font-size: 15px; }
    }

    /* ══════════════════════════════
       통합 계산기 모달 (화폐가치·예적금·연금·보험료환산)
    ══════════════════════════════ */
    #calc-overlay {
      display: none;
      position: fixed; inset: 0;
      z-index: 9700;
      background: rgba(0,0,0,0.55);
      backdrop-filter: blur(3px);
      align-items: center; justify-content: center;
      padding: 16px;
    }
    #calc-overlay.open { display: flex; }
    .calc-modal {
      width: 100%; max-width: 540px;
      max-height: 92vh;
      display: flex; flex-direction: column;
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 14px;
      overflow: hidden;
      box-shadow: 0 20px 60px rgba(0,0,0,0.35);
    }
    .calc-header {
      display: flex; align-items: center; justify-content: space-between;
      gap: 10px;
      padding: 14px 18px;
      border-bottom: 1px solid var(--border);
      background: linear-gradient(90deg, rgba(26,61,232,0.08), rgba(159,122,234,0.05));
      flex-shrink: 0;
    }
    .calc-header h2 {
      font-size: 16px; font-weight: 700;
      color: var(--txt-hi);
      margin: 0;
      display: flex; align-items: center; gap: 8px;
    }
    .calc-header .calc-close {
      background: none; border: none;
      font-size: 22px; color: var(--txt-lo);
      cursor: pointer; line-height: 1;
      padding: 2px 6px;
    }
    .calc-body {
      padding: 16px 18px 20px;
      overflow-y: auto;
      flex: 1; min-height: 0;
    }
    .calc-tabs {
      display: flex; gap: 4px;
      padding: 4px;
      background: var(--bg);
      border-radius: 8px;
      margin-bottom: 16px;
    }
    .calc-tab {
      flex: 1;
      padding: 7px 10px;
      border: none;
      border-radius: 6px;
      background: transparent;
      color: var(--txt-mid);
      font-size: 12.5px; font-weight: 600;
      cursor: pointer;
      transition: all 0.15s;
    }
    .calc-tab.active {
      background: var(--bg-card);
      color: var(--blue-mid);
      box-shadow: 0 1px 4px rgba(0,0,0,0.06);
    }
    .calc-field {
      margin-bottom: 12px;
    }
    .calc-field label {
      display: block;
      font-size: 11.5px; font-weight: 600;
      color: var(--txt-mid);
      margin-bottom: 6px;
      letter-spacing: 0.02em;
    }
    .calc-field input,
    .calc-field select {
      width: 100%;
      padding: 9px 12px;
      border: 1px solid var(--border);
      border-radius: 8px;
      background: var(--bg);
      color: var(--txt-hi);
      font-size: 14px;
      font-family: inherit;
      outline: none;
      transition: border-color 0.15s;
    }
    .calc-field input:focus,
    .calc-field select:focus {
      border-color: var(--blue-mid);
    }
    .calc-field-inline {
      display: flex; gap: 8px;
    }
    .calc-field-inline > * { flex: 1; }
    .calc-btn {
      width: 100%;
      padding: 11px;
      margin-top: 6px;
      background: linear-gradient(135deg, #1a3de8, #4a70f5);
      color: #fff;
      border: none; border-radius: 10px;
      font-size: 14px; font-weight: 700;
      cursor: pointer;
      box-shadow: 0 2px 10px rgba(26,61,232,0.25);
      transition: all 0.15s;
    }
    .calc-btn:hover {
      box-shadow: 0 4px 14px rgba(26,61,232,0.4);
      transform: translateY(-1px);
    }
    .calc-result {
      margin-top: 14px;
      padding: 14px 16px;
      border: 1px solid rgba(26,61,232,0.20);
      background: linear-gradient(135deg, rgba(26,61,232,0.06), rgba(159,122,234,0.04));
      border-radius: 10px;
    }
    .calc-result-label {
      font-size: 11px; font-weight: 700;
      color: var(--blue-mid);
      letter-spacing: 0.06em;
      margin-bottom: 6px;
      text-transform: uppercase;
    }
    .calc-result-value {
      font-size: 22px; font-weight: 800;
      color: var(--txt-hi);
      letter-spacing: -0.01em;
      word-break: break-all;
    }
    .calc-result-sub {
      font-size: 11.5px;
      color: var(--txt-lo);
      margin-top: 4px;
    }
    .calc-note {
      font-size: 11px;
      color: var(--txt-lo);
      margin-top: 10px;
      padding: 8px 10px;
      background: var(--bg);
      border-radius: 6px;
      line-height: 1.5;
    }
    @media (max-width: 480px) {
      .calc-modal { max-height: 95vh; }
      .calc-body { padding: 14px; }
      .calc-result-value { font-size: 19px; }
    }

    /* ══════════════════════════════
       보험사 점검/장애 알림 배너 (상단 고정)
    ══════════════════════════════ */
    #alert-banner {
      display: none;
      position: relative;
      z-index: 100;
      padding: 10px 16px;
      gap: 10px;
      align-items: center;
      font-size: 13px;
      font-weight: 600;
      border-bottom: 1px solid rgba(0,0,0,0.06);
      animation: alertSlideDown 0.35s ease;
    }
    #alert-banner.open { display: flex; }
    #alert-banner.sev-info { background: linear-gradient(90deg, #dbeafe, #eff6ff); color: #1e3a8a; }
    #alert-banner.sev-warn { background: linear-gradient(90deg, #fef3c7, #fffbeb); color: #92400e; }
    #alert-banner.sev-down { background: linear-gradient(90deg, #fee2e2, #fef2f2); color: #991b1b; }
    .alert-icon { font-size: 16px; flex-shrink: 0; }
    .alert-text { flex: 1; min-width: 0; overflow: hidden; }
    .alert-text strong { display: inline; }
    .alert-text .alert-msg {
      font-weight: 500; opacity: 0.85;
      margin-left: 8px;
      overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    }
    .alert-nav {
      display: flex; align-items: center; gap: 4px;
      flex-shrink: 0;
    }
    .alert-nav-btn,
    .alert-close-btn {
      background: rgba(0,0,0,0.05);
      border: none;
      width: 24px; height: 24px;
      border-radius: 6px;
      cursor: pointer;
      color: inherit;
      font-size: 12px; font-weight: 700;
      line-height: 1;
      display: flex; align-items: center; justify-content: center;
    }
    .alert-nav-btn:hover, .alert-close-btn:hover { background: rgba(0,0,0,0.1); }
    .alert-count {
      font-size: 11px; opacity: 0.7;
      padding: 0 6px;
    }
    @keyframes alertSlideDown {
      from { transform: translateY(-100%); opacity: 0; }
      to   { transform: translateY(0); opacity: 1; }
    }
    [data-theme="dark"] #alert-banner.sev-info { background: linear-gradient(90deg, rgba(30,58,138,0.30), rgba(30,58,138,0.15)); color: #c7d2fe; }
    [data-theme="dark"] #alert-banner.sev-warn { background: linear-gradient(90deg, rgba(146,64,14,0.30), rgba(146,64,14,0.15)); color: #fde68a; }
    [data-theme="dark"] #alert-banner.sev-down { background: linear-gradient(90deg, rgba(153,27,27,0.35), rgba(153,27,27,0.15)); color: #fca5a5; }
    [data-theme="dark"] .alert-nav-btn,
    [data-theme="dark"] .alert-close-btn { background: rgba(255,255,255,0.10); }
    [data-theme="dark"] .alert-nav-btn:hover,
    [data-theme="dark"] .alert-close-btn:hover { background: rgba(255,255,255,0.18); }
    @media (max-width: 480px) {
      #alert-banner { padding: 8px 12px; font-size: 12px; }
      .alert-text .alert-msg { display: none; }
    }