/* overrides.css?v=2025-08-27-08 — 편차 해결 + 재발 방지 */

/* ===== 푸터 영어 텍스트 Richmond Display 강제 적용 (최고 우선순위) ===== */
.powered-by-enhanced span[style*="richmond-display"],
.powered-by-enhanced span[style*="Richmond Display"] {
  font-family: var(--font-title) !important;
  color: #ffffff !important;
  font-weight: 800 !important;
}

/* ===== 푸터 영어 텍스트 Richmond Display 강제 적용 (최고 우선순위) ===== */

/* ===== 🖤 전체 다크 테마 통일 (최고 우선순위) ===== */
html, body, #root, .App {
  background: #000000 !important;
  background-color: #000000 !important;
  color: #ffffff !important;
}

/* 메인 페이지 배경도 검정색으로 */
.main-page,
.hero-section,
.main-container,
[class*="main"],
[class*="hero"] {
  background: #000000 !important;
  background-color: #000000 !important;
}

/* 헤더 완전 검정 통일 */
.header,
.nav-header,
.top-nav,
[class*="header"],
[class*="nav"] {
  background: #000000 !important;
  background-color: #000000 !important;
  border-bottom: none !important;
}

/* 푸터 완전 검정 통일 */
.footer,
.bottom-nav,
.footer-section,
[class*="footer"],
[class*="bottom"] {
  background: #000000 !important;
  background-color: #000000 !important;
  border-top: none !important;
}

/* 로그인 버튼 테두리 진하게 (메뉴 박스 수준) */
button:contains("로그인"),
[class*="login"] button,
.nav-button:contains("로그인") {
  background: rgba(0, 0, 0, 0.95) !important;
  border: 1px solid rgba(255, 255, 255, 0.25) !important; /* 메뉴 박스와 동일한 굵기 */
  color: #ffffff !important;
  border-radius: 12px !important;
  padding: 1rem 1.5rem !important;
}

button:contains("로그인"):hover {
  border: 1px solid rgba(255, 255, 255, 0.4) !important;
  background: rgba(0, 0, 0, 1) !important;
}

/* 중간 줄을 중심으로 위아래 정렬 */
.footer-section {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: space-around !important;
  min-height: 200px !important;
}

/* Contact/Social/Portfolio를 줄 위쪽에 */
.footer-buttons-top {
  order: 1 !important;
  margin-bottom: 1rem !important;
}

/* 명함과 Visit를 줄 아래쪽에 */
.footer-buttons-bottom {
  order: 3 !important;
  margin-top: 1rem !important;
}

/* 중간 줄 자체는 그대로 두되 투명하게 */
.footer hr,
.footer-divider {
  order: 2 !important;
  opacity: 0.1 !important;
  height: 1px !important;
  background: rgba(255, 255, 255, 0.1) !important;
}

/* "전 세계 누구나 참여 가능" - 뒷 배경 완전 제거 + 검정색 강제 */
.participation-desc,
p:contains("전 세계 누구나"),
[class*="participation"],
*:contains("전 세계 누구나") {
  background: rgba(0, 0, 0, 0.95) !important;
  background-color: rgba(0, 0, 0, 0.95) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  border-radius: 25px !important;
  padding: 0.8rem 1.5rem !important;
  
  /* 클릭 유도 그림자 */
  box-shadow: 
    0 6px 20px rgba(0, 0, 0, 0.5),
    0 3px 10px rgba(0, 0, 0, 0.3),
    0 1px 4px rgba(255, 255, 255, 0.1) !important;
  
  backdrop-filter: blur(10px) !important;
}

/* 모든 배경 이미지나 그라디언트 제거 */
.participation-desc::before,
.participation-desc::after,
[class*="participation"]::before,
[class*="participation"]::after {
  display: none !important;
  background: none !important;
}

