爱情苦海

/* ========================================
   Theme: Romantic Warm — 柔情似水
   Soft pinks, warm gradients, gentle glow
   ======================================== */

:root {
  --bg-primary: #fff5f2;
  --bg-hero-start: #fff5f2;
  --bg-hero-end: #fde8e4;
  --bg-interlude-start: #fde8e4;
  --bg-interlude-mid: #f5d5ce;
  --bg-interlude-end: #edc5bc;
  --text-primary: #3a2030;
  --text-body: #5a3a48;
  --accent: #d4728c;
  --accent-light: #c4899a;
  --border: #f0d0d0;
}

/* --- Hero with warm glow --- */
.hero {
  background: linear-gradient(180deg, #fff5f2 0%, #fde8e4 60%, #fce0da 100%);
}

.hero::before {
  content: '';
  position: absolute;
  top: 20%;
  left: 50%;
  width: 500px;
  height: 500px;
  transform: translateX(-50%);
  background: radial-gradient(circle, rgba(212,114,140,0.08) 0%, transparent 70%);
  z-index: 0;
  pointer-events: none;
}

.hero-title {
  background: linear-gradient(135deg, #3a2030, #d4728c);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* --- Warm pink waves --- */
.wave-1 {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 180'%3E%3Cpath fill='%23d4728c18' d='M0,80 C250,140 350,0 500,80 C650,160 750,20 1000,80 L1000,180 L0,180Z'/%3E%3C/svg%3E");
}

.wave-2 {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 180'%3E%3Cpath fill='%23e8a0b420' d='M0,100 C200,40 400,140 600,80 C800,20 900,120 1000,100 L1000,180 L0,180Z'/%3E%3C/svg%3E");
}

.wave-3 {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 180'%3E%3Cpath fill='%23d4728c10' d='M0,120 C150,60 350,150 500,100 C650,50 850,130 1000,120 L1000,180 L0,180Z'/%3E%3C/svg%3E");
}

/* --- Interlude warm --- */
.interlude {
  background: linear-gradient(180deg, #fde8e4 0%, #f5d5ce 50%, #edc5bc 100%);
}

.ocean-wave-1 {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 200'%3E%3Cpath fill='%23d4728c22' d='M0,100 C300,20 400,160 600,100 C800,40 900,150 1200,100 L1200,200 L0,200Z'/%3E%3C/svg%3E");
}

.ocean-wave-2 {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 200'%3E%3Cpath fill='%23e8a0b430' d='M0,120 C200,60 500,160 700,100 C900,40 1100,140 1200,120 L1200,200 L0,200Z'/%3E%3C/svg%3E");
}

.ocean-wave-3 {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 200'%3E%3Cpath fill='%23c4899a25' d='M0,80 C150,140 350,40 600,100 C850,160 950,60 1200,80 L1200,200 L0,200Z'/%3E%3C/svg%3E");
}

.ocean-wave-4 {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 200'%3E%3Cpath fill='%23d4728c30' d='M0,130 C250,70 450,160 650,110 C850,60 1050,150 1200,130 L1200,200 L0,200Z'/%3E%3C/svg%3E");
}

/* --- Romantic accents --- */
.poem-divider {
  background: linear-gradient(90deg, transparent, #d4728c, transparent);
  opacity: 0.4;
}

.quote-text {
  text-shadow: 0 0 40px rgba(212,114,140,0.1);
}

/* --- Floating hearts decoration --- */
.philosophy::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background:
    radial-gradient(3px 3px at 15% 30%, rgba(212,114,140,0.15) 50%, transparent 100%),
    radial-gradient(2px 2px at 75% 20%, rgba(232,160,180,0.12) 50%, transparent 100%),
    radial-gradient(3px 3px at 85% 70%, rgba(212,114,140,0.1) 50%, transparent 100%),
    radial-gradient(2px 2px at 25% 80%, rgba(232,160,180,0.12) 50%, transparent 100%);
  pointer-events: none;
}

.philosophy {
  position: relative;
}

/* --- Footer --- */
.footer-name {
  color: #d4728c;
}

/* --- Theme Switcher --- */
.theme-toggle {
  background: #fff5f2;
  border-color: #f0d0d0;
}

.theme-panel {
  background: #fff5f2;
  border-color: #f0d0d0;
}

.theme-option:hover,
.theme-option.active {
  background: #fde8e4;
}