/* ═══════════════════════════════════════════════════════
   X-LINE CAMPUS — Dark Mode + Detail Page Typography
   ═══════════════════════════════════════════════════════ */

/* ══════════ CSS 변수 ══════════ */
[data-theme="dark"] {
  --bg:   #0B0B0C;
  --bg2:  #131315;
  --bgs:  #1A1A1E;
  --ink:  #F2F2F5;
  --ink2: #C8C8D8;   /* 기존 #9898A8 → 훨씬 밝게 */
  --ink3: #9696AA;   /* 기존 #5C5C6E → 밝게 */
  --ink4: #5C5C70;
  /* 포인트 컬러 — RGB 변수로 정의해 오렌지/민트/핑크 전환 가능 */
  --ac:  255, 87, 34;   /* 메인 포인트 RGB  (#FF5722) */
  --ac2: 229, 57, 53;   /* 보조 포인트 RGB  (#E53935) */
  --ac3: 255, 112, 67;  /* 밝은 변형 RGB    (#FF7043) */
  --blue:   #FF5722;
  --violet: #E53935;
  --grad:   linear-gradient(135deg, rgb(var(--ac)), rgb(var(--ac2)));
  --blt:    rgba(var(--ac), .10);
  --bd:     rgba(var(--ac), .16);
  --bd2:    rgba(var(--ac), .36);
}

/* ══════════ 포인트 컬러 (라이트·다크 공통 적용) ══════════
   data-accent 가 지정되면 라이트/다크 모두 해당 색으로 전환.
   지정 없으면(기본) 라이트=블루 / 다크=오렌지 유지.
   --blue=메인색, --violet=그라데이션 파트너색(원본처럼 2색 그라데이션 유지). */
[data-accent="orange"] {
  --ac:  255, 87, 34;  --ac2: 229, 57, 53;  --ac3: 255, 112, 67;
  --blue: #FF5722; --violet: #E5374B;       /* 오렌지 → 레드 */
}
[data-accent="red"] {
  --ac:  244, 63, 94;  --ac2: 251, 146, 60; --ac3: 251, 113, 133;
  --blue: #F43F5E; --violet: #FB923C;       /* 레드 → 오렌지 */
}
[data-accent="amber"] {
  --ac:  245, 158, 11; --ac2: 249, 115, 22; --ac3: 255, 196, 86;
  --blue: #F59E0B; --violet: #F97316;       /* 앰버 → 오렌지 */
}
[data-accent="lime"] {
  --ac:  132, 204, 22; --ac2: 34, 197, 94;  --ac3: 163, 230, 53;
  --blue: #84CC16; --violet: #22C55E;       /* 라임 → 그린 */
}
[data-accent="mint"] {
  --ac:  22, 214, 174; --ac2: 14, 165, 233; --ac3: 77, 234, 196;
  --blue: #16D6AE; --violet: #0EA5E9;       /* 민트 → 시안블루 */
}
[data-accent="cyan"] {
  --ac:  6, 182, 212;  --ac2: 59, 130, 246; --ac3: 34, 211, 238;
  --blue: #06B6D4; --violet: #3B82F6;       /* 시안 → 블루 */
}
[data-accent="blue"] {
  --ac:  59, 130, 246; --ac2: 124, 58, 237; --ac3: 96, 165, 250;
  --blue: #3B82F6; --violet: #7C3AED;       /* 블루 → 바이올렛(원본형) */
}
[data-accent="purple"] {
  --ac:  168, 85, 247; --ac2: 236, 72, 153; --ac3: 192, 132, 252;
  --blue: #A855F7; --violet: #EC4899;       /* 퍼플 → 핑크 */
}
[data-accent="pink"] {
  --ac:  255, 77, 141; --ac2: 192, 38, 211; --ac3: 255, 125, 174;
  --blue: #FF4D8D; --violet: #C026D3;       /* 핑크 → 마젠타 */
}
/* 위 블록 공통 파생 변수 (테두리·옅은 배경·그라데이션) */
[data-accent="orange"], [data-accent="red"],   [data-accent="amber"],
[data-accent="lime"],   [data-accent="mint"],  [data-accent="cyan"],
[data-accent="blue"],   [data-accent="purple"],[data-accent="pink"] {
  --grad: linear-gradient(135deg, rgb(var(--ac)), rgb(var(--ac2)));
  --blt:  rgba(var(--ac), .10);
  --bd:   rgba(var(--ac), .16);
  --bd2:  rgba(var(--ac), .36);
}

/* ── 테마 전환 트랜지션 ── */
.theme-transitioning,
.theme-transitioning * {
  transition:
    background-color .28s ease,
    color .22s ease,
    border-color .22s ease,
    box-shadow .22s ease !important;
}

