/* Theme: Light */
body.theme-light {
    background: linear-gradient(135deg, #f5f5f5 0%, #e0e0e0 100%);
    color: #333;
}
body.theme-light::before {
    content: "☀️";
    position: fixed;
    font-size: max(60vw, 600px);
    opacity: 0.15;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
}
.theme-light .theme-title {
    color: #1565c0;
}
.theme-light .dice-count {
    background: #fff;
    color: #1a1a1a;
    box-shadow: 0 4px 20px rgba(0,0,0,0.15);
    border: 3px solid #1565c0;
}
.theme-light button {
    background: #e0e0e0;
    color: #333;
}
.theme-light .btn-primary {
    background: #1565c0;
    color: white;
}
.theme-light .unlock-btn {
    background: #ff9800;
    color: white;
}
.theme-light .theme-selector select,
.theme-light .mute-btn {
    background: white;
    border-color: #1565c0;
    color: #333;
}

/* Theme: Dark */
body.theme-dark {
    background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%);
    color: #f0f0f0;
}
body.theme-dark::before {
    content: "🌙";
    position: fixed;
    font-size: max(60vw, 600px);
    opacity: 0.15;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
}
.theme-dark .theme-title {
    color: #bb86fc;
}
.theme-dark .dice-count {
    background: #333;
    color: #ffffff;
    box-shadow: 0 4px 20px rgba(0,0,0,0.5);
    border: 3px solid #bb86fc;
}
.theme-dark button {
    background: #404040;
    color: #f0f0f0;
}
.theme-dark .btn-primary {
    background: #7c4dff;
    color: white;
}
.theme-dark .unlock-btn {
    background: #f57c00;
    color: white;
}
.theme-dark .theme-selector select,
.theme-dark .mute-btn {
    background: #2d2d2d;
    color: #f0f0f0;
    border-color: #bb86fc;
}

/* Theme: OLED */
body.theme-oled {
    background: #000000;
    color: #ffffff;
}
body.theme-oled::before {
    content: none;
}
.theme-oled .theme-title {
    color: #00ffff;
}
.theme-oled .dice-count {
    background: #000000;
    color: #00ffff;
    box-shadow: 0 0 20px rgba(0,255,255,0.3);
    border: 2px solid #00ffff;
}
.theme-oled button {
    background: #000000;
    color: #ffffff;
    border: 1px solid #00ffff;
}
.theme-oled .btn-primary {
    background: #000000;
    color: #00ffff;
    border: 2px solid #00ffff;
}
.theme-oled .unlock-btn {
    background: #ff00ff;
    color: white;
}
.theme-oled .theme-selector select,
.theme-oled .mute-btn {
    background: #000000;
    color: #00ffff;
    border-color: #00ffff;
}
.theme-oled .quote-display {
    color: #888888;
}

