/* ============================================ */
/* GOOGLE FUNDING CHOICES - NEON STYLE          */
/* ============================================ */

/* Overlay background */
.fc-dialog-overlay,
.fc-ab-choice-overlay {
    background: rgba(0, 0, 0, 0.88) !important;
    backdrop-filter: blur(6px) !important;
}

/* Main dialog box */
.fc-dialog,
.fc-ab-choice-dialog,
#googlefc .fc-dialog {
    background: rgba(5, 0, 20, 0.97) !important;
    border: 2px solid #00FFFF !important;
    border-radius: 20px !important;
    box-shadow:
        0 0 30px rgba(0, 255, 255, 0.5),
        0 0 60px rgba(0, 255, 255, 0.2),
        0 0 100px rgba(255, 0, 255, 0.1) !important;
    font-family: 'Orbitron', sans-serif !important;
    color: #fff !important;
    padding: 28px 24px !important;
}

/* Title */
.fc-dialog__title,
.fc-ab-choice-dialog__title,
#googlefc h2,
#googlefc h3 {
    color: #00FFFF !important;
    font-family: 'Orbitron', sans-serif !important;
    font-weight: 700 !important;
    font-size: 1.1rem !important;
    text-shadow: 0 0 12px rgba(0, 255, 255, 0.6) !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    margin-bottom: 12px !important;
}

/* Message text */
.fc-dialog__message,
.fc-ab-choice-dialog__message,
#googlefc p {
    color: rgba(255, 255, 255, 0.82) !important;
    font-family: 'Orbitron', sans-serif !important;
    font-size: 0.8rem !important;
    line-height: 1.7 !important;
    letter-spacing: 0.3px !important;
}

/* Primary button (disable ad blocker / allow ads) */
.fc-primary-button,
.fc-button.fc-primary-button,
#googlefc .fc-primary-button {
    background: linear-gradient(135deg, #00FFFF, #FF00FF) !important;
    color: #000 !important;
    border: none !important;
    border-radius: 12px !important;
    font-family: 'Orbitron', sans-serif !important;
    font-weight: 700 !important;
    font-size: 0.8rem !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    padding: 12px 24px !important;
    box-shadow: 0 0 18px rgba(0, 255, 255, 0.45) !important;
    cursor: pointer !important;
    transition: box-shadow 0.3s !important;
}

.fc-primary-button:hover,
.fc-button.fc-primary-button:hover {
    box-shadow: 0 0 30px rgba(0, 255, 255, 0.7), 0 0 50px rgba(255, 0, 255, 0.3) !important;
}

/* Secondary button (dismiss / close) */
.fc-secondary-button,
.fc-button.fc-secondary-button,
.fc-close-button,
#googlefc .fc-secondary-button {
    background: transparent !important;
    color: rgba(255, 255, 255, 0.5) !important;
    border: 1px solid rgba(255, 255, 255, 0.25) !important;
    border-radius: 12px !important;
    font-family: 'Orbitron', sans-serif !important;
    font-size: 0.75rem !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    padding: 10px 20px !important;
    cursor: pointer !important;
    transition: all 0.3s !important;
}

.fc-secondary-button:hover,
.fc-button.fc-secondary-button:hover {
    border-color: rgba(0, 255, 255, 0.5) !important;
    color: #00FFFF !important;
}

/* Button row */
.fc-dialog__buttons,
.fc-ab-choice-dialog__buttons {
    display: flex !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    margin-top: 20px !important;
}

/* Divider / separator lines */
.fc-dialog__divider,
#googlefc hr {
    border-color: rgba(0, 255, 255, 0.2) !important;
    margin: 16px 0 !important;
}


/* ============================================ */
/* MONOCHROMATIC THEME                          */
/* ============================================ */

