/* ==========================================================================
   EmotionShield B2C Main Web App - Clean Light Mode Theme (theme-light.css)
   Synchronized 100% with Terms (/EmotionShield/terms/) & Privacy Design System
   Brand Tokens: Deep Midnight Teal (#0B1B22), Brand Teal (#1A7B88),
                 Accent Aqua (#38A3A5), Warm Coral (#DE866D), Mint (#63D4C5)
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Base Document, Canvas & Typography
   -------------------------------------------------------------------------- */
html[data-theme="light"],
html[data-theme="light"] body {
  background-color: #F4F8F8 !important;
  color: #0F2530 !important;
  color-scheme: light !important;
}

/* Metallic Silver Text -> Light Mode High Contrast Dark Teal Charcoal */
html[data-theme="light"] .text-metallic-silver {
  background: linear-gradient(135deg, #0F2530 0%, #174557 40%, #1A7B88 75%, #0F2530 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  filter: drop-shadow(0 1px 1px rgba(15, 37, 48, 0.15)) !important;
}

/* --------------------------------------------------------------------------
   2. Top Compliance Bar & Sticky Header
   -------------------------------------------------------------------------- */
html[data-theme="light"] .top-compliance-banner,
html[data-theme="light"] header.sticky,
html[data-theme="light"] header {
  background-color: rgba(255, 255, 255, 0.92) !important;
  border-color: #D1E4E6 !important;
  box-shadow: 0 2px 10px rgba(15, 37, 48, 0.05) !important;
}

/* Top Compliance Notification Banner (/html/body/div[2])
   Referencing Marketing One-pageWebsite /html/body/div[1] */
html[data-theme="light"] #topComplianceBanner,
body.light-theme #topComplianceBanner,
html[data-theme="light"] div[onclick*="showComplianceModal"],
body.light-theme div[onclick*="showComplianceModal"],
html[data-theme="light"] div[class*="border-b"][class*="bg-[#08151B]"]:has(i.fa-shield-halved) {
  background-color: #E6EFF0 !important;
  border-bottom: 1px solid #D1E4E6 !important;
  color: #334E58 !important;
}

html[data-theme="light"] #topComplianceBanner:hover,
body.light-theme #topComplianceBanner:hover,
html[data-theme="light"] div[onclick*="showComplianceModal"]:hover,
body.light-theme div[onclick*="showComplianceModal"]:hover {
  background-color: #D9E7E9 !important;
  color: #0F2530 !important;
}

html[data-theme="light"] #topComplianceBanner span,
body.light-theme #topComplianceBanner span,
html[data-theme="light"] div[onclick*="showComplianceModal"] span,
body.light-theme div[onclick*="showComplianceModal"] span {
  color: #334E58 !important;
}

html[data-theme="light"] #topComplianceBanner strong,
body.light-theme #topComplianceBanner strong,
html[data-theme="light"] div[onclick*="showComplianceModal"] strong,
body.light-theme div[onclick*="showComplianceModal"] strong {
  color: #0F2530 !important;
}

html[data-theme="light"] #topComplianceBanner i.fa-shield-halved,
body.light-theme #topComplianceBanner i.fa-shield-halved,
html[data-theme="light"] div[onclick*="showComplianceModal"] i.fa-shield-halved,
body.light-theme div[onclick*="showComplianceModal"] i.fa-shield-halved {
  color: #38A3A5 !important;
}

html[data-theme="light"] #topComplianceBanner i.fa-arrow-up-right-from-square,
body.light-theme #topComplianceBanner i.fa-arrow-up-right-from-square,
html[data-theme="light"] div[onclick*="showComplianceModal"] i.fa-arrow-up-right-from-square,
body.light-theme div[onclick*="showComplianceModal"] i.fa-arrow-up-right-from-square {
  color: #38A3A5 !important;
}

html[data-theme="light"] header span.text-slate-400 {
  color: #5C7B85 !important;
}

/* Header Action Buttons */
html[data-theme="light"] header button.bg-\[\#0F2530\]\/90,
html[data-theme="light"] header button[class*="bg-[#0F2530]"] {
  background-color: #FFFFFF !important;
  border-color: #D1E4E6 !important;
  color: #334E58 !important;
  box-shadow: 0 1px 4px rgba(15, 37, 48, 0.06) !important;
}
html[data-theme="light"] header button.bg-\[\#0F2530\]\/90:hover,
html[data-theme="light"] header button[class*="bg-[#0F2530]"]:hover {
  background-color: #E6EFF0 !important;
  color: #0F2530 !important;
}

/* Header Badge Counters on Colored Pills: Keep Bright White for Maximum Contrast */
html[data-theme="light"] header #headerAccessPolicyBadge,
body.light-theme header #headerAccessPolicyBadge,
html[data-theme="light"] header #headerEvidenceBadge,
body.light-theme header #headerEvidenceBadge,
html[data-theme="light"] header #headerDiaryBadge,
body.light-theme header #headerDiaryBadge,
html[data-theme="light"] header button span[class*="rounded-full"][class*="text-white"],
body.light-theme header button span[class*="rounded-full"][class*="text-white"],
html[data-theme="light"] header button span[id*="Badge"],
body.light-theme header button span[id*="Badge"] {
  color: #FFFFFF !important;
}

/* --------------------------------------------------------------------------
   3. Target 1: Hero Section (Referencing Terms /html/body/section)
      - #diaryHeroDetails
      - #heroSloganContainer
      - Security Gate Intro Emblem Card
   -------------------------------------------------------------------------- */
html[data-theme="light"] #diaryHeroDetails,
html[data-theme="light"] #heroSloganContainer,
html[data-theme="light"] #securityGateSection > div:first-child {
  background: radial-gradient(circle at 50% 10%, rgba(26, 123, 136, 0.12) 0%, rgba(244, 248, 248, 0.95) 60%),
              linear-gradient(180deg, #E6EFF0 0%, #F4F8F8 100%) !important;
  border: 1px solid #D1E4E6 !important;
  box-shadow: 0 4px 20px -2px rgba(15, 37, 48, 0.06) !important;
}

html[data-theme="light"] #diaryHeroDetails h2,
html[data-theme="light"] #diaryHeroDetails h3,
html[data-theme="light"] #diaryHeroDetails .font-black,
html[data-theme="light"] #heroSloganContainer h2,
html[data-theme="light"] #heroSloganContainer .font-black {
  color: #0F2530 !important;
}

html[data-theme="light"] #diaryHeroDetails p,
html[data-theme="light"] #heroSloganContainer p {
  color: #334E58 !important;
}

html[data-theme="light"] #diaryHeroDetails .text-slate-400,
html[data-theme="light"] #heroSloganContainer .text-slate-400 {
  color: #5C7B85 !important;
}

/* Emblem Box inside Hero (Clean Light Teal Frame) */
html[data-theme="light"] #securityGateSection .bg-\[\#174557\]\/80,
html[data-theme="light"] #diaryHeroDetails .bg-\[\#174557\]\/80 {
  background-color: #ECF5F5 !important;
  border-color: #A4CFD3 !important;
  box-shadow: 0 2px 8px rgba(15, 37, 48, 0.06) !important;
}

/* --------------------------------------------------------------------------
   4. Target 2: Top Mode Switcher Bar (Referencing Terms /html/body/main/div/aside/div)
      - /html/body/main/div[2]/div[1]
   -------------------------------------------------------------------------- */
html[data-theme="light"] div[class*="bg-[#08151B]"][class*="rounded-2xl"],
html[data-theme="light"] #mainWorkspaceSection > div:first-child {
  background-color: #E6EFF0 !important;
  border: 1px solid #D1E4E6 !important;
  box-shadow: inset 0 2px 4px rgba(15, 37, 48, 0.05) !important;
}

/* Inactive Tab Buttons inside Switcher Bar */
html[data-theme="light"] div[class*="bg-[#08151B]"] button:not(.active):not([class*="bg-[#1A7B88]"]):not([class*="bg-emerald-600"]) {
  color: #5C7B85 !important;
  background-color: transparent !important;
}
html[data-theme="light"] div[class*="bg-[#08151B]"] button:not(.active):hover {
  color: #0F2530 !important;
  background-color: rgba(255, 255, 255, 0.5) !important;
}

/* Active Tab Buttons inside Switcher Bar (Solid White Elevated Card) */
html[data-theme="light"] div[class*="bg-[#08151B]"] button.active,
html[data-theme="light"] div[class*="bg-[#08151B]"] button[class*="bg-[#1A7B88]"],
html[data-theme="light"] div[class*="bg-[#08151B]"] button[class*="bg-emerald-600"],
html[data-theme="light"] #mainModeBtnAnalysis.bg-\[\#1A7B88\],
html[data-theme="light"] #mainModeBtnDiary.bg-\[\#1A7B88\] {
  background-color: #FFFFFF !important;
  color: #0F2530 !important;
  border: 1px solid #D1E4E6 !important;
  box-shadow: 0 2px 8px rgba(15, 37, 48, 0.08) !important;
}
html[data-theme="light"] div[class*="bg-[#08151B]"] button[class*="bg-[#1A7B88]"] *,
html[data-theme="light"] div[class*="bg-[#08151B]"] button[class*="bg-emerald-600"] *,
html[data-theme="light"] #mainModeBtnAnalysis.bg-\[\#1A7B88\] *,
html[data-theme="light"] #mainModeBtnDiary.bg-\[\#1A7B88\] * {
  color: #0F2530 !important;
}
html[data-theme="light"] div[class*="bg-[#08151B]"] button[class*="bg-[#1A7B88]"] i,
html[data-theme="light"] div[class*="bg-[#08151B]"] button[class*="bg-emerald-600"] i,
html[data-theme="light"] #mainModeBtnAnalysis.bg-\[\#1A7B88\] i,
html[data-theme="light"] #mainModeBtnDiary.bg-\[\#1A7B88\] i {
  color: #1A7B88 !important;
}

/* Inactive Tab Specific ID Targeting */
html[data-theme="light"] #mainModeBtnAnalysis.text-slate-400,
html[data-theme="light"] #mainModeBtnDiary.text-slate-400 {
  color: #5C7B85 !important;
  background-color: transparent !important;
  border-color: transparent !important;
}
html[data-theme="light"] #mainModeBtnAnalysis.text-slate-400:hover,
html[data-theme="light"] #mainModeBtnDiary.text-slate-400:hover {
  color: #0F2530 !important;
  background-color: rgba(255, 255, 255, 0.6) !important;
}

/* --------------------------------------------------------------------------
   4-1. Target: Input Tab Selector Bar (/html/body/main/div[2]/div[2]/div[1]/div[3]/div/div[1])
        Referencing /html/body/main/div[2]/div[1] (Top Mode Switcher Bar)
   -------------------------------------------------------------------------- */
/* Tab Container Bar */
html[data-theme="light"] #inputViewContainer .grid-cols-3.bg-\[\#08151B\],
html[data-theme="light"] div[class*="grid-cols-3"][class*="bg-[#08151B]"] {
  background-color: #E6EFF0 !important;
  border-bottom: 1px solid #D1E4E6 !important;
  box-shadow: inset 0 2px 4px rgba(15, 37, 48, 0.04) !important;
}

/* Active Tab Button in Input Tab Bar */
html[data-theme="light"] #tabBtnAudio.bg-\[\#0F2530\],
html[data-theme="light"] #tabBtnImage.bg-\[\#0F2530\],
html[data-theme="light"] #tabBtnText.bg-\[\#0F2530\],
html[data-theme="light"] div[class*="grid-cols-3"] button[class*="bg-[#0F2530]"] {
  background-color: #FFFFFF !important;
  color: #0F2530 !important;
  border-bottom: 2px solid #1A7B88 !important;
  box-shadow: 0 2px 8px rgba(15, 37, 48, 0.06) !important;
}

html[data-theme="light"] #tabBtnAudio.bg-\[\#0F2530\] *,
html[data-theme="light"] #tabBtnImage.bg-\[\#0F2530\] *,
html[data-theme="light"] #tabBtnText.bg-\[\#0F2530\] *,
html[data-theme="light"] div[class*="grid-cols-3"] button[class*="bg-[#0F2530]"] span.truncate {
  color: #0F2530 !important;
  font-weight: 700 !important;
}

html[data-theme="light"] #tabBtnAudio.bg-\[\#0F2530\] i,
html[data-theme="light"] #tabBtnImage.bg-\[\#0F2530\] i,
html[data-theme="light"] #tabBtnText.bg-\[\#0F2530\] i,
html[data-theme="light"] div[class*="grid-cols-3"] button[class*="bg-[#0F2530]"] i {
  color: #1A7B88 !important;
}

/* Inactive Tab Buttons in Input Tab Bar */
html[data-theme="light"] #tabBtnAudio.text-slate-400,
html[data-theme="light"] #tabBtnImage.text-slate-400,
html[data-theme="light"] #tabBtnText.text-slate-400,
html[data-theme="light"] div[class*="grid-cols-3"] button.text-slate-400 {
  color: #5C7B85 !important;
  background-color: transparent !important;
  border-bottom: 2px solid transparent !important;
}

html[data-theme="light"] #tabBtnAudio.text-slate-400:hover,
html[data-theme="light"] #tabBtnImage.text-slate-400:hover,
html[data-theme="light"] #tabBtnText.text-slate-400:hover,
html[data-theme="light"] div[class*="grid-cols-3"] button.text-slate-400:hover {
  color: #0F2530 !important;
  background-color: rgba(255, 255, 255, 0.5) !important;
}

/* Sub-badges inside Input Tab Bar (STT & OCR) */
html[data-theme="light"] #tabBtnAudio span[class*="bg-[#1A7B88]"] {
  background-color: #EAF6F7 !important;
  color: #1A7B88 !important;
  border-color: #A4CFD3 !important;
}

html[data-theme="light"] #tabBtnImage span[class*="bg-emerald-500"] {
  background-color: #ECFDF5 !important;
  color: #065F46 !important;
  border-color: #A7F3D0 !important;
}

/* --------------------------------------------------------------------------
   4-1.1 Target: Universal PII Mode Toolbar (/html/body/main/div[2]/div[2]/div[1]/div[3]/div/div[2])
         Universal PII Mode Switcher Bar in Input Container
   -------------------------------------------------------------------------- */
/* Universal PII Toolbar Container Bar */
html[data-theme="light"] #universalPiiToolbar,
body.light-theme #universalPiiToolbar,
html[data-theme="light"] div#universalPiiToolbar,
body.light-theme div#universalPiiToolbar {
  background-color: #FFFFFF !important;
  border-bottom: 1px solid #D1E4E6 !important;
  color: #0F2530 !important;
  box-shadow: none !important;
}

/* Toolbar Title Label */
html[data-theme="light"] #universalPiiToolbar span.text-slate-400,
body.light-theme #universalPiiToolbar span.text-slate-400 {
  color: #334E58 !important;
  font-weight: 700 !important;
}

html[data-theme="light"] #universalPiiToolbar i.fa-user-shield,
body.light-theme #universalPiiToolbar i.fa-user-shield {
  color: #1A7B88 !important;
}

/* Checked Radio Label (가명화 적용 / 원본 유지 선택된 카드) */
html[data-theme="light"] #universalPiiToolbar label:has(input[name="globalPiiDestination"]:checked),
body.light-theme #universalPiiToolbar label:has(input[name="globalPiiDestination"]:checked) {
  background-color: #FFFFFF !important;
  border-color: #A4CFD3 !important;
  box-shadow: 0 1px 6px rgba(15, 37, 48, 0.08) !important;
}

html[data-theme="light"] #universalPiiToolbar label:has(input[name="globalPiiDestination"]:checked) span,
body.light-theme #universalPiiToolbar label:has(input[name="globalPiiDestination"]:checked) span {
  color: #0F2530 !important;
  font-weight: 800 !important;
}

/* Unchecked Radio Label (선택되지 않은 카드) */
html[data-theme="light"] #universalPiiToolbar label:has(input[name="globalPiiDestination"]:not(:checked)),
body.light-theme #universalPiiToolbar label:has(input[name="globalPiiDestination"]:not(:checked)) {
  background-color: #F0F7F8 !important;
  border-color: #D1E4E6 !important;
  box-shadow: none !important;
}

html[data-theme="light"] #universalPiiToolbar label:has(input[name="globalPiiDestination"]:not(:checked)) span,
body.light-theme #universalPiiToolbar label:has(input[name="globalPiiDestination"]:not(:checked)) span {
  color: #5C7B85 !important;
  font-weight: 600 !important;
}

/* Unchecked Radio Label Hover */
html[data-theme="light"] #universalPiiToolbar label:has(input[name="globalPiiDestination"]:not(:checked)):hover,
body.light-theme #universalPiiToolbar label:has(input[name="globalPiiDestination"]:not(:checked)):hover {
  background-color: #FFFFFF !important;
  border-color: #1A7B88 !important;
}

html[data-theme="light"] #universalPiiToolbar label:has(input[name="globalPiiDestination"]:not(:checked)):hover span,
body.light-theme #universalPiiToolbar label:has(input[name="globalPiiDestination"]:not(:checked)):hover span {
  color: #0F2530 !important;
}

/* Hint Text on the Right */
html[data-theme="light"] #globalPiiHintText,
body.light-theme #globalPiiHintText {
  color: #4B6770 !important;
}

html[data-theme="light"] #globalPiiHintText span,
body.light-theme #globalPiiHintText span {
  color: #4B6770 !important;
}

html[data-theme="light"] #globalPiiHintText .text-sky-300,
body.light-theme #globalPiiHintText .text-sky-300 {
  color: #0284C7 !important;
}

html[data-theme="light"] #globalPiiHintText i,
body.light-theme #globalPiiHintText i {
  color: #1A7B88 !important;
}

/* Image/Document Tab Destination Selector Bar */
html[data-theme="light"] div[class*="bg-[#08151B]"]:has(input[name="inputPageDestination"]),
body.light-theme div[class*="bg-[#08151B]"]:has(input[name="inputPageDestination"]) {
  background-color: #EBF3F4 !important;
  border-color: #D1E4E6 !important;
  color: #0F2530 !important;
}

html[data-theme="light"] label:has(input[name="inputPageDestination"]:checked),
body.light-theme label:has(input[name="inputPageDestination"]:checked) {
  background-color: #FFFFFF !important;
  border-color: #A4CFD3 !important;
  box-shadow: 0 1px 6px rgba(15, 37, 48, 0.08) !important;
}

html[data-theme="light"] label:has(input[name="inputPageDestination"]:checked) span,
body.light-theme label:has(input[name="inputPageDestination"]:checked) span {
  color: #0F2530 !important;
  font-weight: 800 !important;
}

html[data-theme="light"] label:has(input[name="inputPageDestination"]:not(:checked)),
body.light-theme label:has(input[name="inputPageDestination"]:not(:checked)) {
  background-color: rgba(255, 255, 255, 0.6) !important;
  border-color: #D1E4E6 !important;
}

html[data-theme="light"] label:has(input[name="inputPageDestination"]:not(:checked)) span,
body.light-theme label:has(input[name="inputPageDestination"]:not(:checked)) span {
  color: #5C7B85 !important;
}

/* 텍스트 입력 탭의 PII 활성 상태 뱃지 및 미리보기 박스 */
html[data-theme="light"] #textPiiActiveStatusBadge,
body.light-theme #textPiiActiveStatusBadge {
  color: #0F766E !important;
}

html[data-theme="light"] #textPiiActiveStatusBadge .text-sky-300,
body.light-theme #textPiiActiveStatusBadge .text-sky-300 {
  color: #0284C7 !important;
}

html[data-theme="light"] #piiPreviewBox,
body.light-theme #piiPreviewBox {
  background-color: #F0F7F7 !important;
  border-color: #D1E4E6 !important;
}