/* ── 기본 ── */
[data-theme="dark"] body { background: var(--bg) !important; color: var(--ink); }
[data-theme="dark"] ::-webkit-scrollbar-track { background: var(--bg2) !important; }
[data-theme="dark"] ::-webkit-scrollbar-thumb { background: rgba(var(--ac),.28) !important; }

/* ── 커서 링 (index) ── */
[data-theme="dark"] #cur-ring { border-color: rgba(var(--ac),.45) !important; }
[data-theme="dark"] body:has(a:hover,button:hover) #cur-ring { border-color: rgba(var(--ac2),.6) !important; }

/* ══════════ INDEX 페이지 ══════════ */
[data-theme="dark"] nav {
  background: rgba(11,11,12,.92) !important;
  border-bottom-color: var(--bd) !important;
}
[data-theme="dark"] #flash { background: rgba(var(--ac),.4) !important; }

/* 로고 전체 — dark 배경에서 white/orange로 (invert + hue 보정) */
[data-theme="dark"] #logo-main,
[data-theme="dark"] .nl img,
[data-theme="dark"] .fbl img,
[data-theme="dark"] .sidebar-logo img {
  filter: invert(1) hue-rotate(-8deg) saturate(1.5) brightness(1.08) !important;
}

/* ── 로고를 선택한 포인트 컬러에 맞춰 단색화 (라이트·다크 공통) ──
   brightness(0)으로 실루엣화한 뒤 hue-rotate로 색을 입힘.
   data-accent 가 지정된 경우에만 적용(기본 상태는 원본 로고 유지). */
[data-accent] #logo-main, [data-accent] .nl img,
[data-accent] .fbl img,  [data-accent] .sidebar-logo img {
  filter: brightness(0) saturate(100%) invert(48%) sepia(96%) saturate(900%)
          hue-rotate(0deg) brightness(98%) contrast(96%) !important;
}
[data-accent="orange"] #logo-main, [data-accent="orange"] .nl img, [data-accent="orange"] .fbl img, [data-accent="orange"] .sidebar-logo img { filter: brightness(0) saturate(100%) invert(48%) sepia(96%) saturate(2000%) hue-rotate(-23deg) brightness(101%) contrast(101%) !important; }
[data-accent="red"]    #logo-main, [data-accent="red"] .nl img,    [data-accent="red"] .fbl img,    [data-accent="red"] .sidebar-logo img    { filter: brightness(0) saturate(100%) invert(40%) sepia(85%) saturate(3000%) hue-rotate(317deg) brightness(98%) contrast(101%) !important; }
[data-accent="amber"]  #logo-main, [data-accent="amber"] .nl img,  [data-accent="amber"] .fbl img,  [data-accent="amber"] .sidebar-logo img  { filter: brightness(0) saturate(100%) invert(70%) sepia(75%) saturate(1400%) hue-rotate(2deg)   brightness(102%) contrast(99%) !important; }
[data-accent="lime"]   #logo-main, [data-accent="lime"] .nl img,   [data-accent="lime"] .fbl img,   [data-accent="lime"] .sidebar-logo img   { filter: brightness(0) saturate(100%) invert(72%) sepia(55%) saturate(1100%) hue-rotate(45deg)  brightness(95%)  contrast(92%) !important; }
[data-accent="mint"]   #logo-main, [data-accent="mint"] .nl img,   [data-accent="mint"] .fbl img,   [data-accent="mint"] .sidebar-logo img   { filter: brightness(0) saturate(100%) invert(70%) sepia(60%) saturate(700%)  hue-rotate(118deg) brightness(95%)  contrast(95%) !important; }
[data-accent="cyan"]   #logo-main, [data-accent="cyan"] .nl img,   [data-accent="cyan"] .fbl img,   [data-accent="cyan"] .sidebar-logo img   { filter: brightness(0) saturate(100%) invert(58%) sepia(85%) saturate(1200%) hue-rotate(150deg) brightness(92%)  contrast(95%) !important; }
[data-accent="blue"]   #logo-main, [data-accent="blue"] .nl img,   [data-accent="blue"] .fbl img,   [data-accent="blue"] .sidebar-logo img   { filter: brightness(0) saturate(100%) invert(45%) sepia(90%) saturate(1500%) hue-rotate(192deg) brightness(97%)  contrast(95%) !important; }
[data-accent="purple"] #logo-main, [data-accent="purple"] .nl img, [data-accent="purple"] .fbl img, [data-accent="purple"] .sidebar-logo img { filter: brightness(0) saturate(100%) invert(45%) sepia(75%) saturate(2500%) hue-rotate(236deg) brightness(98%)  contrast(96%) !important; }
[data-accent="pink"]   #logo-main, [data-accent="pink"] .nl img,   [data-accent="pink"] .fbl img,   [data-accent="pink"] .sidebar-logo img   { filter: brightness(0) saturate(100%) invert(55%) sepia(70%) saturate(3000%) hue-rotate(300deg) brightness(101%) contrast(98%) !important; }