/* Contact/Social/Portfolio 강력하게 파란하늘색으로 변경! */
*[class*="social-link"],
a[href*="contact"], 
a[href*="social"],
a[href*="portfolio"],
button:contains("Contact"),
button:contains("Social"),
button:contains("Portfolio") {
  background: linear-gradient(135deg, #87CEEB 0%, #B0E0E6 100%) !important;
  background-color: #87CEEB !important;
  color: #000000 !important;
  border: 1px solid #4682B4 !important;
  box-shadow: 0 4px 15px rgba(135, 206, 235, 0.5) !important;
}

/* 🔥 DISABLED: NaverAuth 충돌 방지
* {
  border-top: none !important;
  border-bottom: none !important;
}
*/

/* 푸터 간격 원상복구 - 모든 간격 조정 코드 제거 */

/* NATG 원칙 버튼 - 흰색 박스 */
button:has-text("NATG"),
[class*="natg"] button,
[href*="natg"],
.natg-button {
  background: rgba(255, 255, 255, 0.95) !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  color: #000000 !important;
  
  /* 클릭 유도를 위한 강한 그림자 */
  box-shadow: 
    0 10px 30px rgba(0, 0, 0, 0.6),
    0 6px 15px rgba(0, 0, 0, 0.4),
    0 3px 8px rgba(255, 255, 255, 0.1) !important;
    
  border-radius: 12px !important;
  padding: 1rem 1.5rem !important;
}

/* 3대 챌린지 버튼 - 95% 검정색 (무지개 제거) */
button:has-text("3대 챌린지"),
[class*="challenge"] button {
  background: rgba(0, 0, 0, 0.95) !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  color: #ffffff !important;
  
  /* 클릭 유도를 위한 강한 그림자 */
  box-shadow: 
    0 10px 30px rgba(0, 0, 0, 0.6),
    0 6px 15px rgba(0, 0, 0, 0.4),
    0 3px 8px rgba(255, 255, 255, 0.1) !important;
    
  border-radius: 12px !important;
  padding: 1rem 1.5rem !important;
}

/* NATG 버튼 호버 - 더 밝은 흰색 */
.natg-button:hover,
button:has-text("NATG"):hover {
  background: rgba(255, 255, 255, 1) !important;
  color: #000000 !important;
  border: 1px solid rgba(0, 0, 0, 0.1) !important;
  
  /* 호버시 더 강한 그림자 */
  box-shadow: 
    0 15px 40px rgba(255, 255, 255, 0.3),
    0 8px 20px rgba(255, 255, 255, 0.2),
    0 4px 12px rgba(0, 0, 0, 0.1) !important;
    
  transform: translateY(-4px) !important;
}

/* 3대 챌린지 버튼 호버 - 완전 검정 + 글래스모피즘 */
button:has-text("3대 챌린지"):hover {
  background: rgba(0, 0, 0, 1) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  border: 1px solid rgba(255, 255, 255, 0.3) !important;
  
  /* 호버시 더 강한 그림자 */
  box-shadow: 
    0 15px 40px rgba(0, 0, 0, 0.7),
    0 8px 20px rgba(0, 0, 0, 0.5),
    0 4px 12px rgba(255, 255, 255, 0.15) !important;
    
  transform: translateY(-4px) !important;
}

/* ===== 🖤 안정적인 메뉴 시스템 (최고 우선순위) ===== */
.nav-cards-grid {
  position: absolute !important;
  top: 100% !important;
  left: 50% !important;
  /* 완전한 중앙 정렬 - transform 제거로 떨림 해결 */
  margin-left: -300px !important; /* width 600px의 절반 */
  transform: none !important; /* 떨림의 원인 완전 제거 */
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 1rem !important;
  background: rgba(0, 0, 0, 0.95) !important; /* 검정색으로 통일 */
  backdrop-filter: blur(20px) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 15px !important;
  padding: 1.5rem !important;
  z-index: 50 !important;
  min-width: 600px !important;
  width: 600px !important;
  
  /* 애니메이션 완전 제거 - 안정성 확보 */
  animation: none !important;
  transition: none !important;
}

@keyframes stableSlideDown {
  from {
    opacity: 0;
    transform: translateX(-50%) translateY(-10px); /* 살짝만 위에서 내려옴 */
  }
  to {
    opacity: 1;
    transform: translateX(-50%) translateY(0); /* 최종 위치 */
  }
}

/* 🚫 메뉴 버튼 떨림 완전 차단! */
.nav-card {
  background: rgba(0, 0, 0, 0.9) !important; /* 검정색으로 통일 */
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 15px !important;
  padding: 1.5rem !important;
  text-align: center !important;
  backdrop-filter: blur(10px) !important;
  cursor: pointer !important;
  
  /* 모든 애니메이션과 트랜스폼 완전 제거 */
  transition: none !important;
  transform: none !important;
  animation: none !important;
  
  /* 고정된 위치 - 절대 움직이지 않음 */
  position: static !important;
  will-change: auto !important;
}

.nav-card:hover,
.nav-card:focus,
.nav-card:active {
  /* 호버시에도 절대 움직이지 않음 - 색상만 변경 */
  background: rgba(20, 20, 20, 0.95) !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
  
  /* 모든 변형 효과 완전 차단 */
  transform: none !important;
  transition: none !important;
  animation: none !important;
  
  /* 그림자도 최소한으로 */
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
}

/* 버튼 내부 요소들도 고정 */
.nav-card-icon,
.nav-card-title {
  transform: none !important;
  transition: none !important;
  animation: none !important;
  position: static !important;
}

.nav-card-title {
  color: #ffffff !important;
  font-weight: 600 !important;
  font-size: 0.95rem !important;
}

.nav-card-icon {
  font-size: 2rem !important;
  margin-bottom: 0.5rem !important;
}

/* ===== 🖤 세련된 검정색 + 선택적 그림자 시스템 (최고 우선순위) ===== */

/* 기본 박스들 - 그림자 없는 깔끔한 검정 */
.participant-count,
.search-container,
.filter-container,
.stats-box,
[class*="info"],
[class*="count"] {
  background: rgba(0, 0, 0, 0.8) !important;
  border: 1px solid rgba(255, 255, 255, 0.05) !important;
  box-shadow: none !important; /* 그림자 없음 - 미니멀 */
  backdrop-filter: blur(10px) !important;
}

/* 강조할 주요 박스들 - 미세한 그림자로 포인트 */
.premium-tab-card,
.premium-tab-card.active,
.challenge-card,
.main-content-card,
[class*="card"]:not([class*="info"]) {
  background: rgba(0, 0, 0, 0.85) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  box-shadow: 
    0 4px 20px rgba(0, 0, 0, 0.3),
    0 1px 3px rgba(255, 255, 255, 0.05) !important; /* 미세한 하이라이트 */
  backdrop-filter: blur(15px) !important;
}

/* 호버시 그림자 살짝 강화 */
.premium-tab-card:hover,
.challenge-card:hover,
[class*="card"]:hover:not([class*="info"]) {
  background: rgba(0, 0, 0, 0.9) !important;
  box-shadow: 
    0 6px 25px rgba(0, 0, 0, 0.4),
    0 2px 5px rgba(255, 255, 255, 0.08) !important;
  transform: translateY(-1px) !important; /* 미세한 플로팅 */
}

/* 모든 버튼 통일 */
.back-button,
.intro-page .back-button,
.premium-back-button,
button:not(.btn-primary):not(.btn-accent),
[class*="btn"]:not(.btn-primary):not(.btn-accent) {
  background: rgba(0, 0, 0, 0.9) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #ffffff !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5) !important;
}

/* ===== 전역 링크 밑줄 제거 (최우선) ===== */
a, a:hover, a:focus, a:active, a:visited {
  text-decoration: none !important;
  text-decoration-line: none !important;
  text-decoration-color: transparent !important;
  border-bottom: none !important;
  border: none !important;
  outline: none !important;
}

/* ===== Visit 버튼 강제 글래스모피즘 (최고 우선순위) ===== */
.btn-glass,
a.btn-glass,
a[href*="wisdomlinkstudio.com"],
.visit-btn,
a.visit-btn {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 14px 34px !important;
  height: 70px !important;
  min-height: 70px !important;
  font-weight: 700 !important;
  font-size: 1.1rem !important;
  color: #FFFFFF !important;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.8) !important;

  /* 매우 강한 글래스모피즘 */
  background: rgba(100, 181, 246, 0.7) !important;
  backdrop-filter: blur(25px) saturate(200%) !important;
  -webkit-backdrop-filter: blur(25px) saturate(200%) !important;
  border: 3px solid rgba(100, 181, 246, 0.9) !important;

  /* 강력한 그림자 */
  box-shadow:
    0 15px 40px rgba(0, 0, 0, 0.8),
    0 8px 20px rgba(100, 181, 246, 0.6),
    inset 0 2px 0 rgba(255, 255, 255, 0.5) !important;

  border-radius: 16px !important;
  transition: all 0.3s ease !important;
  text-decoration: none !important;
  gap: 0.5rem !important;
  white-space: nowrap !important;
  cursor: pointer !important;
}

/* 기존 스타일 주석 처리 */
/*
.btn-wls-glass{
  position:relative; isolation:isolate;
  background: rgba(255,255,255,0.06) !important;
  color:#E6EAF2 !important;
  border: 1.5px solid rgba(110,168,255,.45) !important;
  border-radius: 14px !important;
  padding: 14px 18px !important;
  font-weight: 800 !important;
  letter-spacing: .2px;
  box-shadow:
    0 20px 55px rgba(0,0,0,.55),
    0 8px 24px rgba(110,168,255,.28) !important;
  backdrop-filter: blur(18px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(160%) !important;
  outline: 3px solid rgba(110,168,255,.35) !important;
  outline-offset: 2px !important;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
  will-change: transform, box-shadow, backdrop-filter;
  text-shadow: 0 1px 0 rgba(0,0,0,.35);
}
*/

.visit-btn, 
a.visit-btn,
a[href*="wisdomlinkstudio.com"] {
  background: linear-gradient(145deg, rgba(100, 181, 246, 0.85), rgba(33, 150, 243, 0.7)) !important;
  border: 3px solid rgba(100, 181, 246, 0.95) !important;
  box-shadow: 
    0 15px 40px rgba(0, 0, 0, 0.8), 
    0 8px 20px rgba(100, 181, 246, 0.6), 
    inset 0 3px 0 rgba(255, 255, 255, 0.5),
    inset 0 -2px 0 rgba(0, 0, 0, 0.3) !important;
  backdrop-filter: blur(25px) saturate(200%) !important;
  color: #FFFFFF !important;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.8) !important;
  font-weight: 800 !important;
}

.visit-btn:hover,
a.visit-btn:hover,
a[href*="wisdomlinkstudio.com"]:hover {
  background: linear-gradient(145deg, rgba(100, 181, 246, 1.0), rgba(33, 150, 243, 0.9)) !important;
  border: 3px solid rgba(100, 181, 246, 1.0) !important;
  box-shadow: 
    0 20px 50px rgba(0, 0, 0, 0.9), 
    0 12px 30px rgba(100, 181, 246, 0.8),
    inset 0 4px 0 rgba(255, 255, 255, 0.6) !important;
  transform: translateY(-3px) scale(1.02) !important;
}

/* ===== 버튼 클래스 기반 스타일 시스템 (JS 인라인 대체) ===== */
.btn-pill, .site-header button, button {
  height: 44px;
  border-radius: 999px;
  padding: 0 14px;
  font-weight: 600;
  border: none;
  cursor: pointer;
  transition: filter 0.2s cubic-bezier(0.2, 0.8, 0.2, 1), transform 0.15s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.btn-primary, .btn-menu, .btn-challenge {
  background: linear-gradient(135deg, #00BCD4 0%, #64B5F6 50%, #E94560 100%) !important;
  color: #FFFFFF !important;
  box-shadow: 0 4px 15px rgba(0, 188, 212, 0.3) !important;
}

.btn-secondary, .btn-login {
  background: linear-gradient(135deg, #64B5F6 0%, #42A5F5 100%) !important;
  color: #FFFFFF !important;
  box-shadow: 0 4px 15px rgba(100, 181, 246, 0.3) !important;
}

.btn-accent, .btn-natg {
  background: linear-gradient(135deg, #FFD700 0%, #FFC107 100%) !important;
  color: #1A1A2E !important;
  box-shadow: 0 4px 15px rgba(255, 215, 0, 0.3) !important;
}

.btn-pill:hover, .site-header button:hover, button:hover {
  filter: brightness(1.05) !important;
}

.btn-pill:active, .site-header button:active, button:active {
  transform: translateY(1px) !important;
}

/* 사회적 링크 호버 효과 (JS 인라인 대체) */
.social-link:hover {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.15)) !important;
  transform: translateY(-2px) !important;
}

/* ===== 토큰(스코프 내부에서만 사용) ===== */
html[data-page]{
  --fng-surface: rgba(36,39,43,.72);
  --fng-border: rgba(255,255,255,.2); /* 더 보이는 테두리 */
  --fng-text: #ffffff;
  --fng-dim: #B0BEC5;
  --fng-gold-1:#FFE082; --fng-gold-2:#FFD54F; --fng-gold-3:#FFC400;
  --fng-red:#FF5722; /* NEW/Featured */
}

/* ===== HOF (명예의 전당) ===== */
html[data-page="hall-of-fame"] .premium-hall-tab-card,
html[data-page="hall-of-fame"] .hall-stat-card,
html[data-page="hall-of-fame"] .hall-fame-card{
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02))!important;
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  border:1px solid var(--fng-border)!important; 
  box-shadow:0 8px 24px rgba(0,0,0,.35)!important; 
  color:var(--fng-text)!important;
}

/* 구형 파랑 오버레이/인라인 제거 */
html[data-page="hall-of-fame"] .premium-hall-tab-card::before,
html[data-page="hall-of-fame"] .hall-stat-card::before,
html[data-page="hall-of-fame"] .hall-fame-card::before,
html[data-page="hall-of-fame"] .premium-hall-tab-card::after,
html[data-page="hall-of-fame"] .hall-stat-card::after,
html[data-page="hall-of-fame"] .hall-fame-card::after{ 
  background:none!important; 
}

html[data-page="hall-of-fame"] .premium-hall-tab-card[style*="background"],
html[data-page="hall-of-fame"] .hall-stat-card[style*="background"],
html[data-page="hall-of-fame"] .hall-fame-card[style*="background"]{ 
  background:transparent!important; 
  background-image:none!important; 
}

/* 수상 배지=골드, 칩/태그=회색 */
html[data-page="hall-of-fame"] .winner-badge{
  background:linear-gradient(135deg,var(--fng-gold-1),var(--fng-gold-2) 45%,var(--fng-gold-3))!important;
  color:#1B1B1B!important; 
  border:1px solid rgba(0,0,0,.12)!important;
}

html[data-page="hall-of-fame"] .tag,
html[data-page="hall-of-fame"] .chip,
html[data-page="hall-of-fame"] .pill,
html[data-page="hall-of-fame"] .hall-fame-card .tag,
html[data-page="hall-of-fame"] .hall-stat-card .tag,
html[data-page="hall-of-fame"] .hall-fame-card .chip,
html[data-page="hall-of-fame"] .hall-stat-card .chip{
  background:rgba(255,255,255,.08)!important; 
  border:1px solid var(--fng-border)!important; 
  color:var(--fng-dim)!important;
}

/* ===== 방송보기 (VOD) ===== */
html[data-page="broadcast"] .vod-card{
  background:var(--fng-surface)!important; 
  border:1px solid var(--fng-border)!important;
  box-shadow:0 8px 24px rgba(0,0,0,.35)!important; 
  color:var(--fng-text)!important;
}

html[data-page="broadcast"] .vod-card .tag,
html[data-page="broadcast"] .tag{ 
  background:rgba(255,255,255,.08)!important; 
  border:1px solid var(--fng-border)!important; 
  color:var(--fng-dim)!important; 
}

html[data-page="broadcast"] .badge-new, 
html[data-page="broadcast"] .badge-featured{ 
  background:var(--fng-red)!important; 
  color:#fff!important; 
}

/* ===== 3대 챌린지 카드 내부 요소 완전 통일 (인라인 스타일 대체) ===== */
.premium-tab-btn {
  color: #FFFFFF !important;
  width: 100% !important;
  height: 100% !important;
  background: transparent !important;
  border: none !important;
  padding: 2rem 1.5rem !important;
  cursor: pointer !important;
  text-align: center !important;
}

.premium-tab-icon {
  font-size: 2.5rem !important;
  margin-bottom: 1rem !important;
  display: block !important;
  color: #FFFFFF !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25) !important;
}

.premium-tab-title {
  font-weight: 700 !important;
  color: #FFFFFF !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25) !important;
  font-size: 1.1rem !important;
  margin-bottom: 0.5rem !important;
  line-height: 1.4 !important;
}

.premium-tab-subtitle {
  opacity: 0.9 !important;
  color: #FFFFFF !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25) !important;
  font-size: 0.9rem !important;
}

/* ===== 명예의 전당을 순위 보기와 완전히 동일하게 만들기 ===== */
html[data-page="hall-of-fame"] .premium-tab-card,
body[data-page="hall-of-fame"] .premium-tab-card {
  /* 원래 크기로 복구 */
  width: 240px !important;
  height: 318.7px !important;
  padding: 12px 20px !important;
  margin: 8px !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  border-radius: 12px !important;
  
  /* 순위 보기와 동일한 배경 */
  background: rgba(50, 50, 50, 0.8) !important;
  box-shadow: rgba(0, 0, 0, 0.4) 0px 8px 24px 0px !important;
  
  color: #FFFFFF !important;
  transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1) !important;
  position: relative !important;
  z-index: 1 !important;
  
  /* 글래스모피즘 제거 - 원상복구 */
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* ===== 명예의 전당 ACTIVE 상태 - 원래대로 App.css가 처리 ===== */
/* 하드코딩된 파란색 강제 적용 제거 */

/* ===== 명예의 전당 검은 박스 - 순위 보기와 정확히 동일 ===== */
html[data-page="hall-of-fame"] .premium-tab-subtitle,
body[data-page="hall-of-fame"] .premium-tab-subtitle {
  /* 순위보기 측정값 그대로 적용 */
  background: rgba(0, 0, 0, 0.8) !important;
  padding: 8px 16px !important;
  border-radius: 8px !important;
  font-size: 13.6px !important;
  line-height: 2.5 !important;
  text-align: center !important;
  display: block !important;
  opacity: 0.9 !important;
  color: rgb(255, 255, 255) !important;
  text-shadow: rgba(0, 0, 0, 0.8) 0px 1px 3px !important;
  box-sizing: border-box !important;
  max-width: 90% !important;
  margin: 8px auto 0px auto !important;
  width: fit-content !important;
}

/* ===== 명예의 전당 검은 박스 (순위 보기와 완전 동일) ===== */
html[data-page="hall-of-fame"] .premium-tab-subtitle,
body[data-page="hall-of-fame"] .premium-tab-subtitle {
  /* 순위 보기 검은 박스와 완전히 동일한 크기 */
  width: 84.61px !important;
  height: 62.22px !important;
  background: rgba(0, 0, 0, 0.8) !important;
  padding: 8px 16px !important;
  margin: 8px auto 0px auto !important;
  border-radius: 8px !important;
  font-size: 13.6px !important;
  text-align: center !important;
  line-height: 1.2 !important;
  
  /* 기본 텍스트 스타일 */
  opacity: 0.9 !important;
  color: #FFFFFF !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25) !important;
  
  /* 박스 배치 */
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  
  /* 박스 크기를 콘텐츠에 맞춤 */
  box-sizing: border-box !important;
  min-width: 84.61px !important;
  min-height: 62.22px !important;
}

html[data-page="ranking"] .premium-tab-card::before,
html[data-page="ranking"] .premium-tab-card::after,
html[data-page="hall-of-fame"] .premium-tab-card::before,
html[data-page="hall-of-fame"] .premium-tab-card::after,
body[data-page="ranking"] .premium-tab-card::before,
body[data-page="ranking"] .premium-tab-card::after,
body[data-page="hall-of-fame"] .premium-tab-card::before,
body[data-page="hall-of-fame"] .premium-tab-card::after{ 
  background:none!important; 
  content: none !important;
  border: none !important;
  box-shadow: none !important;
}

/* ===== 3대 챌린지 카드 기본 스타일 ===== */
html[data-page="ranking"] .challenge-tab-relay,
html[data-page="ranking"] .challenge-tab-ai-battle,  
html[data-page="ranking"] .challenge-tab-story,
html[data-page="hall-of-fame"] .challenge-tab-relay,
html[data-page="hall-of-fame"] .challenge-tab-ai-battle,
html[data-page="hall-of-fame"] .challenge-tab-story,
body[data-page="ranking"] .challenge-tab-relay,
body[data-page="ranking"] .challenge-tab-ai-battle,
body[data-page="ranking"] .challenge-tab-story,
body[data-page="hall-of-fame"] .challenge-tab-relay,
body[data-page="hall-of-fame"] .challenge-tab-ai-battle,
body[data-page="hall-of-fame"] .challenge-tab-story {
  /* App.css에서 사용하는 강력한 글래스모피즘과 완전 동일 */
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0.05) 100%) !important;
  backdrop-filter: blur(25px) saturate(200%) !important;
  -webkit-backdrop-filter: blur(25px) saturate(200%) !important;
  border-radius: 20px !important;
}