body.theme-mono {
    background: linear-gradient(135deg, #3a3a3a 0%, #222 50%, #333 100%) !important;
    animation: none !important;
}

body.theme-mono h1 {
    text-shadow: 0 0 10px #fff, 0 0 20px #ccc, 0 0 30px #aaa !important;
    animation: none !important;
}

/* Cyan elements -> light gray */
body.theme-mono .subtitle,
body.theme-mono .game-title,
body.theme-mono .footer h3,
body.theme-mono .policy-section h2,
body.theme-mono .ranking-title,
body.theme-mono .developer-credit .dev-name,
body.theme-mono .ranking-stats,
body.theme-mono .no-records,
body.theme-mono .game-info,
body.theme-mono .player-bar .player-label,
body.theme-mono .next-piece h3,
body.theme-mono .controls h3,
body.theme-mono .sidebar-header h2,
body.theme-mono .stat-label,
body.theme-mono .policy-section a,
body.theme-mono .donate-hint a {
    color: #ccc !important;
    text-shadow: 0 0 5px rgba(200,200,200,0.3) !important;
}

/* Cyan borders -> gray */
body.theme-mono .game-card,
body.theme-mono .card,
body.theme-mono .game-container,
body.theme-mono .canvas-wrapper,
body.theme-mono .board-container,
body.theme-mono .ranking-container,
body.theme-mono .ranking-item,
body.theme-mono .footer,
body.theme-mono .policy-section,
body.theme-mono .effective-date,
body.theme-mono .name-box,
body.theme-mono .sidebar,
body.theme-mono .stat,
body.theme-mono .settings-btn {
    border-color: #999 !important;
    box-shadow: 0 0 10px rgba(150,150,150,0.3), 0 4px 15px rgba(0,0,0,0.5) !important;
}

/* Magenta elements -> medium gray */
body.theme-mono .game-info.p2-turn {
    color: #bbb !important;
    text-shadow: none !important;
}

body.theme-mono .player-bar .player-name {
    color: #bbb !important;
    text-shadow: none !important;
}

body.theme-mono .tab-btn,
body.theme-mono .level-tab-btn,
body.theme-mono .ranking-level {
    color: #bbb !important;
    border-color: #888 !important;
    box-shadow: 0 0 8px rgba(150,150,150,0.3) !important;
    text-shadow: none !important;
}

body.theme-mono .tab-btn.active,
body.theme-mono .level-tab-btn.active {
    background: rgba(200,200,200,0.2) !important;
    color: #fff !important;
    border-color: #aaa !important;
    box-shadow: 0 0 15px rgba(200,200,200,0.3) !important;
}

/* Green/success -> light gray */
body.theme-mono .game-card.active {
    border-color: #ccc !important;
    box-shadow: 0 0 15px rgba(200,200,200,0.3) !important;
}

body.theme-mono .status-available {
    background: rgba(200,200,200,0.15) !important;
    color: #ddd !important;
    border-color: #ccc !important;
    box-shadow: 0 0 8px rgba(200,200,200,0.3) !important;
}

body.theme-mono .score {
    border-color: #aaa !important;
    box-shadow: 0 0 10px rgba(150,150,150,0.3) !important;
}

/* Back button */
body.theme-mono .back-btn {
    color: #ccc !important;
    border-color: #999 !important;
    background: rgba(200,200,200,0.1) !important;
    box-shadow: 0 0 8px rgba(150,150,150,0.3) !important;
}

/* Buttons */
body.theme-mono .reset-btn,
body.theme-mono .mode-btn,
body.theme-mono .difficulty-btn {
    color: #ddd !important;
    border-color: #aaa !important;
    box-shadow: 0 0 10px rgba(150,150,150,0.3) !important;
}

body.theme-mono .mode-btn.active,
body.theme-mono .difficulty-btn.active {
    background: rgba(200,200,200,0.2) !important;
}

/* Modals / overlays */
body.theme-mono .game-over h2,
body.theme-mono .victory-message h2,
body.theme-mono .modal h2,
body.theme-mono .level-complete h2 {
    color: #ddd !important;
    text-shadow: 0 0 10px rgba(200,200,200,0.3) !important;
}

body.theme-mono .game-over,
body.theme-mono .victory-message,
body.theme-mono .modal,
body.theme-mono .level-complete {
    border-color: #999 !important;
    box-shadow: 0 0 20px rgba(150,150,150,0.3) !important;
}

body.theme-mono .game-over p,
body.theme-mono .victory-message p,
body.theme-mono .modal p {
    color: #ccc !important;
    text-shadow: none !important;
}

/* Name overlay */
body.theme-mono .name-box h2 {
    color: #ccc !important;
    text-shadow: 0 0 10px rgba(200,200,200,0.3) !important;
}

body.theme-mono .name-box input {
    border-color: #999 !important;
}

body.theme-mono .name-box input:focus {
    border-color: #ccc !important;
    box-shadow: 0 0 10px rgba(200,200,200,0.3) !important;
}

body.theme-mono .name-box button {
    background: linear-gradient(135deg, #aaa, #888) !important;
}

/* PayPal */
body.theme-mono .paypal-link {
    border-color: #999 !important;
    background: rgba(200,200,200,0.08) !important;
    box-shadow: 0 0 8px rgba(150,150,150,0.2) !important;
}

body.theme-mono .paypal-link:hover {
    border-color: #bbb !important;
    box-shadow: 0 0 20px rgba(200,200,200,0.3) !important;
}

body.theme-mono .qr-container {
    box-shadow: 0 0 10px rgba(150,150,150,0.3), 0 4px 10px rgba(0,0,0,0.3) !important;
}

/* Coming soon */
body.theme-mono .game-card.coming-soon {
    border-color: #555 !important;
    box-shadow: 0 0 5px rgba(100,100,100,0.2) !important;
}

body.theme-mono .status-coming-soon {
    border-color: #555 !important;
    color: #777 !important;
}

/* Developer credit */
body.theme-mono .developer-credit {
    border-top-color: rgba(200,200,200,0.2) !important;
}

/* Settings / sidebar */
body.theme-mono .settings-btn {
    color: #ccc !important;
}

body.theme-mono .settings-btn:hover {
    color: #eee !important;
    border-color: #bbb !important;
    box-shadow: 0 0 15px rgba(200,200,200,0.4) !important;
}

body.theme-mono .sidebar-header {
    border-bottom-color: rgba(200,200,200,0.2) !important;
}

body.theme-mono .sidebar-close:hover {
    border-color: #bbb !important;
    color: #bbb !important;
}

body.theme-mono .sidebar-option:hover {
    border-color: rgba(200,200,200,0.3) !important;
    background: rgba(200,200,200,0.06) !important;
}

body.theme-mono .sidebar-section-title {
    color: rgba(200,200,200,0.4) !important;
}

body.theme-mono .toggle-switch input:checked + .toggle-slider {
    background: linear-gradient(135deg, #aaa, #888) !important;
    box-shadow: 0 0 8px rgba(150,150,150,0.3) !important;
}

/* Stat values */
body.theme-mono .stat-value {
    color: #ccc !important;
    text-shadow: 0 0 5px rgba(200,200,200,0.3) !important;
}

body.theme-mono .stat.cyan .stat-value,
body.theme-mono .stat.magenta .stat-value {
    color: #ccc !important;
    text-shadow: 0 0 5px rgba(200,200,200,0.3) !important;
}

/* TicTacToe / Reversi cells */
body.theme-mono .cell {
    border-color: #888 !important;
    box-shadow: 0 0 5px rgba(150,150,150,0.3) !important;
}

body.theme-mono .cell.x {
    color: #ccc !important;
    text-shadow: 0 0 10px rgba(200,200,200,0.3) !important;
}

body.theme-mono .cell.o {
    color: #999 !important;
    text-shadow: 0 0 10px rgba(150,150,150,0.3) !important;
}

body.theme-mono .cell.win {
    background: rgba(200,200,200,0.2) !important;
    border-color: #bbb !important;
}

body.theme-mono .cell.valid {
    border-color: #aaa !important;
    box-shadow: 0 0 8px rgba(170,170,170,0.4) !important;
}

body.theme-mono .cell:hover.valid {
    background: rgba(200,200,200,0.15) !important;
}

/* Reversi board & pieces */
body.theme-mono .board {
    background: rgba(200,200,200,0.05) !important;
    border-color: #888 !important;
}

body.theme-mono .piece.black {
    background: radial-gradient(circle, #ccc, #999) !important;
    box-shadow: 0 0 10px rgba(200,200,200,0.3) !important;
}

body.theme-mono .piece.white {
    background: radial-gradient(circle, #666, #444) !important;
    box-shadow: 0 0 10px rgba(100,100,100,0.3) !important;
}

/* Memory cards */
body.theme-mono .card .front {
    background: linear-gradient(145deg, #666, #555) !important;
    border-color: #888 !important;
    box-shadow: inset 0 0 15px rgba(150,150,150,0.3), 0 0 10px rgba(150,150,150,0.3) !important;
}

body.theme-mono .card .back {
    border-color: #aaa !important;
    box-shadow: inset 0 0 15px rgba(150,150,150,0.2), 0 0 10px rgba(150,150,150,0.3) !important;
    filter: drop-shadow(0 0 8px rgba(200,200,200,0.4)) !important;
}

body.theme-mono .card.matched {
    background: linear-gradient(145deg, #999, #888) !important;
    border-color: #aaa !important;
    box-shadow: 0 0 20px rgba(200,200,200,0.3) !important;
}

body.theme-mono .card.matched .front {
    background: linear-gradient(145deg, #999, #888) !important;
    border-color: #aaa !important;
}

body.theme-mono .card:hover {
    box-shadow: 0 0 20px rgba(200,200,200,0.4) !important;
}

body.theme-mono .level-btn:first-of-type {
    background: rgba(200,200,200,0.15) !important;
    color: #ccc !important;
    border-color: #aaa !important;
    box-shadow: 0 0 10px rgba(150,150,150,0.3) !important;
}

body.theme-mono .level-btn:last-of-type {
    background: rgba(150,150,150,0.15) !important;
    color: #aaa !important;
    border-color: #888 !important;
    box-shadow: 0 0 10px rgba(130,130,130,0.3) !important;
}

/* Aim game */
body.theme-mono .target {
    background: radial-gradient(circle, #ccc, #888) !important;
    border-color: #aaa !important;
    box-shadow: 0 0 15px rgba(200,200,200,0.3) !important;
}

body.theme-mono .crosshair::before,
body.theme-mono .crosshair::after {
    background: #ccc !important;
    box-shadow: 0 0 5px rgba(200,200,200,0.5) !important;
}

/* Tetris panels */
body.theme-mono .canvas-wrapper {
    border-color: #999 !important;
    box-shadow: 0 0 15px rgba(150,150,150,0.3) !important;
}

body.theme-mono .side-panel {
    border-color: #888 !important;
    box-shadow: 0 0 10px rgba(150,150,150,0.2) !important;
}

body.theme-mono .side-panel > div:first-child {
    color: #bbb !important;
}

body.theme-mono .next-piece {
    border-color: #888 !important;
}

body.theme-mono canvas {
    border-color: #888 !important;
    box-shadow: inset 0 0 15px rgba(150,150,150,0.1) !important;
}

/* Rankings top */
body.theme-mono .ranking-item.top-1 {
    border-color: #c0c0c0 !important;
    background: rgba(200,200,200,0.12) !important;
    box-shadow: 0 0 10px rgba(200,200,200,0.3) !important;
}

body.theme-mono .ranking-item.top-2 {
    border-color: #999 !important;
    background: rgba(150,150,150,0.08) !important;
    box-shadow: 0 0 8px rgba(150,150,150,0.2) !important;
}

body.theme-mono .ranking-item.top-3 {
    border-color: #777 !important;
    background: rgba(130,130,130,0.08) !important;
    box-shadow: 0 0 8px rgba(130,130,130,0.2) !important;
}

/* Theme selector in sidebar */
body.theme-mono .theme-option.active {
    border-color: #ccc !important;
    box-shadow: 0 0 12px rgba(200,200,200,0.4) !important;
}


/* ============================================ */
/* RETRO SUNSET THEME                           */
/* ============================================ */

body.theme-retro {
    background: linear-gradient(135deg, #1a0a2e 0%, #2d1b4e 30%, #4a1942 60%, #1a1a2e 100%) !important;
    background-size: 400% 400% !important;
    animation: none !important;
}

body.theme-retro h1 {
    text-shadow: 0 0 10px #fff, 0 0 20px #FFD700, 0 0 30px #FFD700, 0 0 50px #FF8C00, 0 0 70px #FF8C00 !important;
    animation: none !important;
}

/* Cyan -> Gold */
body.theme-retro .subtitle,
body.theme-retro .game-title,
body.theme-retro .footer h3,
body.theme-retro .policy-section h2,
body.theme-retro .ranking-title,
body.theme-retro .developer-credit .dev-name,
body.theme-retro .ranking-stats,
body.theme-retro .no-records,
body.theme-retro .game-info,
body.theme-retro .player-bar .player-label,
body.theme-retro .next-piece h3,
body.theme-retro .controls h3,
body.theme-retro .sidebar-header h2,
body.theme-retro .stat-label,
body.theme-retro .policy-section a,
body.theme-retro .donate-hint a {
    color: #FFD700 !important;
    text-shadow: 0 0 8px rgba(255,215,0,0.5) !important;
}

/* Gold borders */
body.theme-retro .game-card,
body.theme-retro .card,
body.theme-retro .game-container,
body.theme-retro .canvas-wrapper,
body.theme-retro .board-container,
body.theme-retro .ranking-container,
body.theme-retro .ranking-item,
body.theme-retro .footer,
body.theme-retro .policy-section,
body.theme-retro .effective-date,
body.theme-retro .name-box,
body.theme-retro .sidebar,
body.theme-retro .stat,
body.theme-retro .settings-btn {
    border-color: #FFD700 !important;
    box-shadow: 0 0 15px rgba(255,215,0,0.4), 0 4px 15px rgba(0,0,0,0.5) !important;
}

/* Magenta -> Coral */
body.theme-retro .game-info.p2-turn {
    color: #FF6347 !important;
    text-shadow: 0 0 8px rgba(255,99,71,0.5) !important;
}

body.theme-retro .player-bar .player-name {
    color: #FF6347 !important;
    text-shadow: 0 0 8px rgba(255,99,71,0.5) !important;
}

body.theme-retro .tab-btn,
body.theme-retro .level-tab-btn,
body.theme-retro .ranking-level {
    color: #FF6347 !important;
    border-color: #FF6347 !important;
    box-shadow: 0 0 10px rgba(255,99,71,0.4) !important;
}

body.theme-retro .tab-btn.active,
body.theme-retro .level-tab-btn.active {
    background: rgba(255,99,71,0.25) !important;
    color: #fff !important;
    border-color: #FF6347 !important;
    box-shadow: 0 0 20px rgba(255,99,71,0.5), inset 0 0 15px rgba(255,99,71,0.2) !important;
}

/* Green -> Amber */
body.theme-retro .game-card.active {
    border-color: #FFA500 !important;
    box-shadow: 0 0 20px rgba(255,165,0,0.4) !important;
}

body.theme-retro .game-card.active:hover {
    border-color: #FF6347 !important;
    box-shadow: 0 0 30px rgba(255,99,71,0.5), 0 10px 30px rgba(0,0,0,0.7) !important;
}

body.theme-retro .status-available {
    background: rgba(255,165,0,0.15) !important;
    color: #FFA500 !important;
    border-color: #FFA500 !important;
    box-shadow: 0 0 10px rgba(255,165,0,0.4) !important;
}

body.theme-retro .score {
    border-color: #FFA500 !important;
    box-shadow: 0 0 10px rgba(255,165,0,0.4) !important;
}

/* Back button */
body.theme-retro .back-btn {
    color: #FF4444 !important;
    border-color: #FF4444 !important;
    background: rgba(255,68,68,0.15) !important;
    box-shadow: 0 0 10px rgba(255,68,68,0.4) !important;
}

body.theme-retro .back-btn:hover {
    background: rgba(255,68,68,0.3) !important;
    box-shadow: 0 0 20px rgba(255,68,68,0.5) !important;
}

/* Buttons */
body.theme-retro .reset-btn {
    color: #FFD700 !important;
    border-color: #FFD700 !important;
    box-shadow: 0 0 10px rgba(255,215,0,0.4) !important;
}

body.theme-retro .reset-btn:hover {
    background: rgba(255,215,0,0.15) !important;
    box-shadow: 0 0 20px rgba(255,215,0,0.5) !important;
}

body.theme-retro .mode-btn,
body.theme-retro .difficulty-btn {
    color: #FFD700 !important;
    border-color: #FFD700 !important;
    box-shadow: 0 0 10px rgba(255,215,0,0.3) !important;
}

body.theme-retro .mode-btn.active,
body.theme-retro .difficulty-btn.active {
    background: rgba(255,215,0,0.25) !important;
    box-shadow: 0 0 20px rgba(255,215,0,0.5) !important;
}

body.theme-retro .mode-btn:hover,
body.theme-retro .difficulty-btn:hover {
    background: rgba(255,215,0,0.15) !important;
}

/* Modals / overlays */
body.theme-retro .game-over h2,
body.theme-retro .victory-message h2,
body.theme-retro .modal h2,
body.theme-retro .level-complete h2 {
    color: #FFD700 !important;
    text-shadow: 0 0 15px rgba(255,215,0,0.5) !important;
}

body.theme-retro .game-over,
body.theme-retro .victory-message,
body.theme-retro .modal,
body.theme-retro .level-complete {
    border-color: #FFD700 !important;
    box-shadow: 0 0 30px rgba(255,215,0,0.4) !important;
}

body.theme-retro .game-over p,
body.theme-retro .victory-message p,
body.theme-retro .modal p,
body.theme-retro .level-complete p {
    color: #FFD700 !important;
    text-shadow: 0 0 8px rgba(255,215,0,0.3) !important;
}

/* Name overlay */
body.theme-retro .name-box h2 {
    color: #FFD700 !important;
    text-shadow: 0 0 15px rgba(255,215,0,0.5) !important;
}

body.theme-retro .name-box input {
    border-color: #FFD700 !important;
}

body.theme-retro .name-box input:focus {
    border-color: #FF6347 !important;
    box-shadow: 0 0 15px rgba(255,99,71,0.4) !important;
}

body.theme-retro .name-box button {
    background: linear-gradient(135deg, #FFD700, #FF6347) !important;
}

/* PayPal */
body.theme-retro .paypal-link {
    border-color: #FFD700 !important;
    background: linear-gradient(135deg, rgba(255,215,0,0.1), rgba(255,99,71,0.1)) !important;
    box-shadow: 0 0 10px rgba(255,215,0,0.3) !important;
}

body.theme-retro .paypal-link:hover {
    border-color: #FF6347 !important;
    background: linear-gradient(135deg, rgba(255,99,71,0.2), rgba(255,215,0,0.2)) !important;
    box-shadow: 0 0 25px rgba(255,99,71,0.4) !important;
}

body.theme-retro .qr-container {
    box-shadow: 0 0 12px rgba(255,215,0,0.3), 0 4px 10px rgba(0,0,0,0.3) !important;
}

/* Coming soon */
body.theme-retro .game-card.coming-soon {
    border-color: #665533 !important;
    box-shadow: 0 0 8px rgba(102,85,51,0.3) !important;
}

body.theme-retro .status-coming-soon {
    border-color: #665533 !important;
    color: #887755 !important;
}

/* Developer credit */
body.theme-retro .developer-credit {
    border-top-color: rgba(255,215,0,0.2) !important;
}

/* Settings / sidebar */
body.theme-retro .settings-btn {
    color: #FFD700 !important;
}

body.theme-retro .settings-btn:hover {
    border-color: #FF6347 !important;
    color: #FF6347 !important;
    box-shadow: 0 0 20px rgba(255,99,71,0.4) !important;
}

body.theme-retro .sidebar-header {
    border-bottom-color: rgba(255,215,0,0.3) !important;
}

body.theme-retro .sidebar-close:hover {
    border-color: #FF6347 !important;
    color: #FF6347 !important;
}

body.theme-retro .sidebar-option:hover {
    border-color: rgba(255,215,0,0.4) !important;
    background: rgba(255,215,0,0.08) !important;
}

body.theme-retro .sidebar-section-title {
    color: rgba(255,215,0,0.5) !important;
}

body.theme-retro .toggle-switch input:checked + .toggle-slider {
    background: linear-gradient(135deg, #FFD700, #FF6347) !important;
    box-shadow: 0 0 10px rgba(255,215,0,0.4) !important;
}

/* Stat values */
body.theme-retro .stat-value {
    color: #FFA500 !important;
    text-shadow: 0 0 8px rgba(255,165,0,0.4) !important;
}

body.theme-retro .stat.cyan .stat-value {
    color: #FFD700 !important;
    text-shadow: 0 0 8px rgba(255,215,0,0.4) !important;
}

body.theme-retro .stat.magenta .stat-value {
    color: #FF6347 !important;
    text-shadow: 0 0 8px rgba(255,99,71,0.4) !important;
}

/* TicTacToe / Reversi cells */
body.theme-retro .cell {
    border-color: #FF6347 !important;
    box-shadow: 0 0 8px rgba(255,99,71,0.3) !important;
}

body.theme-retro .cell.x {
    color: #FFD700 !important;
    text-shadow: 0 0 20px rgba(255,215,0,0.5) !important;
}

body.theme-retro .cell.o {
    color: #FF6347 !important;
    text-shadow: 0 0 20px rgba(255,99,71,0.5) !important;
}

body.theme-retro .cell.win {
    background: rgba(255,165,0,0.3) !important;
    border-color: #FFA500 !important;
}

body.theme-retro .cell.valid {
    border-color: #FFA500 !important;
    box-shadow: 0 0 8px rgba(255,165,0,0.4) !important;
}

body.theme-retro .cell:hover.valid {
    background: rgba(255,165,0,0.2) !important;
    box-shadow: 0 0 15px rgba(255,165,0,0.5) !important;
}

/* Reversi board & pieces */
body.theme-retro .board {
    background: rgba(255,165,0,0.06) !important;
    border-color: #FFA500 !important;
}

body.theme-retro .piece.black {
    background: radial-gradient(circle, #FFD700, #CC8800) !important;
    box-shadow: 0 0 12px rgba(255,215,0,0.5) !important;
}

body.theme-retro .piece.white {
    background: radial-gradient(circle, #FF6347, #CC3322) !important;
    box-shadow: 0 0 12px rgba(255,99,71,0.5) !important;
}

/* Memory cards */
body.theme-retro .card .front {
    background: linear-gradient(145deg, #4a1942, #2d1b4e) !important;
    border-color: #FF6347 !important;
    box-shadow: inset 0 0 15px rgba(255,99,71,0.3), 0 0 15px rgba(255,99,71,0.3) !important;
}

body.theme-retro .card .back {
    border-color: #FFA500 !important;
    box-shadow: inset 0 0 15px rgba(255,165,0,0.2), 0 0 10px rgba(255,165,0,0.3) !important;
    filter: drop-shadow(0 0 8px rgba(255,165,0,0.5)) !important;
}

body.theme-retro .card.matched {
    background: linear-gradient(145deg, #FFA500, #FF8C00) !important;
    border-color: #FFA500 !important;
    box-shadow: 0 0 25px rgba(255,165,0,0.5) !important;
}

body.theme-retro .card.matched .front {
    background: linear-gradient(145deg, #FFA500, #FF8C00) !important;
    border-color: #FFA500 !important;
    box-shadow: inset 0 0 20px rgba(255,165,0,0.4), 0 0 20px rgba(255,165,0,0.4) !important;
}

body.theme-retro .card:hover {
    box-shadow: 0 0 20px rgba(255,215,0,0.5), 0 0 30px rgba(255,215,0,0.3) !important;
}

body.theme-retro .level-btn:first-of-type {
    background: rgba(255,165,0,0.2) !important;
    color: #FFA500 !important;
    border-color: #FFA500 !important;
    box-shadow: 0 0 12px rgba(255,165,0,0.4) !important;
}

body.theme-retro .level-btn:last-of-type {
    background: rgba(255,68,68,0.2) !important;
    color: #FF4444 !important;
    border-color: #FF4444 !important;
    box-shadow: 0 0 12px rgba(255,68,68,0.4) !important;
}

/* Aim game */
body.theme-retro .target {
    background: radial-gradient(circle, #FFD700, #FF8C00) !important;
    border-color: #FF6347 !important;
    box-shadow: 0 0 20px rgba(255,99,71,0.5) !important;
}

body.theme-retro .crosshair::before,
body.theme-retro .crosshair::after {
    background: #FFA500 !important;
    box-shadow: 0 0 8px rgba(255,165,0,0.6) !important;
}

/* Tetris */
body.theme-retro .side-panel {
    border-color: #FF6347 !important;
    box-shadow: 0 0 15px rgba(255,99,71,0.3) !important;
}

body.theme-retro .side-panel > div:first-child {
    color: #FF6347 !important;
}

body.theme-retro .next-piece {
    border-color: #FFD700 !important;
}

body.theme-retro canvas {
    border-color: #FFD700 !important;
    box-shadow: inset 0 0 15px rgba(255,215,0,0.1) !important;
}

/* Rankings top */
body.theme-retro .ranking-item.top-1 {
    border-color: #FFD700 !important;
    background: rgba(255,215,0,0.15) !important;
    box-shadow: 0 0 15px rgba(255,215,0,0.4) !important;
}

body.theme-retro .ranking-item.top-2 {
    border-color: #C0C0C0 !important;
    background: rgba(192,192,192,0.1) !important;
}

body.theme-retro .ranking-item.top-3 {
    border-color: #CD7F32 !important;
    background: rgba(205,127,50,0.1) !important;
}

/* Theme selector */
body.theme-retro .theme-option.active {
    border-color: #FFD700 !important;
    box-shadow: 0 0 12px rgba(255,215,0,0.5) !important;
}


/* ============================================ */
/* OCEAN DEEP THEME                             */
/* ============================================ */

body.theme-ocean {
    background: linear-gradient(135deg, #0a192f 0%, #0d2847 50%, #0c1e3a 100%) !important;
    background-size: 400% 400% !important;
    animation: none !important;
}

body.theme-ocean h1 {
    text-shadow: 0 0 10px #fff, 0 0 20px #1E90FF, 0 0 30px #1E90FF, 0 0 50px #4169E1, 0 0 70px #4169E1 !important;
    animation: none !important;
}

body.theme-ocean .subtitle,
body.theme-ocean .game-title,
body.theme-ocean .footer h3,
body.theme-ocean .policy-section h2,
body.theme-ocean .ranking-title,
body.theme-ocean .developer-credit .dev-name,
body.theme-ocean .ranking-stats,
body.theme-ocean .no-records,
body.theme-ocean .game-info,
body.theme-ocean .player-bar .player-label,
body.theme-ocean .next-piece h3,
body.theme-ocean .controls h3,
body.theme-ocean .sidebar-header h2,
body.theme-ocean .stat-label,
body.theme-ocean .policy-section a,
body.theme-ocean .donate-hint a {
    color: #1E90FF !important;
    text-shadow: 0 0 8px rgba(30,144,255,0.5) !important;
}

body.theme-ocean .game-card,
body.theme-ocean .card,
body.theme-ocean .game-container,
body.theme-ocean .canvas-wrapper,
body.theme-ocean .board-container,
body.theme-ocean .ranking-container,
body.theme-ocean .ranking-item,
body.theme-ocean .footer,
body.theme-ocean .policy-section,
body.theme-ocean .effective-date,
body.theme-ocean .name-box,
body.theme-ocean .sidebar,
body.theme-ocean .stat,
body.theme-ocean .settings-btn {
    border-color: #1E90FF !important;
    box-shadow: 0 0 15px rgba(30,144,255,0.4), 0 4px 15px rgba(0,0,0,0.5) !important;
}

body.theme-ocean .game-info.p2-turn {
    color: #7B68EE !important;
    text-shadow: 0 0 8px rgba(123,104,238,0.5) !important;
}

body.theme-ocean .player-bar .player-name {
    color: #7B68EE !important;
    text-shadow: 0 0 8px rgba(123,104,238,0.5) !important;
}

body.theme-ocean .tab-btn,
body.theme-ocean .level-tab-btn,
body.theme-ocean .ranking-level {
    color: #7B68EE !important;
    border-color: #7B68EE !important;
    box-shadow: 0 0 10px rgba(123,104,238,0.4) !important;
}

body.theme-ocean .tab-btn.active,
body.theme-ocean .level-tab-btn.active {
    background: rgba(123,104,238,0.25) !important;
    color: #fff !important;
    border-color: #7B68EE !important;
    box-shadow: 0 0 20px rgba(123,104,238,0.5), inset 0 0 15px rgba(123,104,238,0.2) !important;
}

body.theme-ocean .game-card.active {
    border-color: #20B2AA !important;
    box-shadow: 0 0 20px rgba(32,178,170,0.4) !important;
}

body.theme-ocean .game-card.active:hover {
    border-color: #7B68EE !important;
    box-shadow: 0 0 30px rgba(123,104,238,0.5), 0 10px 30px rgba(0,0,0,0.7) !important;
}

body.theme-ocean .status-available {
    background: rgba(32,178,170,0.15) !important;
    color: #20B2AA !important;
    border-color: #20B2AA !important;
    box-shadow: 0 0 10px rgba(32,178,170,0.4) !important;
}

body.theme-ocean .score {
    border-color: #20B2AA !important;
    box-shadow: 0 0 10px rgba(32,178,170,0.4) !important;
}

body.theme-ocean .back-btn {
    color: #6495ED !important;
    border-color: #6495ED !important;
    background: rgba(100,149,237,0.15) !important;
    box-shadow: 0 0 10px rgba(100,149,237,0.4) !important;
}

body.theme-ocean .back-btn:hover {
    background: rgba(100,149,237,0.3) !important;
    box-shadow: 0 0 20px rgba(100,149,237,0.5) !important;
}

body.theme-ocean .reset-btn {
    color: #1E90FF !important;
    border-color: #1E90FF !important;
    box-shadow: 0 0 10px rgba(30,144,255,0.4) !important;
}

body.theme-ocean .reset-btn:hover {
    background: rgba(30,144,255,0.15) !important;
    box-shadow: 0 0 20px rgba(30,144,255,0.5) !important;
}

body.theme-ocean .mode-btn,
body.theme-ocean .difficulty-btn {
    color: #1E90FF !important;
    border-color: #1E90FF !important;
    box-shadow: 0 0 10px rgba(30,144,255,0.3) !important;
}

body.theme-ocean .mode-btn.active,
body.theme-ocean .difficulty-btn.active {
    background: rgba(30,144,255,0.25) !important;
    box-shadow: 0 0 20px rgba(30,144,255,0.5) !important;
}

body.theme-ocean .mode-btn:hover,
body.theme-ocean .difficulty-btn:hover {
    background: rgba(30,144,255,0.15) !important;
}

body.theme-ocean .game-over h2,
body.theme-ocean .victory-message h2,
body.theme-ocean .modal h2,
body.theme-ocean .level-complete h2 {
    color: #1E90FF !important;
    text-shadow: 0 0 15px rgba(30,144,255,0.5) !important;
}

body.theme-ocean .game-over,
body.theme-ocean .victory-message,
body.theme-ocean .modal,
body.theme-ocean .level-complete {
    border-color: #1E90FF !important;
    box-shadow: 0 0 30px rgba(30,144,255,0.4) !important;
}

body.theme-ocean .game-over p,
body.theme-ocean .victory-message p,
body.theme-ocean .modal p,
body.theme-ocean .level-complete p {
    color: #1E90FF !important;
    text-shadow: 0 0 8px rgba(30,144,255,0.3) !important;
}

body.theme-ocean .name-box h2 {
    color: #1E90FF !important;
    text-shadow: 0 0 15px rgba(30,144,255,0.5) !important;
}

body.theme-ocean .name-box input {
    border-color: #1E90FF !important;
}

body.theme-ocean .name-box input:focus {
    border-color: #7B68EE !important;
    box-shadow: 0 0 15px rgba(123,104,238,0.4) !important;
}

body.theme-ocean .name-box button {
    background: linear-gradient(135deg, #1E90FF, #7B68EE) !important;
}

body.theme-ocean .paypal-link {
    border-color: #1E90FF !important;
    background: linear-gradient(135deg, rgba(30,144,255,0.1), rgba(123,104,238,0.1)) !important;
    box-shadow: 0 0 10px rgba(30,144,255,0.3) !important;
}

body.theme-ocean .paypal-link:hover {
    border-color: #7B68EE !important;
    background: linear-gradient(135deg, rgba(123,104,238,0.2), rgba(30,144,255,0.2)) !important;
    box-shadow: 0 0 25px rgba(123,104,238,0.4) !important;
}

body.theme-ocean .qr-container {
    box-shadow: 0 0 12px rgba(30,144,255,0.3), 0 4px 10px rgba(0,0,0,0.3) !important;
}

body.theme-ocean .game-card.coming-soon {
    border-color: #1a3050 !important;
    box-shadow: 0 0 8px rgba(26,48,80,0.3) !important;
}

body.theme-ocean .status-coming-soon {
    border-color: #1a3050 !important;
    color: #4a6a8a !important;
}

body.theme-ocean .developer-credit {
    border-top-color: rgba(30,144,255,0.2) !important;
}

body.theme-ocean .settings-btn {
    color: #1E90FF !important;
}

body.theme-ocean .settings-btn:hover {
    border-color: #7B68EE !important;
    color: #7B68EE !important;
    box-shadow: 0 0 20px rgba(123,104,238,0.4) !important;
}

body.theme-ocean .sidebar-header {
    border-bottom-color: rgba(30,144,255,0.3) !important;
}

body.theme-ocean .sidebar-close:hover {
    border-color: #7B68EE !important;
    color: #7B68EE !important;
}

body.theme-ocean .sidebar-option:hover {
    border-color: rgba(30,144,255,0.4) !important;
    background: rgba(30,144,255,0.08) !important;
}

body.theme-ocean .sidebar-section-title {
    color: rgba(30,144,255,0.5) !important;
}

body.theme-ocean .toggle-switch input:checked + .toggle-slider {
    background: linear-gradient(135deg, #1E90FF, #7B68EE) !important;
    box-shadow: 0 0 10px rgba(30,144,255,0.4) !important;
}

body.theme-ocean .stat-value {
    color: #20B2AA !important;
    text-shadow: 0 0 8px rgba(32,178,170,0.4) !important;
}

body.theme-ocean .stat.cyan .stat-value {
    color: #1E90FF !important;
    text-shadow: 0 0 8px rgba(30,144,255,0.4) !important;
}

body.theme-ocean .stat.magenta .stat-value {
    color: #7B68EE !important;
    text-shadow: 0 0 8px rgba(123,104,238,0.4) !important;
}

body.theme-ocean .cell {
    border-color: #7B68EE !important;
    box-shadow: 0 0 8px rgba(123,104,238,0.3) !important;
}

body.theme-ocean .cell.x {
    color: #1E90FF !important;
    text-shadow: 0 0 20px rgba(30,144,255,0.5) !important;
}

body.theme-ocean .cell.o {
    color: #7B68EE !important;
    text-shadow: 0 0 20px rgba(123,104,238,0.5) !important;
}

body.theme-ocean .cell.win {
    background: rgba(32,178,170,0.3) !important;
    border-color: #20B2AA !important;
}

body.theme-ocean .cell.valid {
    border-color: #20B2AA !important;
    box-shadow: 0 0 8px rgba(32,178,170,0.4) !important;
}

body.theme-ocean .cell:hover.valid {
    background: rgba(32,178,170,0.2) !important;
    box-shadow: 0 0 15px rgba(32,178,170,0.5) !important;
}

body.theme-ocean .board {
    background: rgba(30,144,255,0.06) !important;
    border-color: #20B2AA !important;
}

body.theme-ocean .piece.black {
    background: radial-gradient(circle, #1E90FF, #0066CC) !important;
    box-shadow: 0 0 12px rgba(30,144,255,0.5) !important;
}

body.theme-ocean .piece.white {
    background: radial-gradient(circle, #7B68EE, #5544CC) !important;
    box-shadow: 0 0 12px rgba(123,104,238,0.5) !important;
}

body.theme-ocean .card .front {
    background: linear-gradient(145deg, #1a3a6a, #0d2847) !important;
    border-color: #7B68EE !important;
    box-shadow: inset 0 0 15px rgba(123,104,238,0.3), 0 0 15px rgba(123,104,238,0.3) !important;
}

body.theme-ocean .card .back {
    border-color: #20B2AA !important;
    box-shadow: inset 0 0 15px rgba(32,178,170,0.2), 0 0 10px rgba(32,178,170,0.3) !important;
    filter: drop-shadow(0 0 8px rgba(32,178,170,0.5)) !important;
}

body.theme-ocean .card.matched {
    background: linear-gradient(145deg, #20B2AA, #1a9a92) !important;
    border-color: #20B2AA !important;
    box-shadow: 0 0 25px rgba(32,178,170,0.5) !important;
}

body.theme-ocean .card.matched .front {
    background: linear-gradient(145deg, #20B2AA, #1a9a92) !important;
    border-color: #20B2AA !important;
}

body.theme-ocean .card:hover {
    box-shadow: 0 0 20px rgba(30,144,255,0.5), 0 0 30px rgba(30,144,255,0.3) !important;
}

body.theme-ocean .level-btn:first-of-type {
    background: rgba(32,178,170,0.2) !important;
    color: #20B2AA !important;
    border-color: #20B2AA !important;
    box-shadow: 0 0 12px rgba(32,178,170,0.4) !important;
}

body.theme-ocean .level-btn:last-of-type {
    background: rgba(100,149,237,0.2) !important;
    color: #6495ED !important;
    border-color: #6495ED !important;
    box-shadow: 0 0 12px rgba(100,149,237,0.4) !important;
}

body.theme-ocean .target {
    background: radial-gradient(circle, #1E90FF, #4169E1) !important;
    border-color: #7B68EE !important;
    box-shadow: 0 0 20px rgba(123,104,238,0.5) !important;
}

body.theme-ocean .crosshair::before,
body.theme-ocean .crosshair::after {
    background: #20B2AA !important;
    box-shadow: 0 0 8px rgba(32,178,170,0.6) !important;
}

body.theme-ocean .side-panel {
    border-color: #7B68EE !important;
    box-shadow: 0 0 15px rgba(123,104,238,0.3) !important;
}

body.theme-ocean .side-panel > div:first-child {
    color: #7B68EE !important;
}

body.theme-ocean .next-piece {
    border-color: #1E90FF !important;
}

body.theme-ocean canvas {
    border-color: #1E90FF !important;
    box-shadow: inset 0 0 15px rgba(30,144,255,0.1) !important;
}

body.theme-ocean .theme-option.active {
    border-color: #1E90FF !important;
    box-shadow: 0 0 12px rgba(30,144,255,0.5) !important;
}

body.theme-ocean .ranking-item.top-1 {
    border-color: #FFD700 !important;
    background: rgba(255,215,0,0.12) !important;
    box-shadow: 0 0 15px rgba(255,215,0,0.3) !important;
}


/* ============================================ */
/* HACKER / MATRIX THEME                        */
/* ============================================ */

body.theme-hacker {
    background: linear-gradient(135deg, #050505 0%, #0a1a0a 50%, #080808 100%) !important;
    background-size: 400% 400% !important;
    animation: none !important;
}

body.theme-hacker h1 {
    text-shadow: 0 0 10px #0f0, 0 0 20px #0f0, 0 0 30px #00FF41, 0 0 50px #00CC33, 0 0 70px #00CC33 !important;
    animation: none !important;
}

body.theme-hacker .subtitle,
body.theme-hacker .game-title,
body.theme-hacker .footer h3,
body.theme-hacker .policy-section h2,
body.theme-hacker .ranking-title,
body.theme-hacker .developer-credit .dev-name,
body.theme-hacker .ranking-stats,
body.theme-hacker .no-records,
body.theme-hacker .game-info,
body.theme-hacker .player-bar .player-label,
body.theme-hacker .next-piece h3,
body.theme-hacker .controls h3,
body.theme-hacker .sidebar-header h2,
body.theme-hacker .stat-label,
body.theme-hacker .policy-section a,
body.theme-hacker .donate-hint a {
    color: #00FF41 !important;
    text-shadow: 0 0 8px rgba(0,255,65,0.5) !important;
}

body.theme-hacker .game-card,
body.theme-hacker .card,
body.theme-hacker .game-container,
body.theme-hacker .canvas-wrapper,
body.theme-hacker .board-container,
body.theme-hacker .ranking-container,
body.theme-hacker .ranking-item,
body.theme-hacker .footer,
body.theme-hacker .policy-section,
body.theme-hacker .effective-date,
body.theme-hacker .name-box,
body.theme-hacker .sidebar,
body.theme-hacker .stat,
body.theme-hacker .settings-btn {
    border-color: #00FF41 !important;
    box-shadow: 0 0 15px rgba(0,255,65,0.3), 0 4px 15px rgba(0,0,0,0.5) !important;
}

body.theme-hacker .game-info.p2-turn {
    color: #39FF14 !important;
    text-shadow: 0 0 8px rgba(57,255,20,0.5) !important;
}

body.theme-hacker .player-bar .player-name {
    color: #39FF14 !important;
    text-shadow: 0 0 8px rgba(57,255,20,0.5) !important;
}

body.theme-hacker .tab-btn,
body.theme-hacker .level-tab-btn,
body.theme-hacker .ranking-level {
    color: #00CC33 !important;
    border-color: #00CC33 !important;
    box-shadow: 0 0 10px rgba(0,204,51,0.4) !important;
}

body.theme-hacker .tab-btn.active,
body.theme-hacker .level-tab-btn.active {
    background: rgba(0,255,65,0.15) !important;
    color: #00FF41 !important;
    border-color: #00FF41 !important;
    box-shadow: 0 0 20px rgba(0,255,65,0.5), inset 0 0 15px rgba(0,255,65,0.15) !important;
}

body.theme-hacker .game-card.active {
    border-color: #39FF14 !important;
    box-shadow: 0 0 20px rgba(57,255,20,0.4) !important;
}

body.theme-hacker .game-card.active:hover {
    border-color: #00FF41 !important;
    box-shadow: 0 0 30px rgba(0,255,65,0.6), 0 10px 30px rgba(0,0,0,0.7) !important;
}

body.theme-hacker .status-available {
    background: rgba(0,255,65,0.1) !important;
    color: #00FF41 !important;
    border-color: #00FF41 !important;
    box-shadow: 0 0 10px rgba(0,255,65,0.3) !important;
}

body.theme-hacker .score {
    border-color: #39FF14 !important;
    box-shadow: 0 0 10px rgba(57,255,20,0.4) !important;
}

body.theme-hacker .back-btn {
    color: #00AA00 !important;
    border-color: #00AA00 !important;
    background: rgba(0,170,0,0.1) !important;
    box-shadow: 0 0 10px rgba(0,170,0,0.4) !important;
}

body.theme-hacker .back-btn:hover {
    background: rgba(0,170,0,0.25) !important;
    box-shadow: 0 0 20px rgba(0,170,0,0.5) !important;
}

body.theme-hacker .reset-btn {
    color: #00FF41 !important;
    border-color: #00FF41 !important;
    box-shadow: 0 0 10px rgba(0,255,65,0.4) !important;
}

body.theme-hacker .reset-btn:hover {
    background: rgba(0,255,65,0.1) !important;
    box-shadow: 0 0 20px rgba(0,255,65,0.5) !important;
}

body.theme-hacker .mode-btn,
body.theme-hacker .difficulty-btn {
    color: #00FF41 !important;
    border-color: #00FF41 !important;
    box-shadow: 0 0 10px rgba(0,255,65,0.3) !important;
}

body.theme-hacker .mode-btn.active,
body.theme-hacker .difficulty-btn.active {
    background: rgba(0,255,65,0.15) !important;
    box-shadow: 0 0 20px rgba(0,255,65,0.5) !important;
}

body.theme-hacker .mode-btn:hover,
body.theme-hacker .difficulty-btn:hover {
    background: rgba(0,255,65,0.1) !important;
}

body.theme-hacker .game-over h2,
body.theme-hacker .victory-message h2,
body.theme-hacker .modal h2,
body.theme-hacker .level-complete h2 {
    color: #00FF41 !important;
    text-shadow: 0 0 15px rgba(0,255,65,0.5) !important;
}

body.theme-hacker .game-over,
body.theme-hacker .victory-message,
body.theme-hacker .modal,
body.theme-hacker .level-complete {
    border-color: #00FF41 !important;
    box-shadow: 0 0 30px rgba(0,255,65,0.4) !important;
}

body.theme-hacker .game-over p,
body.theme-hacker .victory-message p,
body.theme-hacker .modal p,
body.theme-hacker .level-complete p {
    color: #39FF14 !important;
    text-shadow: 0 0 8px rgba(57,255,20,0.3) !important;
}

body.theme-hacker .name-box h2 {
    color: #00FF41 !important;
    text-shadow: 0 0 15px rgba(0,255,65,0.5) !important;
}

body.theme-hacker .name-box input {
    border-color: #00FF41 !important;
}

body.theme-hacker .name-box input:focus {
    border-color: #39FF14 !important;
    box-shadow: 0 0 15px rgba(57,255,20,0.4) !important;
}

body.theme-hacker .name-box button {
    background: linear-gradient(135deg, #00FF41, #00CC33) !important;
    color: #000 !important;
}

body.theme-hacker .paypal-link {
    border-color: #00FF41 !important;
    background: rgba(0,255,65,0.05) !important;
    box-shadow: 0 0 10px rgba(0,255,65,0.2) !important;
}

body.theme-hacker .paypal-link:hover {
    border-color: #39FF14 !important;
    background: rgba(0,255,65,0.12) !important;
    box-shadow: 0 0 25px rgba(57,255,20,0.4) !important;
}

body.theme-hacker .qr-container {
    box-shadow: 0 0 12px rgba(0,255,65,0.3), 0 4px 10px rgba(0,0,0,0.3) !important;
}

body.theme-hacker .game-card.coming-soon {
    border-color: #0a3a0a !important;
    box-shadow: 0 0 8px rgba(10,58,10,0.3) !important;
}

body.theme-hacker .status-coming-soon {
    border-color: #0a3a0a !important;
    color: #2a6a2a !important;
}

body.theme-hacker .developer-credit {
    border-top-color: rgba(0,255,65,0.15) !important;
}

body.theme-hacker .settings-btn {
    color: #00FF41 !important;
}

body.theme-hacker .settings-btn:hover {
    border-color: #39FF14 !important;
    color: #39FF14 !important;
    box-shadow: 0 0 20px rgba(57,255,20,0.5) !important;
}

body.theme-hacker .sidebar-header {
    border-bottom-color: rgba(0,255,65,0.2) !important;
}

body.theme-hacker .sidebar-close:hover {
    border-color: #39FF14 !important;
    color: #39FF14 !important;
}

body.theme-hacker .sidebar-option:hover {
    border-color: rgba(0,255,65,0.3) !important;
    background: rgba(0,255,65,0.06) !important;
}

body.theme-hacker .sidebar-section-title {
    color: rgba(0,255,65,0.4) !important;
}

body.theme-hacker .toggle-switch input:checked + .toggle-slider {
    background: linear-gradient(135deg, #00FF41, #00CC33) !important;
    box-shadow: 0 0 10px rgba(0,255,65,0.4) !important;
}

body.theme-hacker .stat-value {
    color: #39FF14 !important;
    text-shadow: 0 0 8px rgba(57,255,20,0.4) !important;
}

body.theme-hacker .stat.cyan .stat-value,
body.theme-hacker .stat.magenta .stat-value {
    color: #00FF41 !important;
    text-shadow: 0 0 8px rgba(0,255,65,0.4) !important;
}

body.theme-hacker .cell {
    border-color: #00CC33 !important;
    box-shadow: 0 0 8px rgba(0,204,51,0.3) !important;
}

body.theme-hacker .cell.x {
    color: #00FF41 !important;
    text-shadow: 0 0 20px rgba(0,255,65,0.5) !important;
}

body.theme-hacker .cell.o {
    color: #39FF14 !important;
    text-shadow: 0 0 20px rgba(57,255,20,0.5) !important;
}

body.theme-hacker .cell.win {
    background: rgba(0,255,65,0.2) !important;
    border-color: #00FF41 !important;
}

body.theme-hacker .cell.valid {
    border-color: #39FF14 !important;
    box-shadow: 0 0 8px rgba(57,255,20,0.4) !important;
}

body.theme-hacker .cell:hover.valid {
    background: rgba(57,255,20,0.15) !important;
    box-shadow: 0 0 15px rgba(57,255,20,0.5) !important;
}

body.theme-hacker .board {
    background: rgba(0,255,65,0.03) !important;
    border-color: #00CC33 !important;
}

body.theme-hacker .piece.black {
    background: radial-gradient(circle, #00FF41, #009922) !important;
    box-shadow: 0 0 12px rgba(0,255,65,0.5) !important;
}

body.theme-hacker .piece.white {
    background: radial-gradient(circle, #39FF14, #22AA00) !important;
    box-shadow: 0 0 12px rgba(57,255,20,0.5) !important;
}

body.theme-hacker .card .front {
    background: linear-gradient(145deg, #0a2a0a, #051505) !important;
    border-color: #00CC33 !important;
    box-shadow: inset 0 0 15px rgba(0,204,51,0.2), 0 0 15px rgba(0,204,51,0.2) !important;
}

body.theme-hacker .card .back {
    border-color: #39FF14 !important;
    box-shadow: inset 0 0 15px rgba(57,255,20,0.15), 0 0 10px rgba(57,255,20,0.3) !important;
    filter: drop-shadow(0 0 8px rgba(57,255,20,0.5)) !important;
}

body.theme-hacker .card.matched {
    background: linear-gradient(145deg, #00CC33, #00AA22) !important;
    border-color: #00FF41 !important;
    box-shadow: 0 0 25px rgba(0,255,65,0.5) !important;
}

body.theme-hacker .card.matched .front {
    background: linear-gradient(145deg, #00CC33, #00AA22) !important;
    border-color: #00FF41 !important;
}

body.theme-hacker .card:hover {
    box-shadow: 0 0 20px rgba(0,255,65,0.5), 0 0 30px rgba(0,255,65,0.3) !important;
}

body.theme-hacker .level-btn:first-of-type {
    background: rgba(0,255,65,0.15) !important;
    color: #00FF41 !important;
    border-color: #00FF41 !important;
    box-shadow: 0 0 12px rgba(0,255,65,0.4) !important;
}

body.theme-hacker .level-btn:last-of-type {
    background: rgba(0,170,0,0.15) !important;
    color: #00AA00 !important;
    border-color: #00AA00 !important;
    box-shadow: 0 0 12px rgba(0,170,0,0.4) !important;
}

body.theme-hacker .target {
    background: radial-gradient(circle, #00FF41, #009922) !important;
    border-color: #39FF14 !important;
    box-shadow: 0 0 20px rgba(57,255,20,0.5) !important;
}

body.theme-hacker .crosshair::before,
body.theme-hacker .crosshair::after {
    background: #00FF41 !important;
    box-shadow: 0 0 8px rgba(0,255,65,0.7) !important;
}

body.theme-hacker .side-panel {
    border-color: #00CC33 !important;
    box-shadow: 0 0 15px rgba(0,204,51,0.3) !important;
}

body.theme-hacker .side-panel > div:first-child {
    color: #00CC33 !important;
}

body.theme-hacker .next-piece {
    border-color: #00FF41 !important;
}

body.theme-hacker canvas {
    border-color: #00FF41 !important;
    box-shadow: inset 0 0 15px rgba(0,255,65,0.05) !important;
}

body.theme-hacker .theme-option.active {
    border-color: #00FF41 !important;
    box-shadow: 0 0 12px rgba(0,255,65,0.5) !important;
}

body.theme-hacker .ranking-item.top-1 {
    border-color: #FFD700 !important;
    background: rgba(255,215,0,0.1) !important;
    box-shadow: 0 0 12px rgba(255,215,0,0.3) !important;
}

body.theme-hacker .ranking-item.top-2 {
    border-color: #C0C0C0 !important;
    background: rgba(192,192,192,0.08) !important;
}

body.theme-hacker .ranking-item.top-3 {
    border-color: #CD7F32 !important;
    background: rgba(205,127,50,0.08) !important;
}


/* ============================================ */
/* SAKURA / CHERRY BLOSSOM THEME                */
/* ============================================ */

body.theme-sakura {
    background: linear-gradient(135deg, #1e0a22 0%, #2a1030 50%, #1a0820 100%) !important;
    background-size: 400% 400% !important;
    animation: none !important;
}

body.theme-sakura h1 {
    text-shadow: 0 0 10px #fff, 0 0 20px #FFB7C5, 0 0 30px #FFB7C5, 0 0 50px #FF69B4, 0 0 70px #FF69B4 !important;
    animation: none !important;
}

body.theme-sakura .subtitle,
body.theme-sakura .game-title,
body.theme-sakura .footer h3,
body.theme-sakura .policy-section h2,
body.theme-sakura .ranking-title,
body.theme-sakura .developer-credit .dev-name,
body.theme-sakura .ranking-stats,
body.theme-sakura .no-records,
body.theme-sakura .game-info,
body.theme-sakura .player-bar .player-label,
body.theme-sakura .next-piece h3,
body.theme-sakura .controls h3,
body.theme-sakura .sidebar-header h2,
body.theme-sakura .stat-label,
body.theme-sakura .policy-section a,
body.theme-sakura .donate-hint a {
    color: #FFB7C5 !important;
    text-shadow: 0 0 8px rgba(255,183,197,0.5) !important;
}

body.theme-sakura .game-card,
body.theme-sakura .card,
body.theme-sakura .game-container,
body.theme-sakura .canvas-wrapper,
body.theme-sakura .board-container,
body.theme-sakura .ranking-container,
body.theme-sakura .ranking-item,
body.theme-sakura .footer,
body.theme-sakura .policy-section,
body.theme-sakura .effective-date,
body.theme-sakura .name-box,
body.theme-sakura .sidebar,
body.theme-sakura .stat,
body.theme-sakura .settings-btn {
    border-color: #FFB7C5 !important;
    box-shadow: 0 0 15px rgba(255,183,197,0.3), 0 4px 15px rgba(0,0,0,0.5) !important;
}

body.theme-sakura .game-info.p2-turn {
    color: #DDA0DD !important;
    text-shadow: 0 0 8px rgba(221,160,221,0.5) !important;
}

body.theme-sakura .player-bar .player-name {
    color: #DDA0DD !important;
    text-shadow: 0 0 8px rgba(221,160,221,0.5) !important;
}

body.theme-sakura .tab-btn,
body.theme-sakura .level-tab-btn,
body.theme-sakura .ranking-level {
    color: #DDA0DD !important;
    border-color: #DDA0DD !important;
    box-shadow: 0 0 10px rgba(221,160,221,0.4) !important;
}

body.theme-sakura .tab-btn.active,
body.theme-sakura .level-tab-btn.active {
    background: rgba(221,160,221,0.2) !important;
    color: #fff !important;
    border-color: #DDA0DD !important;
    box-shadow: 0 0 20px rgba(221,160,221,0.5), inset 0 0 15px rgba(221,160,221,0.15) !important;
}

body.theme-sakura .game-card.active {
    border-color: #FF69B4 !important;
    box-shadow: 0 0 20px rgba(255,105,180,0.4) !important;
}

body.theme-sakura .game-card.active:hover {
    border-color: #DDA0DD !important;
    box-shadow: 0 0 30px rgba(221,160,221,0.5), 0 10px 30px rgba(0,0,0,0.7) !important;
}

body.theme-sakura .status-available {
    background: rgba(255,105,180,0.12) !important;
    color: #FF69B4 !important;
    border-color: #FF69B4 !important;
    box-shadow: 0 0 10px rgba(255,105,180,0.3) !important;
}

body.theme-sakura .score {
    border-color: #FF69B4 !important;
    box-shadow: 0 0 10px rgba(255,105,180,0.4) !important;
}

body.theme-sakura .back-btn {
    color: #DB7093 !important;
    border-color: #DB7093 !important;
    background: rgba(219,112,147,0.12) !important;
    box-shadow: 0 0 10px rgba(219,112,147,0.4) !important;
}

body.theme-sakura .back-btn:hover {
    background: rgba(219,112,147,0.25) !important;
    box-shadow: 0 0 20px rgba(219,112,147,0.5) !important;
}

body.theme-sakura .reset-btn {
    color: #FFB7C5 !important;
    border-color: #FFB7C5 !important;
    box-shadow: 0 0 10px rgba(255,183,197,0.4) !important;
}

body.theme-sakura .reset-btn:hover {
    background: rgba(255,183,197,0.12) !important;
    box-shadow: 0 0 20px rgba(255,183,197,0.5) !important;
}

body.theme-sakura .mode-btn,
body.theme-sakura .difficulty-btn {
    color: #FFB7C5 !important;
    border-color: #FFB7C5 !important;
    box-shadow: 0 0 10px rgba(255,183,197,0.3) !important;
}

body.theme-sakura .mode-btn.active,
body.theme-sakura .difficulty-btn.active {
    background: rgba(255,183,197,0.2) !important;
    box-shadow: 0 0 20px rgba(255,183,197,0.5) !important;
}

body.theme-sakura .mode-btn:hover,
body.theme-sakura .difficulty-btn:hover {
    background: rgba(255,183,197,0.12) !important;
}

body.theme-sakura .game-over h2,
body.theme-sakura .victory-message h2,
body.theme-sakura .modal h2,
body.theme-sakura .level-complete h2 {
    color: #FFB7C5 !important;
    text-shadow: 0 0 15px rgba(255,183,197,0.5) !important;
}

body.theme-sakura .game-over,
body.theme-sakura .victory-message,
body.theme-sakura .modal,
body.theme-sakura .level-complete {
    border-color: #FFB7C5 !important;
    box-shadow: 0 0 30px rgba(255,183,197,0.4) !important;
}

body.theme-sakura .game-over p,
body.theme-sakura .victory-message p,
body.theme-sakura .modal p,
body.theme-sakura .level-complete p {
    color: #FFB7C5 !important;
    text-shadow: 0 0 8px rgba(255,183,197,0.3) !important;
}

body.theme-sakura .name-box h2 {
    color: #FFB7C5 !important;
    text-shadow: 0 0 15px rgba(255,183,197,0.5) !important;
}

body.theme-sakura .name-box input {
    border-color: #FFB7C5 !important;
}

body.theme-sakura .name-box input:focus {
    border-color: #DDA0DD !important;
    box-shadow: 0 0 15px rgba(221,160,221,0.4) !important;
}

body.theme-sakura .name-box button {
    background: linear-gradient(135deg, #FFB7C5, #DDA0DD) !important;
    color: #1e0a22 !important;
}

body.theme-sakura .paypal-link {
    border-color: #FFB7C5 !important;
    background: linear-gradient(135deg, rgba(255,183,197,0.08), rgba(221,160,221,0.08)) !important;
    box-shadow: 0 0 10px rgba(255,183,197,0.2) !important;
}

body.theme-sakura .paypal-link:hover {
    border-color: #DDA0DD !important;
    background: linear-gradient(135deg, rgba(221,160,221,0.15), rgba(255,183,197,0.15)) !important;
    box-shadow: 0 0 25px rgba(221,160,221,0.4) !important;
}

body.theme-sakura .qr-container {
    box-shadow: 0 0 12px rgba(255,183,197,0.3), 0 4px 10px rgba(0,0,0,0.3) !important;
}

body.theme-sakura .game-card.coming-soon {
    border-color: #3a1a30 !important;
    box-shadow: 0 0 8px rgba(58,26,48,0.3) !important;
}

body.theme-sakura .status-coming-soon {
    border-color: #3a1a30 !important;
    color: #6a3a5a !important;
}

body.theme-sakura .developer-credit {
    border-top-color: rgba(255,183,197,0.15) !important;
}

body.theme-sakura .settings-btn {
    color: #FFB7C5 !important;
}

body.theme-sakura .settings-btn:hover {
    border-color: #DDA0DD !important;
    color: #DDA0DD !important;
    box-shadow: 0 0 20px rgba(221,160,221,0.4) !important;
}

body.theme-sakura .sidebar-header {
    border-bottom-color: rgba(255,183,197,0.2) !important;
}

body.theme-sakura .sidebar-close:hover {
    border-color: #DDA0DD !important;
    color: #DDA0DD !important;
}

body.theme-sakura .sidebar-option:hover {
    border-color: rgba(255,183,197,0.3) !important;
    background: rgba(255,183,197,0.06) !important;
}

body.theme-sakura .sidebar-section-title {
    color: rgba(255,183,197,0.4) !important;
}

body.theme-sakura .toggle-switch input:checked + .toggle-slider {
    background: linear-gradient(135deg, #FFB7C5, #DDA0DD) !important;
    box-shadow: 0 0 10px rgba(255,183,197,0.4) !important;
}

body.theme-sakura .stat-value {
    color: #FF69B4 !important;
    text-shadow: 0 0 8px rgba(255,105,180,0.4) !important;
}

body.theme-sakura .stat.cyan .stat-value {
    color: #FFB7C5 !important;
    text-shadow: 0 0 8px rgba(255,183,197,0.4) !important;
}

body.theme-sakura .stat.magenta .stat-value {
    color: #DDA0DD !important;
    text-shadow: 0 0 8px rgba(221,160,221,0.4) !important;
}

body.theme-sakura .cell {
    border-color: #DDA0DD !important;
    box-shadow: 0 0 8px rgba(221,160,221,0.3) !important;
}

body.theme-sakura .cell.x {
    color: #FFB7C5 !important;
    text-shadow: 0 0 20px rgba(255,183,197,0.5) !important;
}

body.theme-sakura .cell.o {
    color: #DDA0DD !important;
    text-shadow: 0 0 20px rgba(221,160,221,0.5) !important;
}

body.theme-sakura .cell.win {
    background: rgba(255,105,180,0.25) !important;
    border-color: #FF69B4 !important;
}

body.theme-sakura .cell.valid {
    border-color: #FF69B4 !important;
    box-shadow: 0 0 8px rgba(255,105,180,0.4) !important;
}

body.theme-sakura .cell:hover.valid {
    background: rgba(255,105,180,0.15) !important;
    box-shadow: 0 0 15px rgba(255,105,180,0.5) !important;
}

body.theme-sakura .board {
    background: rgba(255,183,197,0.04) !important;
    border-color: #FF69B4 !important;
}

body.theme-sakura .piece.black {
    background: radial-gradient(circle, #FFB7C5, #CC8899) !important;
    box-shadow: 0 0 12px rgba(255,183,197,0.5) !important;
}

body.theme-sakura .piece.white {
    background: radial-gradient(circle, #DDA0DD, #AA77AA) !important;
    box-shadow: 0 0 12px rgba(221,160,221,0.5) !important;
}

body.theme-sakura .card .front {
    background: linear-gradient(145deg, #3a1a40, #2a1030) !important;
    border-color: #DDA0DD !important;
    box-shadow: inset 0 0 15px rgba(221,160,221,0.2), 0 0 15px rgba(221,160,221,0.2) !important;
}

body.theme-sakura .card .back {
    border-color: #FF69B4 !important;
    box-shadow: inset 0 0 15px rgba(255,105,180,0.15), 0 0 10px rgba(255,105,180,0.3) !important;
    filter: drop-shadow(0 0 8px rgba(255,105,180,0.5)) !important;
}

body.theme-sakura .card.matched {
    background: linear-gradient(145deg, #FF69B4, #FF5599) !important;
    border-color: #FF69B4 !important;
    box-shadow: 0 0 25px rgba(255,105,180,0.5) !important;
}

body.theme-sakura .card.matched .front {
    background: linear-gradient(145deg, #FF69B4, #FF5599) !important;
    border-color: #FF69B4 !important;
}

body.theme-sakura .card:hover {
    box-shadow: 0 0 20px rgba(255,183,197,0.5), 0 0 30px rgba(255,183,197,0.3) !important;
}

body.theme-sakura .level-btn:first-of-type {
    background: rgba(255,105,180,0.15) !important;
    color: #FF69B4 !important;
    border-color: #FF69B4 !important;
    box-shadow: 0 0 12px rgba(255,105,180,0.4) !important;
}

body.theme-sakura .level-btn:last-of-type {
    background: rgba(219,112,147,0.15) !important;
    color: #DB7093 !important;
    border-color: #DB7093 !important;
    box-shadow: 0 0 12px rgba(219,112,147,0.4) !important;
}

body.theme-sakura .target {
    background: radial-gradient(circle, #FFB7C5, #FF69B4) !important;
    border-color: #DDA0DD !important;
    box-shadow: 0 0 20px rgba(221,160,221,0.5) !important;
}

body.theme-sakura .crosshair::before,
body.theme-sakura .crosshair::after {
    background: #FF69B4 !important;
    box-shadow: 0 0 8px rgba(255,105,180,0.6) !important;
}

body.theme-sakura .side-panel {
    border-color: #DDA0DD !important;
    box-shadow: 0 0 15px rgba(221,160,221,0.3) !important;
}

body.theme-sakura .side-panel > div:first-child {
    color: #DDA0DD !important;
}

body.theme-sakura .next-piece {
    border-color: #FFB7C5 !important;
}

body.theme-sakura canvas {
    border-color: #FFB7C5 !important;
    box-shadow: inset 0 0 15px rgba(255,183,197,0.08) !important;
}

body.theme-sakura .theme-option.active {
    border-color: #FFB7C5 !important;
    box-shadow: 0 0 12px rgba(255,183,197,0.5) !important;
}

body.theme-sakura .ranking-item.top-1 {
    border-color: #FFD700 !important;
    background: rgba(255,215,0,0.1) !important;
    box-shadow: 0 0 12px rgba(255,215,0,0.3) !important;
}

body.theme-sakura .ranking-item.top-2 {
    border-color: #C0C0C0 !important;
    background: rgba(192,192,192,0.08) !important;
}

body.theme-sakura .ranking-item.top-3 {
    border-color: #CD7F32 !important;
    background: rgba(205,127,50,0.08) !important;
}


/* ============================================ */
/* GAME INFO BOX + ALL CARD SECTIONS            */
/* CSS variables for full theme-responsive UI   */
/* ============================================ */

/* --- Neon defaults (applied to all themes via :root) --- */
:root {
    --gib-border:   rgba(0,255,255,0.45);
    --gib-shadow:   0 0 14px rgba(0,255,255,0.12), 0 4px 15px rgba(0,0,0,0.5);
    --gib-heading:  #00FFFF;
    --gib-hd-sh:    0 0 8px rgba(0,255,255,0.5);
    --gib-hl:       #FF00FF;
    --gib-hl-sh:    0 0 6px rgba(255,0,255,0.4);
    --gib-ac:       #00FFFF;
    --gib-ac-sh:    0 0 6px rgba(0,255,255,0.4);
    --gib-btn-bg:   rgba(0,255,255,0.08);
    --gib-btn-bdr:  rgba(0,255,255,0.4);
    --gib-btn-clr:  #00FFFF;
    --gib-btn-hbg:  rgba(0,255,255,0.18);
    --gib-btn-hsh:  0 0 14px rgba(0,255,255,0.5);
    --dev-border:   rgba(255,0,255,0.45);
    --dev-shadow:   0 0 14px rgba(255,0,255,0.12), 0 4px 15px rgba(0,0,0,0.5);
    --dev-heading:  #FF00FF;
    --dev-hd-sh:    0 0 8px rgba(255,0,255,0.5);
}

body.theme-mono {
    --gib-border:   rgba(150,150,150,0.45);
    --gib-shadow:   0 0 10px rgba(150,150,150,0.1), 0 4px 15px rgba(0,0,0,0.5);
    --gib-heading:  #ccc;
    --gib-hd-sh:    0 0 6px rgba(200,200,200,0.3);
    --gib-hl:       #bbb;
    --gib-hl-sh:    none;
    --gib-ac:       #ccc;
    --gib-ac-sh:    none;
    --gib-btn-bg:   rgba(200,200,200,0.06);
    --gib-btn-bdr:  rgba(150,150,150,0.4);
    --gib-btn-clr:  #ccc;
    --gib-btn-hbg:  rgba(200,200,200,0.15);
    --gib-btn-hsh:  0 0 10px rgba(150,150,150,0.3);
    --dev-border:   rgba(150,150,150,0.45);
    --dev-shadow:   0 0 10px rgba(150,150,150,0.1), 0 4px 15px rgba(0,0,0,0.5);
    --dev-heading:  #ccc;
    --dev-hd-sh:    0 0 6px rgba(200,200,200,0.3);
}

body.theme-retro {
    --gib-border:   rgba(255,215,0,0.5);
    --gib-shadow:   0 0 14px rgba(255,215,0,0.12), 0 4px 15px rgba(0,0,0,0.5);
    --gib-heading:  #FFD700;
    --gib-hd-sh:    0 0 8px rgba(255,215,0,0.5);
    --gib-hl:       #FF6347;
    --gib-hl-sh:    0 0 6px rgba(255,99,71,0.4);
    --gib-ac:       #FFD700;
    --gib-ac-sh:    0 0 6px rgba(255,215,0,0.4);
    --gib-btn-bg:   rgba(255,215,0,0.07);
    --gib-btn-bdr:  rgba(255,215,0,0.45);
    --gib-btn-clr:  #FFD700;
    --gib-btn-hbg:  rgba(255,215,0,0.18);
    --gib-btn-hsh:  0 0 14px rgba(255,215,0,0.45);
    --dev-border:   rgba(255,99,71,0.5);
    --dev-shadow:   0 0 14px rgba(255,99,71,0.12), 0 4px 15px rgba(0,0,0,0.5);
    --dev-heading:  #FF6347;
    --dev-hd-sh:    0 0 8px rgba(255,99,71,0.5);
}

body.theme-ocean {
    --gib-border:   rgba(30,144,255,0.5);
    --gib-shadow:   0 0 14px rgba(30,144,255,0.12), 0 4px 15px rgba(0,0,0,0.5);
    --gib-heading:  #1E90FF;
    --gib-hd-sh:    0 0 8px rgba(30,144,255,0.5);
    --gib-hl:       #7B68EE;
    --gib-hl-sh:    0 0 6px rgba(123,104,238,0.4);
    --gib-ac:       #1E90FF;
    --gib-ac-sh:    0 0 6px rgba(30,144,255,0.4);
    --gib-btn-bg:   rgba(30,144,255,0.07);
    --gib-btn-bdr:  rgba(30,144,255,0.45);
    --gib-btn-clr:  #1E90FF;
    --gib-btn-hbg:  rgba(30,144,255,0.18);
    --gib-btn-hsh:  0 0 14px rgba(30,144,255,0.45);
    --dev-border:   rgba(123,104,238,0.5);
    --dev-shadow:   0 0 14px rgba(123,104,238,0.12), 0 4px 15px rgba(0,0,0,0.5);
    --dev-heading:  #7B68EE;
    --dev-hd-sh:    0 0 8px rgba(123,104,238,0.5);
}

body.theme-hacker {
    --gib-border:   rgba(0,255,65,0.5);
    --gib-shadow:   0 0 14px rgba(0,255,65,0.12), 0 4px 15px rgba(0,0,0,0.5);
    --gib-heading:  #00FF41;
    --gib-hd-sh:    0 0 8px rgba(0,255,65,0.5);
    --gib-hl:       #39FF14;
    --gib-hl-sh:    0 0 6px rgba(57,255,20,0.4);
    --gib-ac:       #00FF41;
    --gib-ac-sh:    0 0 6px rgba(0,255,65,0.4);
    --gib-btn-bg:   rgba(0,255,65,0.07);
    --gib-btn-bdr:  rgba(0,255,65,0.45);
    --gib-btn-clr:  #00FF41;
    --gib-btn-hbg:  rgba(0,255,65,0.18);
    --gib-btn-hsh:  0 0 14px rgba(0,255,65,0.45);
    --dev-border:   rgba(57,255,20,0.5);
    --dev-shadow:   0 0 14px rgba(57,255,20,0.12), 0 4px 15px rgba(0,0,0,0.5);
    --dev-heading:  #39FF14;
    --dev-hd-sh:    0 0 8px rgba(57,255,20,0.5);
}

body.theme-sakura {
    --gib-border:   rgba(255,183,197,0.5);
    --gib-shadow:   0 0 14px rgba(255,183,197,0.12), 0 4px 15px rgba(0,0,0,0.5);
    --gib-heading:  #FFB7C5;
    --gib-hd-sh:    0 0 8px rgba(255,183,197,0.5);
    --gib-hl:       #DDA0DD;
    --gib-hl-sh:    0 0 6px rgba(221,160,221,0.4);
    --gib-ac:       #FFB7C5;
    --gib-ac-sh:    0 0 6px rgba(255,183,197,0.4);
    --gib-btn-bg:   rgba(255,183,197,0.07);
    --gib-btn-bdr:  rgba(255,183,197,0.45);
    --gib-btn-clr:  #FFB7C5;
    --gib-btn-hbg:  rgba(255,183,197,0.18);
    --gib-btn-hsh:  0 0 14px rgba(255,183,197,0.45);
    --dev-border:   rgba(221,160,221,0.5);
    --dev-shadow:   0 0 14px rgba(221,160,221,0.12), 0 4px 15px rgba(0,0,0,0.5);
    --dev-heading:  #DDA0DD;
    --dev-hd-sh:    0 0 8px rgba(221,160,221,0.5);
}

/* --- Structural CSS (toggle/collapse) — unchanged --- */
.gib-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.gib-header h2,
.gib-header h3 {
    margin-bottom: 0 !important;
    flex: 1;
}

.gib-body {
    overflow: hidden;
    max-height: 800px;
    opacity: 1;
    margin-top: 14px;
    transition:
        max-height 0.45s cubic-bezier(0.4, 0, 0.2, 1),
        opacity 0.3s ease,
        margin-top 0.35s ease;
}

.game-info-box.collapsed .gib-body,
.about-section.collapsed .gib-body {
    max-height: 0;
    opacity: 0;
    margin-top: 0;
}

/* Toggle button — colors via variables */
.gib-toggle-btn {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--gib-btn-bg) !important;
    border: 1.5px solid var(--gib-btn-bdr) !important;
    color: var(--gib-btn-clr) !important;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.3s, box-shadow 0.3s, transform 0.2s;
    padding: 0;
    margin-top: 2px;
    position: relative;
    outline: none;
}

.gib-toggle-btn::after {
    content: '';
    display: block;
    width: 7px;
    height: 7px;
    border-right: 2px solid currentColor;
    border-top: 2px solid currentColor;
    transform: rotate(-45deg) translate(-1px, 2px);
    transition: transform 0.38s cubic-bezier(0.4, 0, 0.2, 1);
}

.game-info-box.collapsed .gib-toggle-btn::after,
.about-section.collapsed .gib-toggle-btn::after {
    transform: rotate(135deg) translate(-1px, -2px);
}

.gib-toggle-btn:hover {
    background: var(--gib-btn-hbg) !important;
    box-shadow: var(--gib-btn-hsh) !important;
    transform: scale(1.12);
}

/* --- Universal color applicators for ALL card classes --- */

/* Box borders & shadows */
.game-info-box,
.about-section,
.about-card,
.contact-card,
.terms-section {
    border-color: var(--gib-border) !important;
    box-shadow: var(--gib-shadow) !important;
}

/* Developer card uses alternate accent color */
.dev-card {
    border-color: var(--dev-border) !important;
    box-shadow: var(--dev-shadow) !important;
}

/* Headings inside all main card classes */
.game-info-box h2,
.game-info-box h3,
.about-section h2,
.about-section h3,
.about-card h2,
.about-card h3,
.contact-card h2,
.contact-card h3,
.terms-section h2,
.terms-section h3 {
    color: var(--gib-heading) !important;
    text-shadow: var(--gib-hd-sh) !important;
}

.dev-card h2,
.dev-card h3 {
    color: var(--dev-heading) !important;
    text-shadow: var(--dev-hd-sh) !important;
}

/* Highlight spans (magenta by default) */
.game-info-box .gib-highlight,
.game-info-box .highlight,
.about-section .highlight,
.about-card .highlight,
.dev-card .highlight,
.contact-card .highlight,
.terms-section .highlight {
    color: var(--gib-hl) !important;
    text-shadow: var(--gib-hl-sh) !important;
}

/* Cyan / accent spans */
.game-info-box .gib-cyan,
.about-section .highlight-cyan,
.about-card .highlight-cyan,
.dev-card .highlight-cyan,
.contact-card .highlight-cyan,
.terms-section .highlight-cyan {
    color: var(--gib-ac) !important;
    text-shadow: var(--gib-ac-sh) !important;
}

/* Links inside card sections */
.terms-section a {
    color: var(--gib-ac) !important;
}
.terms-section a:hover {
    color: var(--gib-hl) !important;
}

/* List bullets inside card sections */
.terms-section ul li::before,
.about-card ul li::before,
.contact-card ul li::before {
    color: var(--gib-hl) !important;
}