[data-theme="dark"] #hlogo::before {
  background: radial-gradient(ellipse at 50% 48%,
    rgba(11,11,12,.92) 0%, rgba(11,11,12,.6) 40%, transparent 80%) !important;
}
[data-theme="dark"] #htag::before {
  background: radial-gradient(ellipse at 50% 40%,
    rgba(11,11,12,.88) 0%, rgba(11,11,12,.52) 44%, transparent 82%) !important;
}
[data-theme="dark"] .hstats {
  background: linear-gradient(to bottom, rgba(11,11,12,.5) 0%, transparent 100%) !important;
  border-top-color: var(--bd) !important;
}
[data-theme="dark"] #concept,
[data-theme="dark"] #features,
[data-theme="dark"] #process,
[data-theme="dark"] #problem,
[data-theme="dark"] #cta { background: rgba(19,19,21,.92) !important; }
[data-theme="dark"] footer { background: rgba(11,11,12,.94) !important; border-top-color: var(--bd) !important; }
[data-theme="dark"] .fc           { background: var(--bgs) !important; }
[data-theme="dark"] .fc:hover     { background: var(--blt) !important; }
[data-theme="dark"] .pc           { background: var(--bgs) !important; }
[data-theme="dark"] .cc           { background: rgba(var(--ac),.06) !important; }
[data-theme="dark"] .ctin         { background: var(--bgs) !important; color: var(--ink) !important; border-color: var(--bd) !important; }
[data-theme="dark"] .ctin::placeholder { color: var(--ink3) !important; }
[data-theme="dark"] .ctg { background: radial-gradient(ellipse, rgba(var(--ac),.08) 0%, transparent 70%) !important; }
[data-theme="dark"] .pdot          { background: var(--bgs) !important; }
[data-theme="dark"] .corner        { border-color: rgba(var(--ac),.2) !important; }
[data-theme="dark"] .hero::before,
[data-theme="dark"] .hero::after   { border-color: rgba(var(--ac),.22) !important; }

/* ══════════ 내부 앱 — 기본 구조 ══════════ */
[data-theme="dark"] .sidebar        { background: var(--bg2) !important; border-right-color: var(--bd) !important; }
[data-theme="dark"] .topbar         { background: var(--bg) !important; border-bottom-color: var(--bd) !important; }
[data-theme="dark"] .main           { background: var(--bg) !important; }
[data-theme="dark"] .project-list-panel { background: var(--bg2) !important; border-right-color: var(--bd) !important; }
[data-theme="dark"] .user-card      { background: var(--bgs) !important; border-color: var(--bd) !important; }
[data-theme="dark"] .nav-item.active { background: rgba(var(--ac),.12) !important; }
[data-theme="dark"] .nav-item:hover  { background: rgba(var(--ac),.07) !important; }
[data-theme="dark"] .nav-item.active::before { background: var(--grad) !important; }
[data-theme="dark"] .nav-badge {
  background: rgba(var(--ac),.14) !important;
  -webkit-background-clip: unset !important;
  background-clip: unset !important;
  -webkit-text-fill-color: rgb(var(--ac3)) !important;
  color: rgb(var(--ac3)) !important;
  border-color: rgba(var(--ac),.35) !important;
}