/* ===== 🚀 이전 NEO의 GPU 가속 최적화 완전 적용 ===== */

@layer overrides {
  /* CSS 토큰 정의 - 색상 일관성 보장 */
  :root {
    --title-gradient: linear-gradient(135deg, #ffffff, #64ffda);
    --highlight-gradient: linear-gradient(135deg, #FFB300, #FF7A00);
    --title-shadow: 2px 2px 4px rgba(0,0,0,0.1);
    --premium-font: 'var(--font-paperlogy)';
  }

  /* 헤더 타이틀 완전 통일 - 깔끔한 흰색으로 */
  :is(.ranking-header, .broadcast-header) .page-title.premium-title.main-title-enhanced.hero-title {
    color: #ffffff !important; /* 단순한 흰색 */
    font-size: 68px !important; /* 통일된 크기 */
    font-weight: 600 !important; /* 통일된 굵기 */
    font-family: var(--premium-font);
    text-align: center;
    margin: 0 0 0.5rem 0;
    line-height: 1.2;
    display: block;
  }

  /* 🎯 overrides.css 헤더 타이틀 모바일 반응형 */
  @media (max-width: 768px) {
    :is(.ranking-header, .broadcast-header) .page-title.premium-title.main-title-enhanced.hero-title {
      font-size: 42px !important; /* 68px → 42px */
    }
  }

  @media (max-width: 480px) {
    :is(.ranking-header, .broadcast-header) .page-title.premium-title.main-title-enhanced.hero-title {
      font-size: 36px !important; /* 42px → 36px */
    }
  }

  /* 하이라이트 단어 전용 클래스 - 모든 페이지에서 재사용 */
  .highlight {
    background: var(--highlight-gradient);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    font-weight: 900;
  }

  /* 서브타이틀 통일 */
  :is(.ranking-header, .broadcast-header) .premium-tab-subtitle {
    font-size: 1rem;
    color: #64ffda;
    font-family: var(--premium-font);
    text-align: center;
    margin: 0.5rem 0 1rem 0;
  }

  /* 인라인 스타일 방어 - 헤더 영역에서 인라인 스타일 차단 */
  :is(.ranking-header, .broadcast-header) *[style] {
    all: revert-layer;
  }

/* 3대 챌린지 카테고리 GPU 가속 강제 */
.premium-tab-card,
.challenge-tab-relay,
.challenge-tab-ai-battle,
.challenge-tab-story {
  will-change: transform, box-shadow !important; /* GPU 가속 강제 */
  transform: translateZ(0) !important; /* GPU 레이어 강제 생성 */
}

/* 작품 카드 GPU 가속 강제 */
.ranking-item-compact,
.hall-item-compact,
.vod-card {
  will-change: transform, box-shadow !important;
  transform: translateZ(0) !important;
}

/* 통계 카드 GPU 가속 강제 */
.compact-stat-item {
  will-change: transform, box-shadow !important;
  transform: translateZ(0) !important;
}

/* 버튼 전역 최적화 */
button,
.premium-back-button,
.submit-button,
.action-btn {
  will-change: transform, box-shadow !important;
  transform: translateZ(0) !important;
}

/* 호버 애니메이션 최적화 */
.premium-tab-card:hover,
.ranking-item-compact:hover,
.compact-stat-item:hover,
button:hover {
  transform: translateZ(0) translateY(-3px) scale(1.02) !important; /* GPU 레이어 유지 */
}

/* ===== 릴레이 챌린지 - 틸/시아너 그림자 ===== */
html[data-page="ranking"] .challenge-tab-relay,
html[data-page="hall-of-fame"] .challenge-tab-relay,
body[data-page="ranking"] .challenge-tab-relay,
body[data-page="hall-of-fame"] .challenge-tab-relay {
  border: 1.5px solid rgba(59, 130, 246, 0.3) !important;
  box-shadow: 
    0 25px 60px rgba(0, 0, 0, 0.8),
    0 15px 35px rgba(59, 130, 246, 0.2),
    0 8px 20px rgba(59, 130, 246, 0.15),
    0 0 0 1px rgba(59, 130, 246, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.2),
    inset 0 -1px 0 rgba(255, 255, 255, 0.05) !important;
}

/* ===== AI 배틀 챌린지 - 퍼플 그림자 ===== */
html[data-page="ranking"] .challenge-tab-ai-battle,
html[data-page="hall-of-fame"] .challenge-tab-ai-battle,
body[data-page="ranking"] .challenge-tab-ai-battle,
body[data-page="hall-of-fame"] .challenge-tab-ai-battle {
  border: 1.5px solid rgba(168, 85, 247, 0.3) !important;
  box-shadow: 
    0 25px 60px rgba(0, 0, 0, 0.8),
    0 15px 35px rgba(168, 85, 247, 0.2),
    0 8px 20px rgba(168, 85, 247, 0.15),
    0 0 0 1px rgba(168, 85, 247, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.2),
    inset 0 -1px 0 rgba(255, 255, 255, 0.05) !important;
}

/* ===== 감동 스토리 챌린지 - 오렌지 그림자 ===== */
html[data-page="ranking"] .challenge-tab-story,
html[data-page="hall-of-fame"] .challenge-tab-story,
body[data-page="ranking"] .challenge-tab-story,
body[data-page="hall-of-fame"] .challenge-tab-story {
  border: 1.5px solid rgba(251, 146, 60, 0.3) !important;
  box-shadow: 
    0 25px 60px rgba(0, 0, 0, 0.8),
    0 15px 35px rgba(251, 146, 60, 0.2),
    0 8px 20px rgba(251, 146, 60, 0.15),
    0 0 0 1px rgba(251, 146, 60, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.2),
    inset 0 -1px 0 rgba(255, 255, 255, 0.05) !important;

  transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1) !important;
  position: relative;
  z-index: 1;
}

/* ===== 강력한 파랑 차단 (구형 컴포넌트 대응) ===== */
html[data-page="hall-of-fame"] *[style*="#64B5F6"],
html[data-page="hall-of-fame"] *[style*="rgb(100, 181, 246)"],
html[data-page="broadcast"] *[style*="#64B5F6"],
html[data-page="broadcast"] *[style*="rgb(100, 181, 246)"],
html[data-page="ranking"] *[style*="#64B5F6"]:not(.btn):not(.button):not(.cta),
html[data-page="ranking"] *[style*="rgb(100, 181, 246)"]:not(.btn):not(.button):not(.cta){
  background: var(--fng-surface) !important;
  background-color: var(--fng-surface) !important;
}

/* ===== 범용 구형 클래스 차단 ===== */
html[data-page="hall-of-fame"] .bg-blue-500,
html[data-page="hall-of-fame"] .bg-primary,
html[data-page="broadcast"] .bg-blue-500,
html[data-page="broadcast"] .bg-primary,
html[data-page="ranking"] .bg-blue-500:not(.btn):not(.button):not(.cta),
html[data-page="ranking"] .bg-primary:not(.btn):not(.button):not(.cta){
  background: var(--fng-surface) !important;
}

/* ── Social Link Red-Line Killer — scope-safe override ── */
/* html/body 어느 쪽에 data-page가 붙어도 동작 */
:where(html[data-page], body[data-page]) a.social-link,
:where(html[data-page], body[data-page]) .social-link[href],
:where(html[data-page], body[data-page]) a.visit-btn,
:where(html[data-page], body[data-page]) .visit-btn[href]{
  /* UA 기본값 제거 */
  text-decoration: none !important;
  text-decoration-color: transparent !important;
  border: 0 !important;
  outline: none !important;
  box-shadow: none !important;
  background-image: none !important; /* 일부 테마 밑줄 */
  -webkit-appearance: none;
  appearance: none;
  -webkit-tap-highlight-color: transparent; /* 모바일 탭 하이라이트 */
}

/* hover/active에도 밑줄/보더 재등장 방지 */
:where(html[data-page], body[data-page]) a.social-link:hover,
:where(html[data-page], body[data-page]) a.social-link:active,
:where(html[data-page], body[data-page]) a.visit-btn:hover,
:where(html[data-page], body[data-page]) a.visit-btn:active{
  text-decoration: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* 커스텀 언더라인(보통 after/before로 긋는 밑줄) 무력화 */
:where(html[data-page], body[data-page]) a.social-link::before,
:where(html[data-page], body[data-page]) a.social-link::after,
:where(html[data-page], body[data-page]) a.visit-btn::before,
:where(html[data-page], body[data-page]) a.visit-btn::after{
  content: none !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
}

/* 키보드 접근성은 유지: focus-visible만 우리 톤으로 */
:where(html[data-page], body[data-page]) a.social-link:focus,
:where(html[data-page], body[data-page]) a.visit-btn:focus{ outline: none !important; }
:where(html[data-page], body[data-page]) a.social-link:focus-visible,
:where(html[data-page], body[data-page]) a.visit-btn:focus-visible{
  outline: 2px solid var(--fng-border) !important; /* 중성 톤 */
  outline-offset: 2px;
}

/* 일부 브라우저의 포커스 링 강제색 제거 */
:where(html[data-page], body[data-page]) a.social-link::-moz-focus-inner,
:where(html[data-page], body[data-page]) a.visit-btn::-moz-focus-inner{ border: 0 !important; }

/* ========= Visit WisdomLink Studio 버튼만 글래스모피즘 ========= */
#wisdomlink-cta-강제 {
  /* ESG 3.0 박스와 동일한 글래스모피즘 */
  background-color: rgba(255, 255, 255, 0.08) !important;
  border: 2px solid rgba(255, 215, 0, 0.4) !important;
  border-radius: 12px !important;
  backdrop-filter: blur(15px) !important;
  -webkit-backdrop-filter: blur(15px) !important;
  
  /* ESG 박스와 동일한 골드 그림자 */
  box-shadow: 
    0 6px 20px rgba(255, 215, 0, 0.3),
    0 0 0 1px rgba(255, 215, 0, 0.2) !important;
  
  /* ESG 박스와 동일한 필터 */
  filter: 
    drop-shadow(0 0 12px rgba(255, 215, 0, 0.5))
    drop-shadow(0 2px 6px rgba(0, 0, 0, 0.9))
    drop-shadow(1px 1px 3px rgba(0, 0, 0, 0.8))
    drop-shadow(-1px -1px 3px rgba(0, 0, 0, 0.8)) !important;
    
  /* 크기와 정렬 */
  height: 70px !important;
  min-height: 70px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 1rem 1.5rem !important;
  
  /* ESG 박스와 완전 동일한 골드 그라데이션 텍스트 */
  background: linear-gradient(135deg, #FFFFFF 0%, #FFD700 50%, #FFA500 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  
  font-weight: 600 !important;
  font-size: 1.1rem !important;
  
  /* ESG 박스와 동일한 강화된 검은 그림자 */
  filter: 
    drop-shadow(0 0 12px rgba(255, 215, 0, 0.5))
    drop-shadow(0 2px 6px rgba(0, 0, 0, 0.9))
    drop-shadow(1px 1px 3px rgba(0, 0, 0, 0.8))
    drop-shadow(-1px -1px 3px rgba(0, 0, 0, 0.8)) !important;
  
  transition: all 0.3s ease !important;
  transform: none !important;
}

#wisdomlink-cta-강제:hover {
  /* 호버시 더 강한 효과 */
  background-color: rgba(255, 255, 255, 0.12) !important;
  border: 2px solid rgba(255, 215, 0, 0.6) !important;
  transform: translateY(-2px) !important;
  
  /* 강화된 박스 그림자 */
  box-shadow: 
    0 8px 25px rgba(255, 215, 0, 0.4),
    0 0 0 1px rgba(255, 215, 0, 0.3) !important;
  
  /* 호버시 텍스트는 동일한 그라데이션 유지 */
  background: linear-gradient(135deg, #FFFFFF 0%, #FFD700 50%, #FFA500 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  
  /* 호버시 더 강한 텍스트 그림자 */
  filter: 
    drop-shadow(0 0 16px rgba(255, 215, 0, 0.6))
    drop-shadow(0 3px 8px rgba(0, 0, 0, 0.9))
    drop-shadow(2px 2px 4px rgba(0, 0, 0, 0.8))
    drop-shadow(-2px -2px 4px rgba(0, 0, 0, 0.8)) !important;
}

/* Contact/Social/Portfolio - 스카이블루 강제 적용 (최고 우선순위) */
a[href*="contact@wisdomlinkstudio.com"],
a[href*="social.wisdomlink"],
a[href*="portfolio.wisdomlink"],
.social-link:not(#wisdomlink-cta-강제) {
  /* 인라인 스타일 완전 존중 - 스카이블루 그라데이션 */
  background: linear-gradient(135deg, #87CEEB, #B0E0E6) !important;
  color: #FFFFFF !important;
  
  /* 크기 축소 제거 - 원래 크기로 복원 */
  transform: none !important;
  transform-origin: center !important;
  
  /* 기본 패딩과 모양 유지 */
  padding: 0.8rem 1.5rem !important;
  border-radius: 12px !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  
  /* 미세한 테두리 */
  border: 1px solid rgba(135, 206, 235, 0.4) !important;
  
  /* 스카이블루 그림자 시스템 */
  box-shadow: 
    0 8px 32px rgba(135, 206, 235, 0.3),
    0 4px 16px rgba(135, 206, 235, 0.2),
    0 2px 8px rgba(135, 206, 235, 0.1) !important;
  
  /* 부드러운 전환 */
  transition: all 0.3s ease !important;
  
  /* 기본 크기 속성 */
  height: auto !important;
  min-height: auto !important;
  max-height: none !important;
  line-height: 1.4 !important;
  
  /* 플렉스 정렬 유지 */
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.5rem !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
  cursor: pointer !important;
}

/* 호버시 스카이블루 강화 */
a[href*="contact@wisdomlinkstudio.com"]:hover,
a[href*="social.wisdomlink"]:hover,
a[href*="portfolio.wisdomlink"]:hover,
.social-link:not(#wisdomlink-cta-강제):hover {
  /* 호버시도 스카이블루 유지하되 더 밝게 */
  background: linear-gradient(135deg, #00BFFF, #87CEEB) !important;
  color: #FFFFFF !important;
  
  /* 크기 변경 없이 살짝 위로만 */
  transform: translateY(-2px) !important;
  
  /* 강화된 스카이블루 그림자 */
  box-shadow: 
    0 12px 48px rgba(135, 206, 235, 0.4),
    0 8px 24px rgba(135, 206, 235, 0.3),
    0 4px 12px rgba(135, 206, 235, 0.2) !important;
    
  /* 테두리도 더 밝게 */
  border: 1px solid rgba(135, 206, 235, 0.6) !important;
}

/* ========= 모든 페이지 로그인 버튼 검은색 완전 통일 ========= */
/* 홈페이지 포함 모든 페이지에서 로그인 버튼을 검정색으로 통일 */

/* 모든 페이지 로그인 버튼 - 검은색 통일 스타일 */
button:last-child,
.login-button,
.login-btn,
header button:last-child,
.header-right button:last-child,
.top-nav button:last-child,
[class*="login"],
html button:last-child,
body button:last-child {
  background: rgba(20,20,20,0.9) !important;
  color: #FFFFFF !important;
  border: 1px solid rgba(255,255,255,0.4) !important;
  border-radius: 8px !important;
  padding: 10px 18px !important;
  font-weight: 600 !important;
  backdrop-filter: blur(12px) !important;
  box-shadow: 0 6px 18px rgba(0,0,0,0.6) !important;
  transition: all 0.2s ease !important;
}

button:last-child:hover,
.login-button:hover,
header button:last-child:hover,
html button:last-child:hover {
  background: rgba(0,0,0,0.95) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.7) !important;
  border: 1px solid rgba(255,255,255,0.6) !important;
}

/* ========= 2,3,4번 페이지 적절한 배경 복구 ========= */
/* 너무 강하게 지운 배경들을 적절히 복구 */

/* 순위보기 + 명예의전당 하단 텍스트 검정 박스 통일 (최고 우선순위) */
html[data-page="ranking"] body .premium-tab-subtitle,
html[data-page="hall-of-fame"] body .premium-tab-subtitle,
body[data-page="ranking"] .premium-tab-subtitle,
body[data-page="hall-of-fame"] .premium-tab-subtitle {
  background: rgba(0,0,0,0.8) !important;
  color: #FFFFFF !important;
  padding: 8px 16px !important;
  border-radius: 8px !important;
  font-size: 13.6px !important;
  font-weight: 500 !important;
  margin: 8px auto 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: fit-content !important;
  max-width: 90% !important;
  text-align: center !important;
  line-height: 1.8 !important;
  min-height: 50px !important;
  /* 명예의 전당 강제 CSS 무력화 */
  background-clip: unset !important;
  -webkit-background-clip: unset !important;
  -webkit-text-fill-color: #FFFFFF !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.6) !important;
}
html[data-page="ranking"] .challenge-tab,
html[data-page="ranking"] .premium-tab-card,
html[data-page="ranking"] .tab-button,
body[data-page="ranking"] .challenge-tab,
body[data-page="ranking"] .premium-tab-card,
body[data-page="ranking"] .tab-button {
  background: rgba(50,50,50,0.8) !important;
  color: #FFFFFF !important;
  border: 1px solid rgba(255,255,255,0.2) !important;
  border-radius: 12px !important;
  backdrop-filter: blur(12px) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.4) !important;
  padding: 12px 20px !important;
  margin: 8px !important;
}

/* 명예의전당 다른 카드들 - premium-tab-card는 제외 */
html[data-page="hall-of-fame"] .hall-stat-card:not(.premium-tab-card),
html[data-page="hall-of-fame"] .hall-fame-card:not(.premium-tab-card),
html[data-page="hall-of-fame"] .premium-hall-tab-card:not(.premium-tab-card),
body[data-page="hall-of-fame"] .hall-stat-card:not(.premium-tab-card),
body[data-page="hall-of-fame"] .hall-fame-card:not(.premium-tab-card) {
  background: rgba(40,40,40,0.9) !important;
  color: #FFFFFF !important;
  border: 1px solid rgba(255,255,255,0.2) !important;
  border-radius: 16px !important;
  backdrop-filter: blur(12px) !important;
  box-shadow: 0 12px 32px rgba(0,0,0,0.5) !important;
  padding: 20px !important;
  margin: 12px !important;
}

/* 명예의전당 모든 텍스트 흰색으로 강제 변경 (검정박스 텍스트 제외) */
html[data-page="hall-of-fame"] *:not(.premium-tab-subtitle),
body[data-page="hall-of-fame"] *:not(.premium-tab-subtitle) {
  color: #FFFFFF !important;
  text-shadow: 0 1px 3px rgba(0,0,0,0.8) !important;
}

/* 명예의전당 탭 버튼 텍스트도 흰색 */
html[data-page="hall-of-fame"] .premium-hall-tab-card *,
html[data-page="hall-of-fame"] .hall-stat-card *,
html[data-page="hall-of-fame"] .hall-fame-card *,
body[data-page="hall-of-fame"] .premium-hall-tab-card *,
body[data-page="hall-of-fame"] .hall-stat-card *,
body[data-page="hall-of-fame"] .hall-fame-card * {
  color: #FFFFFF !important;
  background-clip: unset !important;
  -webkit-background-clip: unset !important;
  -webkit-text-fill-color: unset !important;
}

/* 방송보기 카드들 - 보이게 복구 */
html[data-page="broadcast"] .vod-card,
body[data-page="broadcast"] .vod-card {
  background: rgba(35,35,35,0.9) !important;
  color: #FFFFFF !important;
  border: 1px solid rgba(255,255,255,0.2) !important;
  border-radius: 16px !important;
  backdrop-filter: blur(12px) !important;
  box-shadow: 0 12px 32px rgba(0,0,0,0.5) !important;
  padding: 20px !important;
  margin: 12px !important;
}

/* 모든 텍스트 가독성 확보 */
html[data-page="ranking"] h1,
html[data-page="ranking"] h2,
html[data-page="ranking"] h3,
html[data-page="ranking"] p,
html[data-page="hall-of-fame"] h1,
html[data-page="hall-of-fame"] h2,
html[data-page="hall-of-fame"] h3,
html[data-page="hall-of-fame"] p,
html[data-page="broadcast"] h1,
html[data-page="broadcast"] h2,
html[data-page="broadcast"] h3,
html[data-page="broadcast"] p {
  color: #FFFFFF !important;
  text-shadow: 0 1px 3px rgba(0,0,0,0.8) !important;
}

/* 기존 완벽한 Visit 버튼은 절대 건드리지 않기 */
#wisdomlink-cta-강제 {
  /* 원래 완벽한 스타일 완전 보호 */
}

/* ==== Route-scoped Visual System (0827d) ==== */

/* 공통 중성 토큰(다크 배경 유지) */
:root{
  --bg:#0B0D12;             /* 다크 블랙 */
  --surface:#131725;        /* 라이트 서피스 */
  --text:#E8ECF4;           /* 본문 화이트 */
  --muted:#9AA4B2;          /* 보조 텍스트 */
  --border:#2A3142;         /* 경계선 */
  --white-10:rgba(255,255,255,.10);
  --white-20:rgba(255,255,255,.20);
  --white-30:rgba(255,255,255,.30);
}

/* 공통 베이스 */
html,body{background:var(--bg);color:var(--text)}
.card,.panel,.container{
  background:var(--surface); color:var(--text);
  border:1px solid var(--border); border-radius:16px; padding:24px;
  box-shadow:0 6px 24px rgba(0,0,0,.24), 0 2px 8px rgba(0,0,0,.16);
}

/* =====================[ 홈 = VIP ESG 골드 허용 ]===================== */
.route-home .esg-gold,           /* ESG 3.0 박스에 이 클래스 추천 */
.route-home #wls-cta {           /* Visit WisdomLink Studio™ 버튼 id 권장 */
  position:relative; isolation:isolate;
  background: linear-gradient(150deg, rgba(198,164,75,.22), rgba(255,255,255,.08)) padding-box !important;
  border: 3px solid rgba(198,164,75,.92) !important;
  color:#FFF7E0 !important;
  backdrop-filter: blur(20px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
  box-shadow: 0 26px 70px rgba(0,0,0,.65), 0 12px 32px rgba(198,164,75,.28) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.45) !important;
  border-radius:14px; padding:14px 20px; font-weight:800; letter-spacing:.2px;
}

/* 기존 Visit 버튼 스타일 보호 - 새 시스템 적용 안함 */
#wisdomlink-cta-강제 {
  /* 기존 완벽한 스타일 유지 - 건드리지 말것 */
}