html[data-theme="light"] #piiPreviewBox div:first-child,
body.light-theme #piiPreviewBox div:first-child {
  color: #334E58 !important;
}

html[data-theme="light"] #piiMaskedText.text-emerald-300,
body.light-theme #piiMaskedText.text-emerald-300 {
  color: #065F46 !important;
}

html[data-theme="light"] #piiMaskedText.text-sky-300,
body.light-theme #piiMaskedText.text-sky-300 {
  color: #0369A1 !important;
}

/* --------------------------------------------------------------------------
   4-2. Target: Work Type Segmented Radio Group (/html/body/main/div[2]/div[3]/div[3]/div[2]/div[2]/div)
        Referencing /html/body/main/div[2]/div[1] (Top Mode Switcher Bar)
   -------------------------------------------------------------------------- */
/* Work Type Radio Container Bar */
html[data-theme="light"] div:has(> label > input[name="diaryWorkType"]),
html[data-theme="light"] div[class*="bg-[#08151B]"]:has(input[name="diaryWorkType"]) {
  background-color: #E6EFF0 !important;
  border: 1px solid #D1E4E6 !important;
  box-shadow: inset 0 2px 4px rgba(15, 37, 48, 0.05) !important;
}

/* Selected Label (Checked Item) -> Pure White Card + High Contrast */
html[data-theme="light"] label:has(input[name="diaryWorkType"]:checked) {
  background-color: #FFFFFF !important;
  color: #0F2530 !important;
  border: 1px solid #D1E4E6 !important;
  box-shadow: 0 2px 8px rgba(15, 37, 48, 0.08) !important;
}

html[data-theme="light"] label:has(input[name="diaryWorkType"]:checked) span {
  color: #0F2530 !important;
  font-weight: 800 !important;
}

html[data-theme="light"] label:has(input[name="diaryWorkType"]:checked) i {
  color: #1A7B88 !important;
}

/* Unselected Label (Unchecked Item) -> Transparent + Soft Slate */
html[data-theme="light"] label:has(input[name="diaryWorkType"]:not(:checked)) {
  background-color: transparent !important;
  color: #5C7B85 !important;
  border: 1px solid transparent !important;
  box-shadow: none !important;
}

html[data-theme="light"] label:has(input[name="diaryWorkType"]:not(:checked)) span {
  color: #5C7B85 !important;
  font-weight: 500 !important;
}

html[data-theme="light"] label:has(input[name="diaryWorkType"]:not(:checked)) i {
  color: #8CA3AC !important;
}

/* Unselected Label Hover */
html[data-theme="light"] label:has(input[name="diaryWorkType"]:not(:checked)):hover {
  background-color: rgba(255, 255, 255, 0.5) !important;
  color: #0F2530 !important;
}
html[data-theme="light"] label:has(input[name="diaryWorkType"]:not(:checked)):hover * {
  color: #0F2530 !important;
}

/* General Role & Permission Radio Cards */
html[data-theme="light"] label.evidence-role-label:has(input:checked) {
  background-color: #FFFFFF !important;
  color: #0F2530 !important;
  border-color: #1A7B88 !important;
  box-shadow: 0 2px 8px rgba(15, 37, 48, 0.08) !important;
}

/* --------------------------------------------------------------------------
   5. Target 3: Main Cards, Forms & Panels (Referencing Terms Sidebar Inner)
      - /html/body/main/div[2]/div[3]/div[3]/... (Diary Form Card)
      - Main Input Card (Analysis Mode)
      - Result Areas & Timeline Cards
   -------------------------------------------------------------------------- */
html[data-theme="light"] .bg-\[\#0F2530\],
html[data-theme="light"] .bg-\[\#0F2530\]\/90,
html[data-theme="light"] .bg-\[\#0F2530\]\/80,
html[data-theme="light"] [class*="bg-[#0F2530]"],
html[data-theme="light"] main div[class*="rounded-3xl"][class*="border"] {
  background-color: #FFFFFF !important;
  border-color: #D1E4E6 !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06), 0 8px 24px -4px rgba(15, 37, 48, 0.06) !important;
}

/* Inner Subtle Sub-panels */
html[data-theme="light"] .bg-\[\#0B1B22\],
html[data-theme="light"] .bg-\[\#0B1B22\]\/90,
html[data-theme="light"] .bg-\[\#0B1B22\]\/80,
html[data-theme="light"] [class*="bg-[#0B1B22]"] {
  background-color: #F8FAFA !important;
  border-color: #E2ECEE !important;
}

html[data-theme="light"] .bg-\[\#174557\],
html[data-theme="light"] .bg-\[\#174557\]\/80,
html[data-theme="light"] .bg-\[\#1A3A4B\],
html[data-theme="light"] .bg-\[\#1A3A4B\]\/90,
html[data-theme="light"] [class*="bg-[#174557]"],
html[data-theme="light"] [class*="bg-[#1A3A4B]"] {
  background-color: #ECF5F5 !important;
  border-color: #D1E4E6 !important;
}

/* --------------------------------------------------------------------------
   6. Form Controls: Input, Textarea, Select, Dropzone (High Readability)
   -------------------------------------------------------------------------- */
html[data-theme="light"] input:not([type="checkbox"]):not([type="radio"]),
html[data-theme="light"] select,
html[data-theme="light"] textarea {
  background-color: #FFFFFF !important;
  color: #0F2530 !important;
  border-color: #D1E4E6 !important;
}

html[data-theme="light"] input::placeholder,
html[data-theme="light"] textarea::placeholder {
  color: #8CA3AC !important;
}

html[data-theme="light"] input:focus,
html[data-theme="light"] select:focus,
html[data-theme="light"] textarea:focus {
  background-color: #FFFFFF !important;
  color: #0F2530 !important;
  border-color: #1A7B88 !important;
  outline-color: #1A7B88 !important;
  box-shadow: 0 0 0 3px rgba(26, 123, 136, 0.15) !important;
}

/* Upload Dropzone (File Drag & Drop Box) */
html[data-theme="light"] .dropzone-area,
html[data-theme="light"] div[class*="border-dashed"] {
  background-color: #F8FAFA !important;
  border-color: #A4CFD3 !important;
}
html[data-theme="light"] div[class*="border-dashed"] p,
html[data-theme="light"] div[class*="border-dashed"] span {
  color: #334E58 !important;
}
html[data-theme="light"] div[class*="border-dashed"] .text-slate-100 {
  color: #0F2530 !important;
}

/* Live Mic Recording Button (#liveRecordBtn) in Light Theme */
html[data-theme="light"] #liveRecordBtn,
body.light-theme #liveRecordBtn {
  background-color: #FFFFFF !important;
  border: 1px solid #CBD5E1 !important;
  color: #0F2530 !important;
  box-shadow: 0 1px 3px rgba(15, 37, 48, 0.08) !important;
}

html[data-theme="light"] #liveRecordBtn:hover,
body.light-theme #liveRecordBtn:hover {
  background-color: #F8FAFC !important;
  border-color: #1A7B88 !important;
  color: #0F2530 !important;
}

html[data-theme="light"] #liveRecordBtn i.fa-microphone,
body.light-theme #liveRecordBtn i.fa-microphone {
  color: #E11D48 !important;
}

/* Active Recording State (Stop button when recording is active) */
html[data-theme="light"] #liveRecordBtn.bg-rose-600,
body.light-theme #liveRecordBtn.bg-rose-600 {
  background-color: #E11D48 !important;
  border-color: #BE123C !important;
  color: #FFFFFF !important;
}
html[data-theme="light"] #liveRecordBtn.bg-rose-600 *,
body.light-theme #liveRecordBtn.bg-rose-600 * {
  color: #FFFFFF !important;
}

html[data-theme="light"] #recordStatusText,
body.light-theme #recordStatusText {
  color: #4A6773 !important;
}

/* Selected Audio Info Box & Buttons */
html[data-theme="light"] #audioFileInfoBox,
body.light-theme #audioFileInfoBox {
  background-color: #F8FAFA !important;
  border-color: #A4CFD3 !important;
}
html[data-theme="light"] #audioFileInfoBox button[onclick*="downloadCurrentAudioFile"] {
  background-color: #1A7B88 !important;
  color: #FFFFFF !important;
  border-color: #1A7B88 !important;
}
html[data-theme="light"] #audioFileInfoBox button[onclick*="downloadCurrentAudioFile"] * {
  color: #FFFFFF !important;
}
html[data-theme="light"] #audioFileInfoBox button[onclick*="clearSelectedAudioFile"] {
  background-color: #FFE4E6 !important;
  color: #BE123C !important;
  border-color: #FDA4AF !important;
}


/* --------------------------------------------------------------------------
   7. Typography Contrast (WCAG AAA Compliance)
   -------------------------------------------------------------------------- */
html[data-theme="light"] .text-white,
html[data-theme="light"] .text-slate-100,
html[data-theme="light"] .text-slate-200 {
  color: #0F2530 !important;
}

html[data-theme="light"] .text-slate-300 {
  color: #2D4853 !important;
}

html[data-theme="light"] .text-slate-400 {
  color: #4A6773 !important;
}

html[data-theme="light"] .text-slate-500 {
  color: #5C7B85 !important;
}

html[data-theme="light"] .text-slate-600 {
  color: #6B8894 !important;
}

/* Preserve Contrast for Solid Accent Buttons */
html[data-theme="light"] button[class*="bg-[#1A7B88]"]:not(div[class*="bg-[#08151B]"] button),
html[data-theme="light"] button[class*="bg-[#DE866D]"],
html[data-theme="light"] button[class*="bg-[#E07A5F]"],
html[data-theme="light"] button[class*="bg-teal"],
html[data-theme="light"] button[class*="bg-emerald-600"]:not(div[class*="bg-[#08151B]"] button),
html[data-theme="light"] button[class*="bg-rose-600"] {
  color: #FFFFFF !important;
}
html[data-theme="light"] button[class*="bg-[#1A7B88]"]:not(div[class*="bg-[#08151B]"] button) *,
html[data-theme="light"] button[class*="bg-[#DE866D]"] *,
html[data-theme="light"] button[class*="bg-[#E07A5F]"] *,
html[data-theme="light"] button[class*="bg-emerald-600"]:not(div[class*="bg-[#08151B]"] button) *,
html[data-theme="light"] button[class*="bg-rose-600"] * {
  color: #FFFFFF !important;
}

/* Preserve Crisp White Text for Counter Badges on Saturated Colored Pills */
html[data-theme="light"] span[class*="rounded-full"][class*="bg-[#E07A5F]"],
html[data-theme="light"] span[class*="rounded-full"][class*="bg-[#1A7B88]"],
html[data-theme="light"] span[class*="rounded-full"][class*="bg-emerald"],
html[data-theme="light"] span[class*="rounded-full"][class*="bg-rose"],
html[data-theme="light"] span[class*="rounded-full"][class*="bg-blue"],
html[data-theme="light"] span[class*="rounded-full"][class*="bg-indigo"],
html[data-theme="light"] span[class*="rounded-full"][class*="bg-purple"] {
  color: #FFFFFF !important;
}

/* --------------------------------------------------------------------------
   8. Status Badges & Chips (Replacing Dark Glow with Clean Pastel Contrast)
   -------------------------------------------------------------------------- */
/* Amber / Warning Badges */
html[data-theme="light"] [class*="bg-amber-950"],
html[data-theme="light"] [class*="bg-amber-900"] {
  background-color: #FEF3C7 !important;
  color: #92400E !important;
  border-color: #FCD34D !important;
}

/* Rose / Danger / RedFlag Badges */
html[data-theme="light"] [class*="bg-rose-950"],
html[data-theme="light"] [class*="bg-rose-900"] {
  background-color: #FEE2E2 !important;
  color: #991B1B !important;
  border-color: #FCA5A5 !important;
}

/* Emerald / Green / Safe Badges */
html[data-theme="light"] [class*="bg-emerald-950"],
html[data-theme="light"] [class*="bg-emerald-900"] {
  background-color: #ECFDF5 !important;
  color: #065F46 !important;
  border-color: #A7F3D0 !important;
}

/* Slate / Neutral Badges */
html[data-theme="light"] [class*="bg-slate-950"],
html[data-theme="light"] [class*="bg-slate-900"] {
  background-color: #F1F5F9 !important;
  color: #334155 !important;
  border-color: #CBD5E1 !important;
}

/* --------------------------------------------------------------------------
   9. Modals & Dialogs (apiModal, vaultModal, accessPolicyModal, etc.)
   -------------------------------------------------------------------------- */
html[data-theme="light"] #apiModal > div,
html[data-theme="light"] #evidenceModal > div,
html[data-theme="light"] #evidenceAccessPolicyModal > div,
html[data-theme="light"] #diaryVaultModal > div,
html[data-theme="light"] #b2bCompanySettingsModal > div,
html[data-theme="light"] #evidenceReviewModal > div,
html[data-theme="light"] #fakeDoorPaymentModal > div,
html[data-theme="light"] #adminAuth2FAModal > div,
html[data-theme="light"] #adminStatsModal > div,
html[data-theme="light"] .modal-container {
  background-color: #FFFFFF !important;
  border: 1px solid #D1E4E6 !important;
  color: #0F2530 !important;
  box-shadow: 0 20px 48px -8px rgba(15, 37, 48, 0.18) !important;
}

html[data-theme="light"] #apiModal .sticky,
html[data-theme="light"] #evidenceAccessPolicyModal .sticky,
html[data-theme="light"] .modal-header {
  background-color: rgba(255, 255, 255, 0.96) !important;
  border-color: #D1E4E6 !important;
}

/* Modal Inner Notice Banner */
html[data-theme="light"] #apiModalNoticeBanner {
  background-color: #FDF3F0 !important;
  border-color: #E07A5F !important;
  color: #334E58 !important;
}
html[data-theme="light"] #apiModalNoticeBanner * {
  color: #334E58 !important;
}
html[data-theme="light"] #apiModalNoticeBanner .text-white {
  color: #0F2530 !important;
}

/* Pay-as-you-go High Contrast Banner in Light Mode */
html[data-theme="light"] #apiModalPayAsYouGoNotice,
body.light-theme #apiModalPayAsYouGoNotice {
  background-color: #FFFBEB !important;
  border-color: #F59E0B !important;
  color: #1E293B !important;
}
html[data-theme="light"] #apiModalPayAsYouGoNotice .text-amber-300,
body.light-theme #apiModalPayAsYouGoNotice .text-amber-300 {
  color: #B45309 !important;
}
html[data-theme="light"] #apiModalPayAsYouGoNotice span.bg-amber-400,
body.light-theme #apiModalPayAsYouGoNotice span.bg-amber-400 {
  background-color: #D97706 !important;
  color: #FFFFFF !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) !important;
}


/* Font Scale Slider & Controls in Light Mode */
html[data-theme="light"] #fontScaleRangeInput {
  background-color: #E2ECEE !important;
  accent-color: #1A7B88 !important;
}
html[data-theme="light"] #fontScaleDisplayBadge {
  background-color: #FEF3C7 !important;
  border-color: #FDE68A !important;
  color: #B45309 !important;
}
html[data-theme="light"] .font-scale-preset-btn:not([class*="border-2"]) {
  border-color: #D1E4E6 !important;
  color: #476571 !important;
  background-color: #FFFFFF !important;
}
html[data-theme="light"] .font-scale-preset-btn:not([class*="border-2"]):hover {
  background-color: #EBF3F4 !important;
  color: #0F2530 !important;
}

/* Theme Mode Select Buttons in Light Mode */
html[data-theme="light"] #themeSelectDarkBtn:not([class*="border-2"]) {
  border-color: #CBD5E1 !important;
  background-color: #FFFFFF !important;
  color: #334155 !important;
}
html[data-theme="light"] #themeSelectDarkBtn:not([class*="border-2"]):hover {
  background-color: #F1F5F9 !important;
  color: #0F172A !important;
}

/* Auth Modal Logged-in State in Light Mode */
html[data-theme="light"] #authBadgeType {
  background-color: #DCFCE7 !important;
  color: #166534 !important;
  border-color: #86EFAC !important;
}

/* Compliance Modal in Light Mode */
html[data-theme="light"] #complianceStatusBanner {
  background-color: #F0FDF4 !important;
  border-color: #86EFAC !important;
  color: #14532D !important;
  box-shadow: 0 4px 12px rgba(16, 185, 129, 0.08) !important;
}
html[data-theme="light"] #complianceStatusBanner * {
  color: #14532D !important;
}
html[data-theme="light"] #complianceStatusBanner span.text-white {
  color: #064E3B !important;
}
html[data-theme="light"] #complianceAgreeBtn:disabled {
  background-color: #E2E8F0 !important;
  border-color: #CBD5E1 !important;
  color: #64748B !important;
  opacity: 1 !important;
}

/* --------------------------------------------------------------------------
   10. Dossier, Timeline & Documents
   -------------------------------------------------------------------------- */
html[data-theme="light"] .dossier-preview-card,
html[data-theme="light"] #dossierViewerContent {
  background-color: #FFFFFF !important;
  color: #0F2530 !important;
  border-color: #D1E4E6 !important;
}

/* ==========================================================================
   Section 10-B: Premium Light Theme Custom Scrollbars (All Pages & Dialogs)
   Synchronized with Terms & Privacy Design Tokens
   ========================================================================== */
html[data-theme="light"],
html[data-theme="light"] body,
html[data-theme="light"] *,
body.light-theme,
body.light-theme * {
  color-scheme: light !important;
  scrollbar-width: thin !important;
  scrollbar-color: #CBD5E1 #F1F5F9 !important;
}

html[data-theme="light"] ::-webkit-scrollbar,
body.light-theme ::-webkit-scrollbar {
  width: 6px !important;
  height: 6px !important;
}

html[data-theme="light"] ::-webkit-scrollbar-track,
body.light-theme ::-webkit-scrollbar-track {
  background: #F1F5F9 !important;
  border-radius: 9999px !important;
}

html[data-theme="light"] ::-webkit-scrollbar-thumb,
body.light-theme ::-webkit-scrollbar-thumb {
  background: #CBD5E1 !important;
  border-radius: 9999px !important;
  transition: background 0.2s ease !important;
}

html[data-theme="light"] ::-webkit-scrollbar-thumb:hover,
body.light-theme ::-webkit-scrollbar-thumb:hover {
  background: #1A7B88 !important;
}

html[data-theme="light"] ::-webkit-scrollbar-thumb:active,
body.light-theme ::-webkit-scrollbar-thumb:active {
  background: #0F2530 !important;
}

html[data-theme="light"] ::-webkit-scrollbar-corner,
body.light-theme ::-webkit-scrollbar-corner {
  background: #F1F5F9 !important;
}

/* Modal Dialog Dedicated Scrollbars (.modal-scrollbar in all dialogs) */
html[data-theme="light"] .modal-scrollbar,
body.light-theme .modal-scrollbar,
html[data-theme="light"] div[class*="modal-scrollbar"],
body.light-theme div[class*="modal-scrollbar"] {
  color-scheme: light !important;
  scrollbar-width: thin !important;
  scrollbar-color: #B4D5D9 #F1F5F9 !important;
}

html[data-theme="light"] .modal-scrollbar::-webkit-scrollbar,
body.light-theme .modal-scrollbar::-webkit-scrollbar {
  width: 6px !important;
  height: 6px !important;
}

html[data-theme="light"] .modal-scrollbar::-webkit-scrollbar-track,
body.light-theme .modal-scrollbar::-webkit-scrollbar-track {
  background: #F1F5F9 !important;
  border-radius: 9999px !important;
}

html[data-theme="light"] .modal-scrollbar::-webkit-scrollbar-thumb,
body.light-theme .modal-scrollbar::-webkit-scrollbar-thumb {
  background: #B4D5D9 !important;
  border-radius: 9999px !important;
  transition: background 0.2s ease !important;
}