/* ── 카드 ── */
[data-theme="dark"] .info-card, [data-theme="dark"] .brief-file-card,
[data-theme="dark"] .critique-item, [data-theme="dark"] .revision-task,
[data-theme="dark"] .feedback-item-sm, [data-theme="dark"] .feedback-item,
[data-theme="dark"] .file-row, [data-theme="dark"] .folder-card,
[data-theme="dark"] .task-row, [data-theme="dark"] .sched-item,
[data-theme="dark"] .pin-item, [data-theme="dark"] .ver-item,
[data-theme="dark"] .lf-item, [data-theme="dark"] .plist-item,
[data-theme="dark"] .comment-item,
[data-theme="dark"] .greeting-card, [data-theme="dark"] .stat-card,
[data-theme="dark"] .deadline-card, [data-theme="dark"] .project-card,
[data-theme="dark"] .archive-card, [data-theme="dark"] .form-card,
[data-theme="dark"] .upcoming-card { background: var(--bgs) !important; }
[data-theme="dark"] .folder-card:hover { background: var(--blt) !important; }
[data-theme="dark"] .rf-group { background: var(--bgs) !important; }   /* 최근파일 수업 그룹 */
[data-theme="dark"] .kcol   { background: var(--bgs) !important; }
[data-theme="dark"] .kcard  { background: var(--bg2) !important; }
[data-theme="dark"] .dmain, [data-theme="dark"] .dbody { background: var(--bg2) !important; }
[data-theme="dark"] .dside  { background: var(--bg2) !important; border-right-color: var(--bd) !important; }
[data-theme="dark"] .ls-card, [data-theme="dark"] .reflection-view,
[data-theme="dark"] .brief-file, [data-theme="dark"] .file-card { background: var(--bgs) !important; }
/* 도면은 다크모드에서도 흰 종이 유지(색 정확·인쇄물 동일). 주변 캔버스(.fcp)만 다크 */
[data-theme="dark"] .drawing-card { background: #FFFFFF !important; }
[data-theme="dark"] .flp    { background: var(--bg2) !important; }
[data-theme="dark"] .fcp    { background: #0D0D10 !important; }
[data-theme="dark"] .fcp-toolbar { background: var(--bg) !important; border-bottom-color: var(--bd) !important; }
[data-theme="dark"] .frp    { background: var(--bg) !important; }
[data-theme="dark"] .modal-card  { background: var(--bg2) !important; }
[data-theme="dark"] .modal-close { background: var(--bgs) !important; color: var(--ink3) !important; }
[data-theme="dark"] .team-panel > div,
[data-theme="dark"] .message-item { background: transparent !important; }

/* ── 버튼 & 칩 ── */
[data-theme="dark"] .topbar-icon-btn { background: var(--bg2) !important; }
[data-theme="dark"] .zoom-btn        { background: var(--bg2) !important; }
[data-theme="dark"] .flp-chip        { background: var(--bg2) !important; }
[data-theme="dark"] .notif-dot       { border-color: var(--bg) !important; }

/* ── 필터 탭/칩 ── */
[data-theme="dark"] .filter-tab      { background: var(--bg2) !important; border-color: var(--bd) !important; color: var(--ink3) !important; }
[data-theme="dark"] .filter-tab.active { background: var(--blt) !important; border-color: var(--blue) !important; color: var(--blue) !important; }
[data-theme="dark"] .filter-chip     { background: var(--bg2) !important; border-color: var(--bd) !important; color: var(--ink3) !important; }
[data-theme="dark"] .filter-chip.active { background: var(--blt) !important; border-color: var(--blue) !important; color: var(--blue) !important; }

/* ── 프로젝트 생성 ── */
[data-theme="dark"] .type-card         { background: var(--bg2) !important; border-color: var(--bd) !important; }
[data-theme="dark"] .type-card.selected { background: var(--blt) !important; border-color: var(--blue) !important; }

/* ── 프로젝트 진행 단계 표시 ── */
[data-theme="dark"] .pstep-dot        { background: var(--bg2) !important; }

/* ── 파일뷰어 슬라이드 ── */
[data-theme="dark"] .slide-body       { background: var(--bg2) !important; }

/* ── 폼 ── */
[data-theme="dark"] input, [data-theme="dark"] textarea, [data-theme="dark"] select,
[data-theme="dark"] .form-input, [data-theme="dark"] .form-textarea, [data-theme="dark"] .form-select,
[data-theme="dark"] .plist-search input, [data-theme="dark"] .msg-input-row textarea,
[data-theme="dark"] .comment-input-row textarea, [data-theme="dark"] #c-input, [data-theme="dark"] #msg-input {
  background: var(--bgs) !important;
  color: var(--ink) !important;
  border-color: var(--bd) !important;
}
[data-theme="dark"] input::placeholder, [data-theme="dark"] textarea::placeholder { color: var(--ink3) !important; }

/* ── 다크모드 회색글씨 → 화이트 계열로 강제 ── */
[data-theme="dark"] .nav-section-label,
[data-theme="dark"] .sidebar-logo-sub,
[data-theme="dark"] .stat-desc,
[data-theme="dark"] .file-meta, [data-theme="dark"] .flp-meta,
[data-theme="dark"] .feedback-meta, [data-theme="dark"] .critique-meta,
[data-theme="dark"] .milestone-date, [data-theme="dark"] .timeline-date,
[data-theme="dark"] .ver-date, [data-theme="dark"] .comment-time,
[data-theme="dark"] .message-time, [data-theme="dark"] .plist-item-sub,
[data-theme="dark"] .revision-task-src, [data-theme="dark"] .revision-task-date,
[data-theme="dark"] .hsl,
[data-theme="dark"] .ls-key, [data-theme="dark"] .stat-lbl,
[data-theme="dark"] .sched-month, [data-theme="dark"] .sched-loc,
[data-theme="dark"] .frp-label, [data-theme="dark"] .sec-title,
[data-theme="dark"] .user-email { color: var(--ink3) !important; }

[data-theme="dark"] .greeting-sub, [data-theme="dark"] .project-meta-row > span,
[data-theme="dark"] .critique-item-body, [data-theme="dark"] .message-text,
[data-theme="dark"] .feedback-text, [data-theme="dark"] .fb-text,
[data-theme="dark"] .revision-task-text, [data-theme="dark"] .kcard .cm,
[data-theme="dark"] .ver-uploader, [data-theme="dark"] .ver-note,
[data-theme="dark"] .c-text, [data-theme="dark"] .lf-text,
[data-theme="dark"] .coming-soon-desc, [data-theme="dark"] .roadmap-note-text,
[data-theme="dark"] .type-card-desc { color: var(--ink2) !important; }

[data-theme="dark"] .ref-textarea { background: var(--bg) !important; color: var(--ink) !important; }

/* ══════════ DETAIL PAGE TYPOGRAPHY (라이트/다크 공통) ══════════
   .sidebar가 있는 내부 앱 페이지에만 적용 (index.html 제외)      */

/* 사이드바 네비 */
.sidebar .nav-item          { font-size: 14px !important; font-weight: 500 !important; }
.sidebar .nav-item.active   { font-weight: 700 !important; }
.sidebar .nav-section-label { font-size: 10px !important; font-weight: 700 !important; letter-spacing: 1.5px !important; }
.sidebar .sidebar-logo-name { font-size: 14px !important; font-weight: 700 !important; }
.sidebar .user-name         { font-size: 13px !important; font-weight: 700 !important; }
.sidebar .user-email        { font-size: 11px !important; }

/* 상단바 */
.topbar .topbar-title       { font-size: 18px !important; font-weight: 700 !important; letter-spacing: -.4px !important; }

/* 페이지 타이틀 */
.project-title              { font-size: 26px !important; font-weight: 800 !important; letter-spacing: -.7px !important; }
.project-h1                 { font-size: 28px !important; font-weight: 800 !important; letter-spacing: -.8px !important; }
.page-title                 { font-size: 26px !important; font-weight: 800 !important; }
.form-header-title          { font-size: 22px !important; font-weight: 700 !important; }
.coming-soon-title          { font-size: 24px !important; font-weight: 700 !important; }
.greeting-title             { font-size: 22px !important; font-weight: 800 !important; letter-spacing: -.6px !important; }
.viewer-filename            { font-size: 16px !important; font-weight: 700 !important; }

/* 섹션 제목 (진행 중 프로젝트·미해결 피드백 등 — 더 크고 또렷하게) */
.section-title              { font-size: 19px !important; font-weight: 800 !important; }
.rp-section-title           { font-size: 15px !important; font-weight: 700 !important; }
.section-card-title, .card-title { font-size: 15px !important; font-weight: 700 !important; }

/* 카드 이름 */
.project-name               { font-size: 14px !important; font-weight: 700 !important; }
.file-name                  { font-size: 13px !important; font-weight: 700 !important; }
.archive-card-name          { font-size: 15px !important; font-weight: 700 !important; }
.deadline-name, .milestone-name { font-size: 14px !important; font-weight: 700 !important; }
.kcard .ct                  { font-size: 13px !important; font-weight: 700 !important; }
.flp-name                   { font-size: 13px !important; font-weight: 700 !important; }
.message-name, .comment-name { font-size: 13px !important; font-weight: 700 !important; }
.comment-name               { font-size: 13px !important; font-weight: 700 !important; }

/* 본문 텍스트 */
.greeting-sub               { font-size: 15px !important; font-weight: 500 !important; line-height: 1.75 !important; }
.critique-item-body         { font-size: 14px !important; font-weight: 500 !important; line-height: 1.7 !important; }
.message-text               { font-size: 14px !important; font-weight: 500 !important; line-height: 1.65 !important; }
.revision-task-text         { font-size: 18px !important; font-weight: 600 !important; line-height: 1.55 !important; }
.feedback-text, .fb-text    { font-size: 13px !important; font-weight: 500 !important; line-height: 1.65 !important; }
.coming-soon-desc           { font-size: 15px !important; font-weight: 500 !important; line-height: 1.8 !important; }
.roadmap-note-text          { font-size: 13px !important; font-weight: 500 !important; line-height: 1.7 !important; }
.type-card-desc             { font-size: 12px !important; font-weight: 500 !important; }
.reflection-view .ref-text  { font-size: 14px !important; font-weight: 500 !important; line-height: 1.8 !important; }
.meta-value                 { font-size: 13px !important; font-weight: 600 !important; }
.project-meta-row > span    { font-size: 13px !important; font-weight: 500 !important; }
.c-text                     { font-size: 13px !important; font-weight: 500 !important; line-height: 1.65 !important; }
.lf-text                    { font-size: 12px !important; font-weight: 500 !important; }
.ver-note                   { font-size: 12px !important; font-weight: 500 !important; }
.archive-card-subject       { font-size: 13px !important; font-weight: 500 !important; }

/* 폼 레이블 */
.field-label                { font-size: 14px !important; font-weight: 700 !important; }
.field-label-opt            { font-size: 12px !important; font-weight: 500 !important; }
.step-label                 { font-size: 13px !important; font-weight: 600 !important; }
.type-card-name             { font-size: 14px !important; font-weight: 700 !important; }

/* 메타/모노 (살짝만 키움 — 좁은 공간) */
.file-meta, .flp-meta       { font-size: 11px !important; font-weight: 600 !important; }
.feedback-meta, .critique-meta { font-size: 11px !important; font-weight: 600 !important; }
.milestone-date, .timeline-date { font-size: 11px !important; }
.ver-date                   { font-size: 11px !important; }
.comment-time, .message-time { font-size: 11px !important; }
.revision-task-src, .revision-task-date { font-size: 13px !important; }
.archive-count              { font-size: 12px !important; font-weight: 600 !important; }
.plist-item-sub             { font-size: 11px !important; }
.plist-dday                 { font-size: 11px !important; font-weight: 700 !important; }
.stat-desc                  { font-size: 15px !important; font-weight: 600 !important; }

/* 파일뷰어 */
.frp-label                  { font-size: 10px !important; font-weight: 700 !important; }
.ver-uploader               { font-size: 12px !important; font-weight: 600 !important; }
.flp-chip                   { font-size: 10px !important; font-weight: 700 !important; }

/* 아카이브 상세 */
.ls-key                     { font-size: 11px !important; }
.ls-val                     { font-size: 13px !important; font-weight: 600 !important; }
.stat-num                   { font-size: 26px !important; font-weight: 800 !important; }
.stat-lbl                   { font-size: 12px !important; font-weight: 600 !important; }
.hero-title                 { font-size: 30px !important; font-weight: 800 !important; }
.hero-meta                  { font-size: 14px !important; }
.tl-title                   { font-size: 13px !important; font-weight: 600 !important; }
.ms-name                    { font-size: 12px !important; font-weight: 600 !important; }
.ms-date                    { font-size: 10px !important; font-weight: 700 !important; }

/* ══════════ LIGHT MODE 가독성 보강 ══════════
   라이트모드에서 연회색 라벨/섹션 제목이 잘 안 보이는 문제 — 더 진하고 굵고 크게 */
html:not([data-theme="dark"]) .stat-label,
html:not([data-theme="dark"]) .stat-lbl {
  color: #000000 !important;        /* 순검정 — 더 진하게 */
  font-size: 21.6px !important;     /* 약 1.8배 키움 */
  font-weight: 800 !important;
}
/* 상단 통계카드 라벨(진행 중 프로젝트·미해결 피드백·마감 알림 등) — 다크: 흰색 또렷 */
[data-theme="dark"] .stat-label {
  color: #FFFFFF !important;
  font-size: 21.6px !important;     /* 약 1.8배 키움 */
  font-weight: 800 !important;
}
html:not([data-theme="dark"]) .stat-desc {
  color: var(--ink2) !important;
  font-weight: 600 !important;
}
html:not([data-theme="dark"]) .section-title,
html:not([data-theme="dark"]) .rp-section-title,
html:not([data-theme="dark"]) .card-title,
html:not([data-theme="dark"]) .section-card-title {
  color: #000000 !important;        /* 순검정 — 더 진하게 */
  font-size: 19px !important;       /* 더 크게 */
  font-weight: 800 !important;
  letter-spacing: -.3px !important;
}
/* 다크모드: 섹션 제목 순백 + 크게 (라이트의 검정·크게와 같은 논리) */
[data-theme="dark"] .section-title,
[data-theme="dark"] .rp-section-title,
[data-theme="dark"] .card-title,
[data-theme="dark"] .section-card-title {
  color: #FFFFFF !important;        /* 순백 — 가독성 */
  font-size: 19px !important;       /* 더 크게 */
  font-weight: 800 !important;
  letter-spacing: -.3px !important;
}
html:not([data-theme="dark"]) .nav-section-label {
  color: var(--ink2) !important;
  font-weight: 800 !important;
}

/* 토글 버튼 */
.dm-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 15px;
  border-radius: 20px;
  border: 1px solid var(--bd);
  background: var(--bg);
  color: var(--ink2);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  font-family: var(--f, 'Noto Sans KR', sans-serif);
  transition: all .2s;
  white-space: nowrap;
  line-height: 1;
  flex-shrink: 0;
}
.dm-btn:hover { border-color: var(--blue); color: var(--blue); background: var(--blt); }
.dm-btn-icon  { font-size: 14px; line-height: 1; display:inline-flex; }
.dm-btn-icon svg.lucide { width:16px; height:16px; }

