/*
Theme Name: WTU CampusHub
Theme URI: https://wtucampushub.com
Description: 武汉纺织大学技术社群平台 · 暖白极简
Version: 3.1
Author: WTU CampusHub
*/

/* ═══════════════════════════════════════════════════════════
   TOKEN SYSTEM — Warm White Minimal
   ═══════════════════════════════════════════════════════════ */
:root {
  --bg-primary:    #fafaf6;
  --bg-secondary:  #f3f3ee;
  --bg-tertiary:   #ebebe6;
  --bg-inverse:    #1a1a1a;

  --text-primary:   #1a1a1a;
  --text-secondary: #6b6b6b;
  --text-muted:     #9b9b9b;
  --text-inverse:   #fafaf6;

  --border-subtle:  #e6e6e0;
  --border-default: #d4d4ce;
  --border-strong:  #1a1a1a;

  --accent:       #1a1a1a;
  --accent-hover: #3d3d3d;
  --success:      #2d7d46;
  --warning:      #b45309;
  --danger:       #b91c1c;

  --font-display: "Inter", -apple-system, sans-serif;
  --font-body:    -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif;
  --font-mono:    "JetBrains Mono", "SF Mono", "Cascadia Code", monospace;

  --radius-xs: 4px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
}

/* ═══════════════════════════════════════════════════════════
   RESET & BASE
   ═══════════════════════════════════════════════════════════ */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; font-size:16px; -webkit-font-smoothing:antialiased; }
body {
  font-family: var(--font-body);
  background: var(--bg-primary);
  color: var(--text-primary);
  line-height: 1.75;
  overflow-x: hidden;
}