html[data-theme="light"] .modal-scrollbar::-webkit-scrollbar-thumb:hover,
body.light-theme .modal-scrollbar::-webkit-scrollbar-thumb:hover {
  background: #1A7B88 !important;
}

html[data-theme="light"] .modal-scrollbar::-webkit-scrollbar-thumb:active,
body.light-theme .modal-scrollbar::-webkit-scrollbar-thumb:active {
  background: #0F2530 !important;
}

html[data-theme="light"] .modal-scrollbar::-webkit-scrollbar-corner,
body.light-theme .modal-scrollbar::-webkit-scrollbar-corner {
  background: #F1F5F9 !important;
}

/* Form Controls & Textarea Scrollbars in Light Mode */
html[data-theme="light"] textarea,
body.light-theme textarea {
  color-scheme: light !important;
  scrollbar-width: thin !important;
  scrollbar-color: #CBD5E1 #F8FAFA !important;
}

html[data-theme="light"] textarea::-webkit-scrollbar,
body.light-theme textarea::-webkit-scrollbar {
  width: 6px !important;
  height: 6px !important;
}

html[data-theme="light"] textarea::-webkit-scrollbar-track,
body.light-theme textarea::-webkit-scrollbar-track {
  background: #F8FAFA !important;
  border-radius: 9999px !important;
}

html[data-theme="light"] textarea::-webkit-scrollbar-thumb,
body.light-theme textarea::-webkit-scrollbar-thumb {
  background: #CBD5E1 !important;
  border-radius: 9999px !important;
}

html[data-theme="light"] textarea::-webkit-scrollbar-thumb:hover,
body.light-theme textarea::-webkit-scrollbar-thumb:hover {
  background: #1A7B88 !important;
}

/* Ambient Glow Subdued in Light Theme */
html[data-theme="light"] .blur-3xl {
  opacity: 0.20 !important;
}

/* --------------------------------------------------------------------------
   11. Site Footer (100% Synchronized with privacy/ and terms/ Design Tokens)
   -------------------------------------------------------------------------- */
html[data-theme="light"] .site-footer,
body.light-theme .site-footer {
  background-color: #E6EFF0 !important;
  border-top-color: #D1E4E6 !important;
  color: #5C7B85 !important;
}

html[data-theme="light"] .site-footer .footer-brand-title,
body.light-theme .site-footer .footer-brand-title {
  color: #0F2530 !important;
}

html[data-theme="light"] .site-footer .footer-links,
body.light-theme .site-footer .footer-links {
  color: #334E58 !important;
}

html[data-theme="light"] .site-footer .footer-link,
body.light-theme .site-footer .footer-link {
  color: #334E58 !important;
}

html[data-theme="light"] .site-footer .footer-link:hover,
body.light-theme .site-footer .footer-link:hover {
  color: #1A7B88 !important;
}

html[data-theme="light"] .site-footer .footer-link-highlight,
body.light-theme .site-footer .footer-link-highlight {
  color: #0D9488 !important;
}

html[data-theme="light"] .site-footer .footer-link-highlight:hover,
body.light-theme .site-footer .footer-link-highlight:hover {
  color: #115E59 !important;
}

html[data-theme="light"] .site-footer .footer-sep,
body.light-theme .site-footer .footer-sep {
  color: #A4CFD3 !important;
}

html[data-theme="light"] .site-footer .footer-desc,
body.light-theme .site-footer .footer-desc {
  color: #5C7B85 !important;
}

html[data-theme="light"] .site-footer .copyright,
body.light-theme .site-footer .copyright {
  color: #5C7B85 !important;
}

/* --------------------------------------------------------------------------
   12. Floating Action Widgets (Feedback & Auto-Logout Badges)
   -------------------------------------------------------------------------- */
/* Floating Feedback Button (개선 제안 피드백 플로팅 버튼 - 고대비 앰버/골드) */
html[data-theme="light"] #floatingFeedbackBtn,
body.light-theme #floatingFeedbackBtn {
  background-color: #FFFDF5 !important;
  border-color: #F59E0B !important;
  color: #78350F !important;
  box-shadow: 0 4px 16px rgba(180, 83, 9, 0.16), 0 1px 3px rgba(0, 0, 0, 0.05) !important;
}

html[data-theme="light"] #floatingFeedbackBtn:hover,
body.light-theme #floatingFeedbackBtn:hover {
  background-color: #FEF3C7 !important;
  border-color: #D97706 !important;
  color: #451A03 !important;
}

html[data-theme="light"] #floatingFeedbackBtn span,
body.light-theme #floatingFeedbackBtn span {
  color: #78350F !important;
}

html[data-theme="light"] #floatingFeedbackBtn .text-amber-100,
body.light-theme #floatingFeedbackBtn .text-amber-100 {
  color: #78350F !important;
  font-weight: 800 !important;
}

html[data-theme="light"] #floatingFeedbackBtn:hover .text-amber-100,
body.light-theme #floatingFeedbackBtn:hover .text-amber-100 {
  color: #451A03 !important;
}

html[data-theme="light"] #floatingFeedbackBtn .text-amber-300\/80,
body.light-theme #floatingFeedbackBtn .text-amber-300\/80,
html[data-theme="light"] #floatingFeedbackBtn span[class*="text-amber-300"],
body.light-theme #floatingFeedbackBtn span[class*="text-amber-300"] {
  color: #92400E !important;
  border-left-color: rgba(180, 83, 9, 0.3) !important;
}

html[data-theme="light"] #floatingFeedbackBtn i.fa-lightbulb,
body.light-theme #floatingFeedbackBtn i.fa-lightbulb {
  color: #D97706 !important;
}

html[data-theme="light"] #floatingFeedbackBtn span.bg-amber-400,
body.light-theme #floatingFeedbackBtn span.bg-amber-400 {
  background-color: #D97706 !important;
}

/* Feedback Modal Tab: 명예의 전당 탭 고대비 */
html[data-theme="light"] #tabFeedbackHallOfFameBtn,
body.light-theme #tabFeedbackHallOfFameBtn {
  color: #92400E !important;
}
html[data-theme="light"] #tabFeedbackHallOfFameBtn:hover,
body.light-theme #tabFeedbackHallOfFameBtn:hover {
  color: #78350F !important;
}
html[data-theme="light"] #tabFeedbackHallOfFameBtn i,
body.light-theme #tabFeedbackHallOfFameBtn i {
  color: #D97706 !important;
}

/* Floating Auto-Logout Badge (좌측 자동 잠금 플로팅 버튼) */
html[data-theme="light"] #floatingAutoLogoutBadge button,
body.light-theme #floatingAutoLogoutBadge button {
  background-color: #FFFFFF !important;
  border-color: #D1E4E6 !important;
  color: #0F2530 !important;
  box-shadow: 0 4px 16px rgba(15, 37, 48, 0.10), 0 1px 3px rgba(0, 0, 0, 0.05) !important;
}

html[data-theme="light"] #floatingAutoLogoutBadge button:hover,
body.light-theme #floatingAutoLogoutBadge button:hover {
  background-color: #E6EFF0 !important;
  border-color: #A4CFD3 !important;
}

html[data-theme="light"] #autoLogoutTimerTextFloating,
body.light-theme #autoLogoutTimerTextFloating {
  color: #0F2530 !important;
}

html[data-theme="light"] #autoLogoutLabelFloating,
body.light-theme #autoLogoutLabelFloating {
  color: #5C7B85 !important;
  border-left-color: #D1E4E6 !important;
}

html[data-theme="light"] #autoLogoutIconFloating,
body.light-theme #autoLogoutIconFloating {
  color: #1A7B88 !important;
}

/* --------------------------------------------------------------------------
   13. Diary Timeline Feed & Supervisor Feedback Quote in Vault Modal
   -------------------------------------------------------------------------- */
/* Diary Timeline Card */
html[data-theme="light"] #diaryTimelineFeed > div,
body.light-theme #diaryTimelineFeed > div {
  background-color: #FFFFFF !important;
  border-color: #D1E4E6 !important;
  color: #0F2530 !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(15, 37, 48, 0.04) !important;
}

html[data-theme="light"] #diaryTimelineFeed > div:hover,
body.light-theme #diaryTimelineFeed > div:hover {
  border-color: #1A7B88 !important;
}

/* Card Header Date & Dividers */
html[data-theme="light"] #diaryTimelineFeed .border-slate-800,
body.light-theme #diaryTimelineFeed .border-slate-800 {
  border-color: #E2ECEE !important;
}

html[data-theme="light"] #diaryTimelineFeed .text-white,
body.light-theme #diaryTimelineFeed .text-white {
  color: #0F2530 !important;
}

/* Tasks Section */
html[data-theme="light"] #diaryTimelineFeed .text-slate-400,
body.light-theme #diaryTimelineFeed .text-slate-400 {
  color: #5C7B85 !important;
}

html[data-theme="light"] #diaryTimelineFeed .text-slate-200,
body.light-theme #diaryTimelineFeed .text-slate-200 {
  color: #334E58 !important;
}

html[data-theme="light"] #diaryTimelineFeed ul li span:last-child,
body.light-theme #diaryTimelineFeed ul li span:last-child {
  color: #1E293B !important;
}

/* Hash Pill */
html[data-theme="light"] #diaryTimelineFeed span.font-mono,
body.light-theme #diaryTimelineFeed span.font-mono {
  background-color: #ECF5F5 !important;
  border-color: #D1E4E6 !important;
  color: #1A7B88 !important;
}

/* Action Buttons (Copy, Edit, Delete) */
html[data-theme="light"] #diaryTimelineFeed button.text-slate-400:hover,
body.light-theme #diaryTimelineFeed button.text-slate-400:hover,
html[data-theme="light"] #diaryTimelineFeed button:hover,
body.light-theme #diaryTimelineFeed button:hover {
  background-color: #E6EFF0 !important;
}

/* 🌟 Supervisor Feedback Quote Box (상사 구두 지시 & 칭찬 피드백 박스: 고대비 앰버) */
html[data-theme="light"] #diaryTimelineFeed .diary-feedback-quote-box,
body.light-theme #diaryTimelineFeed .diary-feedback-quote-box,
html[data-theme="light"] #diaryTimelineFeed div[class*="border-amber-500"],
body.light-theme #diaryTimelineFeed div[class*="border-amber-500"] {
  background-color: #FEF9EE !important;
  border-color: #FCD34D !important;
  box-shadow: 0 1px 4px rgba(180, 83, 9, 0.08) !important;
}

html[data-theme="light"] #diaryTimelineFeed .diary-feedback-title,
body.light-theme #diaryTimelineFeed .diary-feedback-title,
html[data-theme="light"] #diaryTimelineFeed .text-amber-300,
body.light-theme #diaryTimelineFeed .text-amber-300 {
  color: #92400E !important;
  font-weight: 800 !important;
}

html[data-theme="light"] #diaryTimelineFeed .diary-feedback-title i,
body.light-theme #diaryTimelineFeed .diary-feedback-title i,
html[data-theme="light"] #diaryTimelineFeed .text-amber-400,
body.light-theme #diaryTimelineFeed .text-amber-400 {
  color: #D97706 !important;
}

html[data-theme="light"] #diaryTimelineFeed .diary-feedback-text,
body.light-theme #diaryTimelineFeed .diary-feedback-text,
html[data-theme="light"] #diaryTimelineFeed [class*="text-amber-200"],
body.light-theme #diaryTimelineFeed [class*="text-amber-200"] {
  color: #78350F !important;
  font-weight: 600 !important;
}

/* --------------------------------------------------------------------------
   14. Analysis Result View (#resultArea & #analysisModeWrapper) Readability
   -------------------------------------------------------------------------- */
/* Incident Date Confirmation & Correction Bar (타겟 3: 사건 발생 일시 소명 바) */
html[data-theme="light"] #incidentDateEditorBar,
body.light-theme #incidentDateEditorBar {
  background-color: #FFFFFF !important;
  border-color: #D1E4E6 !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
}

html[data-theme="light"] #incidentDateEditorBar .bg-blue-950\/80,
body.light-theme #incidentDateEditorBar .bg-blue-950\/80 {
  background-color: #EFF6FF !important;
  border-color: #BFDBFE !important;
  color: #1D4ED8 !important;
}

html[data-theme="light"] #incidentDateEditorBar .bg-blue-950\/80 i,
body.light-theme #incidentDateEditorBar .bg-blue-950\/80 i {
  color: #2563EB !important;
}

html[data-theme="light"] #currentIncidentDateDisplay,
body.light-theme #currentIncidentDateDisplay {
  color: #0F2530 !important;
  font-weight: 900 !important;
}

html[data-theme="light"] #incidentDateSourceBadge,
body.light-theme #incidentDateSourceBadge {
  background-color: #F1F5F9 !important;
  border-color: #CBD5E1 !important;
  color: #475569 !important;
}

html[data-theme="light"] #incidentDateEditorBar button,
body.light-theme #incidentDateEditorBar button {
  background-color: #F4F8F8 !important;
  border-color: #A4CFD3 !important;
  color: #1A7B88 !important;
}

html[data-theme="light"] #incidentDateEditorBar button:hover,
body.light-theme #incidentDateEditorBar button:hover {
  background-color: #E6EFF0 !important;
  color: #0F2530 !important;
}

/* 🌟 Predictive Defense Cards (타겟 1 & 2: 상대방 다음 수 예측 대응) */
html[data-theme="light"] #nextMovesList .next-move-card,
body.light-theme #nextMovesList .next-move-card,
html[data-theme="light"] #nextMovesList li,
body.light-theme #nextMovesList li {
  background-color: #FFFFFF !important;
  border-color: #E2ECEE !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(15, 37, 48, 0.03) !important;
}

html[data-theme="light"] #nextMovesList .next-move-card:hover,
body.light-theme #nextMovesList .next-move-card:hover,
html[data-theme="light"] #nextMovesList li:hover,
body.light-theme #nextMovesList li:hover {
  border-color: #C084FC !important;
}

/* 예상 행동 (Action: 고대비 딥 퍼플 #581C87) */
html[data-theme="light"] #nextMovesList .next-move-action,
body.light-theme #nextMovesList .next-move-action,
html[data-theme="light"] #nextMovesList .text-purple-200,
body.light-theme #nextMovesList .text-purple-200 {
  color: #581C87 !important;
  font-weight: 700 !important;
}

html[data-theme="light"] #nextMovesList .next-move-action-text,
body.light-theme #nextMovesList .next-move-action-text {
  color: #581C87 !important;
  font-weight: 700 !important;
}

html[data-theme="light"] #nextMovesList .next-move-action-badge,
body.light-theme #nextMovesList .next-move-action-badge,
html[data-theme="light"] #nextMovesList .bg-purple-950,
body.light-theme #nextMovesList .bg-purple-950 {
  background-color: #F3E8FF !important;
  border-color: #D8B4FE !important;
  color: #6B21A8 !important;
  font-weight: 800 !important;
}

/* 실질 대응 (Response: 고대비 에메랄드/딥 틸) */
html[data-theme="light"] #nextMovesList .next-move-response,
body.light-theme #nextMovesList .next-move-response,
html[data-theme="light"] #nextMovesList [class*="border-emerald-500"],
body.light-theme #nextMovesList [class*="border-emerald-500"] {
  background-color: #F0FDF4 !important;
  border-left-color: #22C55E !important;
}

html[data-theme="light"] #nextMovesList .next-move-response-badge,
body.light-theme #nextMovesList .next-move-response-badge,
html[data-theme="light"] #nextMovesList .bg-emerald-950,
body.light-theme #nextMovesList .bg-emerald-950 {
  background-color: #DCFCE7 !important;
  border-color: #86EFAC !important;
  color: #15803D !important;
  font-weight: 800 !important;
}

html[data-theme="light"] #nextMovesList .next-move-response-text,
body.light-theme #nextMovesList .next-move-response-text,
html[data-theme="light"] #nextMovesList .next-move-response .text-slate-100,
body.light-theme #nextMovesList .next-move-response .text-slate-100 {
  color: #0F2530 !important;
  font-weight: 600 !important;
}

html[data-theme="light"] #nextMovesList i.fa-chess-pawn,
body.light-theme #nextMovesList i.fa-chess-pawn {
  color: #7E22CE !important;
}

/* Core Diagnosis Profile 1 & Profile 2 Cards */
html[data-theme="light"] #targetType,
body.light-theme #targetType,
html[data-theme="light"] #hiddenIntent,
body.light-theme #hiddenIntent {
  color: #0F2530 !important;
  font-weight: 900 !important;
}

html[data-theme="light"] #targetDesc,
body.light-theme #targetDesc,
html[data-theme="light"] #hiddenDesc,
body.light-theme #hiddenDesc {
  color: #334E58 !important;
  line-height: 1.65 !important;
}

/* Reality Check Card (Referencing #heroSloganContainer gradient background) */
html[data-theme="light"] #realityCheckCard,
body.light-theme #realityCheckCard,
html[data-theme="light"] #validDiagnosisSection div[class*="from-[#174557]"],
body.light-theme #validDiagnosisSection div[class*="from-[#174557]"] {
  background: radial-gradient(circle at 50% 10%, rgba(26, 123, 136, 0.12) 0%, rgba(244, 248, 248, 0.95) 60%),
              linear-gradient(180deg, #E6EFF0 0%, #F4F8F8 100%) !important;
  border: 1px solid #D1E4E6 !important;
  box-shadow: 0 4px 16px -2px rgba(15, 37, 48, 0.06) !important;
  color: #0F2530 !important;
}

html[data-theme="light"] #realityCheckCard div[class*="text-[#38A3A5]"],
body.light-theme #realityCheckCard div[class*="text-[#38A3A5]"] {
  color: #1A7B88 !important;
  font-weight: 800 !important;
}

html[data-theme="light"] #realityCheckCard div[class*="text-[#38A3A5]"] i,
body.light-theme #realityCheckCard div[class*="text-[#38A3A5]"] i {
  color: #1A7B88 !important;
}

html[data-theme="light"] #realityCheckCard #realityCheckText,
body.light-theme #realityCheckCard #realityCheckText,
html[data-theme="light"] #realityCheckText,
body.light-theme #realityCheckText {
  color: #0F2530 !important;
  font-weight: 600 !important;
  line-height: 1.65 !important;
}

html[data-theme="light"] #realityCheckCard button,
body.light-theme #realityCheckCard button {
  background-color: #FFFFFF !important;
  border-color: #A4CFD3 !important;
  color: #1A7B88 !important;
  box-shadow: 0 1px 3px rgba(15, 37, 48, 0.05) !important;
}

html[data-theme="light"] #realityCheckCard button:hover,
body.light-theme #realityCheckCard button:hover {
  background-color: #E6EFF0 !important;
  color: #0F2530 !important;
}

/* Fact-Finding Structured Table: Unify All Outer & Divider Lines */
html[data-theme="light"] .fact-finding-table-container,
body.light-theme .fact-finding-table-container,
html[data-theme="light"] #validDiagnosisSection div.overflow-x-auto,
body.light-theme #validDiagnosisSection div.overflow-x-auto {
  border-color: #D1E4E6 !important;
  background-color: #FFFFFF !important;
}

html[data-theme="light"] .fact-finding-table,
body.light-theme .fact-finding-table,
html[data-theme="light"] #validDiagnosisSection table,
body.light-theme #validDiagnosisSection table {
  border-color: #D1E4E6 !important;
}

html[data-theme="light"] .fact-finding-table tr,
body.light-theme .fact-finding-table tr,
html[data-theme="light"] #validDiagnosisSection table tr,
body.light-theme #validDiagnosisSection table tr {
  border-color: #D1E4E6 !important;
}