/* ── 박스 입체감 (다크): 오렌지 그림자 ── */
[data-theme="dark"] .greeting-card, [data-theme="dark"] .stat-card,
[data-theme="dark"] .project-card,  [data-theme="dark"] .cal-widget,
[data-theme="dark"] .deadline-card, [data-theme="dark"] .file-row,
[data-theme="dark"] .fb-proj {
  border-color: rgba(var(--ac),.30) !important;
  box-shadow: 0 1px 2px rgba(0,0,0,.5), 0 12px 30px -12px rgba(var(--ac),.40) !important;
}
[data-theme="dark"] .stat-card:hover,  [data-theme="dark"] .project-card:hover,
[data-theme="dark"] .file-row:hover,   [data-theme="dark"] .deadline-card:hover,
[data-theme="dark"] .fb-proj:hover {
  border-color: rgba(var(--ac),.5) !important;
  box-shadow: 0 2px 6px rgba(0,0,0,.55), 0 18px 40px -12px rgba(var(--ac),.55) !important;
}

/* ── index 텍스트 박스 입체감 (다크): 오렌지 그림자 ── */
[data-theme="dark"] .fgrid, [data-theme="dark"] .pc,
[data-theme="dark"] .cc,    [data-theme="dark"] .qbox {
  border-color: rgba(var(--ac),.30) !important;
  box-shadow: 0 1px 2px rgba(0,0,0,.5), 0 12px 30px -12px rgba(var(--ac),.40) !important;
}
[data-theme="dark"] .pc:hover {
  border-color: rgba(var(--ac),.5) !important;
  box-shadow: 0 2px 6px rgba(0,0,0,.55), 0 18px 40px -12px rgba(var(--ac),.55) !important;
}