.route-home #wls-cta:hover,
.route-home .esg-gold:hover{
  transform:translateY(-2px); background:rgba(255,255,255,.14) !important;
}
.route-home #wls-cta:focus-visible,
.route-home .esg-gold:focus-visible{ outline:3px solid rgba(198,164,75,.65); outline-offset:2px }

/* ==================[ 세컨더리(2·3·4번 페이지) = 중성 미니멀 ]================== */
/* 색상 최소화: 화이트/라이트그레이만 사용, 공간/타이포/그림자로 레벨링 */

/* 2,3,4번 페이지 모든 버튼 중성화 (Visit 버튼 제외) */
.route-secondary a:not(#wisdomlink-cta-강제), 
.route-secondary .btn:not(#wisdomlink-cta-강제), 
.route-secondary button:not(#wisdomlink-cta-강제){
  color: var(--text) !important;          /* 브랜드 컬러 배제 */
  background: var(--white-10) !important; /* 은은한 화이트 글래스 */
  border: 1px solid var(--white-20) !important;
  border-radius: 12px; padding: 12px 16px; font-weight: 700;
  backdrop-filter: blur(12px) saturate(140%) !important;
  -webkit-backdrop-filter: blur(12px) saturate(140%) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.35);
}

.route-secondary a:not(#wisdomlink-cta-강제):hover,
.route-secondary .btn:not(#wisdomlink-cta-강제):hover,
.route-secondary button:not(#wisdomlink-cta-강제):hover{
  background: var(--white-20) !important; 
  transform: translateY(-1px);
}

/* 2,3,4번 페이지 카드/레이아웃 통일 */
.route-secondary .card:not(.premium-brand-logo),
.route-secondary .panel,
.route-secondary .container,
.route-secondary .premium-tab-card,
.route-secondary .hall-stat-card,
.route-secondary .hall-fame-card,
.route-secondary .vod-card,
.route-secondary .ranking-card {
  background: rgba(255,255,255,.08) !important;
  border: 1px solid var(--white-20) !important;
  box-shadow: 0 12px 36px rgba(0,0,0,.40) !important;
  border-radius: 16px !important;
}

/* 2,3,4번 페이지 텍스트 계층 (크기/굵기로만) - 돋보기 제외 */
.route-secondary h1{font-size:56px;line-height:1.2;margin:32px 0 16px; color: var(--text) !important;}
.route-secondary h2{font-size:40px;line-height:1.25;margin:24px 0 12px; color: var(--text) !important;}
.route-secondary h3{font-size:32px;line-height:1.3;margin:20px 0 8px; color: var(--text) !important;}
.route-secondary p:not(.search-icon), .route-secondary li:not(.search-icon), .route-secondary div:not(.search-icon){font-size:16px;line-height:1.55;color:var(--text) !important;}

/* 돋보기 아이콘은 크기 제한 해제 - 직접 지정 */
.search-icon {
  font-size: 2.8rem !important;
  width: 42px !important;
  height: 42px !important;
}

/* 2,3,4번 페이지 탭 버튼들 중성화 */
.route-secondary .challenge-tab,
.route-secondary .premium-hall-tab-card,
.route-secondary .tab-button {
  background: var(--white-10) !important;
  border: 1px solid var(--white-20) !important;
  color: var(--text) !important;
  box-shadow: 0 6px 18px rgba(0,0,0,.25) !important;
}

.route-secondary .challenge-tab:hover,
.route-secondary .premium-hall-tab-card:hover,
.route-secondary .tab-button:hover {
  background: var(--white-20) !important;
  transform: translateY(-1px) !important;
}

/* 2,3,4번 페이지 액션 버튼들 중성화 */
.route-secondary .action-btn,
.route-secondary .like-btn,
.route-secondary .share-btn,
.route-secondary .comment-btn {
  background: var(--white-10) !important;
  border: 1px solid var(--white-20) !important;
  color: var(--text) !important;
}

/* 2,3,4번 페이지 그라디언트/강한 색상 제거 */
.route-secondary [class*="gradient"],
.route-secondary .glass:not(#wisdomlink-cta-강제), 
.route-secondary .frosted:not(#wisdomlink-cta-강제){
  background: var(--white-10) !important; 
  backdrop-filter: blur(12px) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.3) !important;
}

/* 2,3,4번 페이지 표/폼 중성 카드 */
.route-secondary table,
.route-secondary form,
.route-secondary .form-group {
  background: rgba(255,255,255,.08) !important;
  border: 1px solid var(--white-20) !important;
  border-radius: 16px !important;
  box-shadow: 0 12px 36px rgba(0,0,0,.40) !important;
}

/* Visit WisdomLink Studio 버튼은 70px 높이 강제 유지 */

/* Contact/Social/Portfolio 버튼들은 건드리지 않음 - 원래 스타일 유지 */

/* ========= Visit WisdomLink Studio 버튼만 글래스모피즘 ========= */

/* === Footer Hairline Kill (v2025-08-28) === */

/* hr 및 구분선 완전 제거 */
:root body :is(footer,#site-footer,[data-footer]) hr {
  display: none !important;
  height: 0 !important;
  border: 0 !important;
  background: none !important;
}

/* 테일윈드/유틸리티 border 계열 무력화 (푸터 한정) */
:root body :is(footer,#site-footer,[data-footer]) [class*="border-"],
:root body :is(footer,#site-footer,[data-footer]) [class~="border"],
:root body :is(footer,#site-footer,[data-footer]) [class*="divide-"] {
  border: 0 !important;
  box-shadow: none !important;
}

/* 그라디언트/헤어라인 유발 배경 제거 (Visit 버튼과 브랜드 텍스트 제외) */
:root body :is(footer,#site-footer,[data-footer]) *:not(#wisdomlink-cta-강제):not(.brand-highlight):not([class*="brand"]),
:root body :is(footer,#site-footer,[data-footer]) *:not(#wisdomlink-cta-강제):not(.brand-highlight):not([class*="brand"])::before,
:root body :is(footer,#site-footer,[data-footer]) *:not(#wisdomlink-cta-강제):not(.brand-highlight):not([class*="brand"])::after {
  border-image: initial !important;
  outline: 0 !important;
  -webkit-font-smoothing: antialiased;
  backface-visibility: hidden;
}

/* 일반 요소들만 헤어라인 제거 (중요한 디자인 요소 제외) */
:root body :is(footer,#site-footer,[data-footer]) :is(.footer-bottom, .footer-content, .footer-links, .copyright):not(#wisdomlink-cta-강제):not(.brand-highlight) {
  background-image: none !important;
  box-shadow: none !important;
}

/* 잔여 클래스 무력화(현장 리포트 기반) */
:root body :is(footer,#site-footer,[data-footer]) :is(
  .glassmorphism-footer,
  .footer-bottom,
  .footer-divider,
  .nav-cards-grid,
  .table, table, th, td
) { border: 0 !important; box-shadow: none !important; }


:root body :is(footer,#site-footer,[data-footer]) .social-link:not(#wisdomlink-cta-강제) {
  background: linear-gradient(135deg, #87CEEB, #B0E0E6) !important;
  color: #FFFFFF !important;
  border: 0 !important;
  box-shadow: 0 8px 32px rgba(135, 206, 235, 0.3) !important;
}

:root body :is(footer,#site-footer,[data-footer]) .social-link:not(#wisdomlink-cta-강제):hover {
  background: linear-gradient(135deg, #00BFFF, #87CEEB) !important;
  color: #FFFFFF !important;
  box-shadow: 0 12px 48px rgba(135, 206, 235, 0.4) !important;
}

/* Visit WisdomLink Studio 버튼 완전 보호 및 복원 */
#wisdomlink-cta-강제 {
  /* 기존 골드 글래스모피즘 완전 복원 */
  background: rgba(255, 255, 255, 0.08) !important;
  border: 2px solid rgba(255, 215, 0, 0.4) !important;
  border-radius: 12px !important;
  backdrop-filter: blur(15px) !important;
  -webkit-backdrop-filter: blur(15px) !important;
  
  /* 골드 그라데이션 텍스트 복원 */
  background: linear-gradient(135deg, #FFFFFF 0%, #FFD700 50%, #FFA500 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  
  /* 골드 그림자 복원 */
  filter: 
    drop-shadow(0 0 12px rgba(255, 215, 0, 0.5))
    drop-shadow(0 2px 6px rgba(0, 0, 0, 0.9))
    drop-shadow(1px 1px 3px rgba(0, 0, 0, 0.8))
    drop-shadow(-1px -1px 3px rgba(0, 0, 0, 0.8)) !important;
    
  /* 골드 박스 그림자 복원 */
  box-shadow: 
    0 6px 20px rgba(255, 215, 0, 0.3),
    0 0 0 1px rgba(255, 215, 0, 0.2) !important;
}

/* 브랜드 하이라이트 텍스트 완전 보호 */
.brand-highlight,
span.brand-highlight,
[class*="brand-highlight"] {
  background: linear-gradient(135deg, #FFD700, #FFA500) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  font-weight: 700 !important;
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.8)) !important;
}

/* 메뉴 4개 챕터 카드 - 미니멀 클린 + 2배 강화 효과 (TV 방송급) */
.nav-card-icon,
.nav-card-title,
.nav-card-icon *,
.nav-card-title * {
  /* 이모지/텍스트 박스 테두리 완전 제거 */
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
}

.nav-card {
  /* 기본 그림자 2배 강화 */
  box-shadow: 
    0 8px 40px rgba(0, 0, 0, 0.6),
    0 2px 6px rgba(255, 255, 255, 0.1) !important;
}

.nav-card:hover {
  /* 호버 효과 2배 강화 */
  transform: translateY(-8px) scale(1.05) !important;
  
  /* 그림자 2배 강화 */
  box-shadow: 
    0 25px 80px rgba(0, 0, 0, 0.8),
    0 15px 40px rgba(0, 0, 0, 0.5),
    0 5px 15px rgba(100, 181, 246, 0.4) !important;
}

/* 북 편집 디자이너의 100,000점 완성 - 소제목-내용 간격 정밀 조정 */
.card-content b + br {
  line-height: 0.5 !important;
  font-size: 12px !important;
}

/* 특정 박스들의 소제목 다음 간격만 정확히 반으로 줄이기 */
.hyper-glass .card-content b + br,
.challenge-card .card-content b + br {
  line-height: 0.5 !important;
  display: block !important;
  height: 12px !important;
}

/* 3대 챌린지 버튼 텍스트 완벽 중앙 정렬 (최고 우선순위 강제) */
html body .submit-btn,
html body .view-btn,
[class*="submit-btn"],
[class*="view-btn"] {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 12px 24px !important;
  height: 48px !important;
  line-height: 1 !important;
  text-align: center !important;
  vertical-align: middle !important;
  box-sizing: border-box !important;
}