html[data-theme="light"] .fact-finding-table th,
body.light-theme .fact-finding-table th,
html[data-theme="light"] #validDiagnosisSection table th,
body.light-theme #validDiagnosisSection table th,
html[data-theme="light"] table th[class*="bg-[#0B1B22]"],
body.light-theme table th[class*="bg-[#0B1B22]"] {
  background-color: #F8FAFA !important;
  color: #334E58 !important;
  border-color: #D1E4E6 !important;
}

html[data-theme="light"] .fact-finding-table td,
body.light-theme .fact-finding-table td,
html[data-theme="light"] #validDiagnosisSection table td,
body.light-theme #validDiagnosisSection table td,
html[data-theme="light"] #tableRank,
body.light-theme #tableRank,
html[data-theme="light"] #tableExcess,
body.light-theme #tableExcess {
  color: #0F2530 !important;
  background-color: #FFFFFF !important;
  border-color: #D1E4E6 !important;
}

html[data-theme="light"] #tableEvidence,
body.light-theme #tableEvidence {
  color: #059669 !important;
  background-color: #FFFFFF !important;
  border-color: #D1E4E6 !important;
  font-weight: 700 !important;
}

/* 1st Person Counter Script Box */
html[data-theme="light"] #counterScriptText,
body.light-theme #counterScriptText {
  color: #0F2530 !important;
  background-color: #FFFFFF !important;
}

/* Result Area Sticky Header Bar */
html[data-theme="light"] #resultArea .sticky,
body.light-theme #resultArea .sticky {
  background-color: rgba(255, 255, 255, 0.95) !important;
  border-color: #D1E4E6 !important;
  box-shadow: 0 4px 16px rgba(15, 37, 48, 0.08) !important;
}

/* --------------------------------------------------------------------------
   15. Evidence Vault Cards & Statement Box Readability (#evidenceModal)
   -------------------------------------------------------------------------- */
html[data-theme="light"] article[id^="evidenceCard_"],
body.light-theme article[id^="evidenceCard_"] {
  background-color: #FFFFFF !important;
  border-color: #D1E4E6 !important;
  box-shadow: 0 2px 8px rgba(15, 37, 48, 0.04) !important;
}

html[data-theme="light"] article[id^="evidenceCard_"] h4,
body.light-theme article[id^="evidenceCard_"] h4 {
  color: #0F2530 !important;
}

html[data-theme="light"] article[id^="evidenceCard_"] h4:hover,
body.light-theme article[id^="evidenceCard_"] h4:hover {
  color: #1A7B88 !important;
}

/* Core Statement Box in Evidence Card */
html[data-theme="light"] .evidence-statement-box,
body.light-theme .evidence-statement-box,
html[data-theme="light"] article[id^="evidenceCard_"] div[class*="bg-[#081820]"],
body.light-theme article[id^="evidenceCard_"] div[class*="bg-[#081820]"] {
  background-color: #F4F8F8 !important;
  border-color: #D1E4E6 !important;
  box-shadow: 0 1px 3px rgba(15, 37, 48, 0.04) !important;
}

html[data-theme="light"] .evidence-statement-header,
body.light-theme .evidence-statement-header {
  border-bottom-color: #E2ECEE !important;
}

html[data-theme="light"] .evidence-statement-title,
body.light-theme .evidence-statement-title {
  color: #1A7B88 !important;
  font-weight: 700 !important;
}

/* Core Statement Box Action Button (Direct Statement Edit/Create) */
html[data-theme="light"] .evidence-statement-btn,
body.light-theme .evidence-statement-btn {
  background-color: #1A7B88 !important;
  border-color: #146570 !important;
  color: #FFFFFF !important;
  box-shadow: 0 1px 3px rgba(15, 37, 48, 0.12) !important;
}

html[data-theme="light"] .evidence-statement-btn *,
body.light-theme .evidence-statement-btn *,
html[data-theme="light"] .evidence-statement-btn span,
body.light-theme .evidence-statement-btn span,
html[data-theme="light"] .evidence-statement-btn i,
body.light-theme .evidence-statement-btn i {
  color: #FFFFFF !important;
}

html[data-theme="light"] .evidence-statement-btn:hover,
body.light-theme .evidence-statement-btn:hover {
  background-color: #146570 !important;
  border-color: #0F2530 !important;
  color: #FFFFFF !important;
}

html[data-theme="light"] .evidence-statement-btn:hover *,
body.light-theme .evidence-statement-btn:hover *,
html[data-theme="light"] .evidence-statement-btn:hover span,
body.light-theme .evidence-statement-btn:hover span,
html[data-theme="light"] .evidence-statement-btn:hover i,
body.light-theme .evidence-statement-btn:hover i {
  color: #FFFFFF !important;
}

html[data-theme="light"] .evidence-statement-text,
body.light-theme .evidence-statement-text,
html[data-theme="light"] p[id^="evidenceCardStatement_"],
body.light-theme p[id^="evidenceCardStatement_"] {
  color: #0F2530 !important;
  font-weight: 500 !important;
  line-height: 1.65 !important;
}

/* Evidence Card Footer Divider and Metadata in Light Mode */
html[data-theme="light"] article[id^="evidenceCard_"] .border-slate-800\/80,
body.light-theme article[id^="evidenceCard_"] .border-slate-800\/80,
html[data-theme="light"] article[id^="evidenceCard_"] .border-slate-800\/60,
body.light-theme article[id^="evidenceCard_"] .border-slate-800\/60 {
  border-color: #E2ECEE !important;
}

/* --------------------------------------------------------------------------
   16. Evidence Vault Header Filter Dropdown & Count Badges (#evidenceModal)
   -------------------------------------------------------------------------- */
/* Dropdown Trigger Button */
html[data-theme="light"] #evidenceFilterDropdownBtn,
body.light-theme #evidenceFilterDropdownBtn {
  background-color: #FFFFFF !important;
  border-color: #D1E4E6 !important;
  color: #0F2530 !important;
  box-shadow: 0 1px 3px rgba(15, 37, 48, 0.05) !important;
}

html[data-theme="light"] #evidenceFilterDropdownBtn:hover,
body.light-theme #evidenceFilterDropdownBtn:hover {
  background-color: #F4F8F8 !important;
  border-color: #A4CFD3 !important;
}

/* Dropdown Menu Popover */
html[data-theme="light"] #evidenceFilterDropdownMenu,
body.light-theme #evidenceFilterDropdownMenu {
  background-color: #FFFFFF !important;
  border-color: #D1E4E6 !important;
  box-shadow: 0 12px 32px -4px rgba(15, 37, 48, 0.16), 0 4px 12px rgba(15, 37, 48, 0.08) !important;
}

/* Dropdown Section Separator & Header Labels */
html[data-theme="light"] #evidenceFilterDropdownMenu > div,
body.light-theme #evidenceFilterDropdownMenu > div {
  background-color: #F4F8F8 !important;
  color: #5C7B85 !important;
  border-color: #E2ECEE !important;
}

/* Dropdown Item Buttons */
html[data-theme="light"] #evidenceFilterDropdownMenu button,
body.light-theme #evidenceFilterDropdownMenu button {
  color: #0F2530 !important;
}

html[data-theme="light"] #evidenceFilterDropdownMenu button:hover,
body.light-theme #evidenceFilterDropdownMenu button:hover {
  background-color: #F0F6F7 !important;
}

/* Active Highlight Item */
html[data-theme="light"] #evidenceFilterDropdownMenu button.bg-\[\#174557\],
body.light-theme #evidenceFilterDropdownMenu button.bg-\[\#174557\],
html[data-theme="light"] #evidenceFilterDropdownMenu button[class*="bg-[#174557]"],
body.light-theme #evidenceFilterDropdownMenu button[class*="bg-[#174557]"] {
  background-color: #E6EFF0 !important;
  color: #0F2530 !important;
  font-weight: 700 !important;
}

/* Current Filter Badge on Trigger Button */
html[data-theme="light"] #currentFilterBadge,
body.light-theme #currentFilterBadge {
  background-color: #1A7B88 !important;
  border: 1px solid #146570 !important;
  color: #FFFFFF !important;
  font-weight: 700 !important;
}

/* Dropdown Count Badges: Crystal Clear High-Contrast Numbers */
html[data-theme="light"] #count-all,
body.light-theme #count-all {
  background-color: #1A7B88 !important;
  border: 1px solid #146570 !important;
  color: #FFFFFF !important;
  font-weight: 700 !important;
}

html[data-theme="light"] #count-unanalyzed,
body.light-theme #count-unanalyzed {
  background-color: #FDF1EC !important;
  border: 1px solid #F5C6B7 !important;
  color: #C25E3F !important;
  font-weight: 700 !important;
}

html[data-theme="light"] #count-abuse,
body.light-theme #count-abuse,
html[data-theme="light"] #count-unfair,
body.light-theme #count-unfair,
html[data-theme="light"] #count-bully,
body.light-theme #count-bully,
html[data-theme="light"] #count-sexual,
body.light-theme #count-sexual,
html[data-theme="light"] #count-other,
body.light-theme #count-other,
html[data-theme="light"] #count-audio,
body.light-theme #count-audio,
html[data-theme="light"] #count-image,
body.light-theme #count-image,
html[data-theme="light"] #evidenceFilterDropdownMenu span[id^="count-"],
body.light-theme #evidenceFilterDropdownMenu span[id^="count-"] {
  background-color: #EDF3F5 !important;
  border: 1px solid #D1E4E6 !important;
  color: #0F2530 !important;
  font-weight: 700 !important;
}

/* Select All Bar & Count Badge */
html[data-theme="light"] #evidenceSelectAllWrap,
body.light-theme #evidenceSelectAllWrap {
  background-color: #FFFFFF !important;
  border-color: #D1E4E6 !important;
  color: #0F2530 !important;
}

html[data-theme="light"] #evidenceSelectedCountBadge,
body.light-theme #evidenceSelectedCountBadge {
  color: #1A7B88 !important;
  font-weight: 800 !important;
}

/* Action Toolbars Wrapper */
html[data-theme="light"] #evidenceModal div[class*="bg-[#0B1B22]"]:not(#evidenceFilterDropdownMenu),
body.light-theme #evidenceModal div[class*="bg-[#0B1B22]"]:not(#evidenceFilterDropdownMenu) {
  background-color: #F4F8F8 !important;
  border-color: #D1E4E6 !important;
}

/* --------------------------------------------------------------------------
   17. High-Contrast Dark Text Badges (Diary, Vault, Analysis & Mode Switcher)
   -------------------------------------------------------------------------- */

/* 1. Top Mode Switcher: Diary Sub-Badge ('퇴근 전 30초') */
html[data-theme="light"] #mainModeBtnDiary span.bg-emerald-950\/60,
body.light-theme #mainModeBtnDiary span.bg-emerald-950\/60,
html[data-theme="light"] #mainModeBtnDiary span[class*="text-emerald-400"],
body.light-theme #mainModeBtnDiary span[class*="text-emerald-400"] {
  background-color: #D1FAE5 !important;
  border-color: #6EE7B7 !important;
  color: #064E3B !important;
  font-weight: 800 !important;
}

html[data-theme="light"] #mainModeBtnDiary:hover span[class*="text-emerald-400"],
body.light-theme #mainModeBtnDiary:hover span[class*="text-emerald-400"] {
  background-color: #A7F3D0 !important;
  color: #022C22 !important;
}

/* 2. Diary Timeline Feed Card Header Badges (#diaryVaultModal / #diaryTimelineFeed) */
html[data-theme="light"] #diaryTimelineFeed span[class*="bg-emerald-950"],
body.light-theme #diaryTimelineFeed span[class*="bg-emerald-950"],
html[data-theme="light"] #diaryTimelineFeed span[class*="text-emerald-400"],
body.light-theme #diaryTimelineFeed span[class*="text-emerald-400"] {
  background-color: #ECFDF5 !important;
  border-color: #A7F3D0 !important;
  color: #064E3B !important;
  font-weight: 700 !important;
}

html[data-theme="light"] #diaryTimelineFeed span[class*="bg-indigo-950"],
body.light-theme #diaryTimelineFeed span[class*="bg-indigo-950"],
html[data-theme="light"] #diaryTimelineFeed span[class*="text-indigo-300"],
body.light-theme #diaryTimelineFeed span[class*="text-indigo-300"] {
  background-color: #EEF2FF !important;
  border-color: #C7D2FE !important;
  color: #1E1B4B !important;
  font-weight: 700 !important;
}

html[data-theme="light"] #diaryTimelineFeed span[class*="bg-rose-950"],
body.light-theme #diaryTimelineFeed span[class*="bg-rose-950"],
html[data-theme="light"] #diaryTimelineFeed span[class*="text-rose-300"],
body.light-theme #diaryTimelineFeed span[class*="text-rose-300"] {
  background-color: #FFF1F2 !important;
  border-color: #FECDD3 !important;
  color: #9F1239 !important;
  font-weight: 700 !important;
}

html[data-theme="light"] #diaryTimelineFeed span[class*="bg-amber-950"],
body.light-theme #diaryTimelineFeed span[class*="bg-amber-950"],
html[data-theme="light"] #diaryTimelineFeed span[class*="text-amber-300"],
body.light-theme #diaryTimelineFeed span[class*="text-amber-300"] {
  background-color: #FFFBEB !important;
  border-color: #FDE68A !important;
  color: #78350F !important;
  font-weight: 700 !important;
}

/* 3. Evidence Vault Card Header Badges (#evidenceModal / article[id^="evidenceCard_"]) */
html[data-theme="light"] article[id^="evidenceCard_"] .border-b > div:first-child span[class*="text-[#38A3A5]"],
body.light-theme article[id^="evidenceCard_"] .border-b > div:first-child span[class*="text-[#38A3A5]"],
html[data-theme="light"] article[id^="evidenceCard_"] .border-b > div:first-child span[class*="bg-[#1A7B88]/20"],
body.light-theme article[id^="evidenceCard_"] .border-b > div:first-child span[class*="bg-[#1A7B88]/20"] {
  background-color: #E6EFF0 !important;
  border-color: #B2D8DB !important;
  color: #0F2530 !important;
  font-weight: 800 !important;
}

html[data-theme="light"] article[id^="evidenceCard_"] .border-b > div:first-child span[class*="text-[#D8896D]"],
body.light-theme article[id^="evidenceCard_"] .border-b > div:first-child span[class*="text-[#D8896D]"],
html[data-theme="light"] article[id^="evidenceCard_"] .border-b > div:first-child span[class*="bg-[#D8896D]/20"],
body.light-theme article[id^="evidenceCard_"] .border-b > div:first-child span[class*="bg-[#D8896D]/20"] {
  background-color: #FDF1EC !important;
  border-color: #F5C6B7 !important;
  color: #9C381E !important;
  font-weight: 800 !important;
}

/* 4. Multimodal Media Meta Badges (#mediaMetaBadges) */
html[data-theme="light"] #mediaMetaBadges span,
body.light-theme #mediaMetaBadges span {
  font-weight: 700 !important;
  box-shadow: 0 1px 2px rgba(15, 37, 48, 0.04) !important;
}

html[data-theme="light"] #mediaMetaBadges span[class*="text-blue-"],
body.light-theme #mediaMetaBadges span[class*="text-blue-"] {
  background-color: #EFF6FF !important;
  border-color: #BFDBFE !important;
  color: #1E3A8A !important;
}

html[data-theme="light"] #mediaMetaBadges span[class*="text-indigo-"],
body.light-theme #mediaMetaBadges span[class*="text-indigo-"] {
  background-color: #EEF2FF !important;
  border-color: #C7D2FE !important;
  color: #1E1B4B !important;
}

html[data-theme="light"] #mediaMetaBadges span[class*="text-emerald-"],
body.light-theme #mediaMetaBadges span[class*="text-emerald-"] {
  background-color: #ECFDF5 !important;
  border-color: #A7F3D0 !important;
  color: #064E3B !important;
}

/* PII Mode Switcher in Light Mode (Matching #resultArea sticky button background) */
html[data-theme="light"] #resultPiiModeSwitcher,
body.light-theme #resultPiiModeSwitcher {
  background-color: #FFFFFF !important;
  border-color: #D1E4E6 !important;
  box-shadow: 0 1px 3px rgba(15, 37, 48, 0.06) !important;
}

html[data-theme="light"] #resultPiiModeSwitcher button:not(.bg-sky-600):not(.bg-emerald-600),
body.light-theme #resultPiiModeSwitcher button:not(.bg-sky-600):not(.bg-emerald-600) {
  color: #4A6773 !important;
  background-color: transparent !important;
}

html[data-theme="light"] #resultPiiModeSwitcher button:not(.bg-sky-600):not(.bg-emerald-600):hover,
body.light-theme #resultPiiModeSwitcher button:not(.bg-sky-600):not(.bg-emerald-600):hover {
  color: #0F2530 !important;
  background-color: #E6EFF0 !important;
}

/* Ensure active buttons keep crisp contrast in light mode */
html[data-theme="light"] #resultPiiModeSwitcher button.bg-sky-600,
body.light-theme #resultPiiModeSwitcher button.bg-sky-600 {
  background-color: #0284C7 !important;
  color: #FFFFFF !important;
  border-color: #38BDF8 !important;
  box-shadow: 0 2px 6px rgba(2, 132, 199, 0.25) !important;
}
html[data-theme="light"] #resultPiiModeSwitcher button.bg-sky-600 *,
body.light-theme #resultPiiModeSwitcher button.bg-sky-600 * {
  color: #FFFFFF !important;
}

html[data-theme="light"] #resultPiiModeSwitcher button.bg-emerald-600,
body.light-theme #resultPiiModeSwitcher button.bg-emerald-600 {
  background-color: #059669 !important;
  color: #FFFFFF !important;
  border-color: #34D399 !important;
  box-shadow: 0 2px 6px rgba(5, 150, 105, 0.25) !important;
}
html[data-theme="light"] #resultPiiModeSwitcher button.bg-emerald-600 *,
body.light-theme #resultPiiModeSwitcher button.bg-emerald-600 * {
  color: #FFFFFF !important;
}

/* 5. Multimodal Audio Result Section Header Title */
html[data-theme="light"] #mediaResultSectionTitle,
body.light-theme #mediaResultSectionTitle {
  color: #0F2530 !important;
  font-weight: 800 !important;
}

/* --------------------------------------------------------------------------
   18. Evidence Access Policy Modal Readability (#evidenceAccessPolicyModal)
   -------------------------------------------------------------------------- */
/* Modal Container & Sticky Header */
html[data-theme="light"] #evidenceAccessPolicyModal > div,
body.light-theme #evidenceAccessPolicyModal > div {
  background-color: #FFFFFF !important;
  border-color: #D1E4E6 !important;
  color: #0F2530 !important;
  box-shadow: 0 20px 48px -8px rgba(15, 37, 48, 0.18) !important;
}

html[data-theme="light"] #evidenceAccessPolicyModal .sticky,
body.light-theme #evidenceAccessPolicyModal .sticky {
  background-color: rgba(255, 255, 255, 0.98) !important;
  border-bottom-color: #E2ECEE !important;
}

/* Header Typography */
html[data-theme="light"] #evidenceAccessPolicyModal #accessPolicyTitle,
body.light-theme #evidenceAccessPolicyModal #accessPolicyTitle {
  color: #0F2530 !important;
  font-weight: 800 !important;
}

html[data-theme="light"] #evidenceAccessPolicyModal .sticky p,
body.light-theme #evidenceAccessPolicyModal .sticky p {
  color: #5C7B85 !important;
}

html[data-theme="light"] #evidenceAccessPolicyModal .sticky button,
body.light-theme #evidenceAccessPolicyModal .sticky button {
  color: #5C7B85 !important;
}

html[data-theme="light"] #evidenceAccessPolicyModal .sticky button:hover,
body.light-theme #evidenceAccessPolicyModal .sticky button:hover {
  color: #0F2530 !important;
  background-color: #E6EFF0 !important;
}

