:root {
    --bg-light: #ffffff;
    --bg-dark: #1a1a1a;
    --bg-sepia: #f4ecd8;
    --text-light: #2c3e50;
    --text-dark: #e0e0e0;
}

body { transition: background 0.3s, color 0.3s; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; }
.theme-light { background-color: var(--bg-light); color: var(--text-light); }
.theme-dark { background-color: var(--bg-dark); color: var(--text-dark); }
.theme-sepia { background-color: var(--bg-sepia); color: #5b4636; }

.story-card { transition: transform 0.2s; cursor: pointer; border: none; box-shadow: 0 4px 6px rgba(0,0,0,0.1); }
.story-card:hover { transform: translateY(-5px); }
.story-card img { height: 250px; object-fit: cover; }

#reader-content {
    line-height: 1.8;
    max-width: 800px;
    margin: 0 auto;
    text-align: justify;
}

.settings-bar {
    background: rgba(0,0,0,0.05);
    padding: 15px;
    border-radius: 8px;
    margin-bottom: 20px;
}