/* NovelWeb — Pastel Dream Design System */
@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@300;400;500;600;700&family=Nunito:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&display=swap');

:root {
  --blush-50: #FFF5F7; --blush-100: #FFE8EE; --blush-200: #FFD1DE; --blush-300: #FFB3C9; --blush-400: #FF8FB0; --blush-500: #FF6B96; --blush-600: #E84D7A;
  --lavender-50: #F5F0FF; --lavender-100: #EDE5FF; --lavender-200: #DCCBFF; --lavender-300: #C4A8FF; --lavender-400: #AB82FF; --lavender-500: #9361FF;
  --mint-50: #F0FDF7; --mint-100: #DCFCE7; --mint-200: #BBF7D0; --mint-300: #86EFAC; --mint-400: #4ADE80; --mint-500: #22C55E;
  --peach-50: #FFF7ED; --peach-100: #FFEDD5; --peach-200: #FED7AA; --peach-300: #FDBA74; --peach-400: #FB923C;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: 'Nunito', sans-serif; background: linear-gradient(180deg, #FFF5F7 0%, #F5F0FF 50%, #F0FDF7 100%); min-height: 100vh; color: #374151; }
h1,h2,h3,h4 { font-family: 'Quicksand', sans-serif; }

/* Glass card */
.glass { background: rgba(255,255,255,0.7); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border: 1px solid rgba(255,255,255,0.5); }
.glass-strong { background: rgba(255,255,255,0.85); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border: 1px solid rgba(255,255,255,0.6); }

/* Hover effects */
.card-hover { transition: all 0.25s ease; }
.card-hover:hover { transform: translateY(-4px); box-shadow: 0 16px 40px -8px rgba(147,97,255,0.15); }

/* Gradient text */
.gradient-text { background: linear-gradient(135deg, var(--lavender-400), var(--blush-400), var(--peach-400)); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }

/* Gradient button */
.btn-gradient { background: linear-gradient(135deg, var(--lavender-400), var(--blush-400)); color: white; border: none; cursor: pointer; transition: all 0.3s; }
.btn-gradient:hover { background: linear-gradient(135deg, var(--lavender-500), var(--blush-500)); box-shadow: 0 4px 20px rgba(147,97,255,0.3); }

/* Line clamp */
.line-clamp-2 { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.line-clamp-3 { display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }

/* Nav */
.nav-link { color: #9CA3AF; font-size: 0.875rem; transition: color 0.2s; text-decoration: none; }
.nav-link:hover { color: var(--lavender-500); }
.nav-link.active { color: var(--lavender-500); font-weight: 600; }

/* Animations */
@keyframes float { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-10px)} }
.float { animation: float 6s ease-in-out infinite; }
@media (prefers-reduced-motion:reduce) { .card-hover:hover{transform:none;} .float{animation:none;} }

/* Star rating */
.star { color: var(--peach-400); }

/* Tag pills */
.tag { display: inline-flex; align-items: center; padding: 0.25rem 0.75rem; border-radius: 9999px; font-size: 0.75rem; font-weight: 500; }
.tag-blush { background: var(--blush-50); color: var(--blush-600); border: 1px solid var(--blush-100); }
.tag-lavender { background: var(--lavender-50); color: var(--lavender-500); border: 1px solid var(--lavender-100); }
.tag-mint { background: var(--mint-50); color: var(--mint-500); border: 1px solid var(--mint-100); }
.tag-peach { background: var(--peach-50); color: var(--peach-400); border: 1px solid var(--peach-100); }