/* Guide Notice Box (2차 피해 방지 안내 박스) */
html[data-theme="light"] #evidenceAccessPolicyModal div[class*="bg-[#1A3A4B]/40"],
body.light-theme #evidenceAccessPolicyModal div[class*="bg-[#1A3A4B]/40"] {
  background-color: #F4F8F8 !important;
  border-color: #D1E4E6 !important;
}

html[data-theme="light"] #evidenceAccessPolicyModal div[class*="bg-[#1A3A4B]/40"] *,
body.light-theme #evidenceAccessPolicyModal div[class*="bg-[#1A3A4B]/40"] * {
  color: #0F2530 !important;
}

html[data-theme="light"] #evidenceAccessPolicyModal div[class*="bg-[#1A3A4B]/40"] p,
body.light-theme #evidenceAccessPolicyModal div[class*="bg-[#1A3A4B]/40"] p {
  color: #334E58 !important;
}

html[data-theme="light"] #evidenceAccessPolicyModal div[class*="bg-[#1A3A4B]/40"] span.text-\[\#E07A5F\],
body.light-theme #evidenceAccessPolicyModal div[class*="bg-[#1A3A4B]/40"] span.text-\[\#E07A5F\] {
  color: #C25E3F !important;
  font-weight: 700 !important;
}

/* Register Form Panel */
html[data-theme="light"] #evidenceAccessPolicyModal div[class*="bg-[#0B1B22]"],
body.light-theme #evidenceAccessPolicyModal div[class*="bg-[#0B1B22]"] {
  background-color: #F8FAFA !important;
  border-color: #D1E4E6 !important;
}

/* Segment Radio Buttons Group */
html[data-theme="light"] #evidenceRoleOptionGroup,
body.light-theme #evidenceRoleOptionGroup {
  background-color: #E6EFF0 !important;
  border-color: #D1E4E6 !important;
}

html[data-theme="light"] #evidenceRoleOptionGroup .evidence-role-label,
body.light-theme #evidenceRoleOptionGroup .evidence-role-label {
  color: #5C7B85 !important;
}

html[data-theme="light"] #evidenceRoleOptionGroup .evidence-role-label .role-text,
body.light-theme #evidenceRoleOptionGroup .evidence-role-label .role-text {
  color: #5C7B85 !important;
}

html[data-theme="light"] #evidenceRoleOptionGroup .evidence-role-label:has(input:checked),
body.light-theme #evidenceRoleOptionGroup .evidence-role-label:has(input:checked) {
  background-color: #FFFFFF !important;
  border-color: #D1E4E6 !important;
  box-shadow: 0 1px 3px rgba(15, 37, 48, 0.08) !important;
}

html[data-theme="light"] #evidenceRoleOptionGroup .evidence-role-label:has(input:checked) .role-text,
body.light-theme #evidenceRoleOptionGroup .evidence-role-label:has(input:checked) .role-text {
  color: #0F2530 !important;
  font-weight: 800 !important;
}

/* Email Input Field */
html[data-theme="light"] #newAllowedEmailInput,
body.light-theme #newAllowedEmailInput {
  background-color: #FFFFFF !important;
  border-color: #D1E4E6 !important;
  color: #0F2530 !important;
}

html[data-theme="light"] #newAllowedEmailInput::placeholder,
body.light-theme #newAllowedEmailInput::placeholder {
  color: #8CA3AB !important;
}

/* List Header & Count Badge */
html[data-theme="light"] #evidenceAccessPolicyModal .mt-4 > div:first-child span:first-child,
body.light-theme #evidenceAccessPolicyModal .mt-4 > div:first-child span:first-child {
  color: #0F2530 !important;
  font-weight: 700 !important;
}

html[data-theme="light"] #allowedEmailsCountBadge,
body.light-theme #allowedEmailsCountBadge {
  background-color: #1A7B88 !important;
  border-color: #146570 !important;
  color: #FFFFFF !important;
}

/* Allowed Emails List Items */
html[data-theme="light"] #allowedEmailsListContainer > div,
body.light-theme #allowedEmailsListContainer > div {
  background-color: #FFFFFF !important;
  border-color: #D1E4E6 !important;
  box-shadow: 0 1px 3px rgba(15, 37, 48, 0.04) !important;
}

html[data-theme="light"] #allowedEmailsListContainer span.font-bold,
body.light-theme #allowedEmailsListContainer span.font-bold {
  color: #0F2530 !important;
}

/* Allowed Emails List Badges: span[2] (Role) & span[3] (Status) */
/* Role Badge (span[2]): Cyan / Emerald / Amber / Slate */
html[data-theme="light"] #allowedEmailsListContainer span[class*="bg-cyan-950"],
body.light-theme #allowedEmailsListContainer span[class*="bg-cyan-950"],
html[data-theme="light"] #allowedEmailsListContainer span[class*="text-cyan-300"],
body.light-theme #allowedEmailsListContainer span[class*="text-cyan-300"] {
  background-color: #E0F2FE !important;
  border-color: #7DD3FC !important;
  color: #0369A1 !important;
  font-weight: 700 !important;
}

html[data-theme="light"] #allowedEmailsListContainer span[class*="bg-emerald-950"],
body.light-theme #allowedEmailsListContainer span[class*="bg-emerald-950"],
html[data-theme="light"] #allowedEmailsListContainer span[class*="text-emerald-300"],
body.light-theme #allowedEmailsListContainer span[class*="text-emerald-300"] {
  background-color: #ECFDF5 !important;
  border-color: #A7F3D0 !important;
  color: #064E3B !important;
  font-weight: 700 !important;
}

html[data-theme="light"] #allowedEmailsListContainer span[class*="bg-amber-950"],
body.light-theme #allowedEmailsListContainer span[class*="bg-amber-950"],
html[data-theme="light"] #allowedEmailsListContainer span[class*="text-amber-300"],
body.light-theme #allowedEmailsListContainer span[class*="text-amber-300"] {
  background-color: #FFFBEB !important;
  border-color: #FDE68A !important;
  color: #78350F !important;
  font-weight: 700 !important;
}

html[data-theme="light"] #allowedEmailsListContainer span[class*="bg-slate-800"],
body.light-theme #allowedEmailsListContainer span[class*="bg-slate-800"],
html[data-theme="light"] #allowedEmailsListContainer span[class*="text-slate-300"],
body.light-theme #allowedEmailsListContainer span[class*="text-slate-300"] {
  background-color: #EDF3F5 !important;
  border-color: #CBD5E1 !important;
  color: #1E293B !important;
  font-weight: 700 !important;
}

/* Status Badge (span[3]): Active Management vs View-Only */
html[data-theme="light"] #allowedEmailsListContainer span[class*="bg-[#1fa396]"],
body.light-theme #allowedEmailsListContainer span[class*="bg-[#1fa396]"],
html[data-theme="light"] #allowedEmailsListContainer span[class*="text-[#7ce7db]"],
body.light-theme #allowedEmailsListContainer span[class*="text-[#7ce7db]"] {
  background-color: #D1FAE5 !important;
  border-color: #6EE7B7 !important;
  color: #064E3B !important;
  font-weight: 800 !important;
}

html[data-theme="light"] #allowedEmailsListContainer span[class*="text-slate-400"],
body.light-theme #allowedEmailsListContainer span[class*="text-slate-400"] {
  background-color: #F1F5F9 !important;
  border-color: #CBD5E1 !important;
  color: #475569 !important;
  font-weight: 700 !important;
}

/* Sub-Role Description Text */
html[data-theme="light"] #allowedEmailsListContainer p,
body.light-theme #allowedEmailsListContainer p,
html[data-theme="light"] #allowedEmailsListContainer p span,
body.light-theme #allowedEmailsListContainer p span {
  color: #5C7B85 !important;
}

/* Right Action Buttons in Item Card */
html[data-theme="light"] #allowedEmailsListContainer button[onclick*="toggleAllowedEmailRole"],
body.light-theme #allowedEmailsListContainer button[onclick*="toggleAllowedEmailRole"] {
  background-color: #F4F8F8 !important;
  border-color: #D1E4E6 !important;
  color: #0F2530 !important;
  font-weight: 600 !important;
}
html[data-theme="light"] #allowedEmailsListContainer button[onclick*="toggleAllowedEmailRole"]:hover,
body.light-theme #allowedEmailsListContainer button[onclick*="toggleAllowedEmailRole"]:hover {
  background-color: #E6EFF0 !important;
}

html[data-theme="light"] #allowedEmailsListContainer button[onclick*="revokeAllowedEvidenceEmail"],
body.light-theme #allowedEmailsListContainer button[onclick*="revokeAllowedEvidenceEmail"] {
  background-color: #FFF1F2 !important;
  border-color: #FECDD3 !important;
  color: #BE123C !important;
  font-weight: 700 !important;
}
html[data-theme="light"] #allowedEmailsListContainer button[onclick*="revokeAllowedEvidenceEmail"]:hover,
body.light-theme #allowedEmailsListContainer button[onclick*="revokeAllowedEvidenceEmail"]:hover {
  background-color: #FFE4E6 !important;
}

/* Empty State in List */
html[data-theme="light"] #allowedEmailsListContainer div[class*="border-dashed"],
body.light-theme #allowedEmailsListContainer div[class*="border-dashed"] {
  background-color: #F8FAFA !important;
  border-color: #D1E4E6 !important;
}

html[data-theme="light"] #allowedEmailsListContainer div[class*="border-dashed"] p,
body.light-theme #allowedEmailsListContainer div[class*="border-dashed"] p {
  color: #5C7B85 !important;
}

html[data-theme="light"] #allowedEmailsListContainer div[class*="border-dashed"] p:first-child,
body.light-theme #allowedEmailsListContainer div[class*="border-dashed"] p:first-child {
  color: #0F2530 !important;
}

/* Bottom Close Button */
html[data-theme="light"] #evidenceAccessPolicyModal .mt-5 button,
body.light-theme #evidenceAccessPolicyModal .mt-5 button {
  background-color: #F4F8F8 !important;
  border: 1px solid #D1E4E6 !important;
  color: #0F2530 !important;
}

html[data-theme="light"] #evidenceAccessPolicyModal .mt-5 button:hover,
body.light-theme #evidenceAccessPolicyModal .mt-5 button:hover {
  background-color: #E6EFF0 !important;
}

/* --------------------------------------------------------------------------
   19. Admin Modals Readability (#adminAuth2FAModal & #adminStatsModal)
   -------------------------------------------------------------------------- */

/* Target 1: Admin 2FA Modal Cancel Buttons */
html[data-theme="light"] #adminAuth2FAModal button[onclick="closeAdmin2FAModal()"],
body.light-theme #adminAuth2FAModal button[onclick="closeAdmin2FAModal()"] {
  background-color: #F4F8F8 !important;
  border: 1px solid #D1E4E6 !important;
  color: #0F2530 !important;
  font-weight: 700 !important;
}

html[data-theme="light"] #adminAuth2FAModal button[onclick="closeAdmin2FAModal()"]:hover,
body.light-theme #adminAuth2FAModal button[onclick="closeAdmin2FAModal()"]:hover {
  background-color: #E6EFF0 !important;
  color: #0F2530 !important;
}

/* Admin 2FA Modal Inputs & Notice Panels */
html[data-theme="light"] #adminAuth2FAModal #admin2FAPinInput,
body.light-theme #adminAuth2FAModal #admin2FAPinInput,
html[data-theme="light"] #adminAuth2FAModal #admin2FAOtpInput,
body.light-theme #adminAuth2FAModal #admin2FAOtpInput {
  background-color: #FFFFFF !important;
  border-color: #D1E4E6 !important;
  color: #0F2530 !important;
}

html[data-theme="light"] #adminAuth2FAModal #admin2FAPinInput::placeholder,
body.light-theme #adminAuth2FAModal #admin2FAPinInput::placeholder,
html[data-theme="light"] #adminAuth2FAModal #admin2FAOtpInput::placeholder,
body.light-theme #adminAuth2FAModal #admin2FAOtpInput::placeholder {
  color: #8CA3AB !important;
}

html[data-theme="light"] #adminAuth2FAModal div[class*="bg-[#0B1B22]"],
body.light-theme #adminAuth2FAModal div[class*="bg-[#0B1B22]"] {
  background-color: #F4F8F8 !important;
  border-color: #D1E4E6 !important;
  color: #334E58 !important;
}

html[data-theme="light"] #adminAuth2FAModal div[class*="bg-emerald-950"],
body.light-theme #adminAuth2FAModal div[class*="bg-emerald-950"] {
  background-color: #ECFDF5 !important;
  border-color: #A7F3D0 !important;
  color: #064E3B !important;
}

html[data-theme="light"] #adminAuth2FAModal div[class*="bg-emerald-950"] p,
body.light-theme #adminAuth2FAModal div[class*="bg-emerald-950"] p {
  color: #064E3B !important;
}

/* Target 2: Admin Stats Console Live Admin Badge */
html[data-theme="light"] #adminStatsModal span[class*="text-emerald-400"],
body.light-theme #adminStatsModal span[class*="text-emerald-400"],
html[data-theme="light"] #adminStatsModal span[class*="bg-emerald-950"],
body.light-theme #adminStatsModal span[class*="bg-emerald-950"] {
  background-color: #ECFDF5 !important;
  border: 1px solid #A7F3D0 !important;
  color: #064E3B !important;
  font-weight: 800 !important;
}

/* Admin Stats Modal Header & Actions */
html[data-theme="light"] #adminStatsModal h3,
body.light-theme #adminStatsModal h3 {
  color: #0F2530 !important;
}

html[data-theme="light"] #adminStatsModal p#adminStatsUpdatedTime,
body.light-theme #adminStatsModal p#adminStatsUpdatedTime {
  color: #5C7B85 !important;
}

html[data-theme="light"] #adminStatsModal button[onclick="refreshAdminStats()"],
body.light-theme #adminStatsModal button[onclick="refreshAdminStats()"] {
  background-color: #FFFFFF !important;
  border-color: #D1E4E6 !important;
  color: #0F2530 !important;
}

html[data-theme="light"] #adminStatsModal button[onclick="closeAdminStatsModal()"],
body.light-theme #adminStatsModal button[onclick="closeAdminStatsModal()"] {
  color: #5C7B85 !important;
}

html[data-theme="light"] #adminStatsModal button[onclick="closeAdminStatsModal()"]:hover,
body.light-theme #adminStatsModal button[onclick="closeAdminStatsModal()"]:hover {
  color: #0F2530 !important;
}

/* Admin Stats Modal Tab Bar */
html[data-theme="light"] #adminStatsModal div[class*="border-b border-slate-800/80"] button:not(.bg-\[\#1A7B88\]),
body.light-theme #adminStatsModal div[class*="border-b border-slate-800/80"] button:not(.bg-\[\#1A7B88\]) {
  color: #5C7B85 !important;
}

html[data-theme="light"] #adminStatsModal div[class*="border-b border-slate-800/80"] button:not(.bg-\[\#1A7B88\]):hover,
body.light-theme #adminStatsModal div[class*="border-b border-slate-800/80"] button:not(.bg-\[\#1A7B88\]):hover {
  color: #0F2530 !important;
}

/* Admin Stats Modal KPI Cards & Settings Panel Cards */
html[data-theme="light"] #adminPanelTraffic div[class*="bg-[#0B1B22]"],
body.light-theme #adminPanelTraffic div[class*="bg-[#0B1B22]"],
html[data-theme="light"] #adminPanelSettings div[class*="bg-[#0B1B22]"],
body.light-theme #adminPanelSettings div[class*="bg-[#0B1B22]"] {
  background-color: #FFFFFF !important;
  border-color: #D1E4E6 !important;
  box-shadow: 0 1px 3px rgba(15, 37, 48, 0.05) !important;
}

html[data-theme="light"] #adminPanelTraffic div[class*="text-white"],
body.light-theme #adminPanelTraffic div[class*="text-white"],
html[data-theme="light"] #adminPanelSettings div[class*="text-white"],
body.light-theme #adminPanelSettings div[class*="text-white"] {
  color: #0F2530 !important;
}

html[data-theme="light"] #adminPanelSettings p[class*="text-slate-400"],
body.light-theme #adminPanelSettings p[class*="text-slate-400"] {
  color: #5C7B85 !important;
}

/* ==========================================================================
   Admin Console Highlighted Panels (Fake Door & Safe Data Reset)
   ========================================================================== */

/* 1. Fake Door Monetization & CTR Card (#adminFakeDoorMetricCard) */
html[data-theme="light"] #adminFakeDoorMetricCard,
body.light-theme #adminFakeDoorMetricCard {
  background: #FFFFFF !important;
  background-image: none !important;
  border: 1px solid #FDE68A !important;
  box-shadow: 0 3px 12px rgba(217, 119, 6, 0.08) !important;
}

html[data-theme="light"] #adminFakeDoorMetricCard span[class*="text-amber-300"],
body.light-theme #adminFakeDoorMetricCard span[class*="text-amber-300"] {
  color: #92400E !important;
}

html[data-theme="light"] #adminFakeDoorMetricCard span[class*="bg-amber-500/20"],
body.light-theme #adminFakeDoorMetricCard span[class*="bg-amber-500/20"] {
  background-color: #FEF3C7 !important;
  border-color: #FCD34D !important;
  color: #B45309 !important;
}

/* Fake Door 3-Step Funnel Boxes */
/* 1. 노출 (뷰어 열람) */
html[data-theme="light"] #adminFakeDoorMetricCard .grid > div:nth-child(1),
body.light-theme #adminFakeDoorMetricCard .grid > div:nth-child(1) {
  background-color: #F8FAFC !important;
  border-color: #E2E8F0 !important;
}
html[data-theme="light"] #adminFakeDoorMetricCard .grid > div:nth-child(1) div[class*="text-slate-400"],
body.light-theme #adminFakeDoorMetricCard .grid > div:nth-child(1) div[class*="text-slate-400"] {
  color: #64748B !important;
}
html[data-theme="light"] #adminFakeDoorMetricCard #statFdViews,
body.light-theme #adminFakeDoorMetricCard #statFdViews {
  color: #0F172A !important;
}
html[data-theme="light"] #adminFakeDoorMetricCard .grid > div:nth-child(1) div[class*="text-slate-500"],
body.light-theme #adminFakeDoorMetricCard .grid > div:nth-child(1) div[class*="text-slate-500"] {
  color: #94A3B8 !important;
}

/* 2. 1차 CTA 클릭 */
html[data-theme="light"] #adminFakeDoorMetricCard .grid > div:nth-child(2),
body.light-theme #adminFakeDoorMetricCard .grid > div:nth-child(2) {
  background-color: #FFFDF0 !important;
  border-color: #FDE68A !important;
}
html[data-theme="light"] #adminFakeDoorMetricCard .grid > div:nth-child(2) div[class*="text-amber-300"],
body.light-theme #adminFakeDoorMetricCard .grid > div:nth-child(2) div[class*="text-amber-300"],
html[data-theme="light"] #adminFakeDoorMetricCard #statFdClicks,
body.light-theme #adminFakeDoorMetricCard #statFdClicks {
  color: #B45309 !important;
}
html[data-theme="light"] #adminFakeDoorMetricCard .grid > div:nth-child(2) div[class*="text-amber-400"],
body.light-theme #adminFakeDoorMetricCard .grid > div:nth-child(2) div[class*="text-amber-400"],
html[data-theme="light"] #adminFakeDoorMetricCard #statFdCtr,
body.light-theme #adminFakeDoorMetricCard #statFdCtr {
  color: #D97706 !important;
}