/* Theme: Pirates */
body.theme-pirates {
    background: linear-gradient(135deg, #1a0f00 0%, #3d2914 50%, #2a1a08 100%);
    color: #d4a574;
}
body.theme-pirates::before {
    content: "☠️";
    position: fixed;
    font-size: max(60vw, 600px);
    opacity: 0.15;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
}
.theme-pirates .theme-title {
    color: #ffd700;
    font-family: 'Times New Roman', serif;
    text-shadow: 3px 3px 6px rgba(0,0,0,0.8);
}
.theme-pirates .dice-count {
    background: #2a1a08;
    color: #ffd700;
    box-shadow: 0 4px 20px rgba(255,215,0,0.3);
    border: 4px solid #ffd700;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.8);
}
.theme-pirates button {
    background: #5c3d1e;
    color: #ffd700;
    border: 2px solid #8b6914;
}
.theme-pirates .btn-primary {
    background: #8b6914;
    color: #1a0f00;
}
.theme-pirates .unlock-btn {
    background: #8b0000;
    color: #ffd700;
}
.theme-pirates .theme-selector select,
.theme-pirates .mute-btn {
    background: #3d2914;
    color: #ffd700;
    border-color: #8b6914;
}
.theme-pirates .quote-display {
    color: #ffd700;
}

/* Theme: Ocean */
body.theme-ocean {
    background: linear-gradient(180deg, #0c2340 0%, #1565c0 50%, #0d47a1 100%);
    color: #e3f2fd;
}
body.theme-ocean::before {
    content: "🌊";
    position: fixed;
    font-size: max(60vw, 600px);
    opacity: 0.15;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
}
.theme-ocean .theme-title {
    color: #81d4fa;
}
.theme-ocean .dice-count {
    background: #0d47a1;
    color: #ffffff;
    box-shadow: 0 4px 20px rgba(129,212,250,0.3);
    border: 3px solid #81d4fa;
}
.theme-ocean button {
    background: #1976d2;
    color: white;
}
.theme-ocean .btn-primary {
    background: #0d47a1;
    color: white;
}
.theme-ocean .unlock-btn {
    background: #ff6f00;
    color: white;
}
.theme-ocean .theme-selector select,
.theme-ocean .mute-btn {
    background: #1565c0;
    color: white;
    border-color: #81d4fa;
}

/* Theme: Skull */
body.theme-skull {
    background: linear-gradient(135deg, #000 0%, #1a1a1a 100%);
    color: #fff;
}
body.theme-skull::before {
    content: "💀";
    position: fixed;
    font-size: max(60vw, 600px);
    opacity: 0.15;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
}
.theme-skull .theme-title {
    color: #ff0000;
}
.theme-skull .dice-count {
    background: #1a1a1a;
    color: #ffffff;
    box-shadow: 0 0 30px rgba(255,0,0,0.4);
    border: 3px solid #ff0000;
}
.theme-skull button {
    background: #333;
    color: #fff;
    border: 1px solid #ff0000;
}
.theme-skull .btn-primary {
    background: #b71c1c;
    color: white;
}
.theme-skull .unlock-btn {
    background: #ff0000;
    color: white;
}
.theme-skull .theme-selector select,
.theme-skull .mute-btn {
    background: #1a1a1a;
    color: white;
    border-color: #ff0000;
}

/* Theme: Treasure */
body.theme-treasure {
    background: linear-gradient(135deg, #4a2c00 0%, #7b5e00 50%, #4a2c00 100%);
    color: #fff8e1;
}
body.theme-treasure::before {
    content: "💰";
    position: fixed;
    font-size: max(60vw, 600px);
    opacity: 0.15;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
}
.theme-treasure .theme-title {
    color: #ffd700;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.5), 0 0 20px rgba(255,215,0,0.5);
}
.theme-treasure .dice-count {
    background: linear-gradient(135deg, #ffd700 0%, #ffb300 100%);
    color: #3d2000;
    box-shadow: 0 4px 30px rgba(255,215,0,0.5);
    border: 4px solid #8b6914;
    font-weight: 900;
}
.theme-treasure button {
    background: #8d6e00;
    color: #fff8e1;
}
.theme-treasure .btn-primary {
    background: #ffc107;
    color: #3d2000;
}
.theme-treasure .unlock-btn {
    background: #ff6f00;
    color: white;
}
.theme-treasure .theme-selector select,
.theme-treasure .mute-btn {
    background: #7b5e00;
    color: #fff8e1;
    border-color: #ffd700;
}

/* Theme: Storm */
body.theme-storm {
    background: linear-gradient(180deg, #263238 0%, #37474f 50%, #455a64 100%);
    color: #eceff1;
}
body.theme-storm::before {
    content: "⛈️";
    position: fixed;
    font-size: max(60vw, 600px);
    opacity: 0.15;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
}
.theme-storm .theme-title {
    color: #90a4ae;
}
.theme-storm .dice-count {
    background: #263238;
    color: #ffffff;
    box-shadow: 0 4px 20px rgba(0,0,0,0.5);
    border: 3px solid #90a4ae;
}
.theme-storm button {
    background: #546e7a;
    color: #eceff1;
}
.theme-storm .btn-primary {
    background: #78909c;
    color: #263238;
}
.theme-storm .unlock-btn {
    background: #ff8f00;
    color: white;
}
.theme-storm .theme-selector select,
.theme-storm .mute-btn {
    background: #455a64;
    color: #eceff1;
    border-color: #78909c;
}

/* Theme: Rum */
body.theme-rum {
    background: linear-gradient(135deg, #3e2723 0%, #5d4037 50%, #4e342e 100%);
    color: #efebe9;
}
body.theme-rum::before {
    content: "🍺";
    position: fixed;
    font-size: max(60vw, 600px);
    opacity: 0.15;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
}
.theme-rum .theme-title {
    color: #ffab91;
}
.theme-rum .dice-count {
    background: #3e2723;
    color: #ffffff;
    box-shadow: 0 4px 20px rgba(255,171,145,0.3);
    border: 3px solid #ffab91;
}
.theme-rum button {
    background: #6d4c41;
    color: #efebe9;
}
.theme-rum .btn-primary {
    background: #8d6e63;
    color: white;
}
.theme-rum .unlock-btn {
    background: #ff5722;
    color: white;
}
.theme-rum .theme-selector select,
.theme-rum .mute-btn {
    background: #5d4037;
    color: #efebe9;
    border-color: #8d6e63;
}

/* Theme: Kraken */
body.theme-kraken {
    background: linear-gradient(135deg, #0d0d0d 0%, #1a237e 50%, #0d0d0d 100%);
    color: #c5cae9;
}
body.theme-kraken::before {
    content: "🦑";
    position: fixed;
    font-size: max(60vw, 600px);
    opacity: 0.15;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
}
.theme-kraken .theme-title {
    color: #7c4dff;
    text-shadow: 0 0 20px rgba(124,77,255,0.5);
}
.theme-kraken .dice-count {
    background: #1a237e;
    color: #ffffff;
    box-shadow: 0 0 40px rgba(124,77,255,0.4);
    border: 3px solid #7c4dff;
}
.theme-kraken button {
    background: #283593;
    color: #c5cae9;
}
.theme-kraken .btn-primary {
    background: #7c4dff;
    color: white;
}
.theme-kraken .unlock-btn {
    background: #ff4081;
    color: white;
}
.theme-kraken .theme-selector select,
.theme-kraken .mute-btn {
    background: #1a237e;
    color: #c5cae9;
    border-color: #7c4dff;
}

/* Theme: Dutchman */
body.theme-dutchman {
    background: linear-gradient(180deg, #004d40 0%, #00695c 50%, #004d40 100%);
    color: #e0f2f1;
}
body.theme-dutchman::before {
    content: "👻";
    position: fixed;
    font-size: max(60vw, 600px);
    opacity: 0.15;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
}
.theme-dutchman .theme-title {
    color: #64ffda;
    text-shadow: 0 0 15px rgba(100,255,218,0.5);
}
.theme-dutchman .dice-count {
    background: #004d40;
    color: #ffffff;
    box-shadow: 0 0 30px rgba(100,255,218,0.3);
    border: 3px solid #64ffda;
}
.theme-dutchman button {
    background: #00796b;
    color: #e0f2f1;
}
.theme-dutchman .btn-primary {
    background: #1de9b6;
    color: #004d40;
}
.theme-dutchman .unlock-btn {
    background: #ff6e40;
    color: white;
}
.theme-dutchman .theme-selector select,
.theme-dutchman .mute-btn {
    background: #00695c;
    color: #e0f2f1;
    border-color: #1de9b6;
}
.theme-dutchman .quote-display {
    color: #64ffda;
}

/* Theme: Mario */
body.theme-mario {
    background: linear-gradient(135deg, #1565c0 0%, #42a5f5 50%, #1565c0 100%);
    color: #fff;
}
body.theme-mario::before {
    content: "🍄";
    position: fixed;
    font-size: max(60vw, 600px);
    opacity: 0.15;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
}
.theme-mario .theme-title {
    color: #f44336;
    text-shadow: 3px 3px 0px #ffeb3b, -1px -1px 0px #000;
    font-family: 'Arial Black', sans-serif;
}
.theme-mario .dice-count {
    background: #f44336;
    color: #ffffff;
    box-shadow: 0 4px 20px rgba(0,0,0,0.4);
    border: 4px solid #ffeb3b;
    text-shadow: 2px 2px 0px #000;
}
.theme-mario button {
    background: #4caf50;
    color: white;
    border: 2px solid #fff;
}
.theme-mario .btn-primary {
    background: #f44336;
    color: white;
}
.theme-mario .unlock-btn {
    background: #ff9800;
    color: white;
}
.theme-mario .theme-selector select,
.theme-mario .mute-btn {
    background: #4caf50;
    color: white;
    border-color: #ffeb3b;
}
.theme-mario .quote-display {
    color: #ffeb3b;
}