/* ── 포인트 컬러 전환 버튼 (라이트·다크 공통 표시) ── */
.ac-btn .ac-dot {
  width: 13px; height: 13px; border-radius: 50%;
  background: linear-gradient(135deg, var(--blue), var(--violet));
  box-shadow: 0 0 7px var(--bd2);
  flex-shrink: 0;
  transition: background .2s, box-shadow .2s;
}
.ac-btn .ac-caret { font-size: 9px; opacity: .6; margin-left: -2px; }

/* ── 컬러 선택 팝업 ── */
.ac-pop {
  position: fixed;
  z-index: 400;
  display: none;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  padding: 16px;
  border-radius: 16px;
  background: var(--bgs, #fff);
  border: 1px solid var(--bd);
  box-shadow: 0 16px 48px rgba(0,0,0,.5), 0 2px 8px rgba(0,0,0,.3);
}
.ac-pop.open { display: grid; }
.ac-pop-item {
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  cursor: pointer;
}
.ac-sw {
  width: 36px; height: 36px; border-radius: 50%;
  border: 2px solid transparent;
  cursor: pointer; padding: 0;
  position: relative;
  transition: transform .15s, box-shadow .15s;
}
.ac-pop-item:hover .ac-sw { transform: scale(1.12); }
.ac-sw.active {
  border-color: var(--ink, #fff);
  box-shadow: 0 0 0 2px var(--bgs, #fff), 0 0 0 4px var(--blue);
}
.ac-sw.active::after {
  content: ''; position: absolute; inset: 0; margin: auto;
  width: 11px; height: 7px;
  border-left: 2.5px solid #fff; border-bottom: 2.5px solid #fff;
  transform: rotate(-45deg) translate(1px,-1px);
}
.ac-sw-label { font-size: 11px; font-weight: 600; color: var(--ink2); }
.ac-pop-item:hover .ac-sw-label { color: var(--blue); }

/* ══════════ LIGHT MODE 박스 입체감 (그림자·테두리 대비) ══════════
   화이트모드에서 카드가 배경(#F8F9FB)과 구분이 안 되는 문제 —
   (1) 전역 테두리 대비 강화  (2) 주요 카드에 또렷한 그림자 */

/* (1) 전역: 모든 박스 테두리를 더 또렷하게(포인트컬러 연동) */
html:not([data-theme="dark"]) {
  --bd:  rgba(var(--ac, 14,99,224), .26);
  --bd2: rgba(var(--ac, 14,99,224), .42);
}

/* (2) 주요 카드 그림자 */
html:not([data-theme="dark"]) .greeting-card,
html:not([data-theme="dark"]) .stat-card,
html:not([data-theme="dark"]) .project-card,
html:not([data-theme="dark"]) .cal-widget,
html:not([data-theme="dark"]) .deadline-card,
html:not([data-theme="dark"]) .fb-proj,
html:not([data-theme="dark"]) .file-card,
html:not([data-theme="dark"]) .file-row,
html:not([data-theme="dark"]) .rf-group,
html:not([data-theme="dark"]) .info-card,
html:not([data-theme="dark"]) .critique-item,
html:not([data-theme="dark"]) .ls-card,
html:not([data-theme="dark"]) .side-card,
html:not([data-theme="dark"]) .form-card,
html:not([data-theme="dark"]) .onboard-card,
html:not([data-theme="dark"]) .archive-card,
html:not([data-theme="dark"]) .panel,
html:not([data-theme="dark"]) .set-card,
html:not([data-theme="dark"]) .noti,
html:not([data-theme="dark"]) .fgrid,
html:not([data-theme="dark"]) .pc,
html:not([data-theme="dark"]) .cc,
html:not([data-theme="dark"]) .qbox,
html:not([data-theme="dark"]) .user-card,
html:not([data-theme="dark"]) .feedback-item,
html:not([data-theme="dark"]) .revision-task,
html:not([data-theme="dark"]) .task-row,
html:not([data-theme="dark"]) .sched-item,
html:not([data-theme="dark"]) .cal-event {
  border-color: rgba(var(--ac, 14,99,224), .30) !important;
  box-shadow: 0 1px 2px rgba(16,24,40,.07),
              0 10px 26px -12px rgba(16,24,40,.22),
              0 4px 10px -6px rgba(var(--ac, 14,99,224),.14) !important;
}

/* (2-hover) 인터랙티브 카드 호버 시 그림자 강조 */
html:not([data-theme="dark"]) .stat-card:hover,
html:not([data-theme="dark"]) .project-card:hover,
html:not([data-theme="dark"]) .file-row:hover,
html:not([data-theme="dark"]) .file-card:hover,
html:not([data-theme="dark"]) .deadline-card:hover,
html:not([data-theme="dark"]) .fb-proj:hover,
html:not([data-theme="dark"]) .archive-card:hover,
html:not([data-theme="dark"]) .noti:hover,
html:not([data-theme="dark"]) .pc:hover,
html:not([data-theme="dark"]) .user-card:hover,
html:not([data-theme="dark"]) .task-row:hover,
html:not([data-theme="dark"]) .revision-task:hover,
html:not([data-theme="dark"]) .sched-item:hover,
html:not([data-theme="dark"]) .feedback-item:hover,
html:not([data-theme="dark"]) .critique-item:hover {
  border-color: rgba(var(--ac, 14,99,224), .48) !important;
  box-shadow: 0 2px 6px rgba(16,24,40,.10),
              0 16px 36px -12px rgba(16,24,40,.28),
              0 6px 14px -6px rgba(var(--ac, 14,99,224),.22) !important;
}

/* ══════════ 팀 프로젝트 — 온라인 팀원 아이콘 (노션 스타일) ══════════ */
.team-presence{display:inline-flex;align-items:center;flex-shrink:0}
.tp-avatar{
  position:relative;width:24px;height:24px;border-radius:50%;
  background:var(--grad);display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--f,'Noto Sans KR',sans-serif);font-size:11px;font-weight:700;color:#fff;
  border:2px solid var(--bg);margin-left:-7px;flex-shrink:0;cursor:default;
}
.tp-avatar:first-child{margin-left:0}
.tp-avatar .tp-dot{
  position:absolute;right:-2px;bottom:-2px;width:8px;height:8px;border-radius:50%;
  border:2px solid var(--bg);box-sizing:content-box;
}
.tp-dot.on{background:#22C55E}
.tp-dot.off{background:#9AA5B4}
.tp-label{margin-left:9px;font-family:var(--m);font-size:13.5px;color:var(--ink3);white-space:nowrap}