/* 3. 최종 결제 시도 (구매 의향) */
html[data-theme="light"] #adminFakeDoorMetricCard .grid > div:nth-child(3),
body.light-theme #adminFakeDoorMetricCard .grid > div:nth-child(3) {
  background-color: #FFF1F2 !important;
  border-color: #FECDD3 !important;
}
html[data-theme="light"] #adminFakeDoorMetricCard .grid > div:nth-child(3) div[class*="text-rose-300"],
body.light-theme #adminFakeDoorMetricCard .grid > div:nth-child(3) div[class*="text-rose-300"] {
  color: #BE123C !important;
}
html[data-theme="light"] #adminFakeDoorMetricCard #statFdPurchases,
body.light-theme #adminFakeDoorMetricCard #statFdPurchases {
  color: #E11D48 !important;
}
html[data-theme="light"] #adminFakeDoorMetricCard .grid > div:nth-child(3) div[class*="text-rose-400"],
body.light-theme #adminFakeDoorMetricCard .grid > div:nth-child(3) div[class*="text-rose-400"],
html[data-theme="light"] #adminFakeDoorMetricCard #statFdPurchaseRate,
body.light-theme #adminFakeDoorMetricCard #statFdPurchaseRate {
  color: #BE123C !important;
}

/* Fake Door Bottom Plan Ratio Bar */
html[data-theme="light"] #adminFakeDoorMetricCard div[class*="bg-[#08151B]/70"],
body.light-theme #adminFakeDoorMetricCard div[class*="bg-[#08151B]/70"] {
  background-color: #F8FAFC !important;
  border-color: #E2E8F0 !important;
  color: #334155 !important;
}
html[data-theme="light"] #adminFakeDoorMetricCard #statFdSingleCount,
body.light-theme #adminFakeDoorMetricCard #statFdSingleCount {
  color: #059669 !important;
}
html[data-theme="light"] #adminFakeDoorMetricCard #statFdCompCount,
body.light-theme #adminFakeDoorMetricCard #statFdCompCount {
  color: #D97706 !important;
}
html[data-theme="light"] #adminFakeDoorMetricCard #statFdModalRate,
body.light-theme #adminFakeDoorMetricCard #statFdModalRate {
  color: #B45309 !important;
}

/* 2. Safe Database & Metrics Reset Card (#adminDataResetCard) */
html[data-theme="light"] #adminDataResetCard,
body.light-theme #adminDataResetCard {
  background: #FFFFFF !important;
  background-image: none !important;
  border: 1px solid #FDE68A !important;
  box-shadow: 0 3px 12px rgba(217, 119, 6, 0.08) !important;
}

html[data-theme="light"] #adminDataResetCard div.text-white,
body.light-theme #adminDataResetCard div.text-white {
  color: #0F2530 !important;
}

html[data-theme="light"] #adminDataResetCard span[class*="bg-emerald-950"],
body.light-theme #adminDataResetCard span[class*="bg-emerald-950"] {
  background-color: #ECFDF5 !important;
  border-color: #A7F3D0 !important;
  color: #065F46 !important;
}

html[data-theme="light"] #adminDataResetCard p.text-slate-400,
body.light-theme #adminDataResetCard p.text-slate-400 {
  color: #5C7B85 !important;
}

html[data-theme="light"] #adminDataResetCard p.text-slate-400 strong,
body.light-theme #adminDataResetCard p.text-slate-400 strong {
  color: #0F2530 !important;
}

/* Option B (Metrics Reset) Box */
html[data-theme="light"] #adminDataResetCard div[class*="border-amber-500/30"],
body.light-theme #adminDataResetCard div[class*="border-amber-500/30"] {
  background-color: #FFFDF0 !important;
  border-color: #FDE68A !important;
}

html[data-theme="light"] #adminDataResetCard div[class*="border-amber-500/30"] div[class*="text-amber-300"],
body.light-theme #adminDataResetCard div[class*="border-amber-500/30"] div[class*="text-amber-300"] {
  color: #92400E !important;
}

html[data-theme="light"] #adminDataResetCard div[class*="border-amber-500/30"] div[class*="text-slate-400"],
body.light-theme #adminDataResetCard div[class*="border-amber-500/30"] div[class*="text-slate-400"] {
  color: #78716C !important;
}

/* Option A (Factory Reset) Box */
html[data-theme="light"] #adminDataResetCard div[class*="border-rose-500/30"],
body.light-theme #adminDataResetCard div[class*="border-rose-500/30"] {
  background-color: #FFF1F2 !important;
  border-color: #FECDD3 !important;
}

html[data-theme="light"] #adminDataResetCard div[class*="border-rose-500/30"] div[class*="text-rose-400"],
body.light-theme #adminDataResetCard div[class*="border-rose-500/30"] div[class*="text-rose-400"] {
  color: #BE123C !important;
}

html[data-theme="light"] #adminDataResetCard div[class*="border-rose-500/30"] div[class*="text-slate-400"],
body.light-theme #adminDataResetCard div[class*="border-rose-500/30"] div[class*="text-slate-400"] {
  color: #9F1239 !important;
}

/* ==========================================================================
   Section 19: Mobile & Web Splash Overlay Light Mode Zero-FOUC Rules
   ========================================================================== */
html[data-theme="light"] #mobileSplashScreen,
body.light-theme #mobileSplashScreen {
  background: linear-gradient(180deg, #F0FDFA 0%, #F8FAFC 50%, #E6FFFA 100%) !important;
  background-color: #F8FAFC !important;
}

html[data-theme="light"] #mobileSplashScreen .splash-ring-1,
body.light-theme #mobileSplashScreen .splash-ring-1 {
  border-color: rgba(20, 184, 166, 0.25) !important;
}

html[data-theme="light"] #mobileSplashScreen .splash-ring-2,
body.light-theme #mobileSplashScreen .splash-ring-2 {
  border-color: rgba(20, 184, 166, 0.15) !important;
}

html[data-theme="light"] #mobileSplashScreen h1,
body.light-theme #mobileSplashScreen h1,
html[data-theme="light"] #mobileSplashScreen .splash-brand-name,
body.light-theme #mobileSplashScreen .splash-brand-name {
  color: #0F2530 !important;
  text-shadow: none !important;
}

html[data-theme="light"] #mobileSplashScreen p,
body.light-theme #mobileSplashScreen p,
html[data-theme="light"] #mobileSplashScreen .splash-brand-sub,
body.light-theme #mobileSplashScreen .splash-brand-sub {
  color: #475569 !important;
}

html[data-theme="light"] #mobileSplashScreen svg,
body.light-theme #mobileSplashScreen svg {
  filter: drop-shadow(0 12px 24px rgba(15, 118, 110, 0.15)) !important;
}

/* ==========================================================================
   Section 20: Feedback Board Modal (/html/body/div[5]/div, #feedbackModal) Light Mode
   ========================================================================== */

/* 1. Modal Dialog Box Outer Shell */
html[data-theme="light"] #feedbackModal > div,
body.light-theme #feedbackModal > div {
  background-color: #FFFFFF !important;
  border-color: #D1E4E6 !important;
  color: #0F2530 !important;
  box-shadow: 0 20px 45px -10px rgba(15, 37, 48, 0.16), 0 8px 20px -4px rgba(15, 37, 48, 0.08) !important;
}

/* 2. Modal Header */
html[data-theme="light"] #feedbackModal .border-b.border-slate-800,
body.light-theme #feedbackModal .border-b.border-slate-800,
html[data-theme="light"] #feedbackModal div[class*="border-b border-slate-800"],
body.light-theme #feedbackModal div[class*="border-b border-slate-800"] {
  border-bottom-color: #E2ECEE !important;
}

html[data-theme="light"] #feedbackModal h3,
body.light-theme #feedbackModal h3,
html[data-theme="light"] #feedbackModal h3 span,
body.light-theme #feedbackModal h3 span {
  color: #0F2530 !important;
}

html[data-theme="light"] #feedbackModal #feedbackHeaderSubtitle,
body.light-theme #feedbackModal #feedbackHeaderSubtitle {
  color: #5C7B85 !important;
}

html[data-theme="light"] #feedbackModal button[onclick="closeFeedbackModal()"],
body.light-theme #feedbackModal button[onclick="closeFeedbackModal()"] {
  color: #5C7B85 !important;
}
html[data-theme="light"] #feedbackModal button[onclick="closeFeedbackModal()"]:hover,
body.light-theme #feedbackModal button[onclick="closeFeedbackModal()"]:hover {
  color: #0F2530 !important;
}

/* 3. Navigation Tabs Bar */
html[data-theme="light"] #feedbackModal div[class*="bg-[#08151B]"],
body.light-theme #feedbackModal div[class*="bg-[#08151B]"] {
  background-color: #F4F8F8 !important;
  border-color: #D1E4E6 !important;
}

html[data-theme="light"] #tabFeedbackWriteBtn,
body.light-theme #tabFeedbackWriteBtn {
  color: #475569 !important;
}
html[data-theme="light"] #tabFeedbackWriteBtn:hover,
body.light-theme #tabFeedbackWriteBtn:hover {
  color: #0F2530 !important;
  background-color: #E6EFF0 !important;
}

/* 4. Category Filter Pills */
html[data-theme="light"] .feedback-filter-pill:not(.bg-\[\#1A7B88\]),
body.light-theme .feedback-filter-pill:not(.bg-\[\#1A7B88\]) {
  background-color: #F4F8F8 !important;
  color: #475569 !important;
  border-color: #CBD5E1 !important;
}
html[data-theme="light"] .feedback-filter-pill:not(.bg-\[\#1A7B88\]):hover,
body.light-theme .feedback-filter-pill:not(.bg-\[\#1A7B88\]):hover {
  background-color: #E6EFF0 !important;
  color: #0F2530 !important;
  border-color: #94A3B8 !important;
}

/* 5. Feedback Post Cards in List Panel */
html[data-theme="light"] #feedbackCardsContainer > div,
body.light-theme #feedbackCardsContainer > div {
  background-color: #FFFFFF !important;
  border-color: #D1E4E6 !important;
  box-shadow: 0 1px 3px rgba(15, 37, 48, 0.05) !important;
}
html[data-theme="light"] #feedbackCardsContainer > div:hover,
body.light-theme #feedbackCardsContainer > div:hover {
  background-color: #F8FCFC !important;
  border-color: #38A3A5 !important;
  box-shadow: 0 4px 12px rgba(15, 37, 48, 0.08) !important;
}

html[data-theme="light"] #feedbackCardsContainer h4,
body.light-theme #feedbackCardsContainer h4 {
  color: #0F2530 !important;
}

html[data-theme="light"] #feedbackCardsContainer p,
body.light-theme #feedbackCardsContainer p {
  color: #475569 !important;
}

html[data-theme="light"] #feedbackCardsContainer div[class*="border-t border-slate-800"],
body.light-theme #feedbackCardsContainer div[class*="border-t border-slate-800"] {
  border-top-color: #E2ECEE !important;
}

html[data-theme="light"] #feedbackCardsContainer span[class*="text-slate-400"],
body.light-theme #feedbackCardsContainer span[class*="text-slate-400"] {
  color: #5C7B85 !important;
}

/* 6. Feedback Write Panel */
html[data-theme="light"] #feedbackWritePanel div[class*="bg-[#0B1B22]/80"],
body.light-theme #feedbackWritePanel div[class*="bg-[#0B1B22]/80"] {
  background-color: #F0FDFA !important;
  border-color: #99F6E4 !important;
}

html[data-theme="light"] #feedbackAuthorAliasPreview,
body.light-theme #feedbackAuthorAliasPreview {
  color: #0F766E !important;
}

html[data-theme="light"] #feedbackWritePanel label,
body.light-theme #feedbackWritePanel label {
  color: #0F2530 !important;
}

/* Category Selection Buttons in Write Panel */
html[data-theme="light"] .feedback-cat-btn:not([class*="bg-blue-950"]),
body.light-theme .feedback-cat-btn:not([class*="bg-blue-950"]) {
  background-color: #F8FAFC !important;
  border-color: #CBD5E1 !important;
  color: #475569 !important;
}
html[data-theme="light"] .feedback-cat-btn:not([class*="bg-blue-950"]):hover,
body.light-theme .feedback-cat-btn:not([class*="bg-blue-950"]):hover {
  background-color: #F1F5F9 !important;
  border-color: #94A3B8 !important;
  color: #0F2530 !important;
}

/* Active Category Button in Write Panel */
html[data-theme="light"] .feedback-cat-btn[class*="bg-blue-950"],
body.light-theme .feedback-cat-btn[class*="bg-blue-950"] {
  background-color: #EFF6FF !important;
  border-color: #3B82F6 !important;
  color: #1D4ED8 !important;
  box-shadow: 0 1px 3px rgba(59, 130, 246, 0.2) !important;
}

html[data-theme="light"] .feedback-cat-btn[class*="bg-rose-950"],
body.light-theme .feedback-cat-btn[class*="bg-rose-950"] {
  background-color: #FFF1F2 !important;
  border-color: #F43F5E !important;
  color: #BE123C !important;
}

html[data-theme="light"] .feedback-cat-btn[class*="bg-purple-950"],
body.light-theme .feedback-cat-btn[class*="bg-purple-950"] {
  background-color: #FAF5FF !important;
  border-color: #A855F7 !important;
  color: #7E22CE !important;
}

html[data-theme="light"] .feedback-cat-btn[class*="bg-emerald-950"],
body.light-theme .feedback-cat-btn[class*="bg-emerald-950"] {
  background-color: #ECFDF5 !important;
  border-color: #10B981 !important;
  color: #047857 !important;
}

/* Form Inputs & Textareas */
html[data-theme="light"] #feedbackWriteTitle,
body.light-theme #feedbackWriteTitle,
html[data-theme="light"] #feedbackWriteContent,
body.light-theme #feedbackWriteContent,
html[data-theme="light"] #feedbackNewCommentInput,
body.light-theme #feedbackNewCommentInput {
  background-color: #FFFFFF !important;
  border-color: #CBD5E1 !important;
  color: #0F2530 !important;
}
html[data-theme="light"] #feedbackWriteTitle::placeholder,
body.light-theme #feedbackWriteTitle::placeholder,
html[data-theme="light"] #feedbackWriteContent::placeholder,
body.light-theme #feedbackWriteContent::placeholder,
html[data-theme="light"] #feedbackNewCommentInput::placeholder,
body.light-theme #feedbackNewCommentInput::placeholder {
  color: #94A3B8 !important;
}
html[data-theme="light"] #feedbackWriteTitle:focus,
body.light-theme #feedbackWriteTitle:focus,
html[data-theme="light"] #feedbackWriteContent:focus,
body.light-theme #feedbackWriteContent:focus,
html[data-theme="light"] #feedbackNewCommentInput:focus,
body.light-theme #feedbackNewCommentInput:focus {
  border-color: #38A3A5 !important;
  box-shadow: 0 0 0 2px rgba(56, 163, 165, 0.2) !important;
}

/* Write Panel Footer Buttons */
html[data-theme="light"] #feedbackWritePanel button[onclick*="switchFeedbackTab('list')"],
body.light-theme #feedbackWritePanel button[onclick*="switchFeedbackTab('list')"] {
  background-color: #F1F5F9 !important;
  color: #475569 !important;
  border: 1px solid #CBD5E1 !important;
}
html[data-theme="light"] #feedbackWritePanel button[onclick*="switchFeedbackTab('list')"]:hover,
body.light-theme #feedbackWritePanel button[onclick*="switchFeedbackTab('list')"]:hover {
  background-color: #E2E8F0 !important;
  color: #0F2530 !important;
}

/* 7. Detail & Comments Panel */
html[data-theme="light"] #feedbackDetailPanel button[onclick*="switchFeedbackTab('list')"],
body.light-theme #feedbackDetailPanel button[onclick*="switchFeedbackTab('list')"] {
  color: #5C7B85 !important;
}
html[data-theme="light"] #feedbackDetailPanel button[onclick*="switchFeedbackTab('list')"]:hover,
body.light-theme #feedbackDetailPanel button[onclick*="switchFeedbackTab('list')"]:hover {
  color: #0F2530 !important;
}

html[data-theme="light"] #feedbackDetailContent > div,
body.light-theme #feedbackDetailContent > div {
  background-color: #F8FCFC !important;
  border-color: #D1E4E6 !important;
  color: #0F2530 !important;
}

html[data-theme="light"] #feedbackDetailPanel h4,
body.light-theme #feedbackDetailPanel h4 {
  color: #0F2530 !important;
}

html[data-theme="light"] #feedbackCommentsList > div,
body.light-theme #feedbackCommentsList > div {
  background-color: #F8FAFC !important;
  border-color: #E2ECEE !important;
  color: #0F2530 !important;
}
html[data-theme="light"] #feedbackCommentsList p,
body.light-theme #feedbackCommentsList p {
  color: #334155 !important;
}

/* 8. Empty & Loading States */
html[data-theme="light"] #feedbackEmptyState,
body.light-theme #feedbackEmptyState {
  color: #64748B !important;
}
html[data-theme="light"] #feedbackEmptyState i,
body.light-theme #feedbackEmptyState i {
  color: #94A3B8 !important;
}
html[data-theme="light"] #feedbackLoadingIndicator,
body.light-theme #feedbackLoadingIndicator {
  color: #64748B !important;
}

/* 9. Feedback Cards Status Badges (span[2]) - 고시인성 밝은 텍스트 및 선명한 배경 */
html[data-theme="light"] #feedbackCardsContainer .feedback-status-badge,
body.light-theme #feedbackCardsContainer .feedback-status-badge,
html[data-theme="light"] #feedbackCardsContainer > div > div:first-child > div:first-child > span:nth-child(2),
body.light-theme #feedbackCardsContainer > div > div:first-child > div:first-child > span:nth-child(2) {
  color: #FFFFFF !important;
  font-weight: 800 !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) !important;
}
html[data-theme="light"] #feedbackCardsContainer .feedback-status-badge i,
body.light-theme #feedbackCardsContainer .feedback-status-badge i,
html[data-theme="light"] #feedbackCardsContainer > div > div:first-child > div:first-child > span:nth-child(2) i,
body.light-theme #feedbackCardsContainer > div > div:first-child > div:first-child > span:nth-child(2) i {
  color: #FFFFFF !important;
  opacity: 0.95 !important;
}
html[data-theme="light"] #feedbackCardsContainer span:nth-child(2)[class*="bg-slate-800"],
body.light-theme #feedbackCardsContainer span:nth-child(2)[class*="bg-slate-800"] {
  background-color: #475569 !important;
  border-color: #334155 !important;
  color: #FFFFFF !important;
}
html[data-theme="light"] #feedbackCardsContainer span:nth-child(2)[class*="bg-amber-950"],
body.light-theme #feedbackCardsContainer span:nth-child(2)[class*="bg-amber-950"] {
  background-color: #D97706 !important;
  border-color: #B45309 !important;
  color: #FFFFFF !important;
}
html[data-theme="light"] #feedbackCardsContainer span:nth-child(2)[class*="bg-blue-950"],
body.light-theme #feedbackCardsContainer span:nth-child(2)[class*="bg-blue-950"] {
  background-color: #2563EB !important;
  border-color: #1D4ED8 !important;
  color: #FFFFFF !important;
}
html[data-theme="light"] #feedbackCardsContainer span:nth-child(2)[class*="bg-emerald-950"],
body.light-theme #feedbackCardsContainer span:nth-child(2)[class*="bg-emerald-950"] {
  background-color: #059669 !important;
  border-color: #047857 !important;
  color: #FFFFFF !important;
}
html[data-theme="light"] #feedbackCardsContainer span:nth-child(2)[class*="bg-rose-950"],
body.light-theme #feedbackCardsContainer span:nth-child(2)[class*="bg-rose-950"] {
  background-color: #E11D48 !important;
  border-color: #BE123C !important;
  color: #FFFFFF !important;
}

