Rehber TVE⁵ - Sosyal'i baştan yarattım! (RDR2 & The Last of Us temaları + özel efektler)

// ==UserScript==
// @name         TVE⁵ — GÜNCDL Edition
// @namespace    https://github.com/0bfsc4t0r
// @version      5.2.0
// @description  Immersive theme engine with RDR2 & TLOU themes
// @author       0bfsc4t0r
// @match        *://www.techolay.net/sosyal/*
// @match        *://techolay.net/sosyal/*
// @match        *://www.technopat.net/sosyal/*
// @match        *://technopat.net/sosyal/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=techolay.net
// @run-at       document-idle
// @license      MIT
// ==/UserScript==

(function() {
    'use strict';

    const CFG = {
        STORAGE_KEY: 'tve5_theme',
        VERSION: '5.2.0',
        Z_BASE: 2147483640
    };

    // ════════════════════════════════════════════════════════════════════════════
    // § THEMES
    // ════════════════════════════════════════════════════════════════════════════

    const THEMES = {
        off: {
            id: 'off',
            name: 'Varsayılan',
            desc: 'Orijinal site teması',
            preview: ['#3a3a4a', '#2a2a3a', '#4a4a5a'],
            vars: null,
            customCSS: null
        },

        cyber: {
            id: 'cyber',
            name: 'Cyberpunk 2077',
            desc: 'Neon cyan & magenta, keskin hatlar',
            tag: 'HOT',
            preview: ['#00f0ff', '#ff2a6d', '#0a0a12'],
            vars: {
                '--tve-bg-base': '#0a0a12',
                '--tve-bg-surface': '#0d0d18',
                '--tve-bg-elevated': 'rgba(13, 13, 24, 0.95)',
                '--tve-bg-overlay': 'rgba(10, 10, 18, 0.9)',
                '--tve-header-bg': 'linear-gradient(180deg, rgba(10,10,18,0.98), rgba(13,13,24,0.95))',
                '--tve-header-border': '#00f0ff',
                '--tve-header-glow': '0 0 30px rgba(0, 240, 255, 0.2)',
                '--tve-border-default': 'rgba(0, 240, 255, 0.3)',
                '--tve-border-accent': '#00f0ff',
                '--tve-border-highlight': '#ff2a6d',
                '--tve-text-primary': '#e0e0e0',
                '--tve-text-secondary': '#a0a0a0',
                '--tve-text-muted': '#666666',
                '--tve-link': '#00f0ff',
                '--tve-link-hover': '#ff2a6d',
                '--tve-username': '#ff2a6d',
                '--tve-text-glow': '0 0 8px rgba(0, 240, 255, 0.5)',
                '--tve-card-bg': 'rgba(13, 13, 24, 0.95)',
                '--tve-card-border': 'rgba(0, 240, 255, 0.3)',
                '--tve-card-shadow': '0 0 20px rgba(0, 240, 255, 0.15)',
                '--tve-m-border-left': '#ff2a6d',
                '--tve-quote-bg': 'rgba(0, 240, 255, 0.05)',
                '--tve-code-bg': '#050508',
                '--tve-avatar-border': '#00f0ff',
                '--tve-avatar-glow': '0 0 15px rgba(0, 240, 255, 0.4)',
                '--tve-avatar-filter': 'none',
                '--tve-btn-bg': 'transparent',
                '--tve-btn-border': '#00f0ff',
                '--tve-btn-text': '#00f0ff',
                '--tve-btn-hover-bg': '#00f0ff',
                '--tve-btn-hover-text': '#0a0a12',
                '--tve-input-bg': 'rgba(10, 10, 18, 0.9)',
                '--tve-input-border': 'rgba(0, 240, 255, 0.3)',
                '--tve-input-focus-border': '#00f0ff',
                '--tve-input-focus-glow': '0 0 15px rgba(0, 240, 255, 0.3)',
                '--tve-scroll-track': '#0a0a12',
                '--tve-scroll-thumb': 'linear-gradient(180deg, #00f0ff, #ff2a6d)',
                '--tve-radius': '0px',
                '--tve-radius-sm': '0px',
                '--tve-font': 'inherit',
                '--tve-selection-bg': 'rgba(0, 240, 255, 0.3)',
                '--tve-selection-text': '#fff',
                '--tve-scanline': 'none',
                '--tve-crt-curve': 'none'
            },
            customCSS: null
        },

        amoled: {
            id: 'amoled',
            name: 'AMOLED Black',
            desc: 'Saf siyah, OLED uyumlu',
            tag: 'OLED',
            preview: ['#000000', '#ffffff', '#1a1a1a'],
            vars: {
                '--tve-bg-base': '#000000',
                '--tve-bg-surface': '#000000',
                '--tve-bg-elevated': '#0a0a0a',
                '--tve-bg-overlay': '#0a0a0a',
                '--tve-header-bg': '#000000',
                '--tve-header-border': '#1a1a1a',
                '--tve-header-glow': 'none',
                '--tve-border-default': '#1a1a1a',
                '--tve-border-accent': '#333333',
                '--tve-border-highlight': '#ffffff',
                '--tve-text-primary': '#ffffff',
                '--tve-text-secondary': '#cccccc',
                '--tve-text-muted': '#666666',
                '--tve-link': '#ffffff',
                '--tve-link-hover': '#888888',
                '--tve-username': '#ffffff',
                '--tve-text-glow': 'none',
                '--tve-card-bg': '#000000',
                '--tve-card-border': '#1a1a1a',
                '--tve-card-shadow': 'none',
                '--tve-m-border-left': '#333333',
                '--tve-quote-bg': '#0a0a0a',
                '--tve-code-bg': '#000000',
                '--tve-avatar-border': '#333333',
                '--tve-avatar-glow': 'none',
                '--tve-avatar-filter': 'none',
                '--tve-btn-bg': '#0a0a0a',
                '--tve-btn-border': '#333333',
                '--tve-btn-text': '#ffffff',
                '--tve-btn-hover-bg': '#1a1a1a',
                '--tve-btn-hover-text': '#ffffff',
                '--tve-input-bg': '#000000',
                '--tve-input-border': '#1a1a1a',
                '--tve-input-focus-border': '#333333',
                '--tve-input-focus-glow': 'none',
                '--tve-scroll-track': '#000000',
                '--tve-scroll-thumb': '#333333',
                '--tve-radius': '0px',
                '--tve-radius-sm': '0px',
                '--tve-font': 'inherit',
                '--tve-selection-bg': '#333333',
                '--tve-selection-text': '#ffffff',
                '--tve-scanline': 'none',
                '--tve-crt-curve': 'none'
            },
            customCSS: null
        },

        dracula: {
            id: 'dracula',
            name: 'Dracula',
            desc: 'Klasik karanlık mor tema',
            preview: ['#bd93f9', '#ff79c6', '#282a36'],
            vars: {
                '--tve-bg-base': '#282a36',
                '--tve-bg-surface': '#282a36',
                '--tve-bg-elevated': '#44475a',
                '--tve-bg-overlay': '#282a36',
                '--tve-header-bg': 'linear-gradient(180deg, #2d2f3d, #282a36)',
                '--tve-header-border': '#44475a',
                '--tve-header-glow': 'none',
                '--tve-border-default': 'rgba(98, 114, 164, 0.3)',
                '--tve-border-accent': '#bd93f9',
                '--tve-border-highlight': '#ff79c6',
                '--tve-text-primary': '#f8f8f2',
                '--tve-text-secondary': '#d5d5d5',
                '--tve-text-muted': '#6272a4',
                '--tve-link': '#ff79c6',
                '--tve-link-hover': '#8be9fd',
                '--tve-username': '#bd93f9',
                '--tve-text-glow': 'none',
                '--tve-card-bg': '#44475a',
                '--tve-card-border': 'rgba(98, 114, 164, 0.3)',
                '--tve-card-shadow': '0 4px 20px rgba(0, 0, 0, 0.3)',
                '--tve-m-border-left': '#bd93f9',
                '--tve-quote-bg': 'rgba(68, 71, 90, 0.5)',
                '--tve-code-bg': '#1e1f29',
                '--tve-avatar-border': '#bd93f9',
                '--tve-avatar-glow': 'none',
                '--tve-avatar-filter': 'none',
                '--tve-btn-bg': '#44475a',
                '--tve-btn-border': '#bd93f9',
                '--tve-btn-text': '#f8f8f2',
                '--tve-btn-hover-bg': '#bd93f9',
                '--tve-btn-hover-text': '#282a36',
                '--tve-input-bg': '#282a36',
                '--tve-input-border': '#44475a',
                '--tve-input-focus-border': '#bd93f9',
                '--tve-input-focus-glow': '0 0 0 3px rgba(189, 147, 249, 0.2)',
                '--tve-scroll-track': '#282a36',
                '--tve-scroll-thumb': '#bd93f9',
                '--tve-radius': '12px',
                '--tve-radius-sm': '8px',
                '--tve-font': 'inherit',
                '--tve-selection-bg': '#bd93f9',
                '--tve-selection-text': '#282a36',
                '--tve-scanline': 'none',
                '--tve-crt-curve': 'none'
            },
            customCSS: null
        },

        vapor: {
            id: 'vapor',
            name: 'Vaporwave',
            desc: 'Retro estetik, synthwave',
            tag: 'RETRO',
            preview: ['#ff71ce', '#01cdfe', '#1a0a2e'],
            vars: {
                '--tve-bg-base': '#1a0a2e',
                '--tve-bg-surface': '#2d1b4e',
                '--tve-bg-elevated': 'rgba(45, 27, 78, 0.9)',
                '--tve-bg-overlay': 'rgba(26, 10, 46, 0.8)',
                '--tve-header-bg': 'linear-gradient(180deg, rgba(45, 27, 78, 0.95), rgba(26, 10, 46, 0.9))',
                '--tve-header-border': '#ff71ce',
                '--tve-header-glow': '0 4px 20px rgba(255, 113, 206, 0.2)',
                '--tve-border-default': 'rgba(255, 113, 206, 0.2)',
                '--tve-border-accent': '#ff71ce',
                '--tve-border-highlight': '#01cdfe',
                '--tve-text-primary': '#ffffff',
                '--tve-text-secondary': 'rgba(255, 255, 255, 0.85)',
                '--tve-text-muted': 'rgba(255, 255, 255, 0.5)',
                '--tve-link': '#01cdfe',
                '--tve-link-hover': '#ff71ce',
                '--tve-username': '#ff71ce',
                '--tve-text-glow': '0 0 10px rgba(255, 113, 206, 0.5)',
                '--tve-card-bg': 'rgba(45, 27, 78, 0.9)',
                '--tve-card-border': 'rgba(255, 113, 206, 0.2)',
                '--tve-card-shadow': '0 10px 40px rgba(185, 103, 255, 0.1)',
                '--tve-m-border-left': '#01cdfe',
                '--tve-quote-bg': 'rgba(255, 113, 206, 0.1)',
                '--tve-code-bg': 'rgba(26, 10, 46, 0.95)',
                '--tve-avatar-border': '#01cdfe',
                '--tve-avatar-glow': '0 0 15px rgba(1, 205, 254, 0.4)',
                '--tve-avatar-filter': 'none',
                '--tve-btn-bg': 'linear-gradient(135deg, #ff71ce, #b967ff)',
                '--tve-btn-border': 'transparent',
                '--tve-btn-text': '#ffffff',
                '--tve-btn-hover-bg': 'linear-gradient(135deg, #ff71ce, #01cdfe)',
                '--tve-btn-hover-text': '#ffffff',
                '--tve-input-bg': 'rgba(26, 10, 46, 0.9)',
                '--tve-input-border': 'rgba(1, 205, 254, 0.3)',
                '--tve-input-focus-border': '#ff71ce',
                '--tve-input-focus-glow': '0 0 20px rgba(255, 113, 206, 0.3)',
                '--tve-scroll-track': '#1a0a2e',
                '--tve-scroll-thumb': 'linear-gradient(180deg, #ff71ce, #01cdfe)',
                '--tve-radius': '16px',
                '--tve-radius-sm': '10px',
                '--tve-font': 'inherit',
                '--tve-selection-bg': '#ff71ce',
                '--tve-selection-text': '#ffffff',
                '--tve-scanline': 'repeating-linear-gradient(0deg, transparent 0px, transparent 2px, rgba(255,113,206,0.03) 2px, rgba(255,113,206,0.03) 4px)',
                '--tve-crt-curve': 'none'
            },
            customCSS: null
        },

        gruvbox: {
            id: 'gruvbox',
            name: 'Gruvbox',
            desc: 'Sıcak retro tonlar',
            preview: ['#fabd2f', '#b8bb26', '#282828'],
            vars: {
                '--tve-bg-base': '#282828',
                '--tve-bg-surface': '#282828',
                '--tve-bg-elevated': '#3c3836',
                '--tve-bg-overlay': '#282828',
                '--tve-header-bg': '#3c3836',
                '--tve-header-border': '#fabd2f',
                '--tve-header-glow': 'none',
                '--tve-border-default': '#504945',
                '--tve-border-accent': '#fabd2f',
                '--tve-border-highlight': '#fe8019',
                '--tve-text-primary': '#ebdbb2',
                '--tve-text-secondary': '#d5c4a1',
                '--tve-text-muted': '#928374',
                '--tve-link': '#83a598',
                '--tve-link-hover': '#8ec07c',
                '--tve-username': '#fabd2f',
                '--tve-text-glow': 'none',
                '--tve-card-bg': '#3c3836',
                '--tve-card-border': '#504945',
                '--tve-card-shadow': 'none',
                '--tve-m-border-left': '#fabd2f',
                '--tve-quote-bg': '#3c3836',
                '--tve-code-bg': '#1d2021',
                '--tve-avatar-border': '#fabd2f',
                '--tve-avatar-glow': 'none',
                '--tve-avatar-filter': 'none',
                '--tve-btn-bg': '#504945',
                '--tve-btn-border': '#fabd2f',
                '--tve-btn-text': '#ebdbb2',
                '--tve-btn-hover-bg': '#fabd2f',
                '--tve-btn-hover-text': '#282828',
                '--tve-input-bg': '#282828',
                '--tve-input-border': '#504945',
                '--tve-input-focus-border': '#fabd2f',
                '--tve-input-focus-glow': 'none',
                '--tve-scroll-track': '#282828',
                '--tve-scroll-thumb': '#fabd2f',
                '--tve-radius': '8px',
                '--tve-radius-sm': '4px',
                '--tve-font': 'inherit',
                '--tve-selection-bg': '#fabd2f',
                '--tve-selection-text': '#282828',
                '--tve-scanline': 'none',
                '--tve-crt-curve': 'none'
            },
            customCSS: null
        },

        win95: {
            id: 'win95',
            name: 'Windows 95',
            desc: '3D butonlar, piksel nostalji',
            tag: 'MEME',
            preview: ['#008080', '#c0c0c0', '#000080'],
            vars: {
                '--tve-bg-base': '#008080',
                '--tve-bg-surface': '#c0c0c0',
                '--tve-bg-elevated': '#c0c0c0',
                '--tve-bg-overlay': '#ffffff',
                '--tve-header-bg': 'linear-gradient(90deg, #000080, #1084d0)',
                '--tve-header-border': 'transparent',
                '--tve-header-glow': 'none',
                '--tve-border-default': '#808080',
                '--tve-border-accent': '#000080',
                '--tve-border-highlight': '#ffffff',
                '--tve-text-primary': '#000000',
                '--tve-text-secondary': '#000000',
                '--tve-text-muted': '#808080',
                '--tve-link': '#000080',
                '--tve-link-hover': '#ff00ff',
                '--tve-username': '#000080',
                '--tve-text-glow': 'none',
                '--tve-card-bg': '#c0c0c0',
                '--tve-card-border': '#808080',
                '--tve-card-shadow': 'none',
                '--tve-m-border-left': '#000080',
                '--tve-quote-bg': '#ffffcc',
                '--tve-code-bg': '#ffffff',
                '--tve-avatar-border': '#808080',
                '--tve-avatar-glow': 'none',
                '--tve-avatar-filter': 'none',
                '--tve-btn-bg': '#c0c0c0',
                '--tve-btn-border': '#808080',
                '--tve-btn-text': '#000000',
                '--tve-btn-hover-bg': '#c0c0c0',
                '--tve-btn-hover-text': '#000000',
                '--tve-input-bg': '#ffffff',
                '--tve-input-border': '#808080',
                '--tve-input-focus-border': '#000080',
                '--tve-input-focus-glow': 'none',
                '--tve-scroll-track': '#c0c0c0',
                '--tve-scroll-thumb': '#c0c0c0',
                '--tve-radius': '0px',
                '--tve-radius-sm': '0px',
                '--tve-font': '"MS Sans Serif", "Courier New", Courier, monospace',
                '--tve-selection-bg': '#000080',
                '--tve-selection-text': '#ffffff',
                '--tve-scanline': 'none',
                '--tve-crt-curve': 'none'
            },
            customCSS: `
                body[data-tve="win95"] .block,
                body[data-tve="win95"] .b-container,
                body[data-tve="win95"] .b--messages {
                    border-style: solid !important;
                    border-width: 2px !important;
                    border-color: #ffffff #808080 #808080 #ffffff !important;
                    box-shadow: inset -1px -1px 0 #000000, inset 1px 1px 0 #dfdfdf !important;
                }
                body[data-tve="win95"] .message,
                body[data-tve="win95"] .m--post {
                    border-style: solid !important;
                    border-width: 2px !important;
                    border-color: #808080 #ffffff #ffffff #808080 !important;
                    border-left-width: 2px !important;
                    box-shadow: inset 1px 1px 0 #000000 !important;
                }
                body[data-tve="win95"] .b-header {
                    background: linear-gradient(90deg, #000080, #1084d0) !important;
                    color: #ffffff !important;
                    font-weight: bold !important;
                    padding: 3px 6px !important;
                }
                body[data-tve="win95"] .button,
                body[data-tve="win95"] button:not([class*="tve-"]) {
                    border-style: solid !important;
                    border-width: 2px !important;
                    border-color: #ffffff #808080 #808080 #ffffff !important;
                    box-shadow: 1px 1px 0 #000000 !important;
                }
                body[data-tve="win95"] .button:active,
                body[data-tve="win95"] button:not([class*="tve-"]):active {
                    border-color: #808080 #ffffff #ffffff #808080 !important;
                    box-shadow: inset 1px 1px 0 #000000 !important;
                }
                body[data-tve="win95"] input,
                body[data-tve="win95"] textarea,
                body[data-tve="win95"] select {
                    border-style: solid !important;
                    border-width: 2px !important;
                    border-color: #808080 #ffffff #ffffff #808080 !important;
                    box-shadow: inset 1px 1px 0 #000000 !important;
                }
                body[data-tve="win95"] ::-webkit-scrollbar { width: 16px !important; }
                body[data-tve="win95"] ::-webkit-scrollbar-thumb {
                    background: #c0c0c0 !important;
                    border: 2px solid !important;
                    border-color: #ffffff #808080 #808080 #ffffff !important;
                }
                body[data-tve="win95"] .p-header *,
                body[data-tve="win95"] .p-nav * { color: #ffffff !important; }
            `
        },

        matrix: {
            id: 'matrix',
            name: 'Matrix',
            desc: 'Terminal estetiği, yeşil kod',
            tag: 'HACKER',
            preview: ['#00ff41', '#003300', '#0a0a0a'],
            vars: {
                '--tve-bg-base': '#0a0a0a',
                '--tve-bg-surface': '#0a0a0a',
                '--tve-bg-elevated': 'rgba(0, 0, 0, 0.85)',
                '--tve-bg-overlay': 'rgba(0, 0, 0, 0.7)',
                '--tve-header-bg': 'rgba(0, 0, 0, 0.9)',
                '--tve-header-border': '#00ff41',
                '--tve-header-glow': '0 0 20px rgba(0, 255, 65, 0.2)',
                '--tve-border-default': 'rgba(0, 255, 65, 0.2)',
                '--tve-border-accent': '#00ff41',
                '--tve-border-highlight': '#ffffff',
                '--tve-text-primary': '#00ff41',
                '--tve-text-secondary': '#00cc33',
                '--tve-text-muted': 'rgba(0, 255, 65, 0.5)',
                '--tve-link': '#00ff41',
                '--tve-link-hover': '#ffffff',
                '--tve-username': '#00ff41',
                '--tve-text-glow': '0 0 8px rgba(0, 255, 65, 0.5)',
                '--tve-card-bg': 'rgba(0, 0, 0, 0.85)',
                '--tve-card-border': 'rgba(0, 255, 65, 0.2)',
                '--tve-card-shadow': '0 0 15px rgba(0, 255, 65, 0.1)',
                '--tve-m-border-left': '#00ff41',
                '--tve-quote-bg': 'rgba(0, 255, 65, 0.03)',
                '--tve-code-bg': 'rgba(0, 0, 0, 0.95)',
                '--tve-avatar-border': '#00ff41',
                '--tve-avatar-glow': '0 0 10px rgba(0, 255, 65, 0.3)',
                '--tve-avatar-filter': 'grayscale(50%) brightness(1.2) contrast(1.1)',
                '--tve-btn-bg': 'transparent',
                '--tve-btn-border': '#00ff41',
                '--tve-btn-text': '#00ff41',
                '--tve-btn-hover-bg': '#00ff41',
                '--tve-btn-hover-text': '#0a0a0a',
                '--tve-input-bg': 'rgba(0, 0, 0, 0.8)',
                '--tve-input-border': 'rgba(0, 255, 65, 0.2)',
                '--tve-input-focus-border': '#00ff41',
                '--tve-input-focus-glow': '0 0 10px rgba(0, 255, 65, 0.3)',
                '--tve-scroll-track': '#0a0a0a',
                '--tve-scroll-thumb': 'rgba(0, 255, 65, 0.5)',
                '--tve-radius': '0px',
                '--tve-radius-sm': '0px',
                '--tve-font': '"Courier New", "Lucida Console", Monaco, monospace',
                '--tve-selection-bg': '#00ff41',
                '--tve-selection-text': '#0a0a0a',
                '--tve-scanline': 'repeating-linear-gradient(0deg, transparent 0px, transparent 1px, rgba(0,0,0,0.2) 1px, rgba(0,0,0,0.2) 2px)',
                '--tve-crt-curve': 'radial-gradient(ellipse at center, transparent 50%, rgba(0,0,0,0.4) 100%)'
            },
            customCSS: `
                body[data-tve="matrix"] .username::before,
                body[data-tve="matrix"] .m-name a::before {
                    content: '> ';
                    opacity: 0.6;
                }
                body[data-tve="matrix"] .b-header::before { content: '['; margin-right: 4px; opacity: 0.5; }
                body[data-tve="matrix"] .b-header::after { content: ']'; margin-left: 4px; opacity: 0.5; }
                body[data-tve="matrix"] .bbCodeBlock--quote::before {
                    content: '/* QUOTE */';
                    display: block;
                    font-size: 10px;
                    color: rgba(0, 255, 65, 0.4);
                    margin-bottom: 6px;
                }
                @keyframes tve-matrix-flicker {
                    0%, 100% { opacity: 1; }
                    93% { opacity: 0.8; }
                }
                body[data-tve="matrix"] .message:hover {
                    animation: tve-matrix-flicker 0.15s ease;
                }
            `
        },

        // ════════════════════════════════════════════════════════════════════════
        // §  The Wild West
        // ════════════════════════════════════════════════════════════════════════

        rdr2: {
            id: 'rd',
            name: 'WEST2',
            desc: 'Vahşi Batı, eskimiş deri, kan kırmızısı',
            tag: 'GAME',
            preview: ['#8a0303', '#3d2b1f', '#1a0505'],
            vars: {
                // Arka planlar - Derin kahverengi ve kurumuş kan kırmızısı
                '--tve-bg-base': 'linear-gradient(180deg, #1a0505 0%, #0d0202 50%, #1a0808 100%)',
                '--tve-bg-surface': '#1c0a0a',
                '--tve-bg-elevated': 'linear-gradient(145deg, #2a1510 0%, #1f0f0a 100%)',
                '--tve-bg-overlay': 'rgba(26, 5, 5, 0.95)',

                // Header - Yaşlı ahşap ve paslanmış metal
                '--tve-header-bg': 'linear-gradient(180deg, #2b1a12 0%, #1a0a05 100%)',
                '--tve-header-border': '#5c3a28',
                '--tve-header-glow': '0 2px 15px rgba(90, 20, 5, 0.4)',

                // Kenarlıklar - Ağır, yıpranmış
                '--tve-border-default': '#3d2b1f',
                '--tve-border-accent': '#8a0303',
                '--tve-border-highlight': '#b8860b',

                // Metin renkleri - Yaşlı kağıt tonu
                '--tve-text-primary': '#e0d0b0',
                '--tve-text-secondary': '#c4b08a',
                '--tve-text-muted': '#8b7355',

                // Linkler
                '--tve-link': '#d4a76a',
                '--tve-link-hover': '#8a0303',
                '--tve-username': '#b8860b',
                '--tve-text-glow': 'none',

                // Kartlar - Yıpranmış deri dokusu
                '--tve-card-bg': 'linear-gradient(145deg, #2a1a12 0%, #1c0c08 100%)',
                '--tve-card-border': '#4a3020',
                '--tve-card-shadow': '0 4px 20px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(139, 69, 19, 0.1)',

                // Mesajlar
                '--tve-m-border-left': '#8a0303',
                '--tve-quote-bg': 'rgba(61, 43, 31, 0.4)',
                '--tve-code-bg': '#0f0505',

                // Avatar
                '--tve-avatar-border': '#5c3a28',
                '--tve-avatar-glow': '0 0 10px rgba(138, 3, 3, 0.3)',
                '--tve-avatar-filter': 'sepia(30%) contrast(1.1) brightness(0.95)',

                // Butonlar - Tarnished metal look
                '--tve-btn-bg': 'linear-gradient(180deg, #3d2b1f 0%, #2a1a10 100%)',
                '--tve-btn-border': '#5c3a28',
                '--tve-btn-text': '#e0d0b0',
                '--tve-btn-hover-bg': 'linear-gradient(180deg, #8a0303 0%, #5c0202 100%)',
                '--tve-btn-hover-text': '#ffffff',

                // Input
                '--tve-input-bg': 'rgba(15, 5, 5, 0.9)',
                '--tve-input-border': '#3d2b1f',
                '--tve-input-focus-border': '#8a0303',
                '--tve-input-focus-glow': '0 0 8px rgba(138, 3, 3, 0.4)',

                // Scrollbar
                '--tve-scroll-track': '#1a0505',
                '--tve-scroll-thumb': 'linear-gradient(180deg, #5c3a28, #3d2b1f)',

                // Diğer
                '--tve-radius': '3px',
                '--tve-radius-sm': '2px',
                '--tve-font': 'Georgia, "Times New Roman", serif',
                '--tve-selection-bg': '#8a0303',
                '--tve-selection-text': '#e0d0b0',
                '--tve-scanline': 'none',
                '--tve-crt-curve': 'none'
            },
            customCSS: `
                /* RDR2 Header Typography - Western Feel */
                body[data-tve="rdr2"] .b-header {
                    font-family: Georgia, "Times New Roman", serif !important;
                    font-weight: bold !important;
                    letter-spacing: 1px !important;
                    text-transform: uppercase !important;
                    font-size: 0.9em !important;
                    border-bottom: 2px solid #5c3a28 !important;
                    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5) !important;
                }

                /* Yaşlı kağıt efekti için quote blokları */
                body[data-tve="rdr2"] .bbCodeBlock--quote {
                    background: linear-gradient(135deg, rgba(61, 43, 31, 0.5), rgba(44, 30, 20, 0.6)) !important;
                    border-left: 4px solid #8a0303 !important;
                    position: relative;
                }
                body[data-tve="rdr2"] .bbCodeBlock--quote::before {
                    content: '❝';
                    position: absolute;
                    top: -5px;
                    left: 10px;
                    font-size: 24px;
                    color: rgba(138, 3, 3, 0.4);
                    font-family: Georgia, serif;
                }

                /* Mesaj hover efekti - Yanan ateş parıltısı */
                body[data-tve="rdr2"] .message:hover,
                body[data-tve="rdr2"] .m--post:hover {
                    box-shadow: 0 0 25px rgba(138, 3, 3, 0.2), inset 0 0 40px rgba(184, 134, 11, 0.03) !important;
                    border-left-color: #b8860b !important;
                }

                /* Username - Gold tarnished look */
                body[data-tve="rdr2"] .username,
                body[data-tve="rdr2"] .m-name a {
                    font-family: Georgia, "Times New Roman", serif !important;
                    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5) !important;
                }

                /* Butonlar için 3D bevel efekti */
                body[data-tve="rdr2"] .button,
                body[data-tve="rdr2"] button:not([class*="tve-"]) {
                    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1),
                                inset 0 -1px 0 rgba(0, 0, 0, 0.3),
                                0 2px 4px rgba(0, 0, 0, 0.4) !important;
                }
                body[data-tve="rdr2"] .button:active,
                body[data-tve="rdr2"] button:not([class*="tve-"]):active {
                    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.4) !important;
                }

                /* Wanted poster texture overlay - subtle */
                body[data-tve="rdr2"] .b-container::before,
                body[data-tve="rdr2"] .b--messages::before {
                    content: '';
                    position: absolute;
                    top: 0;
                    left: 0;
                    right: 0;
                    bottom: 0;
                    background: url("data:image/svg+xml,%3Csvg viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.03'/%3E%3C/svg%3E");
                    pointer-events: none;
                    opacity: 0.5;
                    z-index: 0;
                }
            `
        },

        // ════════════════════════════════════════════════════════════════════════
        // § TSS — Nature Reclaims
        // ════════════════════════════════════════════════════════════════════════

        tlou: {
            id: 'tlou',
            name: 'THLOU',
            desc: 'Biyolüminesan sporlar, yıkık şehirler',
            tag: 'GAME',
            preview: ['#8cd600', '#1c211c', '#0f140f'],
            vars: {
                // Arka planlar - Karanlık orman, ıslak beton
                '--tve-bg-base': 'linear-gradient(180deg, #0f140f 0%, #0a0d0a 50%, #0d100d 100%)',
                '--tve-bg-surface': '#12161290',
                '--tve-bg-elevated': 'linear-gradient(145deg, #1c211c 0%, #151915 100%)',
                '--tve-bg-overlay': 'rgba(15, 20, 15, 0.95)',

                // Header - Beton ve yosun
                '--tve-header-bg': 'linear-gradient(180deg, rgba(28, 33, 28, 0.98) 0%, rgba(15, 20, 15, 0.95) 100%)',
                '--tve-header-border': '#2a352a',
                '--tve-header-glow': '0 0 30px rgba(140, 214, 0, 0.15), 0 2px 10px rgba(0, 0, 0, 0.5)',

                // Kenarlıklar
                '--tve-border-default': 'rgba(42, 53, 42, 0.8)',
                '--tve-border-accent': '#8cd600',
                '--tve-border-highlight': '#7ab800',

                // Metin - Gritty, kirli beyaz
                '--tve-text-primary': '#c8c8c0',
                '--tve-text-secondary': '#a0a098',
                '--tve-text-muted': '#606058',

                // Linkler ve accent - BİYOLÜMİNESAN GLOW!
                '--tve-link': '#8cd600',
                '--tve-link-hover': '#a8f020',
                '--tve-username': '#8cd600',
                '--tve-text-glow': '0 0 10px rgba(140, 214, 0, 0.6), 0 0 20px rgba(140, 214, 0, 0.3)',

                // Kartlar - Beton dokusu
                '--tve-card-bg': 'linear-gradient(145deg, rgba(28, 33, 28, 0.95) 0%, rgba(20, 24, 20, 0.98) 100%)',
                '--tve-card-border': 'rgba(140, 214, 0, 0.15)',
                '--tve-card-shadow': '0 4px 25px rgba(0, 0, 0, 0.5), 0 0 40px rgba(140, 214, 0, 0.05)',

                // Mesajlar
                '--tve-m-border-left': '#8cd600',
                '--tve-quote-bg': 'rgba(140, 214, 0, 0.05)',
                '--tve-code-bg': 'rgba(10, 13, 10, 0.95)',

                // Avatar - Spor ışıltısı
                '--tve-avatar-border': '#8cd600',
                '--tve-avatar-glow': '0 0 15px rgba(140, 214, 0, 0.5), 0 0 30px rgba(140, 214, 0, 0.2)',
                '--tve-avatar-filter': 'contrast(1.1) brightness(0.95)',

                // Butonlar - FIREFLY GLOW
                '--tve-btn-bg': 'rgba(28, 33, 28, 0.9)',
                '--tve-btn-border': '#8cd600',
                '--tve-btn-text': '#8cd600',
                '--tve-btn-hover-bg': '#8cd600',
                '--tve-btn-hover-text': '#0a0d0a',

                // Input
                '--tve-input-bg': 'rgba(10, 13, 10, 0.9)',
                '--tve-input-border': '#2a352a',
                '--tve-input-focus-border': '#8cd600',
                '--tve-input-focus-glow': '0 0 15px rgba(140, 214, 0, 0.4), 0 0 30px rgba(140, 214, 0, 0.2)',

                // Scrollbar
                '--tve-scroll-track': '#0f140f',
                '--tve-scroll-thumb': '#8cd600',

                // Diğer
                '--tve-radius': '4px',
                '--tve-radius-sm': '3px',
                '--tve-font': 'inherit',
                '--tve-selection-bg': 'rgba(140, 214, 0, 0.4)',
                '--tve-selection-text': '#ffffff',
                '--tve-scanline': 'none',
                '--tve-crt-curve': 'none'
            },
            customCSS: `
                /* Bioluminescent Spore Glow Effect */
                @keyframes tve-spore-pulse {
                    0%, 100% {
                        box-shadow: 0 0 10px rgba(140, 214, 0, 0.3),
                                    0 0 20px rgba(140, 214, 0, 0.15),
                                    inset 0 0 15px rgba(140, 214, 0, 0.03);
                    }
                    50% {
                        box-shadow: 0 0 20px rgba(140, 214, 0, 0.5),
                                    0 0 40px rgba(140, 214, 0, 0.25),
                                    inset 0 0 25px rgba(140, 214, 0, 0.05);
                    }
                }

                @keyframes tve-firefly-glow {
                    0%, 100% {
                        text-shadow: 0 0 8px rgba(140, 214, 0, 0.6),
                                     0 0 15px rgba(140, 214, 0, 0.4);
                    }
                    50% {
                        text-shadow: 0 0 12px rgba(140, 214, 0, 0.8),
                                     0 0 25px rgba(140, 214, 0, 0.5),
                                     0 0 40px rgba(140, 214, 0, 0.3);
                    }
                }

                /* Username Firefly Glow */
                body[data-tve="tlou"] .username,
                body[data-tve="tlou"] .m-name a {
                    animation: tve-firefly-glow 3s ease-in-out infinite !important;
                }

                /* Header border glow */
                body[data-tve="tlou"] .p-header::after,
                body[data-tve="tlou"] .p-nav::after {
                    content: '';
                    position: absolute;
                    bottom: 0;
                    left: 0;
                    right: 0;
                    height: 1px;
                    background: linear-gradient(90deg, transparent, #8cd600, transparent);
                    box-shadow: 0 0 10px #8cd600, 0 0 20px rgba(140, 214, 0, 0.5);
                }

                /* Message hover - Spore activation */
                body[data-tve="tlou"] .message:hover,
                body[data-tve="tlou"] .m--post:hover {
                    animation: tve-spore-pulse 2s ease-in-out infinite !important;
                    border-left-color: #a8f020 !important;
                }

                /* Buttons radioactive glow on hover */
                body[data-tve="tlou"] .button:hover,
                body[data-tve="tlou"] button:not([class*="tve-"]):hover {
                    box-shadow: 0 0 15px rgba(140, 214, 0, 0.6),
                                0 0 30px rgba(140, 214, 0, 0.3),
                                inset 0 0 10px rgba(140, 214, 0, 0.2) !important;
                    text-shadow: 0 0 5px rgba(0, 0, 0, 0.8) !important;
                }

                /* Input focus glow enhancement */
                body[data-tve="tlou"] input:focus,
                body[data-tve="tlou"] textarea:focus {
                    animation: tve-spore-pulse 2s ease-in-out infinite !important;
                }

                /* Quote block - Infected area warning */
                body[data-tve="tlou"] .bbCodeBlock--quote {
                    position: relative;
                    border-left: 3px solid #8cd600 !important;
                    box-shadow: inset 0 0 30px rgba(140, 214, 0, 0.03) !important;
                }
                body[data-tve="tlou"] .bbCodeBlock--quote::before {
                    content: '⚠ INFECTED ZONE';
                    display: block;
                    font-size: 9px;
                    letter-spacing: 2px;
                    color: rgba(140, 214, 0, 0.5);
                    margin-bottom: 8px;
                    text-transform: uppercase;
                }

                /* Block container moss/vine overlay effect */
                body[data-tve="tlou"] .b-container,
                body[data-tve="tlou"] .b--messages {
                    position: relative;
                }
                body[data-tve="tlou"] .b-container::after,
                body[data-tve="tlou"] .b--messages::after {
                    content: '';
                    position: absolute;
                    top: 0;
                    left: 0;
                    right: 0;
                    height: 3px;
                    background: linear-gradient(90deg,
                        transparent 0%,
                        rgba(140, 214, 0, 0.3) 20%,
                        rgba(140, 214, 0, 0.5) 50%,
                        rgba(140, 214, 0, 0.3) 80%,
                        transparent 100%
                    );
                    box-shadow: 0 0 15px rgba(140, 214, 0, 0.4);
                    pointer-events: none;
                }

                /* Scrollbar glow */
                body[data-tve="tlou"] ::-webkit-scrollbar-thumb {
                    box-shadow: 0 0 8px rgba(140, 214, 0, 0.5) !important;
                }
                body[data-tve="tlou"] ::-webkit-scrollbar-thumb:hover {
                    box-shadow: 0 0 15px rgba(140, 214, 0, 0.8) !important;
                }

                /* Avatar spore ring */
                body[data-tve="tlou"] .avatar,
                body[data-tve="tlou"] .m-avatar {
                    position: relative;
                }
                body[data-tve="tlou"] .avatar::after,
                body[data-tve="tlou"] .m-avatar::after {
                    content: '';
                    position: absolute;
                    inset: -4px;
                    border-radius: inherit;
                    border: 1px solid rgba(140, 214, 0, 0.3);
                    box-shadow: 0 0 10px rgba(140, 214, 0, 0.2);
                    pointer-events: none;
                }
            `
        }
    };

    // ════════════════════════════════════════════════════════════════════════════
    // § IDENTITY SYSTEM
    // ════════════════════════════════════════════════════════════════════════════

    const Identity = {
        USERS: {
            '27967': {
                badge: 'verified',
                style: 'lunex-red',
                tag: 'CREATOR'
            }
        },

        STYLES: `
            @keyframes tve-anim-lunex {
                0% { text-shadow: 0 0 5px #ff0000, 0 0 10px #8b0000; color: #fff0f0; }
                50% { text-shadow: 0 0 15px #ff0000, 0 0 25px #ff0000, 0 0 35px #8b0000; color: #ffffff; }
                100% { text-shadow: 0 0 5px #ff0000, 0 0 10px #8b0000; color: #fff0f0; }
            }
            .tve-user-lunex-red {
                color: #ff0000 !important;
                font-weight: 900 !important;
                letter-spacing: 0.5px;
                animation: tve-anim-lunex 2s ease-in-out infinite !important;
                background: none !important;
                -webkit-text-fill-color: unset !important;
            }
            .tve-badge {
                display: inline-flex;
                vertical-align: middle;
                margin-left: 4px;
                width: 15px;
                height: 15px;
            }
            .tve-badge-verified {
                color: #1da1f2;
                filter: drop-shadow(0 0 3px rgba(29, 161, 242, 0.5));
            }
        `,

        init() {
            const style = document.createElement('style');
            style.id = 'tve-identity';
            style.textContent = this.STYLES;
            document.head.appendChild(style);

            this.scan();

            const debouncedScan = this.debounce(() => this.scan(), 150);
            const observer = new MutationObserver(debouncedScan);
            observer.observe(document.body, { childList: true, subtree: true });
        },

        debounce(fn, delay) {
            let timer = null;
            return (...args) => {
                clearTimeout(timer);
                timer = setTimeout(() => fn.apply(this, args), delay);
            };
        },

        scan() {
            const selector = 'a.username[data-user-id], .m-name a[data-user-id], .m-userDetails a[data-user-id], .contentRow-title a[data-user-id]';
            const links = document.querySelectorAll(selector);

            links.forEach(el => {
                const uid = el.getAttribute('data-user-id');
                const config = this.USERS[uid];

                if (config && !el.classList.contains('tve-id-done')) {
                    el.classList.add('tve-id-done');

                    if (config.style) el.classList.add(`tve-user-${config.style}`);

                    if (config.badge) {
                        const badge = this.createBadge(config.badge);
                        el.insertAdjacentElement('afterend', badge);
                    }

                    if (config.tag) {
                        el.title = config.tag;
                    }
                }
            });
        },

        createBadge(type) {
            const svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
            svg.setAttribute('class', `tve-badge tve-badge-${type}`);
            svg.setAttribute('viewBox', '0 0 24 24');
            svg.setAttribute('aria-label', type);

            const path = document.createElementNS('http://www.w3.org/2000/svg', 'path');
            path.setAttribute('fill', 'currentColor');
            path.setAttribute('d', 'M22.5 12.5c0-1.58-.875-2.95-2.148-3.6.154-.435.238-.905.238-1.4 0-2.21-1.71-3.998-3.818-3.998-.47 0-.92.084-1.336.25C14.818 2.415 13.51 1.5 12 1.5s-2.816.917-3.437 2.25c-.415-.165-.866-.25-1.336-.25-2.11 0-3.818 1.79-3.818 4 0 .495.084.965.238 1.4-1.272.65-2.147 2.02-2.147 3.6 0 1.457.746 2.74 1.863 3.494C3.15 16.68 3 17.326 3 18c0 2.21 1.79 4 4 4 .917 0 1.755-.304 2.458-.814.603.93 1.63 1.563 2.833 1.563 1.135 0 2.114-.56 2.75-1.408.68.52 1.53.858 2.457.858 2.21 0 4-1.79 4-4 0-.674-.15-1.32-.363-1.906 1.117-.754 1.863-2.037 1.863-3.494zm-13.6 3.4l-3-3 1.4-1.4 1.6 1.6 5.6-5.6 1.4 1.4-7 7z');

            svg.appendChild(path);
            return svg;
        }
    };

    // ════════════════════════════════════════════════════════════════════════════
    // § CSS SKELETON
    // ════════════════════════════════════════════════════════════════════════════

    const CSS_SKELETON = `
body[data-tve]::before {
    content: '';
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: ${CFG.Z_BASE - 10};
    background: var(--tve-scanline);
}
body[data-tve]::after {
    content: '';
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: ${CFG.Z_BASE - 11};
    background: var(--tve-crt-curve);
}
body[data-tve] {
    background: var(--tve-bg-base) !important;
    color: var(--tve-text-primary) !important;
    font-family: var(--tve-font) !important;
}
body[data-tve]::selection,
body[data-tve] *::selection {
    background: var(--tve-selection-bg);
    color: var(--tve-selection-text);
}
body[data-tve] .p-body,
body[data-tve] .p-body-inner,
body[data-tve] .p-body-main,
body[data-tve] .p-body-sidebar {
    background: transparent !important;
}
body[data-tve] .p-header,
body[data-tve] .p-nav,
body[data-tve] .p-nav-inner {
    background: var(--tve-header-bg) !important;
    border-bottom: 1px solid var(--tve-header-border) !important;
    box-shadow: var(--tve-header-glow) !important;
    position: relative;
}
body[data-tve] .p-nav-list > li > a {
    color: var(--tve-text-primary) !important;
}
body[data-tve] .p-nav-list > li > a:hover {
    color: var(--tve-link-hover) !important;
}
body[data-tve] .block,
body[data-tve] .b-container,
body[data-tve] .b--messages {
    background: var(--tve-card-bg) !important;
    border: 1px solid var(--tve-card-border) !important;
    border-radius: var(--tve-radius) !important;
    box-shadow: var(--tve-card-shadow) !important;
    position: relative;
}
body[data-tve] .b-header {
    background: var(--tve-bg-elevated) !important;
    border-bottom: 1px solid var(--tve-border-default) !important;
    color: var(--tve-text-primary) !important;
    border-radius: var(--tve-radius) var(--tve-radius) 0 0 !important;
}
body[data-tve] .message,
body[data-tve] .m--post {
    background: var(--tve-bg-overlay) !important;
    border: 1px solid var(--tve-border-default) !important;
    border-left: 3px solid var(--tve-m-border-left) !important;
    border-radius: var(--tve-radius-sm) !important;
    margin: 10px !important;
    transition: border-color 0.2s ease, box-shadow 0.3s ease;
}
body[data-tve] .message:hover,
body[data-tve] .m--post:hover {
    border-color: var(--tve-border-accent) !important;
    box-shadow: var(--tve-card-shadow) !important;
}
body[data-tve] .m-body,
body[data-tve] .bbWrapper,
body[data-tve] .m-content p,
body[data-tve] .m-content span {
    color: var(--tve-text-secondary) !important;
}
body[data-tve] a {
    color: var(--tve-link) !important;
    text-shadow: var(--tve-text-glow);
    transition: color 0.2s ease, text-shadow 0.2s ease;
}
body[data-tve] a:hover {
    color: var(--tve-link-hover) !important;
}
body[data-tve] .username,
body[data-tve] .m-name a,
body[data-tve] .m-userDetails a {
    color: var(--tve-username) !important;
    font-weight: 600 !important;
    text-shadow: var(--tve-text-glow) !important;
}
body[data-tve] h1, body[data-tve] h2, body[data-tve] h3,
body[data-tve] h4, body[data-tve] h5, body[data-tve] h6 {
    color: var(--tve-text-primary) !important;
}
body[data-tve] .avatar img,
body[data-tve] .m-avatar img,
body[data-tve] .avatar-u {
    border: 2px solid var(--tve-avatar-border) !important;
    border-radius: var(--tve-radius-sm) !important;
    box-shadow: var(--tve-avatar-glow) !important;
    filter: var(--tve-avatar-filter) !important;
    transition: filter 0.2s ease, box-shadow 0.3s ease;
}
body[data-tve] .avatar:hover img,
body[data-tve] .m-avatar:hover img {
    filter: none !important;
}
body[data-tve] .button,
body[data-tve] button:not([class*="tve-"]) {
    background: var(--tve-btn-bg) !important;
    border: 1px solid var(--tve-btn-border) !important;
    border-radius: var(--tve-radius-sm) !important;
    color: var(--tve-btn-text) !important;
    transition: all 0.2s ease !important;
}
body[data-tve] .button:hover,
body[data-tve] button:not([class*="tve-"]):hover {
    background: var(--tve-btn-hover-bg) !important;
    color: var(--tve-btn-hover-text) !important;
}
body[data-tve] input,
body[data-tve] textarea,
body[data-tve] select {
    background: var(--tve-input-bg) !important;
    border: 1px solid var(--tve-input-border) !important;
    border-radius: var(--tve-radius-sm) !important;
    color: var(--tve-text-primary) !important;
    transition: border-color 0.2s ease, box-shadow 0.3s ease;
}
body[data-tve] input:focus,
body[data-tve] textarea:focus,
body[data-tve] select:focus {
    border-color: var(--tve-input-focus-border) !important;
    box-shadow: var(--tve-input-focus-glow) !important;
    outline: none !important;
}
body[data-tve] input::placeholder,
body[data-tve] textarea::placeholder {
    color: var(--tve-text-muted) !important;
}
body[data-tve] .bbCodeBlock--quote {
    background: var(--tve-quote-bg) !important;
    border-left: 3px solid var(--tve-border-accent) !important;
    border-radius: 0 var(--tve-radius-sm) var(--tve-radius-sm) 0 !important;
}
body[data-tve] .bbCodeBlock--code,
body[data-tve] pre,
body[data-tve] code {
    background: var(--tve-code-bg) !important;
    border: 1px solid var(--tve-border-default) !important;
    border-radius: var(--tve-radius-sm) !important;
    color: var(--tve-text-primary) !important;
}
body[data-tve] ::-webkit-scrollbar { width: 8px; height: 8px; }
body[data-tve] ::-webkit-scrollbar-track { background: var(--tve-scroll-track); }
body[data-tve] ::-webkit-scrollbar-thumb {
    background: var(--tve-scroll-thumb);
    border-radius: 4px;
    transition: box-shadow 0.2s ease;
}
`;

    // ════════════════════════════════════════════════════════════════════════════
    // § UI STYLES
    // ════════════════════════════════════════════════════════════════════════════

    const UI_STYLES = `
.tve-fab {
    position: fixed;
    bottom: 28px;
    right: 28px;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    border: none;
    cursor: pointer;
    z-index: ${CFG.Z_BASE};
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    box-shadow: 0 4px 20px rgba(102, 126, 234, 0.4);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.tve-fab:hover {
    transform: scale(1.08);
    box-shadow: 0 6px 28px rgba(102, 126, 234, 0.5);
}
.tve-fab:active { transform: scale(0.96); }
.tve-fab[aria-expanded="true"] { transform: rotate(45deg); }
.tve-fab-icon {
    width: 24px;
    height: 24px;
    stroke: #ffffff;
    stroke-width: 2;
    fill: none;
}
.tve-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.75);
    z-index: ${CFG.Z_BASE + 1};
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}
.tve-overlay[data-visible="true"] {
    opacity: 1;
    visibility: visible;
}
.tve-modal {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0.9);
    width: min(520px, 92vw);
    max-height: 85vh;
    z-index: ${CFG.Z_BASE + 2};
    opacity: 0;
    visibility: hidden;
    transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.3s ease, visibility 0.3s ease;
}
.tve-modal[data-visible="true"] {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, -50%) scale(1);
}
.tve-modal-card {
    background: linear-gradient(145deg, rgba(25, 25, 40, 0.98), rgba(15, 15, 25, 0.99));
    border-radius: 20px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.5);
    overflow: hidden;
}
.tve-modal-header {
    padding: 20px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.tve-modal-brand { display: flex; align-items: center; gap: 12px; }
.tve-modal-logo {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: linear-gradient(135deg, #667eea, #764ba2);
    display: flex;
    align-items: center;
    justify-content: center;
}
.tve-modal-logo svg { width: 22px; height: 22px; stroke: #fff; fill: none; }
.tve-modal-title { display: flex; flex-direction: column; gap: 2px; }
.tve-modal-name {
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}
.tve-modal-version {
    font-size: 10px;
    padding: 2px 6px;
    background: rgba(102, 126, 234, 0.3);
    color: #c4b5fd;
    border-radius: 4px;
}
.tve-modal-subtitle { font-size: 11px; color: #666; margin: 0; }
.tve-modal-close {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(255, 255, 255, 0.05);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}
.tve-modal-close:hover {
    background: rgba(239, 68, 68, 0.2);
    border-color: rgba(239, 68, 68, 0.3);
}
.tve-modal-close svg { width: 16px; height: 16px; stroke: #888; }
.tve-modal-close:hover svg { stroke: #ef4444; }
.tve-modal-body {
    padding: 20px 24px;
    max-height: 58vh;
    overflow-y: auto;
}
.tve-modal-body::-webkit-scrollbar { width: 4px; }
.tve-modal-body::-webkit-scrollbar-thumb { background: #667eea; border-radius: 2px; }
.tve-section-label {
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: #666;
    margin-bottom: 12px;
}
.tve-theme-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
}
.tve-theme-card {
    position: relative;
    padding: 14px;
    border-radius: 12px;
    border: 2px solid rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.03);
    cursor: pointer;
    transition: all 0.25s ease;
}
.tve-theme-card:hover {
    border-color: rgba(255, 255, 255, 0.15);
    background: rgba(255, 255, 255, 0.05);
}
.tve-theme-card[aria-checked="true"] {
    border-color: var(--card-accent, #667eea);
    background: rgba(102, 126, 234, 0.1);
}
.tve-theme-preview {
    display: flex;
    gap: 3px;
    margin-bottom: 10px;
    height: 6px;
}
.tve-theme-preview span { flex: 1; border-radius: 3px; }
.tve-theme-info { display: flex; justify-content: space-between; align-items: flex-start; }
.tve-theme-name {
    font-size: 13px;
    font-weight: 600;
    color: #fff;
    margin-bottom: 2px;
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}
.tve-theme-tag {
    font-size: 8px;
    font-weight: 700;
    padding: 2px 4px;
    border-radius: 3px;
    background: linear-gradient(135deg, #667eea, #764ba2);
    color: #fff;
}
.tve-theme-tag.game {
    background: linear-gradient(135deg, #10b981, #059669);
}
.tve-theme-desc { font-size: 11px; color: #888; }
.tve-theme-check {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: all 0.2s ease;
}
.tve-theme-card[aria-checked="true"] .tve-theme-check {
    background: var(--card-accent, #667eea);
    border-color: var(--card-accent, #667eea);
}
.tve-theme-check svg {
    width: 10px;
    height: 10px;
    stroke: #fff;
    stroke-width: 3;
    opacity: 0;
    transform: scale(0);
    transition: all 0.2s ease;
}
.tve-theme-card[aria-checked="true"] .tve-theme-check svg {
    opacity: 1;
    transform: scale(1);
}
.tve-modal-footer {
    padding: 14px 24px;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.tve-modal-credit { font-size: 10px; color: #555; }
.tve-modal-credit a { color: #667eea; text-decoration: none; }
.tve-modal-status { display: flex; align-items: center; gap: 6px; font-size: 10px; color: #666; }
.tve-modal-status-dot { width: 6px; height: 6px; border-radius: 50%; background: #22c55e; }
@media (max-width: 600px) {
    .tve-fab { bottom: 20px; right: 20px; width: 50px; height: 50px; }
    .tve-modal { width: calc(100vw - 24px); }
    .tve-theme-grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
    }
}
`;

    // ════════════════════════════════════════════════════════════════════════════
    // § STORAGE
    // ════════════════════════════════════════════════════════════════════════════

    const Storage = {
        get() {
            try { return localStorage.getItem(CFG.STORAGE_KEY) || 'off'; }
            catch { return 'off'; }
        },
        set(id) {
            try { localStorage.setItem(CFG.STORAGE_KEY, id); }
            catch {}
        }
    };

    // ════════════════════════════════════════════════════════════════════════════
    // § ENGINE
    // ════════════════════════════════════════════════════════════════════════════

    const Engine = {
        currentTheme: 'off',
        appliedVars: [],

        init() {
            this.injectStyle('tve-skeleton', CSS_SKELETON);
            this.injectStyle('tve-ui', UI_STYLES);

            const saved = Storage.get();
            if (saved && THEMES[saved]) {
                this.apply(saved);
            }
        },

        apply(id) {
            const theme = THEMES[id];
            if (!theme) return;

            if (this.appliedVars.length) this.clearVars();
            this.removeCustomCSS();

            if (id === 'off') {
                document.body.removeAttribute('data-tve');
                this.appliedVars = [];
            } else {
                document.body.setAttribute('data-tve', id);

                if (theme.vars) {
                    const keys = Object.keys(theme.vars);
                    this.appliedVars = keys;
                    for (const k of keys) {
                        document.body.style.setProperty(k, theme.vars[k]);
                    }
                }

                if (theme.customCSS) {
                    this.injectStyle('tve-custom', theme.customCSS);
                }
            }

            this.currentTheme = id;
            Storage.set(id);
            UI.syncSelection();
        },

        clearVars() {
            for (const k of this.appliedVars) {
                document.body.style.removeProperty(k);
            }
            this.appliedVars = [];
        },

        removeCustomCSS() {
            const el = document.getElementById('tve-custom');
            if (el) el.remove();
        },

        injectStyle(id, css) {
            let el = document.getElementById(id);
            if (el) el.remove();
            el = document.createElement('style');
            el.id = id;
            el.textContent = css;
            document.head.appendChild(el);
        }
    };

    // ════════════════════════════════════════════════════════════════════════════
    // § UI
    // ════════════════════════════════════════════════════════════════════════════

    const UI = {
        isOpen: false,
        els: {},
        focusable: [],
        lastFocus: null,

        init() {
            this.createDOM();
            this.bind();
        },

        createDOM() {
            const fab = document.createElement('button');
            fab.className = 'tve-fab';
            fab.setAttribute('aria-label', 'Tema ayarlarını aç');
            fab.setAttribute('aria-expanded', 'false');
            fab.setAttribute('aria-haspopup', 'dialog');
            fab.innerHTML = `<svg class="tve-fab-icon" viewBox="0 0 24 24"><path d="M12 2.69l5.66 5.66a8 8 0 11-11.31 0z"/><circle cx="12" cy="14" r="3"/></svg>`;
            document.body.appendChild(fab);
            this.els.fab = fab;

            const overlay = document.createElement('div');
            overlay.className = 'tve-overlay';
            overlay.setAttribute('data-visible', 'false');
            document.body.appendChild(overlay);
            this.els.overlay = overlay;

            const modal = document.createElement('div');
            modal.className = 'tve-modal';
            modal.setAttribute('role', 'dialog');
            modal.setAttribute('aria-modal', 'true');
            modal.setAttribute('aria-labelledby', 'tve-modal-title');
            modal.setAttribute('data-visible', 'false');
            modal.innerHTML = this.buildHTML();
            document.body.appendChild(modal);
            this.els.modal = modal;

            this.cacheFocusable();
        },

        buildHTML() {
            const cards = Object.entries(THEMES).map(([id, t]) => {
                const active = Engine.currentTheme === id;
                const preview = t.preview.map(c => `<span style="background:${c}"></span>`).join('');
                const tagClass = t.tag === 'GAME' ? 'game' : '';
                const tag = t.tag ? `<span class="tve-theme-tag ${tagClass}">${t.tag}</span>` : '';
                const accent = t.preview[0] || '#667eea';

                return `
                    <div class="tve-theme-card" role="radio" aria-checked="${active}"
                         data-theme="${id}" tabindex="0" style="--card-accent:${accent}">
                        <div class="tve-theme-preview">${preview}</div>
                        <div class="tve-theme-info">
                            <div>
                                <div class="tve-theme-name">${t.name}${tag}</div>
                                <div class="tve-theme-desc">${t.desc}</div>
                            </div>
                            <div class="tve-theme-check">
                                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor">
                                    <polyline points="20 6 9 17 4 12"/>
                                </svg>
                            </div>
                        </div>
                    </div>
                `;
            }).join('');

            return `
                <div class="tve-modal-card">
                    <header class="tve-modal-header">
                        <div class="tve-modal-brand">
                            <div class="tve-modal-logo">
                                <svg viewBox="0 0 24 24"><path d="M12 2.69l5.66 5.66a8 8 0 11-11.31 0z"/><circle cx="12" cy="14" r="3"/></svg>
                            </div>
                            <div class="tve-modal-title">
                                <h2 class="tve-modal-name" id="tve-modal-title">
                                    TVE<sup>5</sup>
                                    <span class="tve-modal-version">v${CFG.VERSION}</span>
                                </h2>
                                <p class="tve-modal-subtitle">Architect Edition</p>
                            </div>
                        </div>
                        <button class="tve-modal-close" aria-label="Kapat">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor">
                                <line x1="18" y1="6" x2="6" y2="18"/>
                                <line x1="6" y1="6" x2="18" y2="18"/>
                            </svg>
                        </button>
                    </header>
                    <div class="tve-modal-body">
                        <div class="tve-section-label">Tema Seç</div>
                        <div class="tve-theme-grid" role="radiogroup">${cards}</div>
                    </div>
                    <footer class="tve-modal-footer">
                        <div class="tve-modal-credit">
                            <a href="https://github.com/0bfsc4t0r" target="_blank" rel="noopener">@0bfsc4t0r</a>
                        </div>
                        <div class="tve-modal-status">
                            <div class="tve-modal-status-dot"></div>
                            <span>Engine Active</span>
                        </div>
                    </footer>
                </div>
            `;
        },

        cacheFocusable() {
            this.focusable = this.els.modal.querySelectorAll('button, [tabindex]:not([tabindex="-1"])');
        },

        bind() {
            const { fab, overlay, modal } = this.els;

            fab.addEventListener('click', () => this.toggle());
            overlay.addEventListener('click', () => this.close());
            modal.querySelector('.tve-modal-close').addEventListener('click', () => this.close());

            modal.querySelector('.tve-theme-grid').addEventListener('click', e => {
                const card = e.target.closest('.tve-theme-card');
                if (card) Engine.apply(card.dataset.theme);
            });

            modal.querySelector('.tve-theme-grid').addEventListener('keydown', e => {
                if (e.key === 'Enter' || e.key === ' ') {
                    const card = e.target.closest('.tve-theme-card');
                    if (card) {
                        e.preventDefault();
                        Engine.apply(card.dataset.theme);
                    }
                }
            });

            document.addEventListener('keydown', e => {
                if (!this.isOpen) return;
                if (e.key === 'Escape') { this.close(); return; }
                if (e.key === 'Tab') this.trapFocus(e);
            });
        },

        trapFocus(e) {
            const list = Array.from(this.focusable);
            if (!list.length) return;

            const first = list[0];
            const last = list[list.length - 1];
            const active = document.activeElement;

            if (e.shiftKey && active === first) {
                e.preventDefault();
                last.focus();
            } else if (!e.shiftKey && active === last) {
                e.preventDefault();
                first.focus();
            }
        },

        toggle() { this.isOpen ? this.close() : this.open(); },

        open() {
            this.isOpen = true;
            this.lastFocus = document.activeElement;

            const { fab, overlay, modal } = this.els;
            fab.setAttribute('aria-expanded', 'true');
            overlay.setAttribute('data-visible', 'true');
            modal.setAttribute('data-visible', 'true');

            requestAnimationFrame(() => {
                const first = modal.querySelector('.tve-theme-card');
                if (first) first.focus();
            });

            this.syncSelection();
        },

        close() {
            this.isOpen = false;

            const { fab, overlay, modal } = this.els;
            fab.setAttribute('aria-expanded', 'false');
            overlay.setAttribute('data-visible', 'false');
            modal.setAttribute('data-visible', 'false');

            if (this.lastFocus) this.lastFocus.focus();
        },

        syncSelection() {
            const { modal } = this.els;
            if (!modal) return;

            modal.querySelectorAll('.tve-theme-card').forEach(card => {
                card.setAttribute('aria-checked', String(card.dataset.theme === Engine.currentTheme));
            });
        }
    };

    // ════════════════════════════════════════════════════════════════════════════
    // § BOOTSTRAP
    // ════════════════════════════════════════════════════════════════════════════

    function init() {
        Engine.init();
        UI.init();
        Identity.init();

        console.log(
            `%c◈ TVE⁵ %c Architect Edition %c v${CFG.VERSION}`,
            'background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:6px 10px;border-radius:4px 0 0 4px;font-weight:700',
            'background:#1a1a2e;color:#c4b5fd;padding:6px 10px',
            'background:#0d0d14;color:#666;padding:6px 10px;border-radius:0 4px 4px 0'
        );
    }

    if (document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded', init);
    } else {
        init();
    }

})();