::selection { background: #1a1a1a; color: #fafaf6; }
:focus-visible { outline: 2px solid #1a1a1a; outline-offset: 2px; border-radius: 2px; }

a { color: var(--text-primary); text-decoration: none; }
a:hover { color: var(--text-secondary); }

img { max-width: 100%; height: auto; display: block; }

/* ═══════════════════════════════════════════════════════════
   TYPOGRAPHY
   ═══════════════════════════════════════════════════════════ */
h1, h2, h3, h4 { font-family: var(--font-display); font-weight: 700; letter-spacing: -0.025em; }
h1 { font-size: clamp(2.8rem, 6vw, 5rem); line-height: 1.06; }
h2 { font-size: clamp(2rem, 4vw, 3.2rem); line-height: 1.12; }
h3 { font-size: 1.2rem; font-weight: 600; letter-spacing: -0.015em; }

.section-label {
  font-family: var(--font-mono);
  font-size: 0.62rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: var(--text-muted);
  margin-bottom: 1rem;
}

/* ═══════════════════════════════════════════════════════════
   ANIMATION
   ═══════════════════════════════════════════════════════════ */
@keyframes fadeInUp {
  from { opacity:0; transform:translateY(20px); }
  to   { opacity:1; transform:translateY(0); }
}
.reveal {
  opacity:0; transform:translateY(20px);
  transition: opacity 0.6s var(--ease-out), transform 0.6s var(--ease-out);
}
.reveal.visible { opacity:1; transform:translateY(0); }
.reveal-delay-1 { transition-delay: 0.06s; }
.reveal-delay-2 { transition-delay: 0.12s; }
.reveal-delay-3 { transition-delay: 0.18s; }
.reveal-delay-4 { transition-delay: 0.24s; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ═══════════════════════════════════════════════════════════
   BUTTONS
   ═══════════════════════════════════════════════════════════ */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 2rem;
  font-family: var(--font-display);
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  border: 1.5px solid #1a1a1a;
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: all 0.2s;
  text-decoration: none;
}
.btn-primary {
  background: #1a1a1a;
  color: #fafaf6;
}
.btn-primary:hover {
  background: #3d3d3d;
  border-color: #3d3d3d;
  color: #fafaf6;
  text-decoration: none;
}
.btn-outline {
  background: transparent;
  color: #1a1a1a;
}
.btn-outline:hover {
  background: #1a1a1a;
  color: #fafaf6;
  text-decoration: none;
}

/* ═══════════════════════════════════════════════════════════
   NAV — warm white, minimal
   ═══════════════════════════════════════════════════════════ */
.nav {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 2.5rem;
  height: 56px;
  background: rgba(250,250,246,0.88);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--border-subtle);
  transition: border-color 0.3s;
}
.nav.scrolled { border-bottom-color: var(--border-default); }

.nav-logo {
  font-family: var(--font-display);
  font-size: 1.1rem;
  font-weight: 700;
  color: #1a1a1a !important;
  letter-spacing: -0.015em;
}
.nav-logo .logo-accent { font-weight: 400; }

.nav-links {
  list-style: none;
  display: flex;
  gap: 2.2rem;
}
.nav-links a {
  font-size: 0.8rem;
  font-weight: 500;
  color: var(--text-secondary);
  letter-spacing: -0.01em;
  transition: color 0.2s;
}
.nav-links a:hover { color: #1a1a1a; text-decoration: none; }

.nav-login, .nav-cta {
  font-size: 0.8rem;
  font-weight: 600;
  font-family: var(--font-display);
  letter-spacing: -0.01em;
}
.nav-login { color: var(--text-secondary); padding: 0.4rem 0; }
.nav-login:hover { color: #1a1a1a; text-decoration: none; }
.nav-cta {
  background: #1a1a1a;
  color: #fafaf6;
  padding: 0.5rem 1.3rem;
  border-radius: var(--radius-sm);
}
.nav-cta:hover { background: #3d3d3d; color: #fafaf6; text-decoration: none; }

/* ═══════════════════════════════════════════════════════════
   HERO — breathing room
   ═══════════════════════════════════════════════════════════ */
.hero {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 6rem 2.5rem 5rem;
  background: var(--bg-primary);
  position: relative;
  overflow: hidden;
}
.hero-content { max-width: 780px; }

.hero-eyebrow {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  margin-bottom: 2.5rem;
}
.eyebrow-line {
  width: 28px;
  height: 1px;
  background: var(--border-default);
}
.eyebrow-text {
  font-family: var(--font-mono);
  font-size: 0.6rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.25em;
  color: var(--text-muted);
}

.hero-title { margin-bottom: 1.8rem; color: #1a1a1a; }
.hero-accent { font-weight: 800; }

.hero-subtitle {
  font-size: 1.1rem;
  color: var(--text-secondary);
  line-height: 1.85;
  margin-bottom: 3rem;
}
.hero-subtitle .highlight {
  font-weight: 600;
  color: #1a1a1a;
}

.hero-buttons {
  display: flex;
  gap: 1rem;
  justify-content: center;
  flex-wrap: wrap;
}

.hero-scroll-indicator {
  position: absolute;
  bottom: 1.2rem;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.6rem;
  font-family: var(--font-mono);
  font-size: 0.55rem;
  letter-spacing: 0.2em;
  color: var(--text-muted);
  z-index: 1;
}
.scroll-line {
  width: 1px;
  height: 36px;
  background: var(--border-default);
  animation: scrollPulse 2.2s ease-in-out infinite;
}
@keyframes scrollPulse {
  0%, 100% { opacity: 0.25; }
  50% { opacity: 0.9; }
}

/* ── Hero Geometric Background ── */
.hero-geo {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
  z-index: 0;
}
.hero-content, .hero-scroll-indicator { position: relative; z-index: 1; }
.hero-buttons { position: relative; z-index: 1; }

.geo-grid-overlay {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(26,26,26,0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(26,26,26,0.045) 1px, transparent 1px);
  background-size: 60px 60px;
  mask-image: radial-gradient(ellipse 60% 60% at 50% 40%, black 30%, transparent 70%);
  -webkit-mask-image: radial-gradient(ellipse 60% 60% at 50% 40%, black 30%, transparent 70%);
}

.geo-shape { position: absolute; opacity: 0.10; }

.geo-circle {
  width: 320px; height: 320px;
  border-radius: 50%;
  border: 1.5px solid #1a1a1a;
  top: 10%; left: -5%;
  animation: geoDrift 18s ease-in-out infinite;
}
.geo-square {
  width: 180px; height: 180px;
  border: 1.5px solid #1a1a1a;
  border-radius: 24px;
  top: 55%; right: -3%;
  animation: geoDrift 22s ease-in-out infinite reverse;
}
.geo-triangle {
  width: 0; height: 0;
  border-left: 80px solid transparent;
  border-right: 80px solid transparent;
  border-bottom: 140px solid rgba(26,26,26,0.10);
  top: 25%; right: 15%;
  animation: geoFloat 14s ease-in-out infinite;
  background: none !important;
}
.geo-diamond {
  width: 100px; height: 100px;
  border: 1.5px solid #1a1a1a;
  transform: rotate(45deg);
  border-radius: 12px;
  top: 70%; left: 12%;
  animation: geoDrift 20s ease-in-out infinite 3s;
}
.geo-ring {
  width: 200px; height: 200px;
  border-radius: 50%;
  border: 1px dashed rgba(26,26,26,0.5);
  top: 40%; left: 60%;
  animation: geoSpin 30s linear infinite;
}
.geo-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: #1a1a1a;
  opacity: 0.14;
  animation: geoPulse 4s ease-in-out infinite;
}
.geo-dot-1 { top: 20%; left: 30%; animation-delay: 0s; }
.geo-dot-2 { top: 60%; left: 50%; animation-delay: 1.5s; }
.geo-dot-3 { top: 35%; left: 75%; animation-delay: 3s; }

@keyframes geoDrift {
  0%, 100% { transform: translate(0, 0) rotate(0deg); }
  25%  { transform: translate(15px, -20px) rotate(1deg); }
  50%  { transform: translate(-10px, -8px) rotate(-1deg); }
  75%  { transform: translate(-18px, 12px) rotate(0.5deg); }
}
@keyframes geoFloat {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  33%  { transform: translateY(-25px) rotate(3deg); }
  66%  { transform: translateY(10px) rotate(-2deg); }
}
@keyframes geoSpin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}
@keyframes geoPulse {
  0%, 100% { opacity: 0.08; transform: scale(1); }
  50%  { opacity: 0.24; transform: scale(1.8); }
}

/* ═══════════════════════════════════════════════════════════
   PHILOSOPHY
   ═══════════════════════════════════════════════════════════ */
.philosophy {
  padding: 9rem 2.5rem;
  background: var(--bg-secondary);
}
.philosophy-grid {
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6rem;
  align-items: center;
}

.phil-mark {
  width: 100%;
  aspect-ratio: 1;
  max-width: 340px;
  margin: 0 auto;
  border: 1.5px solid var(--border-default);
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  animation: philBreath 6s ease-in-out infinite;
}
@keyframes philBreath {
  0%, 100% { border-color: var(--border-default); box-shadow: 0 0 0 0 rgba(26,26,26,0); }
  50%  { border-color: rgba(26,26,26,0.3); box-shadow: 0 0 40px rgba(26,26,26,0.04); }
}

/* Inner rotating square */
.phil-rotator {
  width: 56%;
  aspect-ratio: 1;
  animation: philRotate 12s linear infinite;
  display: flex;
  align-items: center;
  justify-content: center;
}
.phil-inner-square {
  width: 100%;
  height: 100%;
  border: 1.5px solid #1a1a1a;
  border-radius: var(--radius-md);
  transition: border-radius 0.8s ease;
}
@keyframes philRotate {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* Floating orbs around the mark */
.phil-orb {
  position: absolute;
  border-radius: 50%;
  background: #1a1a1a;
  opacity: 0.10;
  animation: philOrbFloat 8s ease-in-out infinite;
}
.phil-orb-1 { width: 12px; height: 12px; top: -8px; right: 15%; animation-delay: 0s; }
.phil-orb-2 { width: 8px;  height: 8px;  bottom: 10%; left: -5px; animation-delay: 2.5s; }
.phil-orb-3 { width: 10px; height: 10px; top: 40%; right: -8px; animation-delay: 5s; }
@keyframes philOrbFloat {
  0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.08; }
  25%  { transform: translate(8px, -12px) scale(1.6); opacity: 0.20; }
  50%  { transform: translate(-4px, -20px) scale(1); opacity: 0.10; }
  75%  { transform: translate(-10px, -6px) scale(1.4); opacity: 0.16; }
}

.philosophy-text h2 { margin-bottom: 1.8rem; }
.philosophy-text p {
  color: var(--text-secondary);
  margin-bottom: 1.2rem;
  font-size: 1rem;
  line-height: 1.85;
}

.philosophy-pills {
  display: flex;
  gap: 0.7rem;
  flex-wrap: wrap;
  margin-top: 2.5rem;
}
.pill {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.4rem 1.1rem;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-xs);
  color: var(--text-secondary);
  background: var(--bg-primary);
}

/* ═══════════════════════════════════════════════════════════
   TRACKS
   ═══════════════════════════════════════════════════════════ */
.tracks {
  padding: 9rem 2.5rem;
  background: var(--bg-primary);
}
.section-header {
  text-align: center;
  max-width: 600px;
  margin: 0 auto 5rem;
}
.section-title { margin-bottom: 1rem; }
.section-subtitle { color: var(--text-secondary); font-size: 1rem; }

.tracks-grid {
  max-width: 1160px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 1.5px;
  background: var(--border-subtle);
  border: 1.5px solid var(--border-subtle);
  border-radius: var(--radius-md);
  overflow: hidden;
}

.track-card {
  background: var(--bg-primary);
  padding: 3rem 2.5rem;
  transition: background 0.2s;
}
.track-card:hover { background: var(--bg-secondary); }

.track-icon {
  color: #1a1a1a;
  margin-bottom: 1.5rem;
  opacity: 0.85;
}
.track-card h3 {
  margin-bottom: 0.8rem;
  font-size: 1.15rem;
}
.track-card p {
  font-size: 0.88rem;
  color: var(--text-secondary);
  line-height: 1.75;
  margin-bottom: 1.2rem;
}
.track-tag {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  color: var(--text-muted);
  letter-spacing: 0.04em;
}

/* ═══════════════════════════════════════════════════════════
   HONORS
   ═══════════════════════════════════════════════════════════ */
.honors {
  padding: 9rem 2.5rem;
  background: var(--bg-secondary);
}

.honors-grid {
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5px;
  background: var(--border-subtle);
  border: 1.5px solid var(--border-subtle);
  border-radius: var(--radius-md);
  overflow: hidden;
}

.honor-stat {
  background: var(--bg-primary);
  padding: 3.5rem 2rem;
  text-align: center;
  transition: background 0.2s;
}
.honor-stat:hover { background: #fafaf6; }

.honor-icon {
  color: #1a1a1a;
  margin-bottom: 1.2rem;
  opacity: 0.8;
}
.honor-number {
  font-family: var(--font-display);
  font-size: 3.2rem;
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 1;
  margin-bottom: 0.5rem;
}
.honor-label {
  font-size: 0.85rem;
  color: var(--text-secondary);
  font-weight: 500;
}

/* ═══════════════════════════════════════════════════════════
   EVENTS
   ═══════════════════════════════════════════════════════════ */
.events {
  padding: 9rem 2.5rem;
  background: var(--bg-primary);
}

.events-list {
  max-width: 800px;
  margin: 0 auto;
}
.event-item {
  display: grid;
  grid-template-columns: 120px 1fr auto;
  gap: 2.5rem;
  align-items: center;
  padding: 2.2rem 0;
  border-bottom: 1px solid var(--border-subtle);
}
.event-item:first-child { border-top: 1px solid var(--border-subtle); }

.event-date {
  font-family: var(--font-mono);
  font-size: 0.75rem;
  color: var(--text-muted);
  letter-spacing: 0.06em;
}
.event-info h3 { margin-bottom: 0.3rem; }
.event-info p { font-size: 0.88rem; color: var(--text-secondary); }
.event-arrow { font-size: 1.3rem; color: var(--text-muted); }

/* ═══════════════════════════════════════════════════════════
   CTA — inverted dark band
   ═══════════════════════════════════════════════════════════ */
.cta-section {
  padding: 7rem 2.5rem;
  text-align: center;
  background: #1a1a1a;
  color: var(--text-inverse);
}
.cta-section .section-label { color: #8b8b8b; }
.cta-section h2 { color: #fafaf6; margin-bottom: 1.2rem; }
.cta-section p { color: #a0a0a0; margin-bottom: 2.5rem; font-size: 1rem; max-width: 500px; margin-left: auto; margin-right: auto; }
.cta-section .btn-primary {
  background: #fafaf6;
  color: #1a1a1a;
  border-color: #fafaf6;
}
.cta-section .btn-primary:hover {
  background: #e0e0d8;
  border-color: #e0e0d8;
  color: #1a1a1a;
}

/* ═══════════════════════════════════════════════════════════
   FOOTER — warm white, clean
   ═══════════════════════════════════════════════════════════ */
.footer-v2 {
  background: var(--bg-secondary);
  border-top: 1px solid var(--border-subtle);
  padding: 5rem 2.5rem 2.5rem;
  color: var(--text-primary);
}
.footer-v2-grid {
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: 4rem;
}
.footer-v2-brand p {
  color: var(--text-secondary);
  font-size: 0.88rem;
  line-height: 1.8;
  margin-top: 0.8rem;
}
.footer-v2-logo {
  font-family: var(--font-display);
  font-size: 1.15rem;
  font-weight: 700;
  color: #1a1a1a;
}
.footer-v2 h4 {
  font-size: 0.72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: var(--text-muted);
  margin-bottom: 1.2rem;
}
.footer-v2 a, .footer-v2 li {
  color: var(--text-secondary);
  font-size: 0.88rem;
  line-height: 2.2;
  list-style: none;
}
.footer-v2 a:hover { color: #1a1a1a; text-decoration: none; }
.footer-v2-bottom {
  max-width: 1100px;
  margin: 3.5rem auto 0;
  padding-top: 1.8rem;
  border-top: 1px solid var(--border-subtle);
  font-size: 0.78rem;
  color: var(--text-muted);
}

/* ═══════════════════════════════════════════════════════════
   DASHBOARD — warm minimal panels
   ═══════════════════════════════════════════════════════════ */
.dash-wrap {
  max-width: 1200px;
  margin: 0 auto;
  padding: 5rem 2rem 3rem;
  background: var(--bg-primary);
}

.dash-topbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 1.5rem;
  margin-bottom: 3rem;
}
.dash-greeting h1 {
  font-size: 1.3rem;
  font-weight: 700;
  margin-bottom: 0.3rem;
  color: #1a1a1a;
}
.dash-greeting .dash-subtitle {
  font-size: 0.85rem;
  color: var(--text-muted);
}

.dash-panel {
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  margin-bottom: 1.5rem;
  overflow: hidden;
}
.dash-panel-header {
  padding: 1.1rem 1.6rem;
  border-bottom: 1px solid var(--border-subtle);
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: var(--bg-secondary);
}
.dash-panel-header h3 {
  font-size: 0.8rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-secondary);
}

.dash-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
}
.dash-grid-full { grid-column: 1 / -1; }

.dash-stat-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}
.dash-stat-item {
  text-align: center;
  padding: 2.5rem 1.5rem;
  border-right: 1px solid var(--border-subtle);
}
.dash-stat-item:last-child { border-right: none; }
.dash-stat-number {
  font-family: var(--font-display);
  font-size: 2.2rem;
  font-weight: 800;
  letter-spacing: -0.04em;
  color: #1a1a1a;
}
.dash-stat-label {
  font-size: 0.72rem;
  color: var(--text-muted);
  margin-top: 0.4rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.dash-leaderboard-list {
  list-style: none;
}
.dash-leaderboard-list li {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 0.9rem 1.6rem;
  border-bottom: 1px solid var(--border-subtle);
  font-size: 0.88rem;
}
.dash-leaderboard-list li:last-child { border-bottom: none; }
.dash-rank {
  font-family: var(--font-mono);
  font-weight: 700;
  font-size: 0.88rem;
  min-width: 28px;
  color: var(--text-muted);
}
.dash-rank.top { color: #1a1a1a; }
.dash-pts {
  margin-left: auto;
  font-family: var(--font-mono);
  font-size: 0.8rem;
  color: var(--text-muted);
}

/* ── Buttons ── */
.dash-btn-v2 {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.55rem 1.3rem;
  font-size: 0.8rem;
  font-weight: 600;
  font-family: var(--font-display);
  border: 1.5px solid #1a1a1a;
  border-radius: var(--radius-sm);
  background: transparent;
  cursor: pointer;
  transition: all 0.2s;
}
.dash-btn-v2.primary {
  background: #1a1a1a;
  color: #fafaf6;
}
.dash-btn-v2.primary:hover { background: #3d3d3d; border-color: #3d3d3d; color: #fafaf6; }
.dash-btn-v2:hover { background: #1a1a1a; color: #fafaf6; }

/* ── Notification Bell ── */
.dash-notif-wrap { position: relative; }
.dash-notif-bell {
  background: none;
  border: none;
  cursor: pointer;
  color: #1a1a1a;
  padding: 0.4rem;
  display: flex;
  align-items: center;
  border-radius: var(--radius-sm);
  transition: background 0.15s;
}
.dash-notif-bell:hover { background: var(--border-subtle); }
.dash-notif-badge {
  position: absolute;
  top: 0; right: 0;
  background: #1a1a1a;
  color: #fafaf6;
  font-size: 0.6rem;
  font-weight: 700;
  min-width: 17px;
  height: 17px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.dash-notif-dropdown {
  position: absolute;
  right: 0; top: calc(100% + 4px);
  width: 350px;
  background: #fff;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  box-shadow: 0 8px 40px rgba(0,0,0,0.06);
  display: none;
  z-index: 200;
}
.dash-notif-dropdown.visible { display: block; }
.dash-notif-dropdown-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem 1.3rem;
  border-bottom: 1px solid var(--border-subtle);
  font-size: 0.82rem;
  font-weight: 600;
}
.dash-notif-mark-all {
  font-size: 0.72rem;
  background: none;
  border: none;
  color: var(--text-muted);
  cursor: pointer;
}
.dash-notif-mark-all:hover { color: #1a1a1a; }
.dash-notif-dropdown-body { max-height: 420px; overflow-y: auto; }

/* Notification item */
.dash-notif-item {
  display: flex;
  gap: 0.7rem;
  padding: 0.9rem 1.2rem;
  border-bottom: 1px solid var(--border-subtle);
  cursor: pointer;
  transition: background 0.1s;
}
.dash-notif-item:hover { background: var(--bg-secondary); }
.dash-notif-item.unread { background: rgba(26,26,26,0.02); border-left: 2px solid #1a1a1a; padding-left: calc(1.2rem - 2px); }
.dash-notif-item-body { flex: 1; min-width: 0; }
.dash-notif-item-title { font-size: 0.82rem; font-weight: 600; color: var(--text-primary); margin: 0 0 0.25rem; line-height: 1.4; }
.dash-notif-extract { font-size: 0.74rem; color: var(--text-secondary); margin: 0 0 0.4rem; line-height: 1.5; }
.dash-notif-meta { font-size: 0.68rem; color: var(--text-muted); }
.dash-notif-empty { text-align: center; padding: 2.5rem 1.5rem; color: var(--text-muted); font-size: 0.84rem; }

/* ── Tabs ── */
.dash-tabs {
  display: flex;
  gap: 0;
  border-bottom: 1px solid var(--border-subtle);
  margin-bottom: 2rem;
}
.dash-tab {
  padding: 0.8rem 1.6rem;
  font-size: 0.8rem;
  font-weight: 600;
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  cursor: pointer;
  color: var(--text-muted);
  font-family: var(--font-display);
  transition: all 0.2s;
}
.dash-tab.active { color: #1a1a1a; border-bottom-color: #1a1a1a; }
.dash-tab:hover { color: #1a1a1a; }

/* ── Competition Cards ── */
.comp-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 1.5px;
  background: var(--border-subtle);
  border: 1.5px solid var(--border-subtle);
  border-radius: var(--radius-md);
  overflow: hidden;
}
.comp-card {
  background: var(--bg-primary);
  padding: 1.8rem;
  transition: background 0.2s;
}
.comp-card:hover { background: var(--bg-secondary); }
.comp-card h3 { font-size: 1.05rem; margin-bottom: 0.5rem; }
.comp-card .comp-meta {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  color: var(--text-muted);
  letter-spacing: 0.04em;
  margin-bottom: 0.8rem;
}
.comp-card .comp-status {
  display: inline-block;
  font-family: var(--font-mono);
  font-size: 0.62rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  padding: 0.25rem 0.7rem;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-xs);
  color: var(--text-secondary);
}

/* ═══════════════════════════════════════════════════════════
   CAMPUS FORMS
   ═══════════════════════════════════════════════════════════ */
.campus-form {
  max-width: 720px;
  margin: 0 auto;
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  padding: 2.5rem;
}
.campus-form .form-row { margin-bottom: 1.4rem; }
.campus-form .form-row label {
  display: block;
  font-size: 0.74rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-secondary);
  margin-bottom: 0.5rem;
}
.campus-form .form-row input,
.campus-form .form-row select,
.campus-form .form-row textarea {
  width: 100%;
  padding: 0.7rem 0.9rem;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-sm);
  font-family: var(--font-body);
  font-size: 0.92rem;
  background: var(--bg-primary);
  color: var(--text-primary);
  transition: border-color 0.2s;
}
.campus-form .form-row input:focus,
.campus-form .form-row select:focus,
.campus-form .form-row textarea:focus {
  outline: none;
  border-color: #1a1a1a;
}
.campus-form .form-row-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.2rem;
}
.campus-form .form-hint {
  font-size: 0.72rem;
  color: var(--text-muted);
  margin-top: 0.4rem;
}
.campus-form .required { color: #1a1a1a; font-weight: 700; }

/* ═══════════════════════════════════════════════════════════
   BACK BAR
   ═══════════════════════════════════════════════════════════ */
#wtuch-back-bar {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 99;
  height: 44px;
  display: flex;
  align-items: center;
  padding: 0 1.5rem;
  background: rgba(250,250,246,0.9);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--border-subtle);
}
.wtuch-back-btn {
  font-size: 0.78rem;
  font-weight: 600;
  color: #1a1a1a;
  text-decoration: none;
  font-family: var(--font-display);
}
.wtuch-back-btn:hover { color: var(--text-secondary); }

/* ═══════════════════════════════════════════════════════════
   DEFAULT WORDPRESS CONTENT
   ═══════════════════════════════════════════════════════════ */
.page-inner {
  padding-top: 44px;
  background: var(--bg-primary) !important;
  color: var(--text-primary) !important;
}
.entry-content {
  max-width: 780px;
  margin: 4rem auto;
  padding: 0 2rem;
  line-height: 1.85;
}
.entry-content h1, .entry-content h2, .entry-content h3 { margin: 2.5rem 0 1.2rem; color: #1a1a1a; }
.entry-content p { margin-bottom: 1.4rem; color: var(--text-secondary); }
.entry-content a { border-bottom: 1px solid var(--border-default); }
.entry-content a:hover { border-bottom-color: #1a1a1a; text-decoration: none; }
.entry-content ul, .entry-content ol { padding-left: 1.8rem; margin-bottom: 1.4rem; }
.entry-content li { color: var(--text-secondary); margin-bottom: 0.5rem; }

/* ═══════════════════════════════════════════════════════════
   TOAST
   ═══════════════════════════════════════════════════════════ */
.toast {
  position: fixed;
  bottom: 2.5rem;
  right: 2.5rem;
  background: #1a1a1a;
  color: #fafaf6;
  padding: 0.9rem 1.6rem;
  font-size: 0.84rem;
  font-weight: 500;
  border-radius: var(--radius-sm);
  z-index: 9999;
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 0.3s, transform 0.3s;
  box-shadow: 0 4px 24px rgba(0,0,0,0.08);
}
.toast.show { opacity: 1; transform: translateY(0); }

/* ═══════════════════════════════════════════════════════════
   LEARNING RESOURCES — warm white minimal
   ═══════════════════════════════════════════════════════════ */
.lr-wrap {
  max-width: 1300px; margin: 0 auto; padding: 0 2rem 4rem;
  font-family: var(--font-body); color: var(--text-primary);
}
#lrStarfield { position: fixed; inset: 0; z-index: 0; pointer-events: none; }

/* header */
.lr-header { position: relative; z-index: 1; text-align: center; padding: 3rem 0 2rem; }
.lr-header h1 {
  font-size: 1.3rem; font-weight: 800; color: #1a1a1a;
  display: flex; align-items: center; justify-content: center; gap: 0.5rem;
  margin: 0 0 0.5rem; letter-spacing: -0.02em;
}
.lr-header h1 svg { color: #1a1a1a; flex-shrink: 0; }
.lr-header p { font-size: 0.84rem; color: #9b9b9b; margin: 0; }

/* tabs */
.lr-tabs {
  position: relative; z-index: 1;
  display: flex; justify-content: center; gap: 0.4rem; margin-bottom: 2rem;
}
.lr-tab {
  padding: 0.6rem 1.5rem; border-radius: 50px; font-size: 0.84rem; font-weight: 600;
  border: 1px solid var(--border-default); background: transparent;
  color: var(--text-secondary); cursor: pointer; font-family: inherit;
  transition: all 0.2s; display: flex; align-items: center; gap: 0.35rem;
}
.lr-tab:hover { border-color: #1a1a1a; color: #1a1a1a; }
.lr-tab.active { background: #1a1a1a; color: #fafaf6; border-color: #1a1a1a; }
.lr-tab .tab-icon { font-size: 0.9rem; }

/* panels */
.lr-panel { display: none; position: relative; z-index: 1; }
.lr-panel.active { display: block; }

/* filter bar */
.lr-filter-bar {
  display: flex; gap: 0.5rem; margin-bottom: 1.2rem; flex-wrap: wrap;
}
.lr-filter-bar select, .lr-filter-bar input {
  padding: 0.5rem 0.8rem; border-radius: var(--radius-sm);
  border: 1px solid var(--border-default); background: var(--bg-primary);
  font-size: 0.8rem; font-family: inherit; color: var(--text-primary);
  outline: none; transition: border-color 0.2s;
}
.lr-filter-bar select:focus, .lr-filter-bar input:focus { border-color: #1a1a1a; }
.lr-filter-bar select { min-width: 110px; }
.lr-filter-bar input { flex: 1; min-width: 180px; }
.lr-filter-clear {
  padding: 0.5rem 1rem; border-radius: var(--radius-sm);
  font-size: 0.8rem; font-family: inherit;
  border: 1px solid var(--border-default); background: transparent;
  color: var(--text-secondary); cursor: pointer; transition: all 0.2s;
}
.lr-filter-clear:hover { border-color: #1a1a1a; color: #1a1a1a; }

/* grid layout */
.lr-grid { display: grid; grid-template-columns: 1fr 280px; gap: 1.5rem; align-items: start; }

/* post cards */
.lr-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.8rem; }
.lr-card {
  display: flex; flex-direction: column; padding: 1.1rem 1.2rem;
  background: var(--bg-primary); border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm); text-decoration: none; color: inherit;
  transition: all 0.2s;
}
.lr-card:hover { border-color: #1a1a1a; transform: translateY(-2px); box-shadow: 0 4px 16px rgba(0,0,0,0.04); }
.lr-card-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem; margin-bottom: 0.5rem; }
.lr-card-date { font-size: 0.68rem; color: var(--text-muted); }
.lr-card-tag {
  font-size: 0.6rem; padding: 0.08rem 0.45rem; border-radius: 3px;
  font-weight: 600; letter-spacing: 0.03em;
}
.lr-card-tag.major  { background: #f3f3ee; color: #6b6b6b; }
.lr-card-tag.grade  { background: #ebebe6; color: #555; }
.lr-card-tag.course { background: #e6e6e0; color: #1a1a1a; }
.lr-card-tag.comp   { background: var(--bg-secondary); color: var(--text-secondary); border: 1px solid var(--border-subtle); }
.lr-card h3 { font-size: 0.88rem; font-weight: 600; color: #1a1a1a; line-height: 1.4; margin-bottom: 0.3rem; }
.lr-card-excerpt { font-size: 0.74rem; color: var(--text-secondary); line-height: 1.5; }

/* empty state */
.lr-empty { text-align: center; padding: 4rem 1rem; color: var(--text-muted); font-size: 0.88rem; }
.lr-empty .empty-icon { font-size: 2rem; margin-bottom: 0.5rem; }

/* sidebar */
.lr-sidebar { display: flex; flex-direction: column; gap: 1rem; }
.lr-side-card {
  background: var(--bg-primary); border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md); padding: 1.3rem;
}
.lr-side-card h3 {
  font-size: 0.78rem; font-weight: 700; color: #1a1a1a;
  margin-bottom: 0.8rem; display: flex; align-items: center; gap: 0.35rem;
}
.lr-side-card h3 svg { color: #1a1a1a; flex-shrink: 0; }
.lr-side-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; }
.lr-side-stat {
  text-align: center; padding: 0.6rem;
  background: var(--bg-secondary); border-radius: var(--radius-sm);
  border: 1px solid var(--border-subtle);
}
.lr-side-stat-num { font-size: 1.2rem; font-weight: 800; color: #1a1a1a; line-height: 1.2; }
.lr-side-stat-label { font-size: 0.62rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.06em; }
.lr-filter-list { display: flex; flex-wrap: wrap; gap: 0.3rem; }
.lr-filter-chip {
  padding: 0.22rem 0.55rem; border-radius: 50px; font-size: 0.68rem;
  border: 1px solid var(--border-default); cursor: pointer;
  transition: all 0.2s; color: var(--text-secondary);
  background: transparent; font-family: inherit;
}
.lr-filter-chip:hover, .lr-filter-chip.active { border-color: #1a1a1a; color: #1a1a1a; background: var(--bg-secondary); }
.lr-filter-chip .count { font-size: 0.58rem; color: var(--text-muted); margin-left: 3px; }

@media (max-width: 768px) {
  .lr-grid { grid-template-columns: 1fr; }
  .lr-cards { grid-template-columns: 1fr; }
  .lr-header { padding: 2rem 0 1.5rem; }
  .lr-tabs { margin-bottom: 1.5rem; }
}


/* ═══════════════════════════════════════════════════════════
   COMPETITION SINGLE PAGE
   ═══════════════════════════════════════════════════════════ */
.comp-single-hero {
  padding: 5rem 2.5rem;
  background: var(--bg-secondary);
  border-bottom: 1px solid var(--border-subtle);
  text-align: center;
}
.comp-single-hero h1 { margin-bottom: 0.6rem; }
.comp-single-hero .comp-single-meta {
  font-family: var(--font-mono);
  font-size: 0.75rem;
  color: var(--text-muted);
  letter-spacing: 0.06em;
}
.comp-single-body {
  max-width: 800px;
  margin: 3.5rem auto;
  padding: 0 2.5rem;
  line-height: 1.85;
}

/* ═══════════════════════════════════════════════════════════
   COMPETITION HOME PAGE (CHP)
   ═══════════════════════════════════════════════════════════ */
.chp-hero {
  padding: 7rem 2.5rem 5rem;
  background: #1a1a1a;
  color: #fafaf6;
  text-align: center;
}
.chp-hero h1 { color: #fafaf6; margin-bottom: 1.2rem; }
.chp-hero .chp-hero-subtitle { color: #a0a0a0; font-size: 1.05rem; margin-bottom: 2rem; }
.chp-hero-meta {
  display: flex;
  justify-content: center;
  gap: 2.5rem;
  flex-wrap: wrap;
  font-size: 0.85rem;
  color: #8b8b8b;
}

/* ═══════════════════════════════════════════════════════════
   ANNOUNCEMENTS
   ═══════════════════════════════════════════════════════════ */
.announce-list { max-width: 800px; margin: 3.5rem auto; padding: 0 2.5rem; }
.announce-item {
  padding: 2.2rem 0;
  border-bottom: 1px solid var(--border-subtle);
}
.announce-item:first-child { border-top: 1px solid var(--border-subtle); }
.announce-item h3 { margin-bottom: 0.5rem; }
.announce-item .announce-date {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  color: var(--text-muted);
  letter-spacing: 0.06em;
}
.announce-item .announce-excerpt {
  color: var(--text-secondary);
  font-size: 0.9rem;
  margin-top: 0.7rem;
  line-height: 1.8;
}

/* ═══════════════════════════════════════════════════════════
   TRACK / SUB-EVENT DETAIL
   ═══════════════════════════════════════════════════════════ */
.track-detail-header {
  padding: 4rem 2.5rem;
  background: var(--bg-secondary);
  border-bottom: 1px solid var(--border-subtle);
  text-align: center;
}
.track-detail-header h1 { margin-bottom: 0.5rem; }
.track-detail-body {
  max-width: 800px;
  margin: 3.5rem auto;
  padding: 0 2.5rem;
  line-height: 1.85;
}

/* ═══════════════════════════════════════════════════════════
   DASHBOARD — compact top header bar
   ═══════════════════════════════════════════════════════════ */
.dash-top-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(250,250,246,0.92);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border-bottom: 1px solid var(--border-subtle);
}
.dth-inner {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 0.55rem 1.5rem;
}
.dth-left {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  min-width: 0;
  flex-shrink: 1;
}
.welcome-avatar {
  width: 34px; height: 34px;
  border-radius: 50%;
  background: #1a1a1a;
  color: #fafaf6;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 0.82rem;
  flex-shrink: 0;
}
.dth-greeting {
  min-width: 0;
  line-height: 1.3;
}
.dth-welcome {
  font-size: 0.82rem;
  font-weight: 700;
  color: #1a1a1a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
}
.dth-subtitle {
  font-size: 0.64rem;
  color: var(--text-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
}

.dth-center {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
  padding: 0 0.5rem;
}
.dth-clock {
  font-family: var(--font-mono);
  font-size: 1rem;
  font-weight: 600;
  color: #1a1a1a;
  letter-spacing: 0.02em;
}
.dth-date {
  font-family: var(--font-mono);
  font-size: 0.64rem;
  color: var(--text-muted);
}

.dth-stats {
  display: flex;
  gap: 0.5rem;
  flex-shrink: 0;
}
.dth-stat {
  text-align: center;
  min-width: 34px;
  padding: 0.15rem 0.3rem;
  border-radius: 5px;
  background: rgba(26,26,26,0.03);
}
.dth-stat-num {
  display: block;
  font-family: var(--font-display);
  font-size: 0.85rem;
  font-weight: 700;
  color: #1a1a1a;
  line-height: 1.2;
}
.dth-stat-label {
  font-size: 0.55rem;
  color: var(--text-muted);
  letter-spacing: 0.06em;
}

.dth-actions {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  flex-shrink: 0;
  margin-left: auto;
}
.dth-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.7rem;
  font-weight: 600;
  padding: 0.35rem 0.7rem;
  border-radius: 5px;
  text-decoration: none;
  white-space: nowrap;
  letter-spacing: 0.02em;
  transition: 0.2s;
}
.dth-btn-primary {
  background: #1a1a1a;
  color: #fafaf6;
}
.dth-btn-primary:hover { background: #3d3d3d; }
.dth-btn-accent {
  background: transparent;
  color: #1a1a1a;
  border: 1px solid #1a1a1a;
}
.dth-btn-accent:hover { background: #1a1a1a; color: #fafaf6; }
.dth-btn-ghost {
  background: transparent;
  color: var(--text-secondary);
  border: 1px solid var(--border-default);
}
.dth-btn-ghost:hover { background: var(--bg-secondary); color: #1a1a1a; border-color: #1a1a1a; }
.dth-btn-logout {
  background: transparent;
  color: #b91c1c;
  border: 1px solid rgba(185,28,28,0.2);
}
.dth-btn-logout:hover { background: #fef2f2; border-color: #b91c1c; }

/* dashboard page — no back bar, so remove top padding */
body.page-template-page-dashboard .page-inner { padding-top: 0; }

.dashboard-v2 { padding: 1.2rem 1.5rem 2rem; }

/* ── Dashboard Main Grid ── */
.dash-main-grid {
  display: grid;
  grid-template-columns: 1fr 360px;
  gap: 1.5rem;
}
.dash-main-left, .dash-main-right {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

/* ── Panel Extras ── */
.panel-icon { margin-right: 0.3rem; }
.panel-link {
  font-size: 0.74rem;
  color: var(--text-muted);
  text-decoration: none;
  font-weight: 500;
}
.panel-link:hover { color: #1a1a1a; }
.dash-badge-v2 {
  font-family: var(--font-mono);
  font-size: 0.64rem;
  font-weight: 600;
  padding: 0.2rem 0.6rem;
  border-radius: var(--radius-xs);
  color: var(--text-muted);
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
}
.dash-badge-v2.new { color: #1a1a1a; border-color: #1a1a1a; }
.dash-badge-v2.count { color: var(--text-secondary); }

/* ── Announce List V2 ── */
.announce-list-v2 { list-style: none; }
.announce-item-v2 {
  display: block;
  padding: 1.1rem 1.6rem;
  border-bottom: 1px solid var(--border-subtle);
  transition: background 0.15s;
}
.announce-item-v2:last-child { border-bottom: none; }
.announce-item-v2:hover { background: var(--bg-secondary); }
.announce-item-v2.pinned { border-left: 2px solid #1a1a1a; }
.announce-pin {
  font-size: 0.68rem;
  font-weight: 600;
  color: #1a1a1a;
  margin-bottom: 0.3rem;
}
.announce-item-v2 h4 {
  font-size: 0.92rem;
  font-weight: 600;
  color: #1a1a1a;
  margin-bottom: 0.3rem;
}
.announce-item-v2 p {
  font-size: 0.8rem;
  color: var(--text-secondary);
  line-height: 1.6;
  margin-bottom: 0.5rem;
}
.announce-meta {
  display: flex;
  gap: 0.8rem;
  font-size: 0.7rem;
  color: var(--text-muted);
}

/* ── Comp List V2 ── */
.comp-list-v2 { list-style: none; }
.comp-item-v2 {
  display: flex;
  gap: 1rem;
  padding: 1rem 1.6rem;
  border-bottom: 1px solid var(--border-subtle);
  transition: background 0.15s;
  align-items: center;
}
.comp-item-v2:last-child { border-bottom: none; }
.comp-item-v2:hover { background: var(--bg-secondary); }
.comp-thumb {
  width: 56px; height: 56px;
  border-radius: var(--radius-sm);
  flex-shrink: 0;
  object-fit: cover;
}
.comp-info { min-width: 0; }
.comp-info h4 {
  font-size: 0.9rem;
  font-weight: 600;
  color: #1a1a1a;
  margin-bottom: 0.25rem;
}
.comp-meta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  font-size: 0.72rem;
  margin-bottom: 0.2rem;
}
.comp-level-badge {
  background: var(--bg-secondary);
  padding: 0.1rem 0.45rem;
  border-radius: var(--radius-xs);
  color: var(--text-secondary);
  font-weight: 600;
}
.comp-date-text { color: var(--text-muted); }
.comp-subs {
  font-size: 0.72rem;
  color: var(--text-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ── Quick Grid V2 ── */
.quick-grid-v2 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.6rem;
  padding: 1rem 1.6rem 1.3rem;
}
.quick-item-v2 {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.4rem;
  padding: 0.8rem 0.5rem;
  border-radius: var(--radius-sm);
  text-decoration: none;
  transition: background 0.15s;
}
.quick-item-v2:hover { background: var(--bg-secondary); }
.qi-icon {
  width: 40px; height: 40px;
  border-radius: var(--radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
}
.qi-text {
  font-size: 0.7rem;
  font-weight: 500;
  color: var(--text-secondary);
}
.quick-item-v2:hover .qi-text { color: #1a1a1a; }

/* ── Honor Wall V2 ── */
.honor-wall-panel { }
.honor-wall-v2 {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 1rem;
  padding: 1.2rem 1.6rem;
}
.honor-card-v2 {
  background: var(--bg-secondary);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
  overflow: hidden;
  position: relative;
  transition: border-color 0.2s;
}
.honor-card-v2:hover { border-color: var(--border-default); }
.honor-card-actions {
  position: absolute;
  top: 6px; right: 6px;
  display: flex;
  gap: 4px;
  z-index: 2;
}
.honor-action-btn {
  width: 26px; height: 26px;
  border-radius: var(--radius-xs);
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.7rem;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.15s;
}
.honor-action-btn:hover { background: var(--bg-tertiary); }
.honor-action-btn.delete:hover { background: #fef2f2; border-color: var(--danger); }
.honor-card-img {
  aspect-ratio: 4/3;
  background: var(--bg-tertiary);
  position: relative;
  overflow: hidden;
}
.honor-card-img img {
  width: 100%; height: 100%;
  object-fit: cover;
}
.honor-badge-level {
  position: absolute;
  top: 8px; left: 8px;
  background: #1a1a1a;
  color: #fafaf6;
  font-size: 0.62rem;
  font-weight: 600;
  padding: 0.15rem 0.5rem;
  border-radius: var(--radius-xs);
}
.honor-placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  color: var(--text-muted);
  font-size: 1.5rem;
}
.honor-placeholder small { font-size: 0.7rem; margin-top: 0.3rem; }
.honor-card-body { padding: 0.8rem 1rem; }
.honor-card-body h4 {
  font-size: 0.84rem;
  font-weight: 600;
  color: #1a1a1a;
  margin-bottom: 0.3rem;
}
.honor-event-type {
  font-size: 0.7rem;
  color: var(--text-muted);
  margin-bottom: 0.15rem;
}
.honor-entry, .honor-team {
  font-size: 0.72rem;
  color: var(--text-secondary);
  margin-bottom: 0.1rem;
}
.honor-date {
  font-size: 0.66rem;
  color: var(--text-muted);
  font-family: var(--font-mono);
}
.empty-hint {
  text-align: center;
  padding: 2rem;
  color: var(--text-muted);
  font-size: 0.84rem;
}
.empty-hint a { color: #1a1a1a; font-weight: 600; }

/* ── Leaderboard V3 ── */
.leaderboard-v3 {
  overflow-x: auto;
  padding: 0.5rem 1.6rem 1.2rem;
}
.leaderboard-v3 table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.78rem;
}
.leaderboard-v3 th {
  text-align: left;
  padding: 0.6rem 0.5rem;
  font-size: 0.66rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-muted);
  border-bottom: 1px solid var(--border-subtle);
  white-space: nowrap;
}
.leaderboard-v3 td {
  padding: 0.55rem 0.5rem;
  border-bottom: 1px solid var(--border-subtle);
  color: var(--text-secondary);
  white-space: nowrap;
}
.lb-v3-row:last-child td { border-bottom: none; }
.lb-v3-row:hover td { background: var(--bg-secondary); }
.lb-v3-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px; height: 22px;
  border-radius: 50%;
  font-size: 0.64rem;
  font-weight: 700;
  color: #fafaf6;
}
.lb-v3-badge.gold { background: #b45309; }
.lb-v3-badge.silver { background: #6b6b6b; }
.lb-v3-badge.bronze { background: #9b6b3d; }
.lb-v3-num { color: var(--text-muted); font-family: var(--font-mono); }
.lb-v3-lv {
  font-size: 0.68rem;
  padding: 0.1rem 0.4rem;
  border-radius: var(--radius-xs);
  background: var(--bg-secondary);
  color: var(--text-secondary);
}
.lb-v3-award {
  font-size: 0.68rem;
  font-weight: 600;
  color: #1a1a1a;
}

/* ═══════════════════════════════════════════════════════════
   COMPETITION SINGLE — warm white minimal
   ═══════════════════════════════════════════════════════════ */
.comp-single { background: var(--bg-primary); }
.comp-hero-wrap {
  background: var(--bg-secondary);
  border-bottom: 1px solid var(--border-subtle);
}
.comp-single-hero {
  max-width: 900px;
  margin: 0 auto;
  padding: 3rem 2rem;
  text-align: center;
}
.comp-single-hero-inner { }
.comp-single-meta-top {
  display: flex;
  justify-content: center;
  gap: 0.6rem;
  margin-bottom: 1rem;
  flex-wrap: wrap;
}
.comp-status-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.2rem 0.7rem;
  border-radius: 50px;
  font-size: 0.7rem;
  font-weight: 600;
  background: var(--bg-primary);
  color: var(--text-secondary);
  border: 1px solid var(--border-subtle);
}
.comp-status-badge.ongoing {
  background: #1a1a1a;
  color: #fafaf6;
  border-color: #1a1a1a;
}
.comp-level-tag {
  padding: 0.2rem 0.7rem;
  border-radius: 50px;
  font-size: 0.7rem;
  font-weight: 500;
  background: var(--bg-primary);
  color: var(--text-secondary);
  border: 1px solid var(--border-subtle);
}
.comp-single-title {
  font-size: clamp(1.8rem, 3.5vw, 2.4rem);
  font-weight: 800;
  color: #1a1a1a;
  margin-bottom: 0.5rem;
}
.comp-hero-organizer {
  font-size: 0.9rem;
  color: var(--text-muted);
  margin-bottom: 0.6rem;
}
.comp-single-date {
  font-size: 0.84rem;
  color: var(--text-secondary);
  margin-bottom: 1.2rem;
}
.comp-date-icon { margin-right: 0.2rem; }
.comp-hero-actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  margin-top: 1rem;
}
.comp-countdown { }
.countdown-label {
  font-size: 0.72rem;
  color: var(--text-muted);
  margin-bottom: 0.4rem;
}
.countdown-digits {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.3rem;
}
.cd-block {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.cd-num {
  font-family: var(--font-mono);
  font-size: 1.5rem;
  font-weight: 700;
  color: #1a1a1a;
  line-height: 1.1;
}
.cd-unit {
  font-size: 0.6rem;
  color: var(--text-muted);
  text-transform: uppercase;
}
.cd-sep {
  font-size: 1.2rem;
  color: var(--text-muted);
  padding-bottom: 1rem;
}
.comp-hero-btns {
  display: flex;
  gap: 0.8rem;
  flex-wrap: wrap;
  justify-content: center;
}
.comp-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.65rem 1.6rem;
  font-family: var(--font-display);
  font-size: 0.82rem;
  font-weight: 600;
  border-radius: var(--radius-sm);
  text-decoration: none;
  cursor: pointer;
  transition: all 0.2s;
  border: 1.5px solid #1a1a1a;
}
.comp-btn-primary {
  background: #1a1a1a;
  color: #fafaf6;
}
.comp-btn-primary:hover { background: #3d3d3d; border-color: #3d3d3d; color: #fafaf6; }
.comp-btn-outline {
  background: transparent;
  color: #1a1a1a;
}
.comp-btn-outline:hover { background: #1a1a1a; color: #fafaf6; }

.comp-single-body {
  max-width: 1100px;
  margin: 0 auto;
  padding: 2.5rem 2rem;
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 2rem;
  align-items: start;
}
.comp-single-main {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

/* ── Info Strip ── */
.comp-info-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--bg-primary);
}
.comp-info-strip-item {
  flex: 1;
  min-width: 100px;
  text-align: center;
  padding: 1.2rem 0.8rem;
  border-right: 1px solid var(--border-subtle);
}
.comp-info-strip-item:last-child { border-right: none; }
.strip-label {
  display: block;
  font-size: 0.64rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-muted);
  margin-bottom: 0.3rem;
}
.strip-val {
  font-family: var(--font-display);
  font-size: 1.1rem;
  font-weight: 700;
  color: #1a1a1a;
}

/* ── Notices ── */
.comp-notices {
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  padding: 1.4rem 1.6rem;
}
.comp-notices h2 {
  font-size: 0.9rem;
  font-weight: 700;
  color: #1a1a1a;
  margin-bottom: 0.8rem;
}
.comp-notice-list { display: flex; flex-direction: column; gap: 0.4rem; }
.comp-notice-item {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.5rem 0;
  text-decoration: none;
  color: var(--text-primary);
  font-size: 0.84rem;
  border-bottom: 1px solid var(--border-subtle);
}
.comp-notice-item:last-child { border-bottom: none; }
.comp-notice-item:hover { color: #1a1a1a; }
.comp-notice-item.is-important { font-weight: 600; }
.notice-badge {
  font-size: 0.6rem;
  font-weight: 700;
  text-transform: uppercase;
  background: #1a1a1a;
  color: #fafaf6;
  padding: 0.1rem 0.4rem;
  border-radius: var(--radius-xs);
  flex-shrink: 0;
}
.notice-title { flex: 1; }
.notice-date { font-size: 0.7rem; color: var(--text-muted); flex-shrink: 0; }

/* ── Quick Cards ── */
.comp-quick-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1rem;
}
.quick-card {
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  padding: 1.4rem;
}
.quick-card-icon { font-size: 1.4rem; margin-bottom: 0.5rem; }
.quick-card h4 {
  font-size: 0.88rem;
  font-weight: 700;
  color: #1a1a1a;
  margin-bottom: 0.5rem;
}
.qc-stage {
  font-size: 0.82rem;
  color: var(--text-secondary);
  margin-bottom: 0.2rem;
  display: flex;
  justify-content: space-between;
}
.qc-deadline {
  font-size: 0.74rem;
  color: #b91c1c;
  margin-top: 0.5rem;
  font-weight: 600;
}
.qc-desc {
  font-size: 0.8rem;
  color: var(--text-secondary);
  line-height: 1.6;
  margin-bottom: 0.2rem;
}
.qc-award-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
}
.qc-award-tag {
  font-size: 0.7rem;
  padding: 0.15rem 0.5rem;
  border-radius: var(--radius-xs);
  background: var(--bg-secondary);
  color: var(--text-secondary);
}
.qc-honor-ref {
  font-size: 0.7rem;
  color: var(--text-muted);
  margin-top: 0.5rem;
}

/* ── Dates ── */
.comp-single-dates {
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  padding: 1.4rem 1.6rem;
}
.comp-single-dates h2 {
  font-size: 0.9rem;
  font-weight: 700;
  color: #1a1a1a;
  margin-bottom: 0.8rem;
}
.comp-dates-grid {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.4rem 1.5rem;
  font-size: 0.84rem;
}
.comp-dates-grid dt { color: var(--text-muted); font-weight: 500; }
.comp-dates-grid dd { color: var(--text-primary); font-weight: 600; }

/* ── Content ── */
.comp-single-content {
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  padding: 1.6rem;
}
.comp-single-content h2 {
  font-size: 0.9rem;
  font-weight: 700;
  color: #1a1a1a;
  margin-bottom: 1rem;
}
.comp-content-text {
  font-size: 0.9rem;
  line-height: 1.85;
  color: var(--text-secondary);
}

/* ── Awards ── */
.comp-single-awards {
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  padding: 1.4rem 1.6rem;
}
.comp-single-awards h2 {
  font-size: 0.9rem;
  font-weight: 700;
  color: #1a1a1a;
  margin-bottom: 0.8rem;
}
.award-tags { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.award-tag {
  display: inline-block;
  padding: 0.3rem 0.8rem;
  border-radius: var(--radius-sm);
  font-size: 0.78rem;
  font-weight: 600;
  color: #fafaf6;
}

/* ── Tracks & Sub-Events ── */
.comp-single-subs {
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  padding: 1.4rem 1.6rem;
}
.comp-single-subs h2 {
  font-size: 0.9rem;
  font-weight: 700;
  color: #1a1a1a;
  margin-bottom: 1rem;
}
.track-section {
  margin-bottom: 1.2rem;
  padding-bottom: 1.2rem;
  border-bottom: 1px solid var(--border-subtle);
}
.track-section:last-child { margin-bottom: 0; padding-bottom: 0; border-bottom: none; }
.track-section-header {
  font-size: 0.88rem;
  font-weight: 700;
  color: #1a1a1a;
  margin-bottom: 0.6rem;
  display: flex;
  align-items: center;
  gap: 0.3rem;
  text-decoration: none;
}
.track-clickable:hover { color: var(--text-secondary); }
.track-link-arrow { font-size: 0.8rem; color: var(--text-muted); margin-left: auto; }
.track-no-subs-hint {
  font-size: 0.76rem;
  color: var(--text-muted);
  font-style: italic;
}
.sub-event-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 0.6rem;
}
.sub-event-card {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.7rem 0.9rem;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
  text-decoration: none;
  color: inherit;
  transition: all 0.2s;
}
.sub-event-card:hover { border-color: #1a1a1a; background: var(--bg-secondary); }
.sub-event-icon { font-size: 1rem; flex-shrink: 0; }
.sub-event-body h4 {
  font-size: 0.8rem;
  font-weight: 600;
  color: #1a1a1a;
}

/* ── Downloads ── */
.comp-downloads {
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  padding: 1.4rem 1.6rem;
}
.comp-downloads h2 {
  font-size: 0.9rem;
  font-weight: 700;
  color: #1a1a1a;
  margin-bottom: 0.8rem;
}
.comp-dl-list { display: flex; flex-direction: column; gap: 0.5rem; }
.comp-dl-item {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 0.8rem 1rem;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
  text-decoration: none;
  color: inherit;
  transition: all 0.2s;
}
.comp-dl-item:hover { border-color: #1a1a1a; background: var(--bg-secondary); }
.dl-icon { font-size: 1.5rem; flex-shrink: 0; }
.dl-info { flex: 1; }
.dl-info strong { display: block; font-size: 0.84rem; color: #1a1a1a; }
.dl-info span { font-size: 0.7rem; color: var(--text-muted); }
.dl-arrow { font-size: 1rem; color: var(--text-muted); }

/* ── Related Posts ── */
.comp-single-posts {
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  padding: 1.4rem 1.6rem;
}
.comp-single-posts h2 {
  font-size: 0.9rem;
  font-weight: 700;
  color: #1a1a1a;
  margin-bottom: 0.8rem;
}
.comp-post-list { display: flex; flex-direction: column; gap: 0.4rem; }
.comp-post-item {
  display: block;
  padding: 0.8rem 0;
  border-bottom: 1px solid var(--border-subtle);
  text-decoration: none;
  color: inherit;
}
.comp-post-item:last-child { border-bottom: none; }
.comp-post-item:hover .comp-post-item-top h4 { color: #1a1a1a; }
.comp-post-item-top {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1rem;
  margin-bottom: 0.3rem;
}
.comp-post-item-top h4 {
  font-size: 0.86rem;
  font-weight: 600;
  color: var(--text-primary);
}
.comp-post-date { font-size: 0.7rem; color: var(--text-muted); flex-shrink: 0; }
.comp-post-item-meta {
  display: flex;
  gap: 0.4rem;
  margin-bottom: 0.3rem;
}
.comp-post-badge {
  font-size: 0.66rem;
  padding: 0.1rem 0.4rem;
  border-radius: var(--radius-xs);
  background: var(--bg-secondary);
  color: var(--text-muted);
}
.comp-post-item-tags {
  display: flex;
  gap: 0.3rem;
  flex-wrap: wrap;
  margin-bottom: 0.3rem;
}
.comp-post-tag {
  font-size: 0.66rem;
  color: var(--text-muted);
}
.comp-post-excerpt {
  font-size: 0.76rem;
  color: var(--text-secondary);
  line-height: 1.6;
}

/* ── Sponsors ── */
.comp-sponsors {
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  padding: 1.4rem 1.6rem;
}
.comp-sponsors h2 {
  font-size: 0.9rem;
  font-weight: 700;
  color: #1a1a1a;
  margin-bottom: 0.8rem;
}
.sponsor-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
}
.sponsor-logo-placeholder {
  padding: 0.6rem 1.2rem;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
  font-size: 0.76rem;
  color: var(--text-muted);
  background: var(--bg-secondary);
}

/* ── Sidebar ── */
.comp-single-sidebar {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.comp-side-panel {
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  padding: 1.3rem;
}
.comp-side-panel h3 {
  font-size: 0.78rem;
  font-weight: 700;
  color: #1a1a1a;
  margin-bottom: 0.8rem;
}
.comp-side-panel dl { }
.comp-side-panel dt {
  font-size: 0.68rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-top: 0.4rem;
}
.comp-side-panel dd {
  font-size: 0.82rem;
  color: var(--text-primary);
  font-weight: 500;
}
.side-honor-list { display: flex; flex-direction: column; gap: 0.5rem; }
.side-honor-item {
  display: flex;
  align-items: center;
  gap: 0.6rem;
}
.side-honor-thumb {
  width: 36px; height: 36px;
  border-radius: var(--radius-xs);
  object-fit: cover;
  background: var(--bg-secondary);
}
.side-honor-thumb.placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.9rem;
}
.side-honor-info strong {
  display: block;
  font-size: 0.76rem;
  color: var(--text-primary);
}
.side-honor-info span {
  font-size: 0.66rem;
  color: var(--text-muted);
}

/* ═══════════════════════════════════════════════════════════
   COMPETITION HOME PAGE (CHP) — warm white minimal
   ═══════════════════════════════════════════════════════════ */
.chp-hero {
  position: relative;
  padding: 4rem 2rem;
  background: var(--bg-secondary);
  border-bottom: 1px solid var(--border-subtle);
  text-align: center;
  overflow: hidden;
}
.chp-hero-bg {
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 400px 200px at 50% 0%, rgba(26,26,26,0.03), transparent 70%);
  pointer-events: none;
}
.chp-hero-inner { position: relative; z-index: 1; max-width: 700px; margin: 0 auto; }
.chp-hero-badges {
  display: flex;
  justify-content: center;
  gap: 0.5rem;
  margin-bottom: 1rem;
  flex-wrap: wrap;
}
.chp-status-badge {
  padding: 0.2rem 0.7rem;
  border-radius: 50px;
  font-size: 0.7rem;
  font-weight: 600;
  border: 1px solid var(--border-subtle);
  background: var(--bg-primary);
  color: var(--text-secondary);
}
.chp-status-badge.ongoing {
  background: #1a1a1a;
  color: #fafaf6;
  border-color: #1a1a1a;
}
.chp-rank-badge {
  padding: 0.2rem 0.7rem;
  border-radius: 50px;
  font-size: 0.7rem;
  font-weight: 500;
  border: 1px solid var(--border-subtle);
  background: var(--bg-primary);
  color: var(--text-secondary);
}
.chp-title {
  font-size: clamp(1.2rem, 2.5vw, 1.6rem);
  font-weight: 800;
  color: #1a1a1a;
  margin-bottom: 0.4rem;
}
.chp-organizer {
  font-size: 0.88rem;
  color: var(--text-muted);
  margin-bottom: 0.8rem;
}
.chp-timeline {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  flex-wrap: wrap;
  font-size: 0.82rem;
}
.chp-tl-node { color: var(--text-secondary); }
.chp-tl-node i {
  font-style: normal;
  font-weight: 600;
  color: #1a1a1a;
}
.chp-tl-sep { color: var(--text-muted); }

/* ── CHP Stats ── */
.chp-stats {
  max-width: 800px;
  margin: -1px auto 0;
}
.chp-stats-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
  border-radius: 0 0 var(--radius-md) var(--radius-md);
  padding: 1rem 2rem;
}
.chp-stat-item { text-align: center; padding: 0 1.2rem; }
.chp-stat-num {
  display: block;
  font-family: var(--font-display);
  font-size: 1.4rem;
  font-weight: 800;
  color: #1a1a1a;
}
.chp-stat-label {
  font-size: 0.64rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.chp-stat-divider {
  width: 1px;
  height: 32px;
  background: var(--border-subtle);
  flex-shrink: 0;
}

/* ── CHP Body ── */
.chp-body {
  max-width: 1100px;
  margin: 2rem auto 0;
  padding: 0 2rem 4rem;
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 2rem;
  align-items: start;
}
.chp-main { display: flex; flex-direction: column; gap: 1.5rem; }
.chp-main > section {
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  padding: 1.6rem;
}
.chp-section-icon { font-size: 1.3rem; margin-bottom: 0.4rem; }
.chp-main h2 {
  font-size: 0.95rem;
  font-weight: 700;
  color: #1a1a1a;
  margin-bottom: 0.8rem;
}
.chp-intro-content {
  font-size: 0.9rem;
  line-height: 1.85;
  color: var(--text-secondary);
}

/* ── CHP Awards ── */
.chp-award-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 0.6rem;
}
.chp-award-card {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.6rem 0.8rem;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
  border-left: 3px solid var(--aw-color, #1a1a1a);
  background: var(--bg-primary);
}
.chp-award-medal {
  font-family: var(--font-display);
  font-size: 1.1rem;
  font-weight: 800;
  color: #1a1a1a;
}
.chp-award-name {
  font-size: 0.78rem;
  font-weight: 500;
  color: var(--text-primary);
}

/* ── CHP Tracks ── */
.chp-track-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 0.8rem;
}
.chp-track-card {
  display: block;
  padding: 1rem 1.2rem;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
  text-decoration: none;
  color: inherit;
  transition: all 0.2s;
  background: var(--bg-primary);
}
.chp-track-card:hover { border-color: #1a1a1a; }
.chp-track-clickable { cursor: pointer; }
.chp-track-header {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin-bottom: 0.5rem;
}
.chp-track-header h3 {
  font-size: 0.84rem;
  font-weight: 700;
  color: #1a1a1a;
}
.chp-track-icon { font-size: 1rem; }
.chp-sub-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
}
.chp-sub-tag {
  font-size: 0.68rem;
  padding: 0.1rem 0.4rem;
  border-radius: var(--radius-xs);
  background: var(--bg-secondary);
  color: var(--text-secondary);
}
.chp-sub-empty {
  font-size: 0.72rem;
  color: var(--text-muted);
  font-style: italic;
}

/* ── CHP Posts ── */
.chp-post-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 0.8rem;
}
.chp-post-card {
  display: block;
  padding: 1rem;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
  text-decoration: none;
  color: inherit;
  transition: all 0.2s;
}
.chp-post-card:hover { border-color: #1a1a1a; }
.chp-post-card-meta {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.4rem;
}
.chp-post-date {
  font-size: 0.66rem;
  color: var(--text-muted);
}
.chp-post-track {
  font-size: 0.62rem;
  padding: 0.06rem 0.4rem;
  border-radius: var(--radius-xs);
  background: var(--bg-secondary);
  color: var(--text-muted);
}
.chp-post-card h4 {
  font-size: 0.82rem;
  font-weight: 600;
  color: #1a1a1a;
  margin-bottom: 0.3rem;
}
.chp-post-tags {
  display: flex;
  gap: 0.3rem;
  flex-wrap: wrap;
  margin-bottom: 0.3rem;
  font-size: 0.66rem;
  color: var(--text-muted);
}
.chp-post-excerpt {
  font-size: 0.74rem;
  color: var(--text-secondary);
  line-height: 1.5;
}

/* ── CHP Sidebar ── */
.chp-sidebar {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.chp-side-card {
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  padding: 1.3rem;
}
.chp-side-card h3 {
  font-size: 0.78rem;
  font-weight: 700;
  color: #1a1a1a;
  margin-bottom: 0.8rem;
}
.chp-side-card dl { }
.chp-side-card dt {
  font-size: 0.66rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-top: 0.3rem;
}
.chp-side-card dd {
  font-size: 0.82rem;
  color: var(--text-primary);
  font-weight: 500;
}
.chp-dd-red { color: #b91c1c !important; font-weight: 600 !important; }
.chp-side-notice {
  display: block;
  padding: 0.5rem 0;
  border-bottom: 1px solid var(--border-subtle);
  text-decoration: none;
  color: var(--text-primary);
  font-size: 0.8rem;
  transition: color 0.15s;
}
.chp-side-notice:last-child { border-bottom: none; }
.chp-side-notice:hover { color: #1a1a1a; }
.chp-side-notice.is-important { font-weight: 600; }
.chp-side-notice-badge {
  font-size: 0.6rem;
  font-weight: 700;
  text-transform: uppercase;
  background: #1a1a1a;
  color: #fafaf6;
  padding: 0.08rem 0.35rem;
  border-radius: var(--radius-xs);
  margin-right: 0.3rem;
}
.chp-side-btn {
  display: block;
  width: 100%;
  padding: 0.55rem 1rem;
  border-radius: var(--radius-sm);
  font-size: 0.76rem;
  font-weight: 600;
  text-align: center;
  text-decoration: none;
  margin-top: 0.4rem;
  background: #1a1a1a;
  color: #fafaf6;
  border: 1.5px solid #1a1a1a;
  transition: all 0.2s;
}
.chp-side-btn:hover { background: #3d3d3d; border-color: #3d3d3d; color: #fafaf6; }
.chp-side-btn-outline {
  background: transparent;
  color: #1a1a1a;
}
.chp-side-btn-outline:hover { background: #1a1a1a; color: #fafaf6; }

/* ═══════════════════════════════════════════════════════════
   FRONT-PAGE EVENTS V2 — card-based (used by front-page.php)
   ═══════════════════════════════════════════════════════════ */
.events-list-v2 {
  max-width: 800px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.event-card {
  display: grid;
  grid-template-columns: 60px 1fr auto;
  gap: 1.5rem;
  align-items: center;
  padding: 1.5rem 1.8rem;
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  transition: border-color 0.2s;
}
.event-card:hover { border-color: var(--border-default); }
.event-date {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.event-date .day {
  font-family: var(--font-display);
  font-size: 1.6rem;
  font-weight: 800;
  color: #1a1a1a;
  line-height: 1;
}
.event-date .month {
  font-size: 0.7rem;
  color: var(--text-muted);
  margin-top: 0.2rem;
}
.event-info h4 {
  font-size: 0.95rem;
  font-weight: 600;
  color: #1a1a1a;
  margin-bottom: 0.2rem;
}
.event-meta {
  font-size: 0.78rem;
  color: var(--text-secondary);
}
.event-tag {
  font-size: 0.64rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 0.2rem 0.6rem;
  border-radius: 50px;
}
.event-tag.upcoming {
  background: #1a1a1a;
  color: #fafaf6;
}
.event-tag.past {
  background: var(--bg-secondary);
  color: var(--text-muted);
  border: 1px solid var(--border-subtle);
}

/* ── Front-page honors card style ── */
.honor-card {
  background: var(--bg-primary);
  padding: 2.5rem 1.5rem;
  text-align: center;
  transition: background 0.2s;
}
.honor-card:hover { background: var(--bg-secondary); }
.honor-icon {
  color: #1a1a1a;
  margin-bottom: 0.8rem;
  opacity: 0.8;
  display: inline-block;
}
.honor-number {
  font-family: var(--font-display);
  font-size: 2.8rem;
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 1;
  color: #1a1a1a;
}
.honor-suffix {
  font-family: var(--font-display);
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--text-muted);
}
.honor-label {
  display: block;
  font-size: 0.85rem;
  color: var(--text-secondary);
  font-weight: 500;
  margin-top: 0.3rem;
}
.honor-sub {
  font-size: 0.72rem;
  color: var(--text-muted);
  margin-top: 0.2rem;
}

/* ── Front-page honors divider ── */
.honors-divider {
  width: 40px;
  height: 1px;
  background: var(--border-default);
  margin: 2rem auto;
}

/* ── Front-page stats row ── */
.stats-row {
  max-width: 900px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
}
.stat-mini {
  text-align: center;
  padding: 1.5rem 1rem;
}
.mini-number {
  font-family: var(--font-display);
  font-size: 1.3rem;
  font-weight: 800;
  color: #1a1a1a;
  letter-spacing: -0.03em;
  line-height: 1;
}
.mini-label {
  font-size: 0.72rem;
  color: var(--text-muted);
  margin-top: 0.3rem;
}

/* ═══════════════════════════════════════════════════════════
   RESOURCE HUB — warm white tokens
   ═══════════════════════════════════════════════════════════ */
:root {
  --rh-bg: var(--bg-primary);
  --rh-surface: var(--bg-secondary);
  --rh-card: var(--bg-primary);
  --rh-border: var(--border-subtle);
  --rh-accent: #1a1a1a;
  --rh-accent2: #1a1a1a;
  --rh-gold: #1a1a1a;
}
.rh-wrap {
  font-family: var(--font-body);
  background: var(--bg-primary);
  color: var(--text-primary);
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
.rh-wrap *, .rh-wrap *::before, .rh-wrap *::after { margin: 0; padding: 0; box-sizing: border-box; }

/* gateway jump selector */
.rh-gateway {
  position: relative; z-index: 2;
  display: flex; align-items: center; justify-content: center;
  min-height: 100vh; padding: 2rem;
}
.rh-gateway-inner { text-align: center; max-width: 620px; }
.rh-gateway-inner h2 {
  font-size: 1.3rem; font-weight: 700; color: #1a1a1a;
  margin-bottom: 2rem; letter-spacing: -0.02em;
}
.rh-gateway-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; }
.rh-gateway-card {
  display: flex; flex-direction: column; align-items: center;
  gap: 0.5rem; padding: 2.2rem 1.5rem;
  background: var(--bg-primary); border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md); text-decoration: none; color: inherit;
  transition: all 0.25s; position: relative;
}
.rh-gateway-card:hover { border-color: #1a1a1a; transform: translateY(-3px); box-shadow: 0 6px 24px rgba(0,0,0,0.05); }
.rh-gw-icon { color: #1a1a1a; margin-bottom: 0.3rem; }
.rh-gateway-card strong { font-size: 1.05rem; font-weight: 700; color: #1a1a1a; }
.rh-gw-desc { font-size: 0.78rem; color: #9b9b9b; }
.rh-gw-arrow { font-size: 1.1rem; color: #bbb; transition: transform 0.2s; }
.rh-gateway-card:hover .rh-gw-arrow { transform: translateX(4px); color: #1a1a1a; }

/* starfield canvas */
#rhStarfield { position: fixed; inset: 0; z-index: 0; pointer-events: none; }

/* sphere section */
.rh-sphere-section {
  position: relative; z-index: 1;
  min-height: 100vh;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  padding: 6rem 0 2rem;
}
.rh-sphere-title { text-align: center; padding: 1rem; }
.rh-sphere-title h1 {
  font-size: clamp(1.3rem, 3vw, 1.8rem);
  font-weight: 800;
  color: #1a1a1a;
  letter-spacing: -0.02em;
}
.rh-sphere-title p { color: var(--text-secondary); margin-top: 0.5rem; font-size: 0.94rem; }
.rh-sphere-count {
  display: inline-flex; align-items: center; gap: 0.5rem;
  margin-top: 0.8rem;
  padding: 0.3rem 1rem; border-radius: 50px;
  background: var(--bg-secondary); border: 1px solid var(--border-subtle);
  font-size: 0.78rem; color: var(--text-secondary);
}
.rh-sphere-count span { color: #1a1a1a; font-weight: 700; }
.rh-sphere-stage {
  position: relative; width: 100%; max-width: 1100px;
  height: 560px; margin: 0 auto;
}
#rhSphereCanvas { position: absolute; inset: 0; display: block; cursor: grab; }
#rhSphereCanvas:active { cursor: grabbing; }
.rh-sphere-label {
  position: absolute; pointer-events: none;
  transform: translate(-50%, 0); text-align: center; z-index: 5;
  transition: opacity 0.3s;
}
.rh-sphere-label-text {
  display: block; font-size: 0.7rem; font-weight: 700;
  color: var(--text-inverse);
  background: #1a1a1a;
  backdrop-filter: blur(8px);
  padding: 0.25rem 0.6rem; border-radius: 6px;
  border: 1px solid rgba(26,26,26,0.2);
  white-space: nowrap; max-width: 140px;
  overflow: hidden; text-overflow: ellipsis;
  letter-spacing: 0.03em;
}
.rh-sphere-hint {
  position: absolute; bottom: 0.5rem; left: 50%;
  transform: translateX(-50%); font-size: 0.7rem;
  color: var(--text-muted); pointer-events: none;
  animation: rh-hint-fade 3s ease-in-out infinite; z-index: 2;
}
@keyframes rh-hint-fade { 0%,100%{opacity:0.2;} 50%{opacity:0.8;} }

/* tooltip */
.rh-tooltip { position: fixed; z-index: 50; pointer-events: none; opacity: 0; transition: opacity 0.2s; }
.rh-tooltip.visible { opacity: 1; }
.rh-tooltip-card {
  background: var(--bg-primary); border: 1px solid var(--border-default);
  border-radius: 14px; padding: 1rem 1.2rem;
  box-shadow: 0 8px 32px rgba(0,0,0,0.08);
  min-width: 200px;
}
.rh-tooltip-card h3 { font-size: 0.96rem; font-weight: 700; color: #1a1a1a; margin-bottom: 0.4rem; }
.rh-tooltip-stats { display: flex; gap: 1rem; font-size: 0.72rem; color: var(--text-secondary); }
.rh-tooltip-stats b { color: #1a1a1a; }

/* body */
.rh-body { position: relative; z-index: 1; max-width: 1300px; margin: 0 auto; padding: 0 2rem 4rem; }
.rh-grid { display: grid; grid-template-columns: 1fr 280px; gap: 2rem; align-items: start; }
.rh-main > section {
  background: var(--bg-primary); border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md); padding: 2rem; margin-bottom: 1.4rem;
}
.rh-main h2 { font-size: 1.1rem; font-weight: 700; color: #1a1a1a; display: flex; align-items: center; gap: 0.5rem; margin-bottom: 1.2rem; }

/* comp grid cards */
.rh-comp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 1rem; }
.rh-comp-card {
  display: block; text-decoration: none; color: inherit;
  background: var(--bg-primary); border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md); padding: 1.4rem;
  transition: all 0.2s;
}
.rh-comp-card:hover { border-color: #1a1a1a; transform: translateY(-2px); box-shadow: 0 4px 16px rgba(0,0,0,0.04); }
.rh-comp-card-badge {
  display: inline-block; padding: 0.15rem 0.6rem; border-radius: var(--radius-xs);
  font-size: 0.62rem; font-weight: 700; letter-spacing: 0.06em;
  margin-bottom: 0.8rem;
}
.rh-status-ongoing { background: #1a1a1a; color: #fafaf6; }
.rh-status-upcoming { background: var(--bg-secondary); color: var(--text-secondary); border: 1px solid var(--border-subtle); }
.rh-comp-card h3 { font-size: 1rem; font-weight: 700; color: #1a1a1a; line-height: 1.4; }
.rh-comp-meta {
  display: flex; gap: 0.8rem; margin-top: 0.7rem;
  font-size: 0.72rem; color: var(--text-secondary);
}
.rh-comp-meta span { display: flex; align-items: center; gap: 0.25rem; }

/* post cards */
.rh-posts-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 0.9rem; }
.rh-post-card {
  display: flex; flex-direction: column; padding: 1.1rem 1.2rem;
  background: var(--bg-primary); border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm); text-decoration: none; color: inherit;
  transition: all 0.2s;
}
.rh-post-card:hover { border-color: #1a1a1a; transform: translateY(-2px); }
.rh-post-meta { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.5rem; }
.rh-post-date { font-size: 0.66rem; color: var(--text-muted); }
.rh-post-comp-tag {
  font-size: 0.6rem; padding: 0.06rem 0.4rem; border-radius: 3px;
  background: var(--bg-secondary); color: var(--text-secondary);
}
.rh-post-card h4 { font-size: 0.86rem; font-weight: 600; color: #1a1a1a; line-height: 1.4; margin-bottom: 0.3rem; }
.rh-post-excerpt { font-size: 0.74rem; color: var(--text-secondary); line-height: 1.5; }
.rh-no-results { text-align: center; padding: 3rem 1rem; color: var(--text-muted); }

/* search */
.rh-search-bar { display: flex; gap: 0.5rem; margin-bottom: 1rem; flex-wrap: wrap; }
.rh-search-input {
  flex: 1; min-width: 200px; padding: 0.55rem 0.9rem;
  border: 1px solid var(--border-default); border-radius: var(--radius-sm);
  font-size: 0.84rem; font-family: var(--font-body);
  background: var(--bg-primary); color: var(--text-primary);
  outline: none; transition: border-color 0.2s;
}
.rh-search-input:focus { border-color: #1a1a1a; }
.rh-search-btn {
  padding: 0.55rem 1.2rem; border-radius: var(--radius-sm);
  font-size: 0.82rem; font-weight: 600; font-family: var(--font-body);
  border: 1.5px solid #1a1a1a; cursor: pointer;
  background: #1a1a1a; color: #fafaf6; transition: all 0.2s;
}
.rh-search-btn:hover { background: #3d3d3d; border-color: #3d3d3d; }
.rh-search-clear {
  padding: 0.55rem 1rem; border-radius: var(--radius-sm);
  font-size: 0.82rem; font-family: var(--font-body);
  border: 1px solid var(--border-default); background: transparent;
  color: var(--text-secondary); cursor: pointer; transition: all 0.2s;
}
.rh-search-clear:hover { border-color: #1a1a1a; color: #1a1a1a; }

/* sidebar */
.rh-sidebar { display: flex; flex-direction: column; gap: 1rem; }
.rh-side-card {
  background: var(--bg-primary); border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md); padding: 1.3rem;
}
.rh-side-card h3 { font-size: 0.82rem; font-weight: 700; color: #1a1a1a; margin-bottom: 0.8rem; }
.rh-side-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; }
.rh-side-stat {
  text-align: center; padding: 0.6rem;
  background: var(--bg-secondary); border-radius: var(--radius-sm);
  border: 1px solid var(--border-subtle);
}
.rh-side-stat-num { font-size: 1.2rem; font-weight: 800; color: #1a1a1a; line-height: 1.2; }
.rh-side-stat-label { font-size: 0.62rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.06em; }
.rh-tag-cloud { display: flex; flex-wrap: wrap; gap: 0.3rem; }
.rh-tag-item {
  padding: 0.18rem 0.55rem; border-radius: 50px; font-size: 0.68rem;
  border: 1px solid var(--border-default); cursor: pointer;
  transition: all 0.2s; color: var(--text-secondary);
  background: transparent; font-family: var(--font-body);
}
.rh-tag-item:hover, .rh-tag-item.active { border-color: #1a1a1a; color: #1a1a1a; background: var(--bg-secondary); }

/* ═══════════════════════════════════════════════════════════
   PAGE DEFAULT — generic page wrapper (write-post, honor-upload, etc.)
   ═══════════════════════════════════════════════════════════ */
.page-default {
  max-width: 780px;
  margin: 0 auto;
  padding: 1.5rem 1.5rem 4rem;
  font-family: var(--font-body);
}
.page-header-section {
  margin-bottom: 1.8rem;
  padding: 0;
  border-bottom: 1px solid var(--border-subtle);
  padding-bottom: 1rem;
}
.page-header-section h1 {
  font-size: 1rem;
  font-weight: 700;
  color: #1a1a1a;
  margin: 0 0 0.35rem;
  letter-spacing: -0.01em;
  display: flex;
  align-items: center;
  gap: 0.4rem;
}
.page-header-section h1 svg {
  color: #1a1a1a;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
}
.page-header-section p {
  font-size: 0.78rem;
  color: #9b9b9b;
  margin: 0;
  line-height: 1.5;
  margin-left: auto;
  margin-right: auto;
}

/* ═══════════════════════════════════════════════════════════
   SINGLE POST — warm white minimal
   ═══════════════════════════════════════════════════════════ */
.single-post-wrap {
  max-width: 780px;
  margin: 0 auto;
  padding: 2rem 1.5rem;
  font-family: var(--font-body);
}
.single-post-article {
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  padding: 2rem 2rem 2.5rem;
  margin-bottom: 2rem;
}
.sp-header { margin-bottom: 1.8rem; }
.sp-category {
  display: inline-block;
  padding: 0.2rem 0.7rem;
  border-radius: var(--radius-xs);
  background: var(--bg-secondary);
  color: #1a1a1a;
  font-size: 0.75rem;
  font-weight: 600;
  margin-bottom: 0.8rem;
}
.sp-header h1 {
  font-size: 1.3rem;
  font-weight: 800;
  color: #1a1a1a;
  line-height: 1.35;
  margin: 0 0 0.8rem;
}
.sp-meta {
  display: flex;
  gap: 1rem;
  font-size: 0.78rem;
  color: var(--text-secondary);
}
.sp-vis-badge {
  font-size: 0.68rem;
  background: var(--bg-secondary);
  color: var(--text-muted);
  padding: 0.1rem 0.55rem;
  border-radius: 999px;
  border: 1px solid var(--border-subtle);
}
.sp-thumb {
  margin-bottom: 1.8rem;
  border-radius: var(--radius-sm);
  overflow: hidden;
}
.sp-thumb img { width: 100%; height: auto; display: block; }
.sp-content {
  font-size: 0.95rem;
  line-height: 1.85;
  color: var(--text-primary);
}
.sp-content h2, .sp-content h3 { color: #1a1a1a; margin: 1.5rem 0 0.8rem; }
.sp-content p { margin: 0 0 1rem; }
.sp-content img { max-width: 100%; border-radius: var(--radius-sm); margin: 1rem 0; }
.sp-content pre {
  background: #1a1a1a; color: #fafaf6;
  padding: 1rem; border-radius: var(--radius-sm);
  overflow-x: auto; font-size: 0.85rem;
}
.sp-content code {
  background: var(--bg-secondary);
  padding: 0.15rem 0.4rem;
  border-radius: var(--radius-xs);
  font-size: 0.88em;
  color: #1a1a1a;
}
.sp-content pre code { background: transparent; color: inherit; padding: 0; }
.sp-tags {
  margin-top: 1.5rem;
  padding-top: 1.2rem;
  border-top: 1px solid var(--border-subtle);
}
.sp-tag-label { font-size: 0.75rem; color: var(--text-secondary); margin-right: 0.5rem; }
.sp-tags a {
  display: inline-block;
  margin: 0.2rem 0.3rem;
  padding: 0.2rem 0.65rem;
  border-radius: 50px;
  background: var(--bg-secondary);
  color: var(--text-secondary);
  font-size: 0.72rem;
  text-decoration: none;
  font-weight: 500;
}
.sp-tags a:hover { background: var(--border-default); color: #1a1a1a; }

/* Comments */
.single-post-comments {
  background: var(--bg-primary);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  padding: 2rem;
}
.single-post-comments textarea {
  width: 100%;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-sm);
  padding: 0.8rem;
  font-size: 0.88rem;
  font-family: var(--font-body);
  resize: vertical;
}
.single-post-comments input[type="submit"] {
  background: #1a1a1a;
  color: #fafaf6;
  border: 1.5px solid #1a1a1a;
  padding: 0.6rem 1.5rem;
  border-radius: var(--radius-sm);
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
  margin-top: 0.5rem;
  transition: all 0.2s;
}
.single-post-comments input[type="submit"]:hover { background: #3d3d3d; border-color: #3d3d3d; }
.commentlist { list-style: none; padding: 0; margin: 1.5rem 0 0; }
.commentlist li { padding: 1rem 0; border-bottom: 1px solid var(--border-subtle); }
.commentlist .comment-author { font-weight: 600; color: #1a1a1a; font-size: 0.85rem; }
.commentlist .comment-meta { font-size: 0.7rem; color: var(--text-muted); margin: 0.2rem 0 0.5rem; }
.commentlist .comment-body p { font-size: 0.85rem; color: var(--text-secondary); line-height: 1.6; margin: 0; }

/* ═══════════════════════════════════════════════════════════
   LEVEL BADGE
   ═══════════════════════════════════════════════════════════ */
.level-badge {
  display: inline-flex;
  align-items: center;
  font-size: 0.68rem;
  font-weight: 600;
  padding: 0.12rem 0.55rem;
  border-radius: 10px;
  white-space: nowrap;
  vertical-align: middle;
  line-height: 1.5;
  margin-left: 0.3rem;
}

/* ═══════════════════════════════════════════════════════════
   ADMIN PANEL (front-end)
   ═══════════════════════════════════════════════════════════ */
.ap-review-item { transition: background 0.12s; }
.ap-review-item:hover { background: var(--bg-secondary); }
.ap-review-item h4 { font-size: 0.92rem; font-weight: 600; color: var(--text-primary); margin: 0 0 0.25rem; }
.ap-empty { padding: 2.5rem 2rem; text-align: center; color: var(--text-muted); font-size: 0.84rem; }

.ap-tab {
  padding: 0.7rem 1.5rem;
  font-size: 0.84rem;
  font-weight: 500;
  color: var(--text-muted);
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  cursor: pointer;
  transition: 0.15s;
  font-family: var(--font-body);
  letter-spacing: 0.01em;
}
.ap-tab:hover { color: var(--text-primary); }
.ap-tab.active { color: var(--text-primary); font-weight: 600; border-bottom-color: var(--text-primary); }

.ap-btn {
  display: inline-flex; align-items: center; gap: 0.3rem;
  padding: 0.35rem 1rem; font-size: 0.76rem; font-weight: 600;
  border-radius: var(--radius-xs); border: 1px solid transparent;
  cursor: pointer; font-family: var(--font-body); transition: 0.15s;
  text-decoration: none; letter-spacing: 0.01em;
}
.ap-btn-primary { background: var(--text-primary); color: #fafaf6; border-color: var(--text-primary); }
.ap-btn-primary:hover { background: #3d3d3d; }
.ap-btn-danger { background: #b91c1c; color: #fafaf6; border-color: #b91c1c; }
.ap-btn-danger:hover { background: #991b1b; }
.ap-btn-ghost { background: var(--bg-primary); color: var(--text-secondary); border-color: var(--border-default); }
.ap-btn-ghost:hover { background: var(--bg-secondary); color: var(--text-primary); }

.ap-reject-form {
  display: none; width: 100%; margin-top: 0.4rem;
}
.ap-reject-form textarea {
  width: 100%; font-family: var(--font-body); font-size: 0.78rem;
  padding: 0.5rem; border: 1px solid var(--border-default);
  border-radius: var(--radius-xs); resize: vertical; min-height: 50px;
  background: var(--bg-primary); color: var(--text-primary);
}
.ap-reject-form textarea:focus { outline: none; border-color: var(--text-primary); }

.ap-user-table { width: 100%; border-collapse: collapse; font-size: 0.82rem; }
.ap-user-table th {
  padding: 0.7rem 1rem; text-align: left; font-weight: 600;
  color: var(--text-secondary); font-size: 0.72rem;
  text-transform: uppercase; letter-spacing: 0.04em;
  border-bottom: 2px solid var(--border-strong);
}
.ap-user-table td { padding: 0.65rem 1rem; border-bottom: 1px solid var(--border-subtle); vertical-align: middle; }
.ap-user-table tr:hover td { background: var(--bg-secondary); }

.ap-page-link {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 2rem; height: 2rem; padding: 0 0.5rem;
  font-size: 0.76rem; font-weight: 500; color: var(--text-secondary);
  text-decoration: none; border: 1px solid var(--border-default);
  border-radius: var(--radius-xs); background: var(--bg-primary);
}
.ap-page-link:hover { background: var(--bg-secondary); color: var(--text-primary); }
.ap-page-link.current { background: var(--text-primary); color: #fafaf6; border-color: var(--text-primary); }

/* ═══════════════════════════════════════════════════════════
   RESPONSIVE ADDITIONS
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 1100px) {
  .comp-single-body { grid-template-columns: 1fr; }
  .chp-body { grid-template-columns: 1fr; }
  .dash-main-grid { grid-template-columns: 1fr; }
  .rh-grid { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  .dth-inner { flex-wrap: wrap; gap: 0.5rem; padding: 0.45rem 1rem; }
  .dth-actions { margin-left: 0; }
  .dash-main-grid { grid-template-columns: 1fr; }
  .quick-grid-v2 { grid-template-columns: repeat(2, 1fr); }
  .honor-wall-v2 { grid-template-columns: 1fr; }
  .comp-hero-btns { flex-direction: column; }
  .comp-info-strip { flex-direction: column; }
  .comp-info-strip-item { border-right: none; border-bottom: 1px solid var(--border-subtle); }
  .comp-info-strip-item:last-child { border-bottom: none; }
  .comp-quick-cards { grid-template-columns: 1fr; }
  .chp-body { grid-template-columns: 1fr; }
  .chp-stats-inner { flex-wrap: wrap; gap: 0.6rem; }
  .chp-stat-divider { display: none; }
  .event-card { grid-template-columns: 1fr; gap: 0.5rem; }
  .stats-row { grid-template-columns: repeat(2, 1fr); }
  .rh-grid { grid-template-columns: 1fr; }
  .rh-comp-grid { grid-template-columns: 1fr; }
  .rh-posts-grid { grid-template-columns: 1fr; }
  .single-post-article { padding: 1.3rem; }
  .sp-header h1 { font-size: 1.35rem; }
}
@media (max-width: 500px) {
  .dphv3-actions-row { flex-direction: column; }
  .quick-grid-v2 { grid-template-columns: repeat(2, 1fr); }
  .stats-row { grid-template-columns: 1fr 1fr; }
  .honor-number { font-size: 2.2rem; }
}

/* ═══════════════════════════════════════════════════════════
   RESPONSIVE (original)
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 1100px) {
  .dash-grid { grid-template-columns: 1fr; }
  .footer-v2-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 960px) {
  .philosophy-grid { grid-template-columns: 1fr; gap: 3.5rem; }
  .phil-mark { max-width: 220px; }
  .honors-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 768px) {
  .nav { padding: 0 1.5rem; }
  .nav-links { display: none; }
  .hero { padding: 5.5rem 1.5rem 4rem; }
  .hero-buttons { flex-direction: column; align-items: center; }
  .philosophy { padding: 5rem 1.5rem; }
  .tracks { padding: 5rem 1.5rem; }
  .tracks-grid { grid-template-columns: 1fr; }
  .honors { padding: 5rem 1.5rem; }
  .honors-grid { grid-template-columns: 1fr; }
  .events { padding: 5rem 1.5rem; }
  .cta-section { padding: 5rem 1.5rem; }
  .event-item { grid-template-columns: 1fr; gap: 0.5rem; }
  .event-arrow { display: none; }
  .footer-v2-grid { grid-template-columns: 1fr; gap: 2.5rem; }
  .dash-wrap { padding: 1.5rem 1rem; }
  .lr-wrap { grid-template-columns: 1fr; }
  .campus-form { padding: 1.5rem; }
  .campus-form .form-row-split { grid-template-columns: 1fr; }
}
@media (max-width: 500px) {
  .hero-title { font-size: 2.2rem; }
  .honor-number { font-size: 2.2rem; }
  .dash-stat-row { grid-template-columns: 1fr 1fr; }
}