/* 10. Hall of Fame Top Sticky Frame (/html/body/div[5]/div/div[6]/div/div) - 밝은색 그라데이션 */
html[data-theme="light"] #feedbackHallOfFameContent > div:first-child,
body.light-theme #feedbackHallOfFameContent > div:first-child,
html[data-theme="light"] .feedback-my-rank-card,
body.light-theme .feedback-my-rank-card {
  background: linear-gradient(135deg, #F0FDFA 0%, #E6F7F8 50%, #CCFBF1 100%) !important;
  border: 1px solid #99F6E4 !important;
  box-shadow: 0 4px 16px rgba(15, 37, 48, 0.08), 0 1px 3px rgba(0, 0, 0, 0.03) !important;
}

html[data-theme="light"] #feedbackHallOfFameContent > div:first-child h4,
body.light-theme #feedbackHallOfFameContent > div:first-child h4,
html[data-theme="light"] .feedback-my-rank-card h4,
body.light-theme .feedback-my-rank-card h4 {
  color: #0F2530 !important;
}

html[data-theme="light"] #feedbackHallOfFameContent > div:first-child p,
body.light-theme #feedbackHallOfFameContent > div:first-child p,
html[data-theme="light"] .feedback-my-rank-card p,
body.light-theme .feedback-my-rank-card p {
  color: #475569 !important;
}

html[data-theme="light"] #feedbackHallOfFameContent > div:first-child span.text-white,
body.light-theme #feedbackHallOfFameContent > div:first-child span.text-white,
html[data-theme="light"] .feedback-my-rank-card span.text-white,
body.light-theme .feedback-my-rank-card span.text-white {
  color: #0F2530 !important;
  font-weight: 900 !important;
}

/* Sticky Frame: Rank Number Box (#내순위) */
html[data-theme="light"] #feedbackHallOfFameContent > div:first-child div[class*="w-10 h-10"],
body.light-theme #feedbackHallOfFameContent > div:first-child div[class*="w-10 h-10"],
html[data-theme="light"] #feedbackHallOfFameContent > div:first-child div[class*="w-9 h-9"],
body.light-theme #feedbackHallOfFameContent > div:first-child div[class*="w-9 h-9"],
html[data-theme="light"] .feedback-my-rank-card div[class*="w-10 h-10"],
body.light-theme .feedback-my-rank-card div[class*="w-10 h-10"] {
  background-color: #FFFFFF !important;
  border: 1px solid #38A3A5 !important;
  color: #0F766E !important;
  box-shadow: 0 2px 6px rgba(56, 163, 165, 0.15) !important;
}

/* Sticky Frame: Tier Badge & My Rank Badge */
html[data-theme="light"] .feedback-my-rank-card span[class*="border-[#38A3A5]"],
body.light-theme .feedback-my-rank-card span[class*="border-[#38A3A5]"],
html[data-theme="light"] .feedback-my-rank-card span[class*="border-amber-600"],
body.light-theme .feedback-my-rank-card span[class*="border-amber-600"],
html[data-theme="light"] .feedback-my-rank-card span[class*="border-slate-400"],
body.light-theme .feedback-my-rank-card span[class*="border-slate-400"] {
  background-color: #FFFFFF !important;
  border-color: #99F6E4 !important;
  color: #0D9488 !important;
}

html[data-theme="light"] .feedback-my-rank-card span[class*="bg-emerald-950"],
body.light-theme .feedback-my-rank-card span[class*="bg-emerald-950"] {
  background-color: #CCFBF1 !important;
  border-color: #5EEAD4 !important;
  color: #0F766E !important;
}

/* Sticky Frame: CP points & Resolved Count */
html[data-theme="light"] .feedback-my-rank-card b.font-black,
body.light-theme .feedback-my-rank-card b.font-black {
  color: #0F766E !important;
}

/* 11. Hall of Fame Banner (/html/body/div[5]/div/div[6]/div/div/div[1]) - 밝은 샴페인 골드 그라데이션 */
html[data-theme="light"] #feedbackHallOfFameContent > div > div:first-child,
body.light-theme #feedbackHallOfFameContent > div > div:first-child,
html[data-theme="light"] .feedback-hof-banner,
body.light-theme .feedback-hof-banner {
  background: linear-gradient(135deg, #FEF3C7 0%, #FFFBEB 50%, #FDE68A 100%) !important;
  border: 1px solid #FCD34D !important;
  box-shadow: 0 4px 14px rgba(217, 119, 6, 0.08) !important;
}

html[data-theme="light"] .feedback-hof-banner h3,
body.light-theme .feedback-hof-banner h3,
html[data-theme="light"] #feedbackHallOfFameContent > div > div:first-child h3,
body.light-theme #feedbackHallOfFameContent > div > div:first-child h3 {
  color: #78350F !important;
  font-weight: 900 !important;
}

html[data-theme="light"] .feedback-hof-banner p,
body.light-theme .feedback-hof-banner p,
html[data-theme="light"] #feedbackHallOfFameContent > div > div:first-child p,
body.light-theme #feedbackHallOfFameContent > div > div:first-child p {
  color: #92400E !important;
}

html[data-theme="light"] .feedback-hof-banner b,
body.light-theme .feedback-hof-banner b,
html[data-theme="light"] #feedbackHallOfFameContent > div > div:first-child b,
body.light-theme #feedbackHallOfFameContent > div > div:first-child b {
  color: #78350F !important;
}

html[data-theme="light"] .feedback-hof-banner i.fa-trophy,
body.light-theme .feedback-hof-banner i.fa-trophy,
html[data-theme="light"] #feedbackHallOfFameContent > div > div:first-child i.fa-trophy,
body.light-theme #feedbackHallOfFameContent > div > div:first-child i.fa-trophy {
  color: #D97706 !important;
}

/* 12. Hall of Fame TOP 3 Podium Cards (/html/body/div[5]/div/div[6]/div/div/div[3]/div[2]/div[1,2,3]) - 밝은색 그라데이션 */
/* 2nd Silver */
html[data-theme="light"] #feedbackHallOfFameContent > div > div:nth-child(3) > div:nth-child(2) > div:nth-child(1),
body.light-theme #feedbackHallOfFameContent > div > div:nth-child(3) > div:nth-child(2) > div:nth-child(1),
html[data-theme="light"] .feedback-podium-silver,
body.light-theme .feedback-podium-silver {
  background: linear-gradient(180deg, #FFFFFF 0%, #F8FAFC 50%, #E2E8F0 100%) !important;
  border: 1px solid #CBD5E1 !important;
  box-shadow: 0 4px 14px rgba(100, 116, 139, 0.12) !important;
}

html[data-theme="light"] .feedback-podium-silver span[class*="bg-black"],
body.light-theme .feedback-podium-silver span[class*="bg-black"],
html[data-theme="light"] #feedbackHallOfFameContent > div > div:nth-child(3) > div:nth-child(2) > div:nth-child(1) span[class*="bg-black"],
body.light-theme #feedbackHallOfFameContent > div > div:nth-child(3) > div:nth-child(2) > div:nth-child(1) span[class*="bg-black"] {
  background-color: #F1F5F9 !important;
  border-color: #CBD5E1 !important;
  color: #475569 !important;
}

html[data-theme="light"] .feedback-podium-silver h4,
body.light-theme .feedback-podium-silver h4,
html[data-theme="light"] #feedbackHallOfFameContent > div > div:nth-child(3) > div:nth-child(2) > div:nth-child(1) h4,
body.light-theme #feedbackHallOfFameContent > div > div:nth-child(3) > div:nth-child(2) > div:nth-child(1) h4 {
  color: #0F2530 !important;
  font-weight: 900 !important;
}

html[data-theme="light"] .feedback-podium-silver div[class*="text-slate-200"],
body.light-theme .feedback-podium-silver div[class*="text-slate-200"],
html[data-theme="light"] #feedbackHallOfFameContent > div > div:nth-child(3) > div:nth-child(2) > div:nth-child(1) div[class*="text-slate-200"],
body.light-theme #feedbackHallOfFameContent > div > div:nth-child(3) > div:nth-child(2) > div:nth-child(1) div[class*="text-slate-200"] {
  color: #334155 !important;
}

html[data-theme="light"] .feedback-podium-silver div[class*="text-slate-400"],
body.light-theme .feedback-podium-silver div[class*="text-slate-400"],
html[data-theme="light"] #feedbackHallOfFameContent > div > div:nth-child(3) > div:nth-child(2) > div:nth-child(1) div[class*="text-slate-400"],
body.light-theme #feedbackHallOfFameContent > div > div:nth-child(3) > div:nth-child(2) > div:nth-child(1) div[class*="text-slate-400"] {
  color: #64748B !important;
}

/* 1st Gold */
html[data-theme="light"] #feedbackHallOfFameContent > div > div:nth-child(3) > div:nth-child(2) > div:nth-child(2),
body.light-theme #feedbackHallOfFameContent > div > div:nth-child(3) > div:nth-child(2) > div:nth-child(2),
html[data-theme="light"] .feedback-podium-gold,
body.light-theme .feedback-podium-gold {
  background: linear-gradient(180deg, #FFFBEB 0%, #FEF3C7 50%, #FDE68A 100%) !important;
  border: 1.5px solid #F59E0B !important;
  box-shadow: 0 6px 18px rgba(217, 119, 6, 0.18) !important;
}

html[data-theme="light"] .feedback-podium-gold span[class*="bg-black"],
body.light-theme .feedback-podium-gold span[class*="bg-black"],
html[data-theme="light"] #feedbackHallOfFameContent > div > div:nth-child(3) > div:nth-child(2) > div:nth-child(2) span[class*="bg-black"],
body.light-theme #feedbackHallOfFameContent > div > div:nth-child(3) > div:nth-child(2) > div:nth-child(2) span[class*="bg-black"] {
  background-color: #FEF3C7 !important;
  border-color: #F59E0B !important;
  color: #92400E !important;
}

html[data-theme="light"] .feedback-podium-gold h4,
body.light-theme .feedback-podium-gold h4,
html[data-theme="light"] #feedbackHallOfFameContent > div > div:nth-child(3) > div:nth-child(2) > div:nth-child(2) h4,
body.light-theme #feedbackHallOfFameContent > div > div:nth-child(3) > div:nth-child(2) > div:nth-child(2) h4 {
  color: #451A03 !important;
  font-weight: 900 !important;
}

html[data-theme="light"] .feedback-podium-gold div[class*="text-amber-300"],
body.light-theme .feedback-podium-gold div[class*="text-amber-300"],
html[data-theme="light"] #feedbackHallOfFameContent > div > div:nth-child(3) > div:nth-child(2) > div:nth-child(2) div[class*="text-amber-300"],
body.light-theme #feedbackHallOfFameContent > div > div:nth-child(3) > div:nth-child(2) > div:nth-child(2) div[class*="text-amber-300"] {
  color: #B45309 !important;
  font-weight: 900 !important;
}

html[data-theme="light"] .feedback-podium-gold div[class*="text-slate-400"],
body.light-theme .feedback-podium-gold div[class*="text-slate-400"],
html[data-theme="light"] #feedbackHallOfFameContent > div > div:nth-child(3) > div:nth-child(2) > div:nth-child(2) div[class*="text-slate-400"],
body.light-theme #feedbackHallOfFameContent > div > div:nth-child(3) > div:nth-child(2) > div:nth-child(2) div[class*="text-slate-400"] {
  color: #78350F !important;
}

/* 3rd Bronze */
html[data-theme="light"] #feedbackHallOfFameContent > div > div:nth-child(3) > div:nth-child(2) > div:nth-child(3),
body.light-theme #feedbackHallOfFameContent > div > div:nth-child(3) > div:nth-child(2) > div:nth-child(3),
html[data-theme="light"] .feedback-podium-bronze,
body.light-theme .feedback-podium-bronze {
  background: linear-gradient(180deg, #FFF7ED 0%, #FFEDD5 50%, #FED7AA 100%) !important;
  border: 1px solid #FB923C !important;
  box-shadow: 0 4px 14px rgba(194, 65, 12, 0.12) !important;
}

html[data-theme="light"] .feedback-podium-bronze span[class*="bg-black"],
body.light-theme .feedback-podium-bronze span[class*="bg-black"],
html[data-theme="light"] #feedbackHallOfFameContent > div > div:nth-child(3) > div:nth-child(2) > div:nth-child(3) span[class*="bg-black"],
body.light-theme #feedbackHallOfFameContent > div > div:nth-child(3) > div:nth-child(2) > div:nth-child(3) span[class*="bg-black"] {
  background-color: #FFEDD5 !important;
  border-color: #FB923C !important;
  color: #9A3412 !important;
}

html[data-theme="light"] .feedback-podium-bronze h4,
body.light-theme .feedback-podium-bronze h4,
html[data-theme="light"] #feedbackHallOfFameContent > div > div:nth-child(3) > div:nth-child(2) > div:nth-child(3) h4,
body.light-theme #feedbackHallOfFameContent > div > div:nth-child(3) > div:nth-child(2) > div:nth-child(3) h4 {
  color: #431407 !important;
  font-weight: 900 !important;
}

html[data-theme="light"] .feedback-podium-bronze div[class*="text-slate-200"],
body.light-theme .feedback-podium-bronze div[class*="text-slate-200"],
html[data-theme="light"] #feedbackHallOfFameContent > div > div:nth-child(3) > div:nth-child(2) > div:nth-child(3) div[class*="text-slate-200"],
body.light-theme #feedbackHallOfFameContent > div > div:nth-child(3) > div:nth-child(2) > div:nth-child(3) div[class*="text-slate-200"] {
  color: #C2410C !important;
}

html[data-theme="light"] .feedback-podium-bronze div[class*="text-slate-400"],
body.light-theme .feedback-podium-bronze div[class*="text-slate-400"],
html[data-theme="light"] #feedbackHallOfFameContent > div > div:nth-child(3) > div:nth-child(2) > div:nth-child(3) div[class*="text-slate-400"],
body.light-theme #feedbackHallOfFameContent > div > div:nth-child(3) > div:nth-child(2) > div:nth-child(3) div[class*="text-slate-400"] {
  color: #7C2D12 !important;
}

/* 13. 4위 이하 랭커 목록 카드 Row (/html/body/div[5]/div/div[6]/div/div/div[4]/div[2]/div) - 밝은 카드 */
html[data-theme="light"] #feedbackHallOfFameContent > div > div:nth-child(4) > div:nth-child(2) > div,
body.light-theme #feedbackHallOfFameContent > div > div:nth-child(4) > div:nth-child(2) > div,
html[data-theme="light"] .feedback-ranker-row,
body.light-theme .feedback-ranker-row {
  background-color: #FFFFFF !important;
  border: 1px solid #E2ECEE !important;
  box-shadow: 0 1px 3px rgba(15, 37, 48, 0.04) !important;
}

html[data-theme="light"] .feedback-ranker-row:hover,
body.light-theme .feedback-ranker-row:hover,
html[data-theme="light"] #feedbackHallOfFameContent > div > div:nth-child(4) > div:nth-child(2) > div:hover,
body.light-theme #feedbackHallOfFameContent > div > div:nth-child(4) > div:nth-child(2) > div:hover {
  background-color: #F8FCFC !important;
  border-color: #38A3A5 !important;
}

html[data-theme="light"] .feedback-ranker-row span[class*="bg-slate-800"],
body.light-theme .feedback-ranker-row span[class*="bg-slate-800"],
html[data-theme="light"] #feedbackHallOfFameContent > div > div:nth-child(4) > div:nth-child(2) > div span[class*="bg-slate-800"],
body.light-theme #feedbackHallOfFameContent > div > div:nth-child(4) > div:nth-child(2) > div span[class*="bg-slate-800"] {
  background-color: #F1F5F9 !important;
  color: #475569 !important;
  font-weight: 800 !important;
}

html[data-theme="light"] .feedback-ranker-row span.text-slate-200,
body.light-theme .feedback-ranker-row span.text-slate-200,
html[data-theme="light"] #feedbackHallOfFameContent > div > div:nth-child(4) > div:nth-child(2) > div span.text-slate-200,
body.light-theme #feedbackHallOfFameContent > div > div:nth-child(4) > div:nth-child(2) > div span.text-slate-200 {
  color: #0F2530 !important;
}

html[data-theme="light"] .feedback-ranker-row div[class*="text-slate-400"],
body.light-theme .feedback-ranker-row div[class*="text-slate-400"],
html[data-theme="light"] #feedbackHallOfFameContent > div > div:nth-child(4) > div:nth-child(2) > div div[class*="text-slate-400"],
body.light-theme #feedbackHallOfFameContent > div > div:nth-child(4) > div:nth-child(2) > div div[class*="text-slate-400"] {
  color: #64748B !important;
}

html[data-theme="light"] .feedback-ranker-row div[class*="text-amber-300"],
body.light-theme .feedback-ranker-row div[class*="text-amber-300"],
html[data-theme="light"] #feedbackHallOfFameContent > div > div:nth-child(4) > div:nth-child(2) > div div[class*="text-amber-300"],
body.light-theme #feedbackHallOfFameContent > div > div:nth-child(4) > div:nth-child(2) > div div[class*="text-amber-300"] {
  color: #0F766E !important;
}

/* 14. Hall of Fame Headings & Idea Cards */
html[data-theme="light"] #feedbackHallOfFameContent h4,
body.light-theme #feedbackHallOfFameContent h4 {
  color: #0F2530 !important;
}

html[data-theme="light"] .feedback-hof-idea-card,
body.light-theme .feedback-hof-idea-card {
  background: linear-gradient(135deg, #F0FDFA 0%, #FFFFFF 100%) !important;
  border: 1px solid #99F6E4 !important;
  box-shadow: 0 1px 3px rgba(15, 37, 48, 0.04) !important;
}

html[data-theme="light"] .feedback-hof-idea-card h5,
body.light-theme .feedback-hof-idea-card h5 {
  color: #0F2530 !important;
}

/* 15. Global Header Action Capsule Button (/html/body/emotionshield-header/header/div/div[2]/a) */
html[data-theme="light"] .site-header.emotionshield-global-header .capsule-btn,
body.light-theme .site-header.emotionshield-global-header .capsule-btn,
html[data-theme="light"] emotionshield-header .capsule-btn,
body.light-theme emotionshield-header .capsule-btn,
html[data-theme="light"] #esHeaderNavActions a.capsule-btn,
body.light-theme #esHeaderNavActions a.capsule-btn {
  background: #FFFFFF !important;
  border: 1.5px solid #0F766E !important;
  color: #0F766E !important;
  box-shadow: 0 2px 8px rgba(15, 118, 110, 0.12) !important;
  font-weight: 800 !important;
}

html[data-theme="light"] .site-header.emotionshield-global-header .capsule-btn:hover,
body.light-theme .site-header.emotionshield-global-header .capsule-btn:hover,
html[data-theme="light"] emotionshield-header .capsule-btn:hover,
body.light-theme emotionshield-header .capsule-btn:hover,
html[data-theme="light"] #esHeaderNavActions a.capsule-btn:hover,
body.light-theme #esHeaderNavActions a.capsule-btn:hover {
  background: #F0FDFA !important;
  border-color: #0D9488 !important;
  color: #115E59 !important;
  box-shadow: 0 4px 12px rgba(15, 118, 110, 0.2) !important;
}

html[data-theme="light"] .site-header.emotionshield-global-header .capsule-btn i,
body.light-theme .site-header.emotionshield-global-header .capsule-btn i,
html[data-theme="light"] emotionshield-header .capsule-btn i,
body.light-theme emotionshield-header .capsule-btn i {
  color: #0F766E !important;
}

html[data-theme="light"] .site-header.emotionshield-global-header .capsule-btn span,
body.light-theme .site-header.emotionshield-global-header .capsule-btn span,
html[data-theme="light"] emotionshield-header .capsule-btn span,
body.light-theme emotionshield-header .capsule-btn span {
  color: #0F766E !important;
  font-weight: 800 !important;
}

/* 16. Evidence Review Sign-off Modal Legal Notice Box (/html/body/div[18]/div/div[2]/div[1]) */
html[data-theme="light"] #evidenceReviewLegalNoticeBox,
body.light-theme #evidenceReviewLegalNoticeBox,
html[data-theme="light"] #evidenceReviewModal .bg-amber-950\/20,
body.light-theme #evidenceReviewModal .bg-amber-950\/20,
html[data-theme="light"] #evidenceReviewModal .bg-amber-500\/10,
body.light-theme #evidenceReviewModal .bg-amber-500\/10 {
  background-color: #FEF3C7 !important;
  border: 1px solid #FCD34D !important;
  color: #78350F !important;
  box-shadow: 0 1px 4px rgba(180, 83, 9, 0.08) !important;
}

html[data-theme="light"] #evidenceReviewLegalNoticeBox div.font-bold,
body.light-theme #evidenceReviewLegalNoticeBox div.font-bold,
html[data-theme="light"] #evidenceReviewModal div:has(> i.fa-scale-balanced) {
  color: #92400E !important;
  font-weight: 800 !important;
}

html[data-theme="light"] #evidenceReviewLegalNoticeBox i.fa-scale-balanced,
body.light-theme #evidenceReviewLegalNoticeBox i.fa-scale-balanced {
  color: #B45309 !important;
}

html[data-theme="light"] #evidenceReviewLegalNoticeBox p,
body.light-theme #evidenceReviewLegalNoticeBox p {
  color: #78350F !important;
  font-weight: 500 !important;
}

html[data-theme="light"] #evidenceReviewLegalNoticeBox strong,
body.light-theme #evidenceReviewLegalNoticeBox strong {
  color: #451A03 !important;
  font-weight: 800 !important;
  text-decoration-color: rgba(180, 83, 9, 0.6) !important;
}

/* 17. Evidence Review Modal Preview Card (/html/body/div[18]/div/div[2]/div[2]) */
html[data-theme="light"] #reviewSummaryPreviewCard,
body.light-theme #reviewSummaryPreviewCard {
  background-color: #FFFFFF !important;
  border-color: #D1E4E6 !important;
  box-shadow: 0 1px 4px rgba(15, 37, 48, 0.05) !important;
}

html[data-theme="light"] #reviewSummaryPreviewCard span#reviewPreviewCardTitle,
body.light-theme #reviewSummaryPreviewCard span#reviewPreviewCardTitle {
  color: #0F766E !important;
  font-weight: 800 !important;
}

html[data-theme="light"] #reviewSummaryPreviewCard #reviewPreviewDateTime,
body.light-theme #reviewSummaryPreviewCard #reviewPreviewDateTime {
  color: #0F2530 !important;
}

html[data-theme="light"] #reviewPreviewSummary,
body.light-theme #reviewPreviewSummary,
html[data-theme="light"] #reviewPreviewDetail,
body.light-theme #reviewPreviewDetail {
  background-color: #F8FAFA !important;
  border-color: #E2ECEE !important;
  color: #0F2530 !important;
}














/* --------------------------------------------------------------------------
   Certificate Transfer Modal Footer Background (#certificateTransferModal)
   -------------------------------------------------------------------------- */
html[data-theme="light"] #certificateTransferModal > div > div:nth-child(3),
body.light-theme #certificateTransferModal > div > div:nth-child(3) {
  background-color: #FFFFFF !important;
  border-top-color: #E2ECEE !important;
}

html[data-theme="light"] #certificateTransferModal > div > div:nth-child(3) button:first-child,
body.light-theme #certificateTransferModal > div > div:nth-child(3) button:first-child {
  background-color: #F1F5F9 !important;
  border-color: #CBD5E1 !important;
  color: #334155 !important;
}

/* --------------------------------------------------------------------------
   Early Bird Beta Promo Modal Light Theme (#earlyBirdPromoModal)
   화이트 모드에서 밝고 깨끗한 화이트 카드 및 선명한 텍스트 가독성 완벽 지원
   -------------------------------------------------------------------------- */
html[data-theme="light"] #earlyBirdPromoModal,
body.light-theme #earlyBirdPromoModal {
  background-color: rgba(15, 37, 48, 0.5) !important;
  backdrop-filter: blur(8px) !important;
}

html[data-theme="light"] #earlyBirdPromoModal > div,
body.light-theme #earlyBirdPromoModal > div {
  background: #FFFFFF !important;
  background-image: none !important;
  border: 1px solid #D1E4E6 !important;
  box-shadow: 0 20px 40px rgba(15, 37, 48, 0.15), 0 4px 12px rgba(15, 37, 48, 0.08) !important;
  color: #0F2530 !important;
}

html[data-theme="light"] #earlyBirdPromoModal .animate-bounce,
body.light-theme #earlyBirdPromoModal .animate-bounce {
  background-color: #FFF2EE !important;
  border-color: #FCDAD0 !important;
  color: #DE866D !important;
  box-shadow: 0 4px 12px rgba(222, 134, 109, 0.2) !important;
}

html[data-theme="light"] #earlyBirdPromoModal h3,
html[data-theme="light"] #earlyBirdPromoModal #earlyBirdModalTitle,
body.light-theme #earlyBirdPromoModal #earlyBirdModalTitle {
  color: #0F2530 !important;
  text-shadow: none !important;
}

html[data-theme="light"] #earlyBirdPromoModal p,
body.light-theme #earlyBirdPromoModal p {
  color: #334E58 !important;
}

html[data-theme="light"] #earlyBirdPromoModal strong,
body.light-theme #earlyBirdPromoModal strong {
  color: #0F2530 !important;
}

/* Benefit Checklist Box */
html[data-theme="light"] #earlyBirdPromoModal .bg-\[\#1A3A4B\]\/40,
html[data-theme="light"] #earlyBirdPromoModal div[class*="bg-[#1A3A4B]"],
body.light-theme #earlyBirdPromoModal div[class*="bg-[#1A3A4B]"] {
  background-color: #F4F8F8 !important;
  border-color: #D1E4E6 !important;
}

html[data-theme="light"] #earlyBirdPromoModal div[class*="bg-[#1A3A4B]"] div,
body.light-theme #earlyBirdPromoModal div[class*="bg-[#1A3A4B]"] div,
html[data-theme="light"] #earlyBirdPromoModal div[class*="bg-[#1A3A4B]"] span,
body.light-theme #earlyBirdPromoModal div[class*="bg-[#1A3A4B]"] span {
  color: #174557 !important;
}

html[data-theme="light"] #earlyBirdPromoModal div[class*="bg-[#1A3A4B]"] .font-bold span,
body.light-theme #earlyBirdPromoModal div[class*="bg-[#1A3A4B]"] .font-bold span {
  color: #0F2530 !important;
}

/* Bottom Footer & CTA Button */
html[data-theme="light"] #earlyBirdPromoModal div.border-t,
body.light-theme #earlyBirdPromoModal div.border-t {
  border-top-color: #E2ECEE !important;
}

html[data-theme="light"] #earlyBirdPromoModal button[onclick*="completeEarlyBirdAndPrint"],
body.light-theme #earlyBirdPromoModal button[onclick*="completeEarlyBirdAndPrint"] {
  background: linear-gradient(135deg, #DE866D 0%, #CE6F55 100%) !important;
  color: #FFFFFF !important;
  box-shadow: 0 4px 14px rgba(222, 134, 109, 0.35) !important;
}

/* --------------------------------------------------------------------------
   Compliance Consent Modal Light Theme (#complianceModal)
   화이트 모드에서 밝고 깨끗한 모달 카드, 텍스트 가독성 및 확약 버튼 고대비 최적화
   -------------------------------------------------------------------------- */
html[data-theme="light"] #complianceModal,
body.light-theme #complianceModal {
  background-color: rgba(15, 37, 48, 0.5) !important;
  backdrop-filter: blur(8px) !important;
}

html[data-theme="light"] #complianceModal > div,
body.light-theme #complianceModal > div {
  background: #FFFFFF !important;
  border: 1px solid #D1E4E6 !important;
  box-shadow: 0 20px 40px rgba(15, 37, 48, 0.15), 0 4px 12px rgba(15, 37, 48, 0.08) !important;
  color: #0F2530 !important;
}

/* Header */
html[data-theme="light"] #complianceModal div.border-b,
body.light-theme #complianceModal div.border-b {
  border-bottom-color: #E2ECEE !important;
  background-color: #FFFFFF !important;
}

html[data-theme="light"] #complianceModal #complianceModalTitle,
body.light-theme #complianceModal #complianceModalTitle {
  color: #0F2530 !important;
}

html[data-theme="light"] #complianceModal button[onclick*="closeComplianceModal"],
body.light-theme #complianceModal button[onclick*="closeComplianceModal"] {
  color: #64748B !important;
}
html[data-theme="light"] #complianceModal button[onclick*="closeComplianceModal"]:hover,
body.light-theme #complianceModal button[onclick*="closeComplianceModal"]:hover {
  color: #0F2530 !important;
}

/* Body Items & Text */
html[data-theme="light"] #complianceModal div.border-t,
body.light-theme #complianceModal div.border-t {
  border-top-color: #E2ECEE !important;
}

html[data-theme="light"] #complianceModal p,
body.light-theme #complianceModal p {
  color: #334E58 !important;
}

html[data-theme="light"] #complianceModal strong,
body.light-theme #complianceModal strong {
  color: #0F2530 !important;
}

html[data-theme="light"] #complianceModal div.font-bold.text-white,
body.light-theme #complianceModal div.font-bold.text-white {
  color: #0F2530 !important;
}

/* Checkbox Agreement Wrap */
html[data-theme="light"] #complianceCheckboxWrap,
body.light-theme #complianceCheckboxWrap {
  background-color: #F4F8F8 !important;
  border-color: #D1E4E6 !important;
}

html[data-theme="light"] #complianceCheckboxLabel,
body.light-theme #complianceCheckboxLabel {
  color: #174557 !important;
}

html[data-theme="light"] #complianceCheckboxLabel strong,
body.light-theme #complianceCheckboxLabel strong {
  color: #0F2530 !important;
}

/* Footer & Compliance Agree Button (Disabled vs Active) */
html[data-theme="light"] #complianceModal div.border-t.flex-shrink-0,
body.light-theme #complianceModal div.border-t.flex-shrink-0 {
  background-color: #F8FAFC !important;
  border-top-color: #E2ECEE !important;
}

html[data-theme="light"] #complianceAgreeBtn:disabled,
body.light-theme #complianceAgreeBtn:disabled {
  background: #E2E8F0 !important;
  border-color: #CBD5E1 !important;
  color: #64748B !important;
  opacity: 1 !important;
  box-shadow: none !important;
}

html[data-theme="light"] #complianceAgreeBtn:disabled i,
html[data-theme="light"] #complianceAgreeBtn:disabled span,
body.light-theme #complianceAgreeBtn:disabled i,
body.light-theme #complianceAgreeBtn:disabled span {
  color: #64748B !important;
}

html[data-theme="light"] #complianceAgreeBtn:not(:disabled),
body.light-theme #complianceAgreeBtn:not(:disabled) {
  background: linear-gradient(135deg, #1A7B88 0%, #146570 100%) !important;
  color: #FFFFFF !important;
  box-shadow: 0 4px 14px rgba(26, 123, 136, 0.35) !important;
}

html[data-theme="light"] #complianceAgreeBtn:not(:disabled) i,
html[data-theme="light"] #complianceAgreeBtn:not(:disabled) span,
body.light-theme #complianceAgreeBtn:not(:disabled) i,
body.light-theme #complianceAgreeBtn:not(:disabled) span {
  color: #FFFFFF !important;
}

html[data-theme="light"] #complianceFooterText,
body.light-theme #complianceFooterText {
  color: #64748B !important;
}

/* --------------------------------------------------------------------------
   Evidence Access Policy Modal Light Theme (#evidenceAccessPolicyModal)
   화이트 모드에서 인가된 이메일 목록 고대비 및 선명한 가독성 보장
   -------------------------------------------------------------------------- */
html[data-theme="light"] #evidenceAccessPolicyModal > div,
body.light-theme #evidenceAccessPolicyModal > div {
  background-color: #FFFFFF !important;
  border-color: #D1E4E6 !important;
  color: #0F2530 !important;
}

html[data-theme="light"] #evidenceAccessPolicyModal .bg-slate-900,
body.light-theme #evidenceAccessPolicyModal .bg-slate-900 {
  background-color: #F8FAFC !important;
  border-color: #E2E8F0 !important;
}

html[data-theme="light"] #evidenceAccessPolicyModal #allowedEmailsListContainer span.text-white,
body.light-theme #evidenceAccessPolicyModal #allowedEmailsListContainer span.text-white,
html[data-theme="light"] #evidenceAccessPolicyModal .eap-email-item-email,
body.light-theme #evidenceAccessPolicyModal .eap-email-item-email {
  color: #0F2530 !important;
  font-weight: 800 !important;
  font-size: 15.5px !important;
}

html[data-theme="light"] #evidenceAccessPolicyModal .eap-email-item,
body.light-theme #evidenceAccessPolicyModal .eap-email-item {
  background-color: #F8FAFC !important;
  border-color: #CBD5E1 !important;
}

html[data-theme="light"] #evidenceAccessPolicyModal #allowedEmailsListContainer p,
body.light-theme #evidenceAccessPolicyModal #allowedEmailsListContainer p {
  color: #475569 !important;
}

html[data-theme="light"] #evidenceAccessPolicyModal #allowedEmailsListContainer button.bg-slate-800,
body.light-theme #evidenceAccessPolicyModal #allowedEmailsListContainer button.bg-slate-800 {
  background-color: #E2E8F0 !important;
  border-color: #CBD5E1 !important;
  color: #1E293B !important;
}
html[data-theme="light"] #evidenceAccessPolicyModal #allowedEmailsListContainer button.bg-slate-800:hover,
body.light-theme #evidenceAccessPolicyModal #allowedEmailsListContainer button.bg-slate-800:hover {
  background-color: #CBD5E1 !important;
  color: #0F172A !important;
}

/* --------------------------------------------------------------------------
   32. Counter Script Legal Risk Notice Banner Light Theme (#safeScriptNoticeBanner)
   -------------------------------------------------------------------------- */
html[data-theme="light"] #safeScriptNoticeBanner,
body.light-theme #safeScriptNoticeBanner {
  background-color: #FEF3C7 !important;
  border: 1px solid #FCD34D !important;
  color: #78350F !important;
  box-shadow: 0 1px 4px rgba(180, 83, 9, 0.08) !important;
}

html[data-theme="light"] #safeScriptNoticeBanner strong.text-amber-300,
body.light-theme #safeScriptNoticeBanner strong.text-amber-300 {
  color: #92400E !important;
  font-weight: 800 !important;
}

html[data-theme="light"] #safeScriptNoticeBanner i.fa-shield-halved,
body.light-theme #safeScriptNoticeBanner i.fa-shield-halved {
  color: #D97706 !important;
}

html[data-theme="light"] #safeScriptNoticeBanner span.text-white,
body.light-theme #safeScriptNoticeBanner span.text-white {
  color: #0F2530 !important;
  font-weight: 700 !important;
}

html[data-theme="light"] #safeScriptNoticeBanner span.text-slate-400,
body.light-theme #safeScriptNoticeBanner span.text-slate-400 {
  color: #92400E !important;
  opacity: 0.85;
}

html[data-theme="light"] #safeScriptNoticeBanner strong.text-\[\#38A3A5\],
body.light-theme #safeScriptNoticeBanner strong.text-\[\#38A3A5\] {
  color: #0D9488 !important;
  font-weight: 800 !important;
}

/* --------------------------------------------------------------------------
   33. Safe Script Copy Modal Light Theme (#safeScriptCopyModal)
   -------------------------------------------------------------------------- */
html[data-theme="light"] #safeScriptCopyModal > div,
body.light-theme #safeScriptCopyModal > div {
  background-color: #FFFFFF !important;
  border-color: #D1E4E6 !important;
  box-shadow: 0 20px 40px -8px rgba(15, 37, 48, 0.25) !important;
}

html[data-theme="light"] #safeScriptCopyModal div.bg-\[\#0F2530\],
body.light-theme #safeScriptCopyModal div.bg-\[\#0F2530\] {
  background-color: #F8FAFC !important;
  border-color: #E2E8F0 !important;
}

html[data-theme="light"] #safeScriptCopyModal h3,
body.light-theme #safeScriptCopyModal h3 {
  color: #0F2530 !important;
}

html[data-theme="light"] #safeScriptCopyModal p.text-slate-400,
body.light-theme #safeScriptCopyModal p.text-slate-400 {
  color: #64748B !important;
}

html[data-theme="light"] #safeScriptCopyModal button[onclick*="closeSafeScriptCopyModal"],
body.light-theme #safeScriptCopyModal button[onclick*="closeSafeScriptCopyModal"] {
  background-color: #E2E8F0 !important;
  color: #475569 !important;
}
html[data-theme="light"] #safeScriptCopyModal button[onclick*="closeSafeScriptCopyModal"]:hover,
body.light-theme #safeScriptCopyModal button[onclick*="closeSafeScriptCopyModal"]:hover {
  background-color: #CBD5E1 !important;
  color: #0F172A !important;
}

html[data-theme="light"] #safeScriptCopyModal .bg-amber-500\/10,
body.light-theme #safeScriptCopyModal .bg-amber-500\/10 {
  background-color: #FEF3C7 !important;
  border-color: #FCD34D !important;
  color: #78350F !important;
}

html[data-theme="light"] #safeScriptCopyModal .bg-amber-500\/10 strong.text-amber-300,
body.light-theme #safeScriptCopyModal .bg-amber-500\/10 strong.text-amber-300 {
  color: #92400E !important;
}

html[data-theme="light"] #safeScriptCopyModal label.bg-\[\#0F2530\]\/60,
body.light-theme #safeScriptCopyModal label.bg-\[\#0F2530\]\/60 {
  background-color: #F8FAFC !important;
  border-color: #E2E8F0 !important;
}
html[data-theme="light"] #safeScriptCopyModal label.bg-\[\#0F2530\]\/60:hover,
body.light-theme #safeScriptCopyModal label.bg-\[\#0F2530\]\/60:hover {
  border-color: #38A3A5 !important;
  background-color: #F0FDFA !important;
}

html[data-theme="light"] #safeScriptCopyModal label strong.text-white,
body.light-theme #safeScriptCopyModal label strong.text-white {
  color: #0F2530 !important;
}

html[data-theme="light"] #safeScriptCopyModal label div.text-slate-200,
body.light-theme #safeScriptCopyModal label div.text-slate-200 {
  color: #334E58 !important;
}

html[data-theme="light"] #safeScriptCopyModal div.bg-\[\#0B1B22\],
body.light-theme #safeScriptCopyModal div.bg-\[\#0B1B22\] {
  background-color: #F8FAFC !important;
  border-color: #E2E8F0 !important;
}

html[data-theme="light"] #safeScriptCopyModal button[onclick*="proceedToEditScript"],
body.light-theme #safeScriptCopyModal button[onclick*="proceedToEditScript"] {
  background-color: #FFFFFF !important;
  border-color: #CBD5E1 !important;
  color: #1A7B88 !important;
}
html[data-theme="light"] #safeScriptCopyModal button[onclick*="proceedToEditScript"]:hover,
body.light-theme #safeScriptCopyModal button[onclick*="proceedToEditScript"]:hover {
  background-color: #F0FDFA !important;
  border-color: #38A3A5 !important;
  color: #0F2530 !important;
}

