        :root {
            --mosaic-bg-color: rgba(0, 0, 0, 0.3);
            --neumorphic-bg: #e0e5ec;
            --neumorphic-shadow-light: #ffffff;
            --neumorphic-shadow-dark: #a3b1c6;
            --neumorphic-color: #4a4a4a;
            --text-color: #000000;
            --grid-text-color: #000000;
            --gradient-color-1: #ff9a9e;
            --gradient-color-2: #fad0c4;
            /* Paletas personalizables por tema (también se inyectan desde JS) */
            --glass-tint: #ffffff;
            --glass-border-tint: #ffffff;
            /* Aurora cristal: opacidades en color-mix (controladas desde paleta / JS) */
            --gg-layer1: 48%;
            --gg-layer2: 42%;
            --gg-tint-mix: 32%;
            --gg-border-mix: 38%;
            --gg-input-mix: 22%;
            --gg-input-border-mix: 24%;
            /* Aurora cristal 3D: blur y lente (paleta / JS) */
            --ac3d-blur: 20px;
            --ac3d-lens-scale: 1.035;
            --ac3d-backdrop-image: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            --skeuo-gradient-top: #f0f0f0;
            --skeuo-gradient-bottom: #d0d0d0;
            --skeuo-border: #999999;
            --flat-surface: #f0f0f0;
            --flat-sidebar: #e8e8e8;
            --flat-sidebar-border: #dddddd;
            --material-surface: #ffffff;
            --material-sidebar: #f7f7f7;
            --material-shadow-color: #000000;
            --brutal-bg: #000000;
            --brutal-accent: #ff0000;
            --brutal-text: #ffffff;
            --retro-bg: #008080;
            --retro-sidebar: #006666;
            --retro-text: #ffffff;
            --retro-border: #ffffff;
            --dark-surface: #121212;
            --dark-sidebar: #1a1a1a;
            --dark-text: #ffffff;
            --minimal-surface: #ffffff;
            --minimal-sidebar: #fafafa;
            --minimal-text: #000000;
            --morph-panel: #e0e5ec;
            --iso-panel: #e0e5ec;
            --cyber-bg: #000000;
            --cyber-neon: #00ffff;
            --cyber-accent: #ff00ff;
            --card-surface: #ffffff;
            --card-sidebar: #f6f7f9;
            --typography-panel: #ffffff;
            --focus-color: #00ffff;
            --focus-glow: 0 0 10px rgba(0, 255, 255, 0.7);
            --tab-bg: var(--neumorphic-bg);
            --tab-active-bg: var(--neumorphic-shadow-light);
            --tab-color: var(--text-color);
            --category-bg: transparent;
            --category-hover: var(--neumorphic-shadow-light);
            --category-active: #c0c8d6;
            --toast-bg: #333;
            --toast-color: #fff;
            --taskbar-height: 60px;
            --topbar-height: 60px;
            --theme-contrast-text: #0f172a;
            --theme-contrast-muted: #475569;
            --theme-contrast-shadow: rgba(0, 0, 0, 0.35);
            /* Shell: botones compactos y cierres modales homogéneos */
            --shell-btn-min-h: 36px;
            --shell-btn-pad-y: 4px;
            --shell-btn-pad-x: 14px;
            --shell-btn-pad-y-md: 4px;
            --shell-btn-pad-x-md: 8px;
            --shell-btn-font-size: 14px;
            --shell-btn-font-size-md: 15px;
            --shell-modal-close-size: 34px;
            --shell-modal-close-radius: 9px;
            --shell-modal-close-font: 20px;
            /* Controles unificados tipo chip (botones, campos, file) */
            --control-radius: 9px;
            --control-gap: 8px;
            --control-chip-bg: color-mix(in srgb, var(--neumorphic-bg) 90%, var(--neumorphic-shadow-dark));
            --control-chip-border: color-mix(in srgb, var(--neumorphic-shadow-dark) 28%, rgba(0, 0, 0, 0.06));
            --control-chip-fg: var(--text-color);
            --control-chip-hover-bg: color-mix(in srgb, var(--neumorphic-bg) 82%, var(--neumorphic-shadow-dark));
            --control-chip-active-bg: color-mix(in srgb, var(--neumorphic-bg) 74%, var(--neumorphic-shadow-dark));
            --control-field-bg: color-mix(in srgb, var(--neumorphic-bg) 96%, var(--neumorphic-shadow-dark));
            --control-field-border: color-mix(in srgb, var(--neumorphic-shadow-dark) 24%, transparent);
            --control-file-track-bg: color-mix(in srgb, var(--neumorphic-bg) 94%, var(--neumorphic-shadow-dark));
            --control-preview-bg: color-mix(in srgb, var(--neumorphic-bg) 92%, var(--text-color) 3%);
            --control-preview-border: var(--control-field-border);
            /* Diálogos grid-app-dialog (heredan controles; temas los refinan abajo) */
            --app-dialog-bg: var(--neumorphic-bg);
            --app-dialog-text: var(--text-color);
            --app-dialog-muted: color-mix(in srgb, var(--text-color) 52%, transparent);
            --app-dialog-border: var(--control-field-border);
            --app-dialog-input-bg: var(--control-field-bg);
            --app-dialog-input-border: var(--control-field-border);
            --app-dialog-btn-secondary-bg: var(--control-chip-bg);
            --app-dialog-btn-border: var(--control-chip-border);
            --app-dialog-focus: var(--focus-color);
            --app-dialog-accent-1: #7000ff;
            --app-dialog-accent-2: #0072ff;
            --app-dialog-accent-3: #00f2ff;
            --app-dialog-shadow:
                10px 10px 20px var(--neumorphic-shadow-dark),
                -10px -10px 20px var(--neumorphic-shadow-light),
                0 18px 48px rgba(0, 0, 0, 0.35);
            --app-dialog-backdrop: rgba(0, 0, 0, 0.52);
        }
        body.neumorphism {
            --control-chip-bg: color-mix(in srgb, var(--neumorphic-bg) 90%, var(--neumorphic-shadow-dark));
            --control-chip-border: color-mix(in srgb, var(--neumorphic-shadow-dark) 28%, rgba(0, 0, 0, 0.06));
            --control-chip-fg: var(--text-color);
            --control-chip-hover-bg: color-mix(in srgb, var(--neumorphic-bg) 82%, var(--neumorphic-shadow-dark));
            --control-chip-active-bg: color-mix(in srgb, var(--neumorphic-bg) 74%, var(--neumorphic-shadow-dark));
            --control-field-bg: color-mix(in srgb, var(--neumorphic-bg) 96%, var(--neumorphic-shadow-dark));
            --control-field-border: color-mix(in srgb, var(--neumorphic-shadow-dark) 24%, transparent);
            --control-file-track-bg: color-mix(in srgb, var(--neumorphic-bg) 94%, var(--neumorphic-shadow-dark));
            --control-preview-bg: color-mix(in srgb, var(--neumorphic-bg) 92%, var(--text-color) 3%);
            --control-preview-border: var(--control-field-border);
        }
        body.dark {
            --app-dialog-bg: var(--dark-surface);
            --app-dialog-text: var(--dark-text);
            --app-dialog-muted: color-mix(in srgb, var(--dark-text) 55%, transparent);
            --app-dialog-shadow: 0 18px 48px rgba(0, 0, 0, 0.55);
            --control-chip-bg: var(--dark-sidebar);
            --control-chip-border: rgba(255, 255, 255, 0.26);
            --control-chip-fg: var(--dark-text);
            --control-chip-hover-bg: color-mix(in srgb, var(--dark-sidebar) 82%, #ffffff 14%);
            --control-chip-active-bg: color-mix(in srgb, var(--dark-sidebar) 88%, #000000 35%);
            --control-field-bg: var(--dark-surface);
            --control-field-border: rgba(255, 255, 255, 0.22);
            --control-file-track-bg: var(--dark-surface);
            --control-preview-bg: color-mix(in srgb, var(--dark-surface) 94%, #ffffff 4%);
            --control-preview-border: rgba(255, 255, 255, 0.2);
        }
        body.glassmorphism {
            --control-chip-bg: color-mix(in srgb, var(--glass-tint) 22%, rgba(255, 255, 255, 0.08));
            --control-chip-border: color-mix(in srgb, var(--glass-border-tint) 26%, rgba(15, 23, 42, 0.12));
            --control-chip-fg: var(--text-color);
            --control-chip-hover-bg: color-mix(in srgb, var(--glass-tint) 30%, rgba(255, 255, 255, 0.12));
            --control-chip-active-bg: color-mix(in srgb, var(--glass-tint) 18%, rgba(15, 23, 42, 0.08));
            --control-field-bg: color-mix(in srgb, var(--glass-tint) 18%, rgba(255, 255, 255, 0.06));
            --control-field-border: color-mix(in srgb, var(--glass-border-tint) 22%, rgba(15, 23, 42, 0.14));
            --control-file-track-bg: color-mix(in srgb, var(--glass-tint) 16%, rgba(255, 255, 255, 0.05));
            --control-preview-bg: color-mix(in srgb, var(--glass-tint) 14%, rgba(15, 23, 42, 0.06));
            --control-preview-border: var(--control-field-border);
        }
        body.skeuomorphism {
            --control-chip-bg: linear-gradient(180deg, var(--skeuo-gradient-top), var(--skeuo-gradient-bottom));
            --control-chip-border: var(--skeuo-border);
            --control-chip-fg: var(--text-color);
            --control-chip-hover-bg: var(--skeuo-gradient-top);
            --control-chip-active-bg: var(--skeuo-gradient-bottom);
            --control-field-bg: var(--skeuo-gradient-top);
            --control-field-border: var(--skeuo-border);
            --control-file-track-bg: var(--skeuo-gradient-top);
            --control-preview-bg: var(--skeuo-gradient-top);
            --control-preview-border: var(--skeuo-border);
        }
        body.flat {
            --control-chip-bg: var(--flat-sidebar);
            --control-chip-border: var(--flat-sidebar-border);
            --control-chip-fg: var(--text-color);
            --control-chip-hover-bg: color-mix(in srgb, var(--flat-sidebar) 88%, var(--flat-sidebar-border));
            --control-chip-active-bg: color-mix(in srgb, var(--flat-sidebar) 82%, #000000 12%);
            --control-field-bg: var(--flat-surface);
            --control-field-border: var(--flat-sidebar-border);
            --control-file-track-bg: var(--flat-surface);
            --control-preview-bg: var(--flat-surface);
            --control-preview-border: var(--flat-sidebar-border);
        }
        body.material {
            --control-chip-bg: var(--material-sidebar);
            --control-chip-fg: var(--text-color);
            --control-chip-border: color-mix(in srgb, var(--material-shadow-color) 14%, transparent);
            --control-chip-hover-bg: color-mix(in srgb, var(--material-sidebar) 90%, var(--material-shadow-color));
            --control-chip-active-bg: color-mix(in srgb, var(--material-sidebar) 85%, var(--material-shadow-color));
            --control-field-bg: var(--material-surface);
            --control-field-border: color-mix(in srgb, var(--material-shadow-color) 12%, transparent);
            --control-file-track-bg: var(--material-surface);
            --control-preview-bg: var(--material-surface);
            --control-preview-border: var(--control-field-border);
        }
        body.brutalism {
            --app-dialog-bg: var(--brutal-bg);
            --app-dialog-text: var(--brutal-text);
            --app-dialog-border: var(--brutal-accent);
            --app-dialog-accent-1: var(--brutal-accent);
            --app-dialog-accent-2: var(--brutal-text);
            --app-dialog-accent-3: var(--brutal-accent);
            --control-chip-bg: var(--brutal-bg);
            --control-chip-fg: var(--brutal-text);
            --control-chip-border: var(--brutal-accent);
            --control-chip-hover-bg: color-mix(in srgb, var(--brutal-bg) 85%, var(--brutal-accent));
            --control-chip-active-bg: var(--brutal-bg);
            --control-field-bg: var(--brutal-bg);
            --control-field-border: var(--brutal-accent);
            --control-file-track-bg: var(--brutal-bg);
            --control-preview-bg: var(--brutal-bg);
            --control-preview-border: var(--brutal-accent);
        }
        body.retro {
            --app-dialog-bg: var(--retro-bg);
            --app-dialog-text: var(--retro-text);
            --app-dialog-border: var(--retro-border);
            --control-chip-bg: var(--retro-sidebar);
            --control-chip-fg: var(--retro-text);
            --control-chip-border: var(--retro-border);
            --control-chip-hover-bg: color-mix(in srgb, var(--retro-sidebar) 88%, #ffffff 12%);
            --control-chip-active-bg: var(--retro-bg);
            --control-field-bg: var(--retro-bg);
            --control-field-border: var(--retro-border);
            --control-file-track-bg: var(--retro-bg);
            --control-preview-bg: var(--retro-bg);
            --control-preview-border: var(--retro-border);
        }
        body.minimalism {
            --app-dialog-bg: var(--minimal-surface);
            --app-dialog-text: var(--minimal-text);
            --app-dialog-shadow: 0 12px 32px rgba(0, 0, 0, 0.12);
            --control-chip-bg: var(--minimal-sidebar);
            --control-chip-fg: var(--minimal-text);
            --control-chip-border: rgba(0, 0, 0, 0.12);
            --control-chip-hover-bg: color-mix(in srgb, var(--minimal-sidebar) 92%, #000000 8%);
            --control-chip-active-bg: color-mix(in srgb, var(--minimal-sidebar) 88%, #000000 10%);
            --control-field-bg: var(--minimal-surface);
            --control-field-border: rgba(0, 0, 0, 0.1);
            --control-file-track-bg: var(--minimal-surface);
            --control-preview-bg: var(--minimal-surface);
            --control-preview-border: var(--control-field-border);
        }
        body.morphing {
            --app-dialog-bg: var(--morph-panel);
            --control-chip-bg: var(--morph-panel);
            --control-chip-fg: var(--text-color);
            --control-chip-border: color-mix(in srgb, var(--text-color) 14%, transparent);
            --control-chip-hover-bg: color-mix(in srgb, var(--morph-panel) 88%, var(--text-color));
            --control-chip-active-bg: color-mix(in srgb, var(--morph-panel) 82%, var(--text-color));
            --control-field-bg: color-mix(in srgb, var(--morph-panel) 94%, var(--text-color));
            --control-field-border: color-mix(in srgb, var(--text-color) 12%, transparent);
            --control-file-track-bg: var(--control-field-bg);
            --control-preview-bg: var(--control-field-bg);
            --control-preview-border: var(--control-field-border);
        }
        body.isometric {
            --app-dialog-bg: var(--iso-panel);
            --control-chip-bg: var(--iso-panel);
            --control-chip-fg: var(--text-color);
            --control-chip-border: color-mix(in srgb, var(--text-color) 14%, transparent);
            --control-chip-hover-bg: color-mix(in srgb, var(--iso-panel) 88%, var(--text-color));
            --control-chip-active-bg: color-mix(in srgb, var(--iso-panel) 82%, var(--text-color));
            --control-field-bg: color-mix(in srgb, var(--iso-panel) 94%, var(--text-color));
            --control-field-border: color-mix(in srgb, var(--text-color) 12%, transparent);
            --control-file-track-bg: var(--control-field-bg);
            --control-preview-bg: var(--control-field-bg);
            --control-preview-border: var(--control-field-border);
        }
        body.cyberpunk {
            --app-dialog-bg: var(--cyber-bg);
            --app-dialog-text: var(--cyber-neon);
            --app-dialog-border: var(--cyber-accent);
            --app-dialog-accent-1: var(--cyber-accent);
            --app-dialog-accent-2: var(--cyber-neon);
            --app-dialog-accent-3: var(--cyber-accent);
            --control-chip-bg: var(--cyber-bg);
            --control-chip-fg: var(--cyber-neon);
            --control-chip-border: var(--cyber-accent);
            --control-chip-hover-bg: color-mix(in srgb, var(--cyber-bg) 75%, var(--cyber-accent));
            --control-chip-active-bg: color-mix(in srgb, var(--cyber-bg) 88%, #000000);
            --control-field-bg: var(--cyber-bg);
            --control-field-border: var(--cyber-accent);
            --control-file-track-bg: var(--cyber-bg);
            --control-preview-bg: var(--cyber-bg);
            --control-preview-border: var(--cyber-accent);
        }
        body.gradient {
            --control-chip-bg: color-mix(in srgb, var(--gradient-color-1) 32%, #ffffff);
            --control-chip-fg: var(--text-color);
            --control-chip-border: color-mix(in srgb, var(--gradient-color-2) 38%, rgba(0, 0, 0, 0.12));
            --control-chip-hover-bg: color-mix(in srgb, var(--gradient-color-1) 26%, #ffffff);
            --control-chip-active-bg: color-mix(in srgb, var(--gradient-color-2) 35%, rgba(0, 0, 0, 0.06));
            --control-field-bg: color-mix(in srgb, var(--gradient-color-2) 22%, #ffffff);
            --control-field-border: color-mix(in srgb, var(--gradient-color-1) 28%, transparent);
            --control-file-track-bg: var(--control-field-bg);
            --control-preview-bg: color-mix(in srgb, var(--gradient-color-2) 18%, #ffffff);
            --control-preview-border: var(--control-field-border);
        }
        body.glassgradient,
        body.auroracrystal3d {
            --control-chip-bg: color-mix(in srgb, var(--glass-tint) 24%, rgba(255, 255, 255, 0.06));
            --control-chip-fg: var(--text-color);
            --control-chip-border: color-mix(in srgb, var(--glass-border-tint) 28%, rgba(15, 23, 42, 0.14));
            --control-chip-hover-bg: color-mix(in srgb, var(--glass-tint) 32%, rgba(255, 255, 255, 0.1));
            --control-chip-active-bg: color-mix(in srgb, var(--glass-tint) 18%, rgba(15, 23, 42, 0.1));
            --control-field-bg: color-mix(in srgb, var(--glass-tint) var(--gg-input-mix), transparent);
            --control-field-border: color-mix(in srgb, var(--glass-border-tint) var(--gg-input-border-mix), transparent);
            --control-file-track-bg: var(--control-field-bg);
            --control-preview-bg: color-mix(in srgb, var(--glass-tint) 16%, rgba(15, 23, 42, 0.05));
            --control-preview-border: var(--control-field-border);
        }
        body.card {
            --app-dialog-bg: var(--card-surface);
            --control-chip-bg: var(--card-sidebar);
            --control-chip-fg: var(--text-color);
            --control-chip-border: rgba(0, 0, 0, 0.1);
            --control-chip-hover-bg: color-mix(in srgb, var(--card-sidebar) 90%, #000000 8%);
            --control-chip-active-bg: color-mix(in srgb, var(--card-sidebar) 86%, #000000 10%);
            --control-field-bg: var(--card-surface);
            --control-field-border: rgba(0, 0, 0, 0.08);
            --control-file-track-bg: var(--card-surface);
            --control-preview-bg: var(--card-surface);
            --control-preview-border: var(--control-field-border);
        }
        body.typography {
            --app-dialog-bg: var(--typography-panel);
            --control-chip-bg: var(--typography-panel);
            --control-chip-fg: var(--text-color);
            --control-chip-border: var(--text-color);
            --control-chip-hover-bg: color-mix(in srgb, var(--typography-panel) 92%, var(--text-color));
            --control-chip-active-bg: color-mix(in srgb, var(--typography-panel) 88%, var(--text-color));
            --control-field-bg: var(--typography-panel);
            --control-field-border: var(--text-color);
            --control-file-track-bg: var(--typography-panel);
            --control-preview-bg: var(--typography-panel);
            --control-preview-border: var(--text-color);
        }

        /* grid-app-dialog: mismo tratamiento visual que .modal-content por tema */
        body.glassmorphism .grid-app-dialog-panel {
            background: color-mix(in srgb, var(--glass-tint) 22%, transparent) !important;
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
            border: 1px solid color-mix(in srgb, var(--glass-border-tint) 10%, transparent) !important;
            box-shadow: 0 18px 48px rgba(0, 0, 0, 0.28) !important;
        }
        body.skeuomorphism .grid-app-dialog-panel {
            background: linear-gradient(to bottom, var(--skeuo-gradient-top), var(--skeuo-gradient-bottom)) !important;
            border: 1px solid var(--skeuo-border) !important;
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), 0 2px 2px rgba(0, 0, 0, 0.3) !important;
        }
        body.flat .grid-app-dialog-panel {
            background: var(--flat-surface) !important;
            border: none !important;
            box-shadow: 0 12px 32px rgba(0, 0, 0, 0.18) !important;
        }
        body.material .grid-app-dialog-panel {
            background: var(--material-surface) !important;
            box-shadow: 0 3px 6px color-mix(in srgb, var(--material-shadow-color) 16%, transparent), 0 3px 6px color-mix(in srgb, var(--material-shadow-color) 23%, transparent) !important;
        }
        body.brutalism .grid-app-dialog-panel {
            border: 3px solid var(--brutal-accent) !important;
            font-family: 'Courier New', monospace;
        }
        body.retro .grid-app-dialog-panel {
            font-family: 'VT323', monospace;
            border: 2px solid var(--retro-border) !important;
        }
        body.cyberpunk .grid-app-dialog-panel {
            border: 2px solid var(--cyber-accent) !important;
            text-shadow: 0 0 5px var(--cyber-neon);
        }
        body.gradient .grid-app-dialog-panel {
            background: linear-gradient(45deg, var(--gradient-color-1) 0%, var(--gradient-color-2) 100%) !important;
        }
        body.glassgradient .grid-app-dialog-panel,
        body.auroracrystal3d .grid-app-dialog-panel {
            background:
                linear-gradient(
                    135deg,
                    color-mix(in srgb, var(--gradient-color-1) var(--gg-layer1), transparent) 0%,
                    color-mix(in srgb, var(--gradient-color-2) var(--gg-layer2), transparent) 48%,
                    color-mix(in srgb, var(--glass-tint) var(--gg-tint-mix), transparent) 100%
                ) !important;
            backdrop-filter: blur(20px) saturate(170%);
            -webkit-backdrop-filter: blur(20px) saturate(170%);
            border: 1px solid color-mix(in srgb, var(--glass-border-tint) var(--gg-border-mix), transparent) !important;
            box-shadow:
                0 6px 28px rgba(15, 23, 42, 0.12),
                inset 0 1px 0 rgba(255, 255, 255, 0.42) !important;
        }
        body.glassgradient .grid-app-dialog-input,
        body.auroracrystal3d .grid-app-dialog-input {
            background: color-mix(in srgb, var(--glass-tint) var(--gg-input-mix), transparent) !important;
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
            border: 1px solid color-mix(in srgb, var(--glass-border-tint) var(--gg-input-border-mix), transparent) !important;
        }
        body.isometric .grid-app-dialog-panel {
            transform: rotate(2deg) skew(-2deg);
        }
        body.typography .grid-app-dialog-panel {
            font-family: 'Arial Black', sans-serif;
            font-weight: bold;
        }

        .topbar,
        .taskbar,
        .windows-menu,
        .windows-menu-categories,
        .windows-menu-apps {
            color: var(--theme-contrast-text);
            text-shadow: 0 1px 2px var(--theme-contrast-shadow);
        }
        /* Placeholder: currentColor falla si el <input> no hereda bien el color (p. ej. WebKit). */
        .windows-menu-categories input::placeholder {
            color: color-mix(in srgb, var(--text-color) 52%, transparent);
        }
        .topbar .search-container input[type="text"]::placeholder {
            color: color-mix(in srgb, var(--text-color) 52%, transparent);
        }
        
        * {
            box-sizing: border-box;
            -webkit-tap-highlight-color: transparent;
        }
        
        html, body {
            overflow-x: hidden;
            width: 100%;
            position: relative;
            margin: 0;
            padding: 0;
            -webkit-touch-callout: none;
            -webkit-user-select: none;
            user-select: none;
            height: 100%;
        }
        
        body {
            font-family: Arial, sans-serif;
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
            background-attachment: fixed;
            min-height: 100vh;
            display: flex;
            flex-direction: column;
            background: var(--neumorphic-bg);
            color: var(--text-color);
            width: 100%;
            height: 100%;
        }
        
        /* Taskbar positions */
        body:not(.mobile-mode).taskbar-bottom .taskbar,
        body.mobile-pc-mode .taskbar {
            bottom: 0;
            top: auto;
        }
        /* Taskbar bottom/top: siempre ocupa todo el ancho */
        body:not(.mobile-mode).taskbar-bottom .taskbar,
        body:not(.mobile-mode).taskbar-top .taskbar {
            left: 0;
            right: 0;
            width: 100%;
        }
        body:not(.mobile-mode).taskbar-bottom .grid-container,
        body.mobile-pc-mode .grid-container {
            margin-bottom: var(--taskbar-height);
            max-height: calc(100vh - var(--taskbar-height));
        }
        body:not(.mobile-mode).taskbar-bottom .topbar,
        body.mobile-pc-mode .topbar {
            top: 0;
            bottom: auto;
        }
        
        body:not(.mobile-mode).taskbar-top .taskbar {
            top: 0;
            bottom: auto;
        }
        body:not(.mobile-mode).taskbar-top .topbar {
            bottom: 0;
            top: auto;
            position: fixed;
            width: 100%;
            z-index: 10;
        }
        body:not(.mobile-mode).taskbar-top .grid-container {
            margin-top: var(--taskbar-height);
            margin-bottom: var(--topbar-height);
            max-height: calc(100vh - var(--taskbar-height) - var(--topbar-height));
        }
        
        body:not(.mobile-mode).taskbar-left .taskbar {
            top: 0;
            left: 0;
            right: auto;
            bottom: 0;
            width: var(--taskbar-height);
            height: 100%;
            flex-direction: column;
            padding: 10px 5px;
        }
        body:not(.mobile-mode).taskbar-left .grid-container {
            margin-left: var(--taskbar-height);
            max-height: 100vh;
        }
        body:not(.mobile-mode).taskbar-left .topbar {
            margin-left: var(--taskbar-height);
            width: calc(100% - var(--taskbar-height));
        }
        
        body:not(.mobile-mode).taskbar-right .taskbar {
            top: 0;
            left: auto;
            right: 0;
            bottom: 0;
            width: var(--taskbar-height);
            height: 100%;
            flex-direction: column;
            padding: 10px 5px;
        }
        body:not(.mobile-mode).taskbar-right .grid-container {
            margin-right: var(--taskbar-height);
            max-height: 100vh;
        }
        body:not(.mobile-mode).taskbar-right .topbar {
            margin-right: var(--taskbar-height);
            width: calc(100% - var(--taskbar-height));
        }
        
        /* Ajustes del menú Windows según posición de taskbar */
        body:not(.mobile-mode).taskbar-top .windows-menu,
        body.mobile-pc-mode .windows-menu {
            top: var(--taskbar-height) !important;
            bottom: var(--topbar-height) !important;
            left: 0 !important;
            right: 0 !important;
            margin: 10px !important;
        }
        body:not(.mobile-mode).taskbar-left .windows-menu,
        body.mobile-pc-mode.taskbar-left .windows-menu {
            left: var(--taskbar-height) !important;
            right: 0 !important;
            top: 0 !important;
            bottom: 0 !important;
            margin: 10px !important;
        }
        body:not(.mobile-mode).taskbar-right .windows-menu,
        body.mobile-pc-mode.taskbar-right .windows-menu {
            left: 0 !important;
            right: var(--taskbar-height) !important;
            top: 0 !important;
            bottom: 0 !important;
            margin: 10px !important;
        }
        body:not(.mobile-mode).taskbar-bottom .windows-menu,
        body.mobile-pc-mode .windows-menu {
            top: 0 !important;
            bottom: var(--taskbar-height) !important;
            left: 0 !important;
            right: 0 !important;
            margin: 10px !important;
        }
        
        /* Modo móvil clásico - ocultar taskbar siempre */
        body.mobile-mode .taskbar {
            display: none !important;
        }
        body.mobile-mode .windows-menu,
        body.mobile-mode .windows-menu-backdrop {
            display: none !important;
        }
        body.mobile-mode .grid-container {
            margin: 0 !important;
            max-height: calc(100vh - var(--topbar-height)) !important;
        }
        
        /* Modo móvil con PC activado - taskbar inferior fijo (más alto para reloj en dos líneas) */
        body.mobile-pc-mode {
            --taskbar-height: 72px;
        }
        body.mobile-pc-mode .taskbar {
            display: flex !important;
            bottom: 0 !important;
            top: auto !important;
            left: 0 !important;
            right: 0 !important;
            width: 100% !important;
            height: var(--taskbar-height) !important;
            min-height: var(--taskbar-height) !important;
            flex-direction: row !important;
            align-items: center !important;
            padding-left: 6px !important;
            padding-right: 6px !important;
        }
        body.mobile-pc-mode .taskbar .taskbar-strip,
        body.mobile-pc-mode .taskbar .pinned-apps,
        body.mobile-pc-mode .taskbar .taskbar-apps {
            flex-direction: row !important;
            overflow-x: auto !important;
            overflow-y: hidden !important;
            flex: 1 !important;
        }
        body.mobile-pc-mode .taskbar .taskbar-strip,
        body.mobile-pc-mode .taskbar .pinned-apps,
        body.mobile-pc-mode .taskbar .taskbar-apps {
            display: none !important;
        }
        body.mobile-pc-mode .taskbar .clock {
            writing-mode: horizontal-tb !important;
            margin-left: auto !important;
            margin-top: 0 !important;
        }
        body.mobile-pc-mode .windows-menu {
            top: 0 !important;
            bottom: var(--taskbar-height) !important;
            left: 0 !important;
            right: 0 !important;
        }
        body.mobile-pc-mode .windows-menu-categories {
            width: 150px !important;
        }
        
        body.slideshow {
            transition: background-image 1s ease-in-out;
        }
        
        :focus-visible {
            outline: 2px solid var(--focus-color);
            outline-offset: 2px;
            box-shadow: var(--focus-glow);
        }
        
        .app-item:focus-visible {
            outline: 2px solid var(--focus-color);
            outline-offset: 2px;
            box-shadow: var(--focus-glow);
            transform: scale(1.05);
        }
        
        input:focus-visible, select:focus-visible, textarea:focus-visible, button:focus-visible {
            outline: 2px solid var(--focus-color);
            outline-offset: 2px;
            box-shadow: var(--focus-glow);
        }
        
        .video-background, #youtubeBackground {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
            z-index: -1;
            pointer-events: none;
        }
        /* Aurora cristal 3D: el wallpaper YouTube/MP4 debe quedar bajo la UI pero visible (sin capa de gradiente encima) */
        body.auroracrystal3d.ac3d-video-wallpaper #youtubeBackground,
        body.auroracrystal3d.ac3d-video-wallpaper video.video-background {
            z-index: 0;
        }
        body.auroracrystal3d.ac3d-video-wallpaper .ac3d-distort-layer {
            display: none !important;
        }
        
        .grid-container {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
            gap: 12px;
            padding: 12px 12px 16px;
            flex-grow: 1;
            grid-auto-rows: auto;
            align-content: start;
            width: 100%;
            touch-action: pan-y pinch-zoom;
            overflow-y: auto;
            max-height: calc(100vh - 120px);
        }
        
        @media (min-width: 768px) {
            .grid-container {
                grid-template-columns: repeat(auto-fill, minmax(108px, 1fr));
                gap: 16px;
                padding: 16px 16px 20px;
                max-height: calc(100vh - 90px);
            }
        }
        
        .app-item {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: flex-start;
            text-align: center;
            cursor: pointer;
            user-select: none;
            -webkit-user-select: none;
            background-color: var(--mosaic-bg-color);
            padding: 10px 8px 8px;
            border-radius: 12px;
            border: 1px solid color-mix(in srgb, var(--text-color) 14%, transparent);
            box-shadow:
                inset 0 1px 0 color-mix(in srgb, var(--text-color) 8%, transparent),
                0 1px 2px color-mix(in srgb, var(--text-color) 6%, transparent);
            backdrop-filter: blur(8px);
            -webkit-backdrop-filter: blur(8px);
            transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
            width: 100%;
            aspect-ratio: 1/1;
            max-width: 112px;
            min-height: 96px;
            margin: 0 auto;
            position: relative;
            outline: none;
            touch-action: manipulation;
            font-variant-numeric: tabular-nums;
        }
        
        .app-item.dragging {
            opacity: 0.5;
            transform: scale(1.05);
        }
        
        .app-item p {
            color: var(--grid-text-color);
            margin-top: auto;
            padding-top: 6px;
            text-shadow: none;
            font-size: clamp(10px, 2.4vw, 12px);
            line-height: 1.25;
            width: 100%;
            max-width: 100%;
            white-space: normal;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 2;
            line-clamp: 2;
            overflow: hidden;
            word-break: break-word;
            hyphens: auto;
            flex-shrink: 0;
            min-height: 2.5em;
        }
        
        @media (min-width: 768px) {
            .app-item p {
                font-size: clamp(11px, 1.35vw, 13px);
            }
        }
        
        .app-icon {
            width: min(58px, 58%);
            height: min(58px, 58%);
            max-width: 64px;
            max-height: 64px;
            object-fit: cover;
            border-radius: 10px;
            pointer-events: auto;
            flex-shrink: 0;
        }
        
        @media (min-width: 768px) {
            .app-icon {
                width: min(64px, 58%);
                height: min(64px, 58%);
                max-width: 72px;
                max-height: 72px;
            }
        }
        
        .app-type-badge {
            position: absolute;
            bottom: 2px;
            right: 2px;
            font-size: 8px;
            padding: 2px 4px;
            border-radius: 4px;
            background-color: rgba(0,0,0,0.7);
            color: white;
            text-transform: uppercase;
            z-index: 10;
            pointer-events: none;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .app-type-badge i {
            font-size: 10px;
        }
        
        
        .app-item.touch-active {
            background-color: rgba(255,255,255,0.2);
            transform: scale(1.05);
        }
        
        .modal {
            display: none;
            position: fixed;
            z-index: 1000;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0,0,0,0.4);
            overflow: hidden;
        }

        /* Por encima de ventanas (.window-frame 10000+) y del menú contextual del explorador (500000). */
        #explorerRenameModal.modal.explorer-rename-modal {
            z-index: 600000 !important;
        }
        
        /* Renombrar en explorador: diálogo compacto con nombre + extensión */
        .explorer-rename-modal .modal-content.explorer-rename-modal-content {
            max-width: 460px;
            width: 92%;
            margin: 8vh auto;
            padding: 0;
            overflow: hidden;
            border-radius: 22px;
            border: 1px solid rgba(255, 255, 255, 0.12);
            box-shadow:
                0 24px 48px rgba(0, 0, 0, 0.35),
                0 0 0 1px rgba(255, 255, 255, 0.06) inset;
            background: linear-gradient(165deg, rgba(255, 255, 255, 0.09) 0%, rgba(255, 255, 255, 0.02) 100%), var(--neumorphic-bg);
            animation: explorerRenameModalIn 0.28s cubic-bezier(0.22, 1, 0.36, 1);
        }
        @keyframes explorerRenameModalIn {
            from {
                opacity: 0;
                transform: translateY(12px) scale(0.97);
            }
            to {
                opacity: 1;
                transform: translateY(0) scale(1);
            }
        }
        .explorer-rename-modal-content .explorer-rename-modal-close {
            position: absolute;
            top: 12px;
            right: 14px;
            z-index: 2;
            width: 36px;
            height: 36px;
            margin: 0;
            padding: 0;
            border: none;
            border-radius: 999px;
            background: rgba(0, 0, 0, 0.2);
            color: var(--text-color);
            font-size: 22px;
            line-height: 1;
            cursor: pointer;
            display: grid;
            place-items: center;
            transition: background 0.15s ease, transform 0.12s ease;
        }
        .explorer-rename-modal-content .explorer-rename-modal-close:hover {
            background: rgba(0, 0, 0, 0.32);
            transform: scale(1.05);
        }
        .explorer-rename-modal-head {
            display: flex;
            align-items: center;
            gap: 16px;
            padding: 22px 22px 8px;
            border-bottom: 1px solid rgba(255, 255, 255, 0.08);
        }
        .explorer-rename-modal-icon-ring {
            flex-shrink: 0;
            width: 52px;
            height: 52px;
            border-radius: 16px;
            display: grid;
            place-items: center;
            background: linear-gradient(145deg, rgba(99, 102, 241, 0.35), rgba(56, 189, 248, 0.2));
            box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.15);
            font-size: 22px;
            color: rgba(255, 255, 255, 0.92);
        }
        .explorer-rename-modal-titles h2 {
            margin: 0 0 4px;
            font-size: 1.25rem;
            font-weight: 600;
            letter-spacing: -0.02em;
        }
        .explorer-rename-modal-hint {
            margin: 0;
            font-size: 0.82rem;
            opacity: 0.72;
            line-height: 1.35;
        }
        .explorer-rename-modal-body {
            padding: 18px 22px 8px;
        }
        .explorer-rename-block label {
            display: block;
            font-size: 0.78rem;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.06em;
            opacity: 0.75;
            margin-bottom: 8px;
        }
        .explorer-rename-input {
            width: 100%;
            box-sizing: border-box;
            padding: 12px 14px;
            border-radius: 12px;
            border: 1px solid rgba(255, 255, 255, 0.14);
            background: rgba(0, 0, 0, 0.18);
            color: var(--text-color);
            font-size: 0.95rem;
            outline: none;
            transition: border-color 0.15s ease, box-shadow 0.15s ease;
        }
        .explorer-rename-input:focus {
            border-color: rgba(99, 102, 241, 0.65);
            box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.22);
        }
        .explorer-rename-split {
            display: flex;
            align-items: stretch;
            gap: 0;
            border-radius: 12px;
            overflow: hidden;
            border: 1px solid rgba(255, 255, 255, 0.14);
            background: rgba(0, 0, 0, 0.15);
        }
        .explorer-rename-input-base {
            flex: 1;
            min-width: 0;
            border: none !important;
            border-radius: 0 !important;
            box-shadow: none !important;
        }
        .explorer-rename-dot {
            align-self: center;
            padding: 0 2px 0 4px;
            font-weight: 700;
            opacity: 0.55;
            user-select: none;
        }
        .explorer-rename-input-ext {
            width: 28%;
            max-width: 120px;
            min-width: 72px;
            border: none !important;
            border-radius: 0 !important;
            box-shadow: none !important;
            background: rgba(99, 102, 241, 0.12) !important;
            font-family: ui-monospace, 'Cascadia Code', monospace;
            font-size: 0.9rem;
        }
        .explorer-rename-help {
            margin: 10px 0 0;
            font-size: 0.8rem;
            opacity: 0.65;
            line-height: 1.4;
        }
        .explorer-rename-preview {
            margin-top: 16px;
            padding: 12px 14px;
            border-radius: 12px;
            background: rgba(0, 0, 0, 0.2);
            border: 1px dashed rgba(255, 255, 255, 0.12);
            display: flex;
            flex-direction: column;
            gap: 6px;
        }
        .explorer-rename-preview span {
            font-size: 0.72rem;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.08em;
            opacity: 0.6;
        }
        .explorer-rename-preview code {
            font-size: 0.95rem;
            word-break: break-all;
            color: rgba(255, 255, 255, 0.92);
        }
        .explorer-rename-modal-actions {
            display: flex;
            justify-content: flex-end;
            gap: 10px;
            padding: 16px 22px 22px;
            flex-wrap: wrap;
        }
        .explorer-rename-btn {
            min-height: var(--shell-btn-min-h);
            padding: 0 16px;
            border-radius: 10px;
            font-weight: 600;
            cursor: pointer;
            border: none;
            transition: transform 0.12s ease, box-shadow 0.15s ease, background 0.15s ease;
        }
        .explorer-rename-btn-cancel {
            background: rgba(255, 255, 255, 0.08);
            color: var(--text-color);
        }
        .explorer-rename-btn-cancel:hover {
            background: rgba(255, 255, 255, 0.14);
        }
        .explorer-rename-btn-save {
            background: linear-gradient(135deg, #6366f1, #3b82f6);
            color: #fff;
            box-shadow: 0 8px 20px rgba(99, 102, 241, 0.35);
        }
        .explorer-rename-btn-save:hover {
            transform: translateY(-1px);
            box-shadow: 0 10px 24px rgba(99, 102, 241, 0.45);
        }
        .explorer-rename-modal-content .explorer-rename-modal-actions .explorer-rename-btn {
            margin-top: 0;
        }
        @media (max-width: 420px) {
            .explorer-rename-split {
                flex-wrap: wrap;
            }
            .explorer-rename-input-ext {
                width: 100%;
                max-width: none;
            }
            .explorer-rename-dot {
                display: none;
            }
        }

        #explorerConflictModal.modal.explorer-conflict-modal,
        #explorerNewFolderChoiceModal.modal.explorer-conflict-modal {
            z-index: 600001 !important;
        }
        .explorer-conflict-modal .modal-content.explorer-conflict-modal-content {
            max-width: 480px;
            width: 92%;
            margin: 8vh auto;
            padding: 0;
            overflow: hidden;
            border-radius: 22px;
            border: 1px solid rgba(255, 255, 255, 0.12);
            box-shadow:
                0 24px 48px rgba(0, 0, 0, 0.35),
                0 0 0 1px rgba(255, 255, 255, 0.06) inset;
            background: linear-gradient(165deg, rgba(255, 255, 255, 0.09) 0%, rgba(255, 255, 255, 0.02) 100%), var(--neumorphic-bg);
            animation: explorerRenameModalIn 0.28s cubic-bezier(0.22, 1, 0.36, 1);
        }
        .explorer-conflict-modal-content .explorer-conflict-modal-close {
            position: absolute;
            top: 12px;
            right: 14px;
            z-index: 2;
            width: var(--shell-modal-close-size);
            height: var(--shell-modal-close-size);
            min-width: var(--shell-modal-close-size);
            min-height: 0;
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            aspect-ratio: 1;
            border: 1px solid color-mix(in srgb, var(--text-color) 14%, transparent);
            border-radius: var(--shell-modal-close-radius);
            background: color-mix(in srgb, var(--neumorphic-bg) 55%, transparent);
            color: var(--text-color);
            font-size: var(--shell-modal-close-font);
            line-height: 1;
            cursor: pointer;
            display: grid;
            place-items: center;
            box-shadow: none;
            backdrop-filter: blur(10px) saturate(1.1);
            -webkit-backdrop-filter: blur(10px) saturate(1.1);
            transition: background 0.15s ease, border-color 0.15s ease, transform 0.12s ease;
        }
        .explorer-conflict-modal-content .explorer-conflict-modal-close:hover {
            background: color-mix(in srgb, var(--text-color) 12%, transparent);
            border-color: color-mix(in srgb, var(--text-color) 22%, transparent);
            transform: none;
        }
        .explorer-conflict-modal-head {
            display: flex;
            align-items: flex-start;
            gap: 16px;
            padding: 22px 22px 12px;
            border-bottom: 1px solid rgba(255, 255, 255, 0.08);
        }
        .explorer-conflict-modal-icon-ring {
            flex-shrink: 0;
            width: 52px;
            height: 52px;
            border-radius: 16px;
            display: grid;
            place-items: center;
            background: linear-gradient(145deg, rgba(245, 158, 11, 0.35), rgba(234, 88, 12, 0.22));
            box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.15);
            font-size: 22px;
            color: rgba(255, 255, 255, 0.92);
        }
        .explorer-conflict-modal-titles h2 {
            margin: 0 0 8px;
            font-size: 1.2rem;
            font-weight: 600;
            letter-spacing: -0.02em;
        }
        .explorer-conflict-modal-message {
            margin: 0;
            font-size: 0.9rem;
            line-height: 1.45;
            opacity: 0.88;
            word-break: break-word;
        }
        .explorer-conflict-modal-body {
            padding: 14px 22px 22px;
        }
        .explorer-conflict-apply-all {
            display: flex;
            align-items: flex-start;
            gap: 10px;
            margin-bottom: 16px;
            cursor: pointer;
            font-size: 0.88rem;
            line-height: 1.35;
            opacity: 0.9;
        }
        .explorer-conflict-apply-all input {
            margin-top: 3px;
            flex-shrink: 0;
        }
        .explorer-conflict-modal-actions {
            display: flex;
            flex-direction: column;
            gap: 10px;
        }
        .explorer-conflict-btn {
            min-height: var(--shell-btn-min-h);
            padding: 0 14px;
            border-radius: 10px;
            font-weight: 600;
            font-size: 0.92rem;
            cursor: pointer;
            border: 1px solid rgba(255, 255, 255, 0.12);
            background: rgba(255, 255, 255, 0.08);
            color: var(--text-color);
            transition: transform 0.12s ease, box-shadow 0.15s ease, background 0.15s ease;
        }
        .explorer-conflict-btn:hover {
            background: rgba(255, 255, 255, 0.13);
        }
        .explorer-conflict-btn-primary {
            background: linear-gradient(135deg, #6366f1, #3b82f6);
            border-color: transparent;
            color: #fff;
            box-shadow: 0 6px 18px rgba(99, 102, 241, 0.3);
        }
        .explorer-conflict-btn-primary:hover {
            transform: translateY(-1px);
            box-shadow: 0 8px 22px rgba(99, 102, 241, 0.4);
        }
        .explorer-conflict-btn-danger {
            background: linear-gradient(135deg, #dc2626, #b91c1c);
            border-color: transparent;
            color: #fff;
            box-shadow: 0 6px 18px rgba(220, 38, 38, 0.28);
        }
        .explorer-conflict-btn-danger:hover {
            transform: translateY(-1px);
            box-shadow: 0 8px 22px rgba(220, 38, 38, 0.38);
        }
        .explorer-conflict-btn-muted {
            background: rgba(0, 0, 0, 0.2);
        }
        .explorer-conflict-rename-panel {
            padding-top: 4px;
        }
        .explorer-conflict-rename-panel label {
            display: block;
            font-size: 0.78rem;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.06em;
            opacity: 0.75;
            margin-bottom: 8px;
        }
        .explorer-conflict-rename-actions {
            display: flex;
            justify-content: flex-end;
            gap: 10px;
            margin-top: 14px;
            flex-wrap: wrap;
        }

        .modal-content {
            background-color: var(--neumorphic-bg);
            margin: 2% auto;
            padding: 20px;
            border: none;
            width: 95%;
            max-width: 800px;
            max-height: 90vh;
            border-radius: 20px;
            box-shadow: 
                10px 10px 20px var(--neumorphic-shadow-dark), 
                -10px -10px 20px var(--neumorphic-shadow-light);
            color: var(--text-color);
            position: relative;
            overflow-y: auto;
            -webkit-overflow-scrolling: touch;
        }
        
        @media (max-width: 768px) {
            .modal-content {
                margin: 1% auto;
                width: 98%;
                padding: 15px;
                max-height: 98vh;
                padding-bottom: 30px;
            }
        }
        
        .modal-content form {
            display: flex;
            flex-direction: column;
            align-items: stretch;
        }
        
        .modal-content button:not(.close) {
            margin-top: 10px;
            color: var(--text-color);
            min-height: var(--shell-btn-min-h);
            flex-shrink: 0;
        }

        /* Mosaico de ventanas */
        .windows-mosaic-modal-content {
            max-width: 980px;
            display: flex;
            flex-direction: column;
        }
        .windows-mosaic-grid {
            margin-top: 12px;
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
            gap: 12px;
        }
        .windows-mosaic-tile {
            background-color: rgba(0,0,0,0.12);
            border: 1px solid rgba(255,255,255,0.14);
            border-radius: 14px;
            padding: 10px;
            cursor: pointer;
            transition: transform 0.15s ease, background-color 0.15s ease;
            overflow: hidden;
            position: relative;
        }
        .windows-mosaic-tile:hover {
            transform: scale(1.02);
            background-color: rgba(0,0,0,0.18);
        }
        .windows-mosaic-close {
            position: absolute;
            top: 6px;
            right: 6px;
            z-index: 4;
            width: 28px;
            height: 28px;
            min-width: 28px;
            min-height: 28px;
            padding: 0;
            margin: 0;
            border: none;
            border-radius: 999px;
            box-sizing: border-box;
            aspect-ratio: 1;
            background: rgba(52, 52, 54, 0.58);
            color: rgba(255, 255, 255, 0.88);
            cursor: pointer;
            line-height: 1;
            display: grid;
            place-items: center;
            /* “Corte” / relieve: sombras internas + ligera proyección */
            box-shadow:
                inset 0 1px 2px rgba(255, 255, 255, 0.12),
                0 6px 14px rgba(0, 0, 0, 0.3);
            transition: background 0.15s ease, box-shadow 0.15s ease, transform 0.12s ease;
        }
        .windows-mosaic-close i {
            display: block;
            line-height: 1;
            font-size: 14px;
            transform: translateY(0.5px);
        }
        .windows-mosaic-close:hover {
            background: rgba(62, 62, 65, 0.72);
            transform: scale(1.06);
            box-shadow:
                inset 0 2px 5px rgba(0, 0, 0, 0.4),
                inset 0 -1px 1px rgba(255, 255, 255, 0.09),
                0 2px 6px rgba(0, 0, 0, 0.28);
        }
        .windows-mosaic-close:active {
            transform: scale(0.98);
            box-shadow:
                inset 0 3px 6px rgba(0, 0, 0, 0.5),
                inset 0 -1px 0 rgba(255, 255, 255, 0.05);
        }
        .windows-mosaic-thumb {
            width: 100%;
            height: 110px;
            border-radius: 12px;
            overflow: hidden;
            background: rgba(255,255,255,0.08);
            display: flex;
            align-items: center;
            justify-content: center;
            margin-bottom: 8px;
            position: relative;
        }
        .windows-mosaic-thumb img,
        .windows-mosaic-thumb video {
            width: 100%;
            height: 100%;
            object-fit: cover;
            filter: saturate(0.95) contrast(0.98);
        }
        .windows-mosaic-thumb .thumb-iframe-wrap {
            width: 100%;
            height: 100%;
            overflow: hidden;
            position: relative;
            background: rgba(255,255,255,0.06);
        }
        .windows-mosaic-thumb iframe {
            width: 400%;
            height: 400%;
            border: 0;
            transform: scale(0.25);
            transform-origin: 0 0;
            pointer-events: none;
        }
        .windows-mosaic-meta {
            display: flex;
            align-items: baseline;
            justify-content: space-between;
            gap: 10px;
        }
        .windows-mosaic-title {
            font-weight: 700;
            font-size: 13px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        .windows-mosaic-sub {
            font-size: 11px;
            color: rgba(0,0,0,0.55);
        }
        .windows-mosaic-actions {
            margin-top: 14px;
            text-align: right;
        }
        #closeAllWindowsBtn {
            background-color: rgba(255,255,255,0.08);
            border-radius: 12px;
            border: 1px solid rgba(255,255,255,0.14);
        }

        /* Explorador tipo Windows (local): colores desde paleta por tema (--fe-palette-*) o contraste automático */
        .file-explorer {
            width: 100%;
            height: 100%;
            display: flex;
            flex-direction: column;
            overflow: hidden;
            min-height: 0;
            /* Evita que dir=rtl invierta el orden visual de paneles (lista | vista previa) y el sentido del scroll */
            direction: ltr;
            background: var(--fe-palette-main-bg, var(--neumorphic-bg));
            color: var(--fe-palette-text, var(--theme-contrast-text));
            --fe-fg: var(--fe-palette-text, var(--theme-contrast-text));
            --fe-fg-muted: var(--fe-palette-muted, var(--theme-contrast-muted));
            --fe-surface: color-mix(in srgb, var(--fe-palette-text, var(--theme-contrast-text)) 10%, transparent);
            --fe-surface-hover: color-mix(in srgb, var(--fe-palette-text, var(--theme-contrast-text)) 16%, transparent);
            --fe-border: color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 20%, transparent);
            --fe-shadow: color-mix(in srgb, var(--fe-palette-text, var(--theme-contrast-text)) 35%, transparent);
            text-shadow: 0 1px 2px var(--fe-shadow);
            --fe-tree-accent: var(--fe-palette-accent, #0a84ff);
            --fe-tree-active-bg: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 24%, transparent);
            --fe-tree-active-bar: var(--fe-palette-accent, #0a84ff);
        }
        .file-explorer .fe-tree {
            background: var(--fe-palette-tree-bg, transparent);
        }
        .file-explorer .explorer-toolbar.fe-toolbar {
            background: var(--fe-palette-toolbar-bg, transparent);
        }

        /* Modal: personalización del explorador (JS sube z-index si ventanas superan este valor) */
        #explorerThemeModal.modal.explorer-theme-modal {
            z-index: 800000 !important;
        }
        .explorer-theme-modal .modal-content.explorer-theme-modal-content {
            max-width: 560px;
            width: 94%;
            margin: 7vh auto;
            border-radius: 18px;
        }
        .explorer-theme-modal-content .explorer-theme-modal-close {
            position: absolute;
            top: 12px;
            right: 14px;
            width: 36px;
            height: 36px;
            border-radius: 10px;
        }
        .explorer-theme-modal-hint {
            margin-top: 4px;
            opacity: 0.8;
            font-size: 12px;
            line-height: 1.35;
        }
        .explorer-theme-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 12px;
            margin-top: 14px;
        }
        @media (max-width: 520px) {
            .explorer-theme-grid {
                grid-template-columns: 1fr;
            }
        }
        .explorer-theme-field label {
            display: block;
            font-weight: 700;
            font-size: 12px;
            margin-bottom: 6px;
            opacity: 0.85;
        }
        .explorer-theme-row {
            display: flex;
            align-items: center;
            gap: 10px;
        }
        .explorer-theme-row input[type="range"] {
            flex: 1;
            min-width: 120px;
        }
        .explorer-theme-alpha-label {
            width: 46px;
            text-align: right;
            font-variant-numeric: tabular-nums;
            opacity: 0.85;
            font-size: 12px;
        }
        .explorer-theme-actions {
            display: flex;
            justify-content: flex-end;
            gap: 10px;
            margin-top: 14px;
        }
        .file-explorer .fe-smart-label,
        .file-explorer .fe-breadcrumb,
        .file-explorer .explorer-path {
            color: var(--fe-fg);
            text-shadow: 0 1px 2px var(--fe-shadow);
        }
        .file-explorer .explorer-item-sub,
        .file-explorer .fe-search-hint,
        .file-explorer .explorer-col-size,
        .file-explorer .explorer-col-date,
        .file-explorer .explorer-item-pathline {
            color: var(--fe-fg-muted);
            text-shadow: 0 1px 2px var(--fe-shadow);
        }
        /* Árbol de directorios: mismo contraste que el tema (texto, iconos, rama activa) */
        .file-explorer .fe-tree {
            flex: 1;
            overflow: auto;
            padding: 6px 8px 12px;
            font-size: 13px;
            line-height: 1.35;
            -webkit-overflow-scrolling: touch;
            color: var(--fe-fg);
            scrollbar-color: color-mix(in srgb, var(--fe-palette-text, var(--theme-contrast-text)) 38%, transparent) color-mix(in srgb, var(--fe-palette-text, var(--theme-contrast-text)) 7%, transparent);
        }
        .file-explorer .fe-tree-node {
            display: flex;
            align-items: center;
            gap: 6px;
            padding: 5px 8px;
            border-radius: 8px;
            cursor: pointer;
            user-select: none;
            color: var(--fe-fg);
            min-width: 0;
            text-shadow: 0 1px 2px var(--fe-shadow);
        }
        .file-explorer .fe-tree-node:hover {
            background: color-mix(in srgb, var(--fe-palette-text, var(--theme-contrast-text)) 12%, transparent);
        }
        .file-explorer .fe-tree-node.explorer-drop-target {
            background: color-mix(in srgb, #22c55e 22%, transparent);
            outline: 2px dashed color-mix(in srgb, #22c55e 75%, var(--theme-contrast-text) 25%);
            outline-offset: 2px;
            color: var(--fe-fg);
        }
        .file-explorer .fe-tree-node.active {
            background: var(--fe-tree-active-bg);
            box-shadow: inset 3px 0 0 var(--fe-tree-active-bar);
            font-weight: 600;
            color: var(--fe-fg);
        }
        .file-explorer .fe-tree-node[data-path] {
            cursor: grab;
        }
        .file-explorer .fe-tree-node[data-path]:active {
            cursor: grabbing;
        }
        .file-explorer .fe-tree-node.fe-tree-dragging {
            opacity: 0.55;
        }
        .file-explorer .fe-tree-expander {
            cursor: pointer;
            width: 20px;
            height: 20px;
            border-radius: 6px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-weight: 900;
            font-size: 13px;
            line-height: 1;
            flex: 0 0 auto;
            user-select: none;
            color: var(--fe-fg);
            opacity: 0.88;
            text-shadow: 0 1px 2px var(--fe-shadow);
        }
        .file-explorer .fe-tree-expander:hover {
            background: color-mix(in srgb, var(--fe-palette-text, var(--theme-contrast-text)) 14%, transparent);
            opacity: 1;
        }
        .file-explorer .fe-tree-expander[aria-disabled="true"] {
            opacity: 0;
            pointer-events: none;
        }
        .file-explorer .fe-tree-node.fe-tree-open > .fe-tree-expander {
            opacity: 0.95;
        }
        .file-explorer .fe-tree-branch-open:not(.active) {
            font-weight: 500;
        }
        .file-explorer .fe-tree-branch-open:not(.active) .fe-tree-label {
            color: var(--fe-fg-muted);
        }
        .file-explorer .fe-tree-label {
            flex: 1;
            min-width: 0;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            color: inherit;
        }
        .file-explorer .fe-tree-node i.fe-tree-icon,
        .file-explorer .fe-tree-node > i.fas {
            flex: 0 0 auto;
            width: 1.1em;
            text-align: center;
            color: var(--fe-fg-muted);
            text-shadow: 0 1px 2px var(--fe-shadow);
        }
        .file-explorer .fe-tree-node.active i.fe-tree-icon,
        .file-explorer .fe-tree-node.active > i.fas {
            color: var(--fe-fg);
        }
        .file-explorer .fe-tree-children {
            padding-left: 12px;
            border-left: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 14%, transparent);
            margin: 2px 0 4px 10px;
        }
        .file-explorer .fe-tree-root-children {
            margin-left: 0;
            padding-left: 0;
            border-left: none;
        }
        /* Panel principal del explorador (lista, ruta, barra) */
        .file-explorer .fe-main {
            color: var(--fe-fg);
            text-shadow: 0 1px 2px var(--fe-shadow);
            position: relative;
            z-index: 0;
        }
        .file-explorer .fe-explorer-chrome-bg {
            position: absolute;
            inset: 0;
            z-index: 0;
            pointer-events: none;
            overflow: hidden;
            border-radius: inherit;
        }
        .file-explorer .fe-explorer-chrome-bg img,
        .file-explorer .fe-explorer-chrome-bg video {
            width: 100%;
            height: 100%;
            object-fit: cover;
            opacity: 0.42;
        }
        .file-explorer .fe-main > :not(.fe-explorer-chrome-bg) {
            position: relative;
            z-index: 1;
        }
        .file-explorer .fe-cust-folder-thumb.fe-cust-preview-video video {
            width: 100%;
            height: 100%;
            max-height: 120px;
            object-fit: cover;
        }
        .file-explorer .fe-cust-folder-thumb.fe-cust-preview-image img {
            width: 100%;
            height: 100%;
            max-height: 120px;
            object-fit: cover;
        }
        .file-explorer .fe-cust-icon-img {
            width: 56%;
            height: 56%;
            object-fit: contain;
        }
        .file-explorer .fe-cust-file-wrap {
            position: relative;
        }
        .file-explorer .fe-cust-file-badge {
            position: absolute;
            top: 4px;
            right: 4px;
            z-index: 2;
            width: 28px;
            height: 28px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 8px;
            background: color-mix(in srgb, var(--fe-palette-main-bg, #111) 55%, transparent);
        }
        .file-explorer .fe-cust-file-badge .fe-cust-icon-img {
            width: 22px;
            height: 22px;
        }
        .file-explorer .fe-cust-file-wrap {
            border-radius: 10px;
        }
        .file-explorer .fe-cust-file-wrap[style*='--fe-cust-file'] {
            box-shadow: 0 0 0 2px color-mix(in srgb, var(--fe-cust-file, #fff) 55%, transparent);
        }
        .explorer-cust-modal-content,
        .explorer-toolbar-cust-modal-content {
            max-width: 560px;
        }
        .explorer-cust-modal-grid {
            display: grid;
            grid-template-columns: minmax(120px, 1fr) 2fr;
            gap: 10px 14px;
            align-items: center;
        }
        .explorer-cust-span2 {
            grid-column: 1 / -1;
        }
        .explorer-cust-modal-grid .wide-input,
        .explorer-cust-config-grid .wide-input {
            width: 100%;
            max-width: 100%;
            box-sizing: border-box;
        }
        .explorer-cust-config-grid {
            display: grid;
            grid-template-columns: minmax(140px, 1fr) 2fr;
            gap: 10px 14px;
            align-items: center;
            max-width: 720px;
        }
        .explorer-cust-hint {
            font-size: 13px;
            opacity: 0.88;
            max-width: 720px;
        }
        .explorer-cust-upload-row {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            align-items: center;
        }
        .file-explorer .fe-path-row {
            color: var(--fe-fg);
        }
        .file-explorer .fe-toolbar {
            color: var(--fe-fg);
        }
        .fe-root {
            display: flex;
            flex-direction: column;
            flex: 1;
            min-height: 0;
            height: 100%;
        }
        .fe-body {
            display: flex;
            flex: 1;
            min-height: 0;
            gap: 0;
            position: relative;
        }
        .fe-sidebar-backdrop {
            display: none;
        }
        .fe-sidebar-toggle {
            display: none;
            align-items: center;
            justify-content: center;
            min-width: var(--shell-btn-min-h);
            min-height: var(--shell-btn-min-h);
            padding: 0 8px;
            border-radius: 10px;
            border: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 22%, transparent);
            background: var(--fe-palette-input-bg, var(--neumorphic-bg, rgba(255,255,255,0.85)));
            color: var(--fe-palette-text, var(--theme-contrast-text));
            cursor: pointer;
            flex-shrink: 0;
            -webkit-tap-highlight-color: transparent;
        }
        .fe-sidebar-toggle:hover {
            background: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 14%, transparent);
        }
        .file-explorer .fe-toolbar .fe-theme-btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-width: var(--shell-btn-min-h);
            min-height: var(--shell-btn-min-h);
            padding: 0 8px;
            border-radius: 10px;
            border: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 22%, transparent);
            background: var(--fe-palette-input-bg, var(--neumorphic-bg, rgba(255,255,255,0.85)));
            color: var(--fe-palette-text, var(--theme-contrast-text));
            cursor: pointer;
            flex-shrink: 0;
            -webkit-tap-highlight-color: transparent;
        }
        .file-explorer .fe-toolbar .fe-theme-btn:hover {
            background: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 14%, transparent);
        }
        .fe-sidebar-head-row {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 8px;
            padding: 10px 12px 6px;
            flex-shrink: 0;
        }
        .fe-sidebar-close-btn {
            display: none;
            align-items: center;
            justify-content: center;
            width: var(--shell-modal-close-size);
            height: var(--shell-modal-close-size);
            min-width: var(--shell-modal-close-size);
            min-height: 0;
            aspect-ratio: 1;
            padding: 0;
            border: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 18%, transparent);
            border-radius: var(--shell-modal-close-radius);
            background: color-mix(in srgb, var(--fe-palette-text, var(--theme-contrast-text)) 8%, transparent);
            color: var(--fe-palette-text, var(--theme-contrast-text));
            cursor: pointer;
            flex-shrink: 0;
            -webkit-tap-highlight-color: transparent;
        }
        .fe-sidebar-close-btn:hover {
            background: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 18%, transparent);
        }
        .fe-sidebar {
            width: 240px;
            min-width: 200px;
            max-width: 340px;
            border-right: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 16%, transparent);
            background: var(--fe-palette-sidebar-bg, var(--neumorphic-bg));
            box-shadow: inset -1px 0 0 color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 8%, transparent);
            display: flex;
            flex-direction: column;
            min-height: 0;
            overflow: hidden;
            color: var(--fe-palette-text, var(--theme-contrast-text));
        }
        .fe-sidebar-head {
            font-size: 11px;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 0.06em;
            padding: 0;
            color: var(--theme-contrast-text);
            opacity: 0.75;
            flex: 1;
            min-width: 0;
        }
        .fe-tree-filter-row {
            display: flex;
            align-items: center;
            gap: 4px;
            padding: 0 12px 8px;
            flex-shrink: 0;
        }
        .fe-tree-filter-input {
            flex: 1;
            min-width: 0;
            box-sizing: border-box;
            padding: 4px 8px;
            border-radius: 6px;
            border: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 20%, transparent);
            font-size: 11px;
            font-weight: 600;
            line-height: 1.25;
            background: color-mix(in srgb, var(--fe-palette-input-bg, var(--neumorphic-bg, #fff)) 94%, transparent);
            color: var(--fe-palette-text, var(--theme-contrast-text));
        }
        .fe-tree-filter-clear {
            flex-shrink: 0;
            appearance: none;
            border: none;
            background: transparent;
            color: var(--fe-fg-muted, var(--fe-palette-muted, var(--theme-contrast-muted)));
            font-size: 11px;
            font-weight: 600;
            line-height: 1.25;
            padding: 2px 6px;
            border-radius: 6px;
            cursor: pointer;
            display: none;
            align-items: center;
            justify-content: center;
            opacity: 0.78;
            min-width: 0;
        }
        .fe-tree-filter-clear:hover {
            opacity: 1;
            background: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 12%, transparent);
        }
        .fe-tree-filter-clear.visible {
            display: inline-flex;
        }
        .file-explorer .fe-sidebar-head {
            color: var(--fe-fg-muted);
            opacity: 1;
        }

        /* Explorador: móvil / panel lateral tipo drawer */
        @media (max-width: 768px) {
            .file-explorer {
                position: relative;
                min-height: 200px;
            }
            .fe-sidebar-backdrop {
                display: block;
                position: absolute;
                inset: 0;
                z-index: 40;
                background: rgba(0, 0, 0, 0.42);
                opacity: 0;
                pointer-events: none;
                transition: opacity 0.22s ease;
            }
            .fe-root.fe-sidebar-visible .fe-sidebar-backdrop {
                opacity: 1;
                pointer-events: auto;
            }
            .fe-sidebar-toggle {
                display: inline-flex;
                touch-action: manipulation;
            }
            .fe-sidebar-close-btn {
                display: inline-flex;
            }
            .fe-sidebar {
                position: absolute;
                left: 0;
                top: 0;
                bottom: 0;
                z-index: 41;
                width: min(88vw, 300px);
                max-width: 300px;
                min-width: 0;
                transform: translateX(-102%);
                transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
                box-shadow: 8px 0 28px rgba(0, 0, 0, 0.18);
                border-right: none;
                padding-top: env(safe-area-inset-top, 0);
                padding-bottom: env(safe-area-inset-bottom, 0);
                padding-left: env(safe-area-inset-left, 0);
            }
            .fe-root.fe-sidebar-visible .fe-sidebar {
                transform: translateX(0);
            }
            .fe-main {
                width: 100%;
                min-width: 0;
            }
            .explorer-toolbar {
                gap: 6px;
                margin-bottom: 8px;
                align-items: center;
            }
            .explorer-toolbar > button {
                min-width: var(--shell-btn-min-h);
                min-height: var(--shell-btn-min-h);
                padding: 0 8px;
                justify-content: center;
                -webkit-tap-highlight-color: transparent;
            }
            .fe-toolbar-actions-cluster {
                display: none;
                flex-wrap: wrap;
                align-items: center;
                gap: 6px;
                width: 100%;
                flex-basis: 100%;
                min-width: 0;
            }
            .fe-root.fe-mtoolbar-pinned .fe-toolbar-actions-cluster,
            .fe-root.fe-mtoolbar-expanded .fe-toolbar-actions-cluster {
                display: flex;
            }
            .fe-sidebar-toggle {
                order: 1;
                flex-shrink: 0;
            }
            .fe-toolbar-more-btn {
                display: inline-flex;
                order: 2;
                touch-action: manipulation;
                -webkit-tap-highlight-color: transparent;
            }
            .fe-root.fe-mtoolbar-pinned .fe-toolbar-more-btn {
                display: none !important;
            }
            .fe-toolbar-pin-btn {
                display: inline-flex;
                flex-shrink: 0;
                touch-action: manipulation;
                -webkit-tap-highlight-color: transparent;
            }
            .fe-toolbar-pin-btn[aria-pressed="true"] {
                background: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 26%, transparent);
                border-color: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 45%, transparent);
                color: var(--fe-palette-accent, #0a84ff);
            }
            .fe-toolbar-search-cluster {
                flex: 1 1 0;
                margin-left: 0;
                order: 3;
                min-width: 0;
                max-width: none;
            }
            .fe-toolbar-actions-cluster {
                order: 10;
            }
            .fe-search-wrap {
                flex: 1 1 auto;
                min-width: 0;
            }
            .fe-search-input {
                width: 100%;
                max-width: none;
                min-width: 0;
                box-sizing: border-box;
            }
            .fe-path-row {
                padding: 4px 6px 6px;
            }
            .fe-breadcrumb {
                font-size: 12px;
            }
            .file-explorer .explorer-items:not(.explorer-items-list):not(.explorer-items-details):not(.explorer-items-content) {
                grid-template-columns: repeat(auto-fill, minmax(108px, 1fr));
                gap: 8px;
            }
            .explorer-item {
                padding: 8px;
            }
            .explorer-item-thumb {
                height: 76px;
            }
            .explorer-item-name {
                font-size: 12px;
            }
            .explorer-items.explorer-items-list .explorer-item {
                min-height: 48px;
            }
            .file-explorer .explorer-connections-panel {
                left: 8px !important;
                right: 8px !important;
                width: auto !important;
                max-width: none;
            }
        }
        .fe-main {
            flex: 1;
            min-width: 0;
            display: flex;
            flex-direction: column;
            min-height: 0;
        }
        .fe-tabs {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            gap: 4px;
            padding: 2px 6px 2px;
            border-bottom: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 14%, transparent);
            background: color-mix(in srgb, var(--fe-palette-input-bg, var(--neumorphic-bg, #fff)) 96%, transparent);
        }
        .fe-tab {
            display: inline-flex;
            align-items: center;
            flex-shrink: 0;
            max-width: min(280px, 100%);
            min-width: 0;
            border-radius: 8px;
            border: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 22%, transparent);
            background: color-mix(in srgb, var(--fe-palette-input-bg, var(--neumorphic-bg, #fff)) 88%, transparent);
            color: var(--fe-palette-text, var(--theme-contrast-text));
            overflow: hidden;
            box-sizing: border-box;
        }
        .fe-tab-main {
            flex: 1;
            min-width: 0;
            appearance: none;
            border: none;
            background: transparent;
            color: inherit;
            font-size: 11px;
            font-weight: 600;
            line-height: 1;
            cursor: pointer;
            padding: 1px 8px 1px 10px;
            height: auto;
            min-height: 0;
            text-align: left;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
        .fe-tab-close {
            flex-shrink: 0;
            width: 22px;
            min-width: 22px;
            border: none;
            border-left: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 18%, transparent);
            background: transparent;
            color: inherit;
            cursor: pointer;
            font-size: 14px;
            line-height: 1;
            padding: 0;
            display: flex;
            align-items: center;
            justify-content: center;
            opacity: 0.75;
            height: auto;
            min-height: 0;
        }
        .fe-tab-close:hover {
            opacity: 1;
            background: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 12%, transparent);
        }
        .fe-tab:hover {
            background: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 14%, transparent);
        }
        .fe-tab.active {
            border-color: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 55%, transparent);
            background: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 22%, transparent);
        }
        .fe-tab-main:disabled,
        .fe-tab-close:disabled {
            opacity: 0.55;
            cursor: not-allowed;
        }
        .fe-path-row {
            display: flex;
            align-items: center;
            padding: 4px 10px 8px;
            gap: 8px;
            flex-wrap: wrap;
            min-height: 28px;
        }
        .fe-breadcrumb {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            gap: 4px;
            font-size: 13px;
            font-weight: 600;
            color: var(--fe-palette-text, var(--theme-contrast-text));
        }
        .fe-bc-seg {
            cursor: pointer;
            padding: 2px 6px;
            border-radius: 6px;
            transition: background 0.15s ease;
        }
        .fe-bc-seg:hover {
            background: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 22%, transparent);
        }
        .fe-bc-sep {
            opacity: 0.45;
            user-select: none;
        }
        .fe-bc-seg.fe-bc-current {
            cursor: default;
            font-weight: 800;
            opacity: 0.95;
        }
        .fe-bc-seg.fe-bc-current:hover {
            background: transparent;
        }
        .file-explorer .fe-tree-trash-node i.fe-tree-icon {
            color: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 55%, var(--fe-fg-muted) 45%);
        }
        .fe-items-wrap {
            position: relative;
            flex: 1;
            min-height: 0;
            overflow: hidden;
            display: flex;
            flex-direction: row;
            align-items: stretch;
            direction: ltr;
        }
        .fe-explorer-stage {
            flex: 1;
            min-width: 0;
            min-height: 0;
            display: flex;
            flex-direction: row;
            align-items: stretch;
            position: relative;
            direction: ltr;
            overscroll-behavior: contain;
        }
        /* El layout dividido sigue el eje izquierda→derecha aunque la app esté en RTL (árabe, etc.). */
        .file-explorer .fe-explorer-stage.fe-split-active {
            direction: ltr;
        }
        .file-explorer .fe-split-orient-hscroll .fe-explorer-main-pane {
            direction: ltr;
        }
        .file-explorer .explorer-items.fe-split-hscroll-strip {
            direction: ltr;
        }
        .fe-explorer-main-pane {
            flex: 1;
            min-width: 0;
            min-height: 0;
            display: flex;
            flex-direction: column;
            position: relative;
            overflow: hidden;
        }
        .fe-split-active .fe-explorer-main-pane {
            min-width: 0;
            flex: 1 1 0;
        }
        .fe-split-orient-right .fe-explorer-main-pane {
            order: 0;
        }
        .fe-split-orient-right .fe-split-resizer {
            order: 1;
        }
        .fe-split-orient-right .fe-preview-pane {
            order: 2;
        }
        .fe-split-orient-left .fe-preview-pane {
            order: 0;
        }
        .fe-split-orient-left .fe-split-resizer {
            order: 1;
        }
        .fe-split-orient-left .fe-explorer-main-pane {
            order: 2;
        }
        .fe-explorer-stage.fe-split-orient-top,
        .fe-explorer-stage.fe-split-orient-bottom,
        .fe-explorer-stage.fe-split-orient-hscroll {
            flex-direction: column;
        }
        .fe-split-orient-top .fe-preview-pane {
            order: 0;
        }
        .fe-split-orient-top .fe-split-resizer {
            order: 1;
        }
        .fe-split-orient-top .fe-explorer-main-pane {
            order: 2;
        }
        .fe-split-orient-bottom .fe-explorer-main-pane {
            order: 0;
        }
        .fe-split-orient-bottom .fe-split-resizer {
            order: 1;
        }
        .fe-split-orient-bottom .fe-preview-pane {
            order: 2;
        }
        .fe-split-orient-hscroll .fe-explorer-main-pane {
            order: 0;
            overflow-x: auto;
            overflow-y: hidden;
            flex: 1 1 auto;
            min-height: 64px;
            max-height: 58%;
        }
        .fe-split-orient-hscroll .fe-split-resizer {
            order: 1;
        }
        .fe-split-orient-hscroll .fe-preview-pane {
            order: 2;
        }
        .file-explorer .fe-split-active .explorer-items {
            overscroll-behavior-y: contain;
            overscroll-behavior-x: none;
        }
        .fe-split-orient-hscroll .fe-explorer-main-pane .explorer-items.fe-split-hscroll-strip {
            overscroll-behavior-x: contain;
        }
        .fe-split-resizer {
            flex: 0 0 8px;
            width: 8px;
            align-self: stretch;
            cursor: col-resize;
            touch-action: none;
            user-select: none;
            background: transparent;
            position: relative;
            z-index: 7;
        }
        .fe-split-vertical .fe-split-resizer {
            flex: 0 0 8px;
            width: 100%;
            height: 8px;
            cursor: row-resize;
            align-self: stretch;
        }
        .fe-split-vertical .fe-split-resizer::after {
            top: 50%;
            bottom: auto;
            left: 8px;
            right: 8px;
            width: auto;
            height: 2px;
            transform: translateY(-50%);
        }
        .fe-split-resizer[hidden] {
            display: none !important;
        }
        .fe-split-resizer::after {
            content: '';
            position: absolute;
            top: 0;
            bottom: 0;
            left: 50%;
            transform: translateX(-50%);
            width: 2px;
            border-radius: 2px;
            background: color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 45%, transparent);
            transition: width 0.12s ease, background 0.12s ease;
        }
        .fe-split-resizer:hover::after,
        .fe-split-resizer.fe-split-dragging::after {
            width: 4px;
            background: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 65%, transparent);
        }
        .fe-preview-pane {
            flex: 0 0 auto;
            width: min(38vw, 320px);
            min-width: 200px;
            max-width: 72%;
            min-height: 0;
            flex-shrink: 0;
            display: flex;
            flex-direction: column;
            overflow: hidden;
            border-left: none;
            background: color-mix(in srgb, var(--fe-palette-text, var(--theme-contrast-text)) 5%, transparent);
            box-shadow: inset 1px 0 0 color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 22%, transparent);
        }
        .fe-split-orient-left .fe-preview-pane {
            box-shadow: inset -1px 0 0 color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 22%, transparent);
        }
        /* Los límites 15% archivos / 25% vista previa los aplica JS; quitar min/max del tema por defecto para poder segmentar. */
        .file-explorer .fe-explorer-stage.fe-split-active:not(.fe-split-vertical) .fe-preview-pane {
            min-width: 0;
            max-width: none;
        }
        .fe-split-vertical .fe-preview-pane {
            width: 100% !important;
            min-width: 0 !important;
            max-width: none !important;
        }
        .fe-split-orient-top .fe-preview-pane {
            box-shadow: inset 0 -1px 0 color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 22%, transparent);
        }
        .fe-split-orient-bottom .fe-preview-pane,
        .fe-split-orient-hscroll .fe-preview-pane {
            box-shadow: inset 0 1px 0 color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 22%, transparent);
        }
        .fe-preview-pane[hidden] {
            display: none !important;
        }
        .fe-preview-head {
            flex-shrink: 0;
            position: relative;
            padding: 4px 8px;
            font-size: 12px;
            font-weight: 700;
            border-top: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 18%, transparent);
            border-bottom: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 18%, transparent);
            color: var(--fe-palette-text, var(--theme-contrast-text));
            background: color-mix(in srgb, var(--fe-palette-text, var(--theme-contrast-text)) 7%, transparent);
        }
        .fe-preview-head-titles {
            display: flex;
            flex-direction: column;
            gap: 2px;
            min-width: 0;
        }
        .fe-preview-filename {
            font-size: 11px;
            font-weight: 600;
            opacity: 0.82;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        .fe-preview-toolbar {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            justify-content: center;
            gap: 4px 6px;
            padding: 4px 8px 6px;
            flex-shrink: 0;
            position: relative;
            margin: 0 6px 6px;
            border-radius: 14px;
            border: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 16%, transparent);
            background: linear-gradient(
                165deg,
                color-mix(in srgb, var(--fe-palette-input-bg, #2c2c32) 88%, transparent) 0%,
                color-mix(in srgb, var(--fe-palette-sidebar-bg, #1a1a1f) 92%, transparent) 100%
            );
            backdrop-filter: blur(14px) saturate(1.15);
            -webkit-backdrop-filter: blur(14px) saturate(1.15);
            box-shadow:
                inset 0 1px 0 color-mix(in srgb, #fff 9%, transparent),
                0 6px 20px rgba(0, 0, 0, 0.2),
                0 1px 0 rgba(0, 0, 0, 0.12);
        }
        .fe-preview-tb-sep {
            width: 1px;
            height: 22px;
            align-self: center;
            flex-shrink: 0;
            margin: 0 2px;
            background: linear-gradient(
                180deg,
                transparent,
                color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 45%, transparent) 20%,
                color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 45%, transparent) 80%,
                transparent
            );
            opacity: 0.85;
            border-radius: 1px;
        }
        .fe-preview-tb-btn {
            appearance: none;
            border: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 22%, transparent);
            background: color-mix(in srgb, var(--fe-palette-text, var(--theme-contrast-text)) 10%, transparent);
            color: var(--fe-palette-text, var(--theme-contrast-text));
            border-radius: 11px;
            min-width: 38px;
            min-height: 36px;
            padding: 0 10px;
            cursor: pointer;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 14px;
            line-height: 1;
            transition:
                transform 0.16s ease,
                background 0.16s ease,
                border-color 0.16s ease,
                box-shadow 0.16s ease;
            box-shadow:
                0 1px 0 color-mix(in srgb, #fff 10%, transparent),
                0 2px 6px rgba(0, 0, 0, 0.12);
        }
        .fe-preview-tb-btn:hover {
            background: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 28%, transparent);
            border-color: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 45%, transparent);
            box-shadow:
                0 1px 0 color-mix(in srgb, #fff 12%, transparent),
                0 4px 14px color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 28%, transparent);
            transform: translateY(-1px);
        }
        .fe-preview-tb-btn:active {
            transform: translateY(0);
            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
        }
        .fe-preview-tb-btn:focus-visible {
            outline: 2px solid color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 65%, transparent);
            outline-offset: 2px;
        }
        .fe-preview-body {
            flex: 1 1 0;
            min-height: 0;
            min-width: 0;
            overflow: hidden;
            padding: 0;
            display: flex;
            flex-direction: column;
            align-items: stretch;
            justify-content: center;
            background: #1a1a1a;
            position: relative;
            overscroll-behavior: contain;
        }
        .fe-preview-surface {
            flex: 1 1 auto;
            min-height: 0;
            width: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: auto;
            -webkit-overflow-scrolling: touch;
        }
        .fe-preview-surface--image {
            padding: 0;
            overflow: hidden;
        }
        .fe-preview-image-box {
            position: relative;
            width: 100%;
            height: 100%;
            min-height: 120px;
            overflow: hidden;
            touch-action: none;
            background: color-mix(in srgb, #fff 6%, transparent);
        }
        .fe-preview-img {
            position: absolute;
            left: 50%;
            top: 50%;
            max-width: 95%;
            max-height: 95%;
            width: auto;
            height: auto;
            object-fit: contain;
            transform-origin: center center;
            touch-action: none;
            user-select: none;
            -webkit-user-drag: none;
        }
        .fe-preview-img.fe-preview-img--zoomed {
            max-width: none;
            max-height: none;
            cursor: grab;
        }
        .fe-preview-surface--media .fe-preview-video {
            max-width: 100%;
            max-height: 100%;
            width: auto;
            height: auto;
            object-fit: contain;
            background: #000;
            border-radius: 8px;
        }
        .fe-preview-surface--audio {
            flex-direction: column;
            gap: 12px;
            padding: 12px;
            box-sizing: border-box;
            justify-content: center;
        }
        .fe-preview-audio-el {
            width: 100%;
            min-width: 0;
            max-width: 100%;
        }
        .fe-preview-content-root--pdf {
            flex: 1 1 auto;
            min-height: 0;
            width: 100%;
            display: flex;
            flex-direction: column;
            overflow: hidden;
        }
        .file-explorer .fe-preview-body .pdf-canvas-root {
            width: 100% !important;
            flex: 1 1 auto !important;
            min-height: 0 !important;
            align-self: stretch !important;
            position: relative;
        }
        .file-explorer .fe-preview-body .pdf-canvas-scroll-wrap {
            flex: 1 1 auto;
            min-height: 0;
            min-width: 0;
        }
        /* Modal: .pdf-zoom-hud es fixed al viewport; en el panel dividido tapaba cabecera/barra del preview. */
        .file-explorer .fe-preview-body .pdf-zoom-hud {
            position: absolute;
            top: 8px;
            right: 8px;
            left: auto;
            bottom: auto;
            transform: none;
            max-width: min(168px, calc(100% - 16px));
        }
        .fe-preview-surface--office {
            padding: 0;
            overflow: hidden;
            align-items: stretch;
            justify-content: stretch;
        }
        .fe-preview-surface--office iframe {
            flex: 1 1 auto;
            min-height: 0;
            width: 100%;
            height: 100%;
            border: 0;
            background: #fff;
        }
        .fe-preview-surface--html {
            padding: 0;
            overflow: hidden;
            align-items: stretch;
            justify-content: stretch;
        }
        .fe-preview-surface--html .fe-preview-html-frame {
            flex: 1 1 auto;
            min-height: 0;
            width: 100%;
            height: 100%;
            border: 0;
            background: #fff;
        }
        .fe-preview-tb-btn.fe-preview-tb-btn--active {
            background: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 22%, transparent);
            color: var(--fe-palette-accent, #0a84ff);
        }
        .fe-preview-surface--text {
            flex-direction: column;
            align-items: stretch;
            align-content: flex-start;
            justify-content: flex-start;
            padding: 8px;
            box-sizing: border-box;
            background: #fff;
            color: #000;
        }
        .fe-preview-surface--text .fe-preview-text {
            max-height: none !important;
            flex: 1 1 auto;
            min-height: 0;
            margin: 0;
            white-space: pre-wrap;
            word-wrap: break-word;
            font-family: ui-monospace, monospace;
            font-size: 12px;
            line-height: 1.45;
            color: #000;
            background: transparent;
        }
        #previewContent.preview-text-plain-host {
            flex-direction: column !important;
            align-items: stretch !important;
            justify-content: flex-start !important;
            overflow: auto !important;
            -webkit-overflow-scrolling: touch;
        }
        #previewContent.preview-text-plain-host,
        #previewContent.preview-text-plain-host .preview-text-plain-pre {
            background: #fff !important;
            color: #000 !important;
        }
        #previewContent .preview-text-plain-pre {
            flex: 1 1 auto;
            min-height: min(40vh, 280px);
            width: 100%;
            margin: 0;
            box-sizing: border-box;
            padding: 12px;
            white-space: pre-wrap;
            word-wrap: break-word;
            overflow: auto;
            font-family: ui-monospace, monospace;
            font-size: 13px;
            line-height: 1.45;
            -webkit-overflow-scrolling: touch;
        }
        .fe-preview-media {
            max-width: 100%;
            width: auto;
            height: auto;
            max-height: min(55vh, 360px);
            object-fit: contain;
            border-radius: 8px;
        }
        .fe-preview-iframe {
            width: 100%;
            min-height: 240px;
            height: 100%;
            border: 0;
            border-radius: 8px;
            background: #fff;
        }
        .fe-preview-text {
            width: 100%;
            margin: 0;
            padding: 8px;
            font-size: 11px;
            line-height: 1.45;
            white-space: pre-wrap;
            word-break: break-word;
            max-height: min(50vh, 360px);
            overflow: auto;
            background: color-mix(in srgb, var(--fe-palette-text, var(--theme-contrast-text)) 6%, transparent);
            border-radius: 8px;
            color: var(--fe-palette-text, var(--theme-contrast-text));
        }
        .fe-preview-fallback {
            text-align: center;
            font-size: 12px;
            color: var(--fe-palette-muted, var(--theme-contrast-muted));
            padding: 12px;
        }
        .fe-preview-meta {
            margin-top: 8px;
            font-size: 11px;
            opacity: 0.85;
        }
        .fe-preview-audio-wrap {
            width: 100%;
            text-align: center;
        }
        .fe-preview-audio-ico {
            font-size: 36px;
            opacity: 0.6;
            display: block;
            margin-bottom: 10px;
        }
        .fe-properties-panel {
            width: 268px;
            max-width: 40vw;
            flex-shrink: 0;
            display: flex;
            flex-direction: column;
            border-left: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 22%, transparent);
            background: color-mix(in srgb, var(--fe-palette-text, var(--theme-contrast-text)) 7%, transparent);
        }
        .fe-properties-panel[hidden] {
            display: none !important;
        }
        .fe-properties-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 8px 10px;
            font-size: 12px;
            font-weight: 700;
            border-bottom: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 18%, transparent);
            color: var(--fe-palette-text, var(--theme-contrast-text));
        }
        .fe-properties-close {
            border: none;
            background: transparent;
            font-size: 20px;
            line-height: 1;
            cursor: pointer;
            color: inherit;
            opacity: 0.75;
            padding: 2px 6px;
        }
        .fe-properties-close:hover {
            opacity: 1;
        }
        .fe-properties-body {
            flex: 1;
            overflow: auto;
            padding: 10px 12px;
            font-size: 12px;
        }
        .fe-prop-row {
            display: grid;
            grid-template-columns: 92px 1fr;
            gap: 8px;
            margin-bottom: 10px;
            align-items: start;
        }
        .fe-prop-k {
            color: var(--fe-palette-muted, var(--theme-contrast-muted));
            font-weight: 600;
        }
        .fe-prop-v {
            word-break: break-word;
            color: var(--fe-palette-text, var(--theme-contrast-text));
        }
        .fe-properties-empty {
            opacity: 0.75;
            font-size: 12px;
        }
        .fe-view-menu-wrap {
            position: relative;
        }
        .fe-view-menu-dropdown {
            position: absolute;
            top: calc(100% + 4px);
            left: 0;
            z-index: 80;
            min-width: 240px;
            max-height: min(70vh, 420px);
            overflow-y: auto;
            padding: 6px;
            border-radius: 12px;
            border: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 22%, transparent);
            background: var(--fe-palette-input-bg, var(--neumorphic-bg, #fff));
            box-shadow: 0 10px 28px rgba(0, 0, 0, 0.18);
        }
        .fe-view-menu-dropdown[hidden] {
            display: none !important;
        }
        .fe-view-menu-item {
            display: block;
            width: 100%;
            text-align: left;
            padding: 8px 10px;
            border: none;
            border-radius: 8px;
            background: transparent;
            color: var(--fe-palette-text, var(--theme-contrast-text));
            font-size: 13px;
            cursor: pointer;
        }
        .fe-view-menu-item:hover {
            background: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 14%, transparent);
        }
        .fe-view-menu-item-current {
            font-weight: 700;
            background: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 12%, transparent);
        }
        .file-explorer .fe-toolbar .fe-properties-btn.active {
            background: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 22%, transparent);
            border-color: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 45%, transparent);
        }
        .fe-items-empty-msg {
            grid-column: 1 / -1;
            padding: 12px;
            opacity: 0.72;
        }
        .explorer-items.explorer-items-details {
            display: flex !important;
            flex-direction: column;
            gap: 4px;
            padding: 4px 6px 8px;
            align-content: stretch;
            overflow-x: auto;
            overflow-y: auto;
            -webkit-overflow-scrolling: touch;
        }
        .fe-details-header {
            display: grid;
            align-items: center;
            gap: 8px;
            padding: 8px 8px 10px;
            position: sticky;
            top: 0;
            z-index: 4;
            background: color-mix(in srgb, var(--fe-palette-item-bg, var(--theme-contrast-text)) 98%, transparent);
            border-bottom: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 24%, transparent);
            font-size: 11px;
            min-width: min(720px, 100%);
        }
        .explorer-items.explorer-items-details .fe-details-header,
        .explorer-items.explorer-items-details .fe-details-row {
            grid-template-columns: 44px minmax(120px, 2fr) minmax(100px, 1.2fr) 88px minmax(108px, 1fr) minmax(40px, 0.5fr);
        }
        .fe-detail-corner {
            min-width: 0;
        }
        .fe-details-sort-label {
            display: inline;
            border: none;
            background: transparent;
            padding: 0;
            margin: 0;
            font: inherit;
            font-weight: 700;
            cursor: default;
            color: inherit;
            text-align: left;
            outline: none;
        }
        .fe-details-sort-label:hover {
            text-decoration: underline;
            text-underline-offset: 2px;
        }
        .fe-detail-h-static {
            font-weight: 700;
            opacity: 0.85;
        }
        .fe-details-row {
            display: grid;
            align-items: center;
            gap: 8px;
            min-height: 44px;
            min-width: min(720px, 100%);
        }
        .explorer-items.explorer-items-details .explorer-item-thumb {
            width: 40px;
            height: 40px;
            min-width: 40px;
            min-height: 40px;
            max-width: 40px;
            max-height: 40px;
            margin: 0;
            border-radius: 8px;
            flex-shrink: 0;
            align-self: center;
        }
        .explorer-items.explorer-items-details .explorer-item-thumb img,
        .explorer-items.explorer-items-details .explorer-item-thumb video {
            object-fit: contain;
            object-position: center;
        }
        .fe-detail-cell {
            font-size: 12px;
            min-width: 0;
            overflow: hidden;
            text-overflow: ellipsis;
        }
        .explorer-items.explorer-items-content {
            display: grid !important;
            grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
            gap: 10px;
            align-content: start;
        }
        .explorer-item-content-meta {
            display: flex;
            flex-direction: column;
            gap: 4px;
            min-width: 0;
        }
        .explorer-item-snippet {
            font-size: 11px;
            opacity: 0.8;
            line-height: 1.35;
            max-height: 3.2em;
            overflow: hidden;
        }
        .explorer-tile-meta {
            font-size: 11px;
            opacity: 0.85;
        }
        .file-explorer .explorer-items.fe-vm-icons-xl {
            grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)) !important;
        }
        .file-explorer .explorer-items.fe-vm-icons-lg,
        .file-explorer .explorer-items.fe-vm-multimedia {
            grid-template-columns: repeat(auto-fill, minmax(168px, 1fr)) !important;
        }
        .file-explorer .explorer-items.fe-vm-icons-md {
            grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)) !important;
        }
        .file-explorer .explorer-items.fe-vm-icons-sm {
            grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)) !important;
        }
        .file-explorer .explorer-items.fe-split-hscroll-strip:not(.explorer-items-list):not(.explorer-items-details):not(.explorer-items-content) {
            display: flex !important;
            flex-flow: row nowrap;
            align-items: stretch;
            gap: 8px;
            padding: 8px 10px;
            overflow-x: auto;
            overflow-y: hidden;
            grid-template-columns: none !important;
            width: max-content;
            min-width: 100%;
            box-sizing: border-box;
        }
        .file-explorer .explorer-items.fe-split-hscroll-strip .explorer-item {
            flex: 0 0 auto;
            width: 92px;
            min-width: 80px;
            max-width: 120px;
        }
        .file-explorer .explorer-items.fe-split-hscroll-strip .explorer-item-name {
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
            text-align: center;
            font-size: 11px;
            line-height: 1.2;
        }
        .file-explorer .explorer-items.fe-vm-tiles {
            grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)) !important;
        }
        .explorer-items .explorer-item-thumb.fe-thumb-xl {
            max-height: 220px;
        }
        .explorer-items .explorer-item-thumb.fe-thumb-lg {
            max-height: 160px;
        }
        .explorer-items .explorer-item-thumb.fe-thumb-md {
            max-height: 120px;
        }
        .explorer-items .explorer-item-thumb.fe-thumb-sm {
            max-height: 72px;
        }
        .explorer-items .explorer-item-thumb.fe-thumb-content {
            max-height: 120px;
        }
        .explorer-items .explorer-item-thumb.fe-thumb-tile {
            max-height: 128px;
        }
        .fe-thumb-folder-ico {
            font-size: 28px;
            opacity: 0.75;
        }
        .explorer-item-thumb-shared {
            display: flex;
            align-items: center;
            justify-content: center;
            background: rgba(255, 255, 255, 0.06);
            border: 1px solid rgba(255, 255, 255, 0.12);
            border-radius: 10px;
        }
        .fe-thumb-shared-ico {
            font-size: 30px;
            opacity: 0.9;
        }
        .explorer-item-thumb-shared-community .fe-thumb-shared-ico {
            color: #8ec5ff;
        }
        .explorer-item-thumb-shared-files .fe-thumb-shared-ico {
            color: #9fd6b8;
        }
        .explorer-item-thumb-shared-department .fe-thumb-shared-ico {
            color: #c9b8ff;
        }
        .explorer-item-shared-shortcut .explorer-item-sub {
            opacity: 0.82;
        }
        .fe-vm-icons-sm .fe-thumb-shared-ico {
            font-size: 22px;
        }
        .fe-vm-icons-xl .fe-thumb-shared-ico {
            font-size: 42px;
        }
        .fe-vm-icons-sm .fe-thumb-folder-ico,
        .fe-vm-icons-sm .fe-thumb-fallback-ico {
            font-size: 22px;
        }
        .fe-vm-icons-xl .fe-thumb-folder-ico,
        .fe-vm-icons-xl .fe-thumb-fallback-ico {
            font-size: 42px;
        }
        .fe-thumb-fallback-ico {
            font-size: 28px;
            opacity: 0.75;
        }
        .explorer-items.fe-vm-compact .explorer-item {
            min-height: 36px;
            padding: 6px 10px 6px 8px;
            margin-bottom: 2px;
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 10px;
        }
        .explorer-items.fe-vm-compact .explorer-item-thumb {
            width: 32px;
            height: 32px;
            min-width: 32px;
            min-height: 32px;
            max-width: 32px;
            max-height: 32px;
            margin-bottom: 0;
            flex-shrink: 0;
        }
        .explorer-items.fe-vm-compact .explorer-item-thumb img,
        .explorer-items.fe-vm-compact .explorer-item-thumb video {
            object-fit: contain;
        }
        .explorer-items.fe-vm-compact .explorer-item-meta {
            flex: 1;
            min-width: 0;
            display: flex;
            align-items: center;
            gap: 10px;
            flex-wrap: nowrap;
        }
        .explorer-items.fe-vm-compact .explorer-item-name {
            font-size: 12px;
            min-width: 0;
            flex: 1 1 120px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        .explorer-items.fe-vm-compact .explorer-item-sub {
            display: none;
        }
        .explorer-items.fe-vm-compact .explorer-col-size {
            width: 76px;
            flex-shrink: 0;
            font-size: 11px;
            text-align: right;
        }
        .explorer-items.fe-vm-compact .explorer-col-date {
            width: min(128px, 28vw);
            flex-shrink: 0;
            font-size: 11px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
        @media (max-width: 720px) {
            .fe-items-wrap {
                flex-direction: column;
            }
            .fe-explorer-stage:not(.fe-split-active) {
                flex-direction: column;
                min-height: 200px;
            }
            .fe-explorer-stage.fe-split-active {
                min-height: min(52vh, 420px);
            }
            .fe-preview-pane {
                width: 100% !important;
                min-width: 0;
                max-width: none !important;
                max-height: 40vh;
                border-left: none;
                box-shadow: none;
                border-top: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 22%, transparent);
            }
            .fe-explorer-stage.fe-split-active.fe-split-vertical .fe-preview-pane {
                max-height: none;
            }
            .fe-properties-panel {
                width: 100%;
                max-width: none;
                max-height: 38vh;
                border-left: none;
                border-top: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 22%, transparent);
            }
        }
        .fe-busy-overlay {
            position: absolute;
            inset: 0;
            z-index: 10;
            display: flex;
            align-items: center;
            justify-content: center;
            background: color-mix(in srgb, rgba(0,0,0,0.25) 70%, transparent);
            backdrop-filter: blur(2px);
        }
        .fe-busy-card {
            display: flex;
            flex-direction: column;
            align-items: stretch;
            gap: 0;
            padding: 10px 14px;
            border-radius: 12px;
            border: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 18%, transparent);
            background: color-mix(in srgb, var(--fe-palette-input-bg, var(--neumorphic-bg, #fff)) 92%, transparent);
            color: var(--fe-palette-text, var(--theme-contrast-text));
            box-shadow: 0 8px 24px rgba(0,0,0,0.18);
        }
        .fe-busy-spinner {
            width: 16px;
            height: 16px;
            border-radius: 999px;
            border: 2px solid color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 35%, transparent);
            border-top-color: var(--fe-palette-accent, #0a84ff);
            animation: feSpin 0.9s linear infinite;
        }
        .fe-busy-text {
            font-size: 13px;
            font-weight: 700;
            opacity: 0.9;
        }
        .fe-busy-main {
            display: flex;
            align-items: center;
            gap: 10px;
        }
        .fe-busy-cancel-btn {
            margin-top: 8px;
            width: 100%;
            padding: 8px 12px;
            border-radius: 8px;
            border: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 22%, transparent);
            background: color-mix(in srgb, var(--fe-palette-input-bg, var(--neumorphic-bg, #fff)) 88%, transparent);
            color: var(--fe-palette-text, var(--theme-contrast-text));
            font-size: 13px;
            font-weight: 600;
            cursor: pointer;
        }
        .fe-busy-cancel-btn:hover {
            filter: brightness(1.06);
        }
        .fe-root.fe-busy .fe-path-row,
        .fe-root.fe-busy .fe-sidebar {
            pointer-events: none;
            opacity: 0.92;
        }
        @keyframes feSpin {
            to { transform: rotate(360deg); }
        }
        .fe-marquee {
            position: absolute;
            border: 1px dashed color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 85%, transparent);
            background: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 12%, transparent);
            pointer-events: none;
            z-index: 5;
        }
        .explorer-item.explorer-item-selected {
            outline: 2px solid color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 85%, transparent);
            background-color: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 12%, transparent);
        }
        .explorer-item.explorer-item-pending-cut {
            opacity: 0.5;
            outline: 1px dashed rgba(255, 159, 10, 0.85);
        }
        .explorer-item-pathline {
            font-size: 11px;
            opacity: 0.82;
            line-height: 1.3;
            word-break: break-word;
        }
        .file-explorer .explorer-items:not(.explorer-items-list):not(.explorer-items-details):not(.explorer-items-content) {
            display: grid !important;
            grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
            grid-auto-rows: min-content;
            align-content: start;
        }
        .file-explorer .explorer-items:not(.explorer-items-list):not(.explorer-items-details):not(.explorer-items-content) .explorer-item {
            flex-direction: column;
            align-items: stretch;
        }
        .file-explorer .explorer-items:not(.explorer-items-list):not(.explorer-items-details):not(.explorer-items-content) .explorer-item-meta {
            display: none;
        }
        .file-explorer .explorer-items:not(.explorer-items-list):not(.explorer-items-details):not(.explorer-items-content) .explorer-col-size,
        .file-explorer .explorer-items:not(.explorer-items-list):not(.explorer-items-details):not(.explorer-items-content) .explorer-col-date {
            display: none;
        }
        .fe-toolbar-search-cluster {
            margin-left: auto;
            display: flex;
            align-items: center;
            gap: 4px;
            flex-wrap: wrap;
            flex-shrink: 0;
        }
        .fe-search-wrap {
            position: relative;
            display: flex;
            align-items: center;
            flex: 0 1 auto;
            min-width: 0;
        }
        .fe-search-input {
            min-width: 140px;
            max-width: 220px;
            padding: 6px 10px;
            border-radius: 8px;
            border: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 22%, transparent);
            font-size: 13px;
            background: var(--fe-palette-input-bg, var(--neumorphic-bg, #fff));
            color: var(--fe-palette-text, var(--theme-contrast-text));
        }
        .fe-search-clear {
            flex-shrink: 0;
            appearance: none;
            align-self: center;
            min-height: auto;
            height: auto;
            padding: 4px 7px;
            border: none;
            border-radius: 6px;
            background: transparent;
            color: var(--fe-fg-muted, var(--fe-palette-muted, var(--theme-contrast-muted)));
            cursor: pointer;
            display: none;
            align-items: center;
            justify-content: center;
            font-size: 11px;
            font-weight: 600;
            line-height: 1.25;
            opacity: 0.78;
        }
        .fe-search-clear:hover {
            opacity: 1;
            background: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 12%, transparent);
        }
        .fe-search-clear.visible {
            display: inline-flex;
        }
        .fe-root.fe-searching .fe-search-input {
            opacity: 0.85;
        }
        .fe-search-hint {
            font-size: 11px;
            max-width: 200px;
            color: var(--fe-palette-muted, var(--theme-contrast-muted));
        }
        .file-gallery-root {
            display: flex;
            flex-direction: column;
            height: 100%;
            min-height: 0;
            background: #111;
        }
        .file-gallery-main {
            flex: 1;
            min-height: 0;
            display: flex;
            align-items: center;
            justify-content: center;
            position: relative;
            background: #0a0a0a;
        }
        .file-gallery-main img,
        .file-gallery-main video {
            max-width: 100%;
            max-height: 100%;
            object-fit: contain;
        }
        .file-gallery-image-wrap {
            position: absolute;
            inset: 0;
            overflow: hidden;
            touch-action: none;
        }
        .file-gallery-zoom-img {
            position: absolute;
            left: 50%;
            top: 50%;
            max-width: 95%;
            max-height: 95%;
            width: auto;
            height: auto;
            object-fit: contain;
            transform-origin: center center;
            transform: translate(-50%, -50%) scale(1);
            transition: transform 0.1s ease;
            user-select: none;
            -webkit-user-drag: none;
            touch-action: none;
        }
        .file-gallery-zoom-img.zoomed {
            cursor: grabbing;
            max-width: none;
            max-height: none;
        }
        .file-gallery-nav {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            width: 44px;
            height: 44px;
            border-radius: 50%;
            border: none;
            background: rgba(255,255,255,0.12);
            color: #fff;
            cursor: pointer;
            z-index: 2;
            font-size: 18px;
        }
        .file-gallery-nav:hover { background: rgba(255,255,255,0.22); }
        .file-gallery-prev { left: 12px; }
        .file-gallery-next { right: 12px; }
        .file-gallery-thumbs {
            display: flex;
            gap: 6px;
            padding: 8px;
            overflow-x: auto;
            flex-shrink: 0;
            background: rgba(0,0,0,0.45);
            border-top: 1px solid rgba(255,255,255,0.08);
        }
        .file-gallery-thumb {
            flex: 0 0 72px;
            height: 52px;
            border-radius: 8px;
            overflow: hidden;
            cursor: pointer;
            border: 2px solid transparent;
            opacity: 0.75;
            transition: opacity 0.15s ease, border-color 0.15s ease;
            background: #222;
        }
        .file-gallery-thumb:hover { opacity: 1; }
        .file-gallery-thumb.active {
            border-color: #0a84ff;
            opacity: 1;
        }
        .file-gallery-thumb img,
        .file-gallery-thumb video {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
        .explorer-items.explorer-items-list {
            display: block !important;
            overflow-y: auto;
            height: 100%;
            padding: 4px 8px;
        }
        .explorer-items.explorer-items-list .explorer-item {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 12px;
            width: 100%;
            margin-bottom: 4px;
            min-height: 44px;
        }
        .explorer-items.explorer-items-list .explorer-item-thumb {
            width: 40px;
            height: 40px;
            min-width: 40px;
            min-height: 40px;
            max-width: 40px;
            max-height: 40px;
            margin-bottom: 0;
            flex-shrink: 0;
        }
        .explorer-items.explorer-items-list .explorer-item-thumb img,
        .explorer-items.explorer-items-list .explorer-item-thumb video {
            object-fit: contain;
            object-position: center;
        }
        .explorer-items.explorer-items-list .explorer-item-meta {
            flex: 1;
            display: flex;
            align-items: center;
            gap: 12px;
            min-width: 0;
            flex-wrap: nowrap;
        }
        .explorer-items.explorer-items-list .explorer-item-name {
            min-width: 0;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        .explorer-items.explorer-items-list:not(.fe-vm-compact) .explorer-item-pathline {
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
        .explorer-items.explorer-items-list:not(.fe-vm-compact) .explorer-item-meta > div:first-child {
            flex: 1 1 auto;
            min-width: 0;
        }
        .explorer-items.explorer-items-list .explorer-col-size {
            width: 88px;
            text-align: right;
            font-size: 12px;
            color: var(--fe-palette-muted, var(--theme-contrast-muted));
        }
        .explorer-items.explorer-items-list .explorer-col-date {
            width: 140px;
            font-size: 12px;
            color: var(--fe-palette-muted, var(--theme-contrast-muted));
        }
        .explorer-items.explorer-items-list[data-fe-split-adaptive="md"] .explorer-col-date {
            width: 100px;
            font-size: 11px;
        }
        .explorer-items.explorer-items-list[data-fe-split-adaptive="sm"] .explorer-col-date {
            display: none;
        }
        .explorer-items.explorer-items-list[data-fe-split-adaptive="sm"] .explorer-col-size {
            width: 72px;
            font-size: 11px;
        }
        .explorer-items.explorer-items-list[data-fe-split-adaptive="sm"] .explorer-item-name {
            font-size: 12px;
        }
        .explorer-items.explorer-items-list[data-fe-split-adaptive="xs"] .explorer-item-meta {
            display: none !important;
        }
        .explorer-items.explorer-items-list[data-fe-split-adaptive="xs"] .explorer-col-size,
        .explorer-items.explorer-items-list[data-fe-split-adaptive="xs"] .explorer-col-date,
        .explorer-items.explorer-items-list[data-fe-split-adaptive="xs"] .explorer-item-name {
            display: none !important;
        }
        .explorer-items.explorer-items-list[data-fe-split-adaptive="xs"] .explorer-item {
            justify-content: center;
            width: 100%;
            min-width: 0;
            padding: 6px 4px;
        }
        .explorer-items.explorer-items-list[data-fe-split-adaptive="xs"] .explorer-item-thumb {
            width: 32px;
            height: 32px;
            min-width: 32px;
            min-height: 32px;
            max-width: 32px;
            max-height: 32px;
        }
        /* Vista dividida: panel de archivos muy estrecho → mosaico con título (se quita al ampliar). */
        .file-explorer .fe-split-active .explorer-items[data-fe-split-mosaic="1"] {
            display: grid !important;
            grid-template-columns: repeat(auto-fill, minmax(76px, 1fr)) !important;
            gap: 8px 6px;
            align-content: start;
            grid-auto-rows: minmax(0, auto);
        }
        .file-explorer .fe-split-active .explorer-items[data-fe-split-mosaic="1"] .explorer-item {
            display: flex !important;
            flex-direction: column !important;
            align-items: center;
            justify-content: flex-start;
            width: 100% !important;
            min-width: 0;
            min-height: 0;
            margin: 0;
            padding: 6px 4px;
            text-align: center;
            box-sizing: border-box;
        }
        .file-explorer .fe-split-active .explorer-items[data-fe-split-mosaic="1"] .explorer-item-thumb {
            width: 44px !important;
            height: 44px !important;
            min-width: 44px !important;
            min-height: 44px !important;
            max-width: 56px !important;
            max-height: 56px !important;
            margin: 0 auto 4px;
            flex-shrink: 0;
        }
        .file-explorer .fe-split-active .explorer-items[data-fe-split-mosaic="1"] .explorer-item-name {
            display: -webkit-box !important;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
            width: 100%;
            font-size: 11px;
            line-height: 1.25;
            text-align: center;
            white-space: normal;
        }
        .file-explorer .fe-split-active .explorer-items[data-fe-split-mosaic="1"] .explorer-item-meta,
        .file-explorer .fe-split-active .explorer-items[data-fe-split-mosaic="1"] .explorer-item-sub,
        .file-explorer .fe-split-active .explorer-items[data-fe-split-mosaic="1"] .explorer-col-size,
        .file-explorer .fe-split-active .explorer-items[data-fe-split-mosaic="1"] .explorer-col-date,
        .file-explorer .fe-split-active .explorer-items[data-fe-split-mosaic="1"] .fe-details-sort-label {
            display: none !important;
        }
        .file-explorer .fe-split-active .explorer-items[data-fe-split-mosaic="1"] .fe-details-header {
            display: none !important;
        }
        .file-explorer .fe-split-active .explorer-items[data-fe-split-mosaic="1"].explorer-items-list .explorer-item {
            flex-direction: column !important;
            align-items: center;
        }
        .file-explorer .fe-split-active .explorer-items[data-fe-split-mosaic="1"].explorer-items-details .explorer-item {
            display: flex !important;
            flex-direction: column !important;
        }
        .fe-back-btn:disabled,
        .fe-fwd-btn:disabled {
            opacity: 0.35;
            cursor: not-allowed;
        }
        .explorer-toolbar {
            display: flex;
            gap: 10px;
            flex-wrap: wrap;
            align-items: center;
            margin-bottom: 10px;
        }
        @media (min-width: 769px) {
            .fe-toolbar-actions-cluster {
                display: contents;
            }
            .fe-toolbar-more-btn,
            .fe-toolbar-pin-btn {
                display: none !important;
            }
        }
        /* Botones del explorador: mismo lenguaje visual que el tema (sin relieve neumórfico global) */
        .file-explorer .fe-toolbar button {
            background: color-mix(in srgb, var(--fe-palette-text, var(--theme-contrast-text)) 7%, transparent);
            color: var(--fe-palette-text, var(--theme-contrast-text));
            border: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 18%, transparent);
            box-shadow: none;
            text-shadow: 0 1px 2px var(--theme-contrast-shadow);
            min-height: var(--shell-btn-min-h);
            padding: 5px 10px;
        }
        .file-explorer .fe-toolbar button:hover {
            background: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 16%, transparent);
            box-shadow: none;
        }
        .file-explorer .fe-toolbar button:active {
            box-shadow: none;
        }
        .file-explorer .fe-toolbar .explorer-trash-toggle-btn.active {
            background: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 26%, transparent);
            border-color: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 45%, transparent);
            color: var(--fe-palette-accent, #0a84ff);
        }
        .file-explorer .fe-toolbar .fe-multi-select-btn.active {
            background: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 26%, transparent);
            border-color: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 45%, transparent);
            color: var(--fe-palette-accent, #0a84ff);
        }
        .file-explorer .fe-toolbar .fe-selection-pill {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            padding: 6px 10px;
            border-radius: 999px;
            border: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 20%, transparent);
            background: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 16%, transparent);
            color: var(--fe-palette-text, var(--theme-contrast-text));
            font-weight: 700;
            font-size: 12px;
            line-height: 1;
            user-select: none;
        }
        .file-explorer .fe-toolbar .fe-selection-pill[hidden] {
            display: none !important;
        }
        .file-explorer .fe-toolbar .fe-selection-exit {
            min-width: 32px;
            min-height: 32px;
            padding: 0;
            border-radius: 999px;
            border: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 20%, transparent);
            background: color-mix(in srgb, var(--fe-palette-text, var(--theme-contrast-text)) 10%, transparent);
            color: var(--fe-palette-text, var(--theme-contrast-text));
            text-shadow: none;
            font-size: 18px;
            line-height: 1;
        }
        .file-explorer .fe-toolbar .fe-selection-exit:hover {
            background: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 20%, transparent);
        }
        .file-explorer .fe-toolbar button.fe-search-clear {
            min-height: unset;
            min-width: unset;
            padding: 4px 7px;
            font-size: 11px;
            font-weight: 600;
            line-height: 1.25;
            border: none;
            background: transparent;
            box-shadow: none;
            text-shadow: none;
        }
        .file-explorer .fe-toolbar button.fe-search-clear:hover {
            box-shadow: none;
        }
        .explorer-path {
            font-size: 12px;
            font-weight: 700;
            color: var(--fe-palette-text, var(--theme-contrast-text));
            flex: 1;
            min-width: 200px;
        }
        .file-explorer .explorer-items {
            position: relative;
            overflow: auto;
            flex: 1;
            min-height: 0;
            min-width: 0;
            height: 100%;
            padding-right: 6px;
            display: grid !important;
            grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
            grid-auto-rows: min-content;
            align-content: start;
            align-items: start;
            gap: 10px;
        }
        /* Prioridad sobre la regla anterior: detalles/documentos y lista no son rejilla de iconos */
        .file-explorer .explorer-items.explorer-items-details {
            display: flex !important;
            flex-direction: column !important;
            grid-template-columns: none !important;
            grid-auto-rows: unset !important;
            align-items: stretch !important;
            gap: 4px !important;
        }
        .file-explorer .explorer-items.explorer-items-details > .fe-details-header,
        .file-explorer .explorer-items.explorer-items-details > .explorer-item.fe-details-row {
            display: grid !important;
            width: 100% !important;
            max-width: 100% !important;
            box-sizing: border-box !important;
        }
        .file-explorer .explorer-items.explorer-items-list {
            display: block !important;
            grid-template-columns: none !important;
            grid-auto-rows: unset !important;
            align-items: unset !important;
        }
        .file-explorer .explorer-items.explorer-items-content {
            display: grid !important;
            grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)) !important;
            align-items: start !important;
        }
        .explorer-item {
            background-color: var(--fe-palette-item-bg, color-mix(in srgb, var(--fe-palette-text, var(--theme-contrast-text)) 11%, transparent));
            border: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 22%, transparent);
            border-radius: 14px;
            padding: 10px;
            position: relative;
            cursor: pointer;
            outline: none;
            transition: transform 0.12s ease, background-color 0.12s ease, box-shadow 0.15s ease, border-color 0.15s ease;
            user-select: none;
            min-width: 0;
            width: 100%;
            box-sizing: border-box;
        }
        .explorer-item-menu-btn {
            position: absolute;
            top: 4px;
            right: 4px;
            width: 16px;
            height: 16px;
            min-width: 16px;
            min-height: 16px;
            padding: 0;
            margin: 0;
            box-sizing: border-box;
            border: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 28%, transparent);
            border-radius: 999px;
            background: color-mix(in srgb, var(--fe-palette-text, var(--theme-contrast-text)) 16%, transparent);
            color: var(--fe-palette-text, var(--theme-contrast-text));
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 8px;
            line-height: 1;
            cursor: pointer;
            opacity: 0;
            transition: opacity 0.12s ease, background-color 0.12s ease, border-color 0.12s ease;
            z-index: 2;
        }
        .explorer-item-menu-btn i {
            font-size: 7px;
            line-height: 1;
            margin: 0;
            padding: 0;
            display: block;
        }
        .explorer-item:hover .explorer-item-menu-btn,
        .explorer-item:focus-within .explorer-item-menu-btn {
            opacity: 1;
        }
        @media (hover: none) and (pointer: coarse) {
            .explorer-item .explorer-item-menu-btn {
                opacity: 1;
            }
        }
        .explorer-item-menu-btn:hover {
            background: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 22%, transparent);
            border-color: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 45%, transparent);
        }
        .explorer-items.explorer-items-list .explorer-item-menu-btn {
            top: 50%;
            right: 6px;
            transform: translateY(-50%);
        }
        .explorer-item.explorer-dragging {
            opacity: 0.55;
        }
        .explorer-item.explorer-drop-target {
            outline: 2px dashed rgba(0, 122, 255, 0.85);
            background-color: rgba(0, 122, 255, 0.12);
        }
        .explorer-path.explorer-drop-parent {
            outline: 2px dashed rgba(0, 200, 120, 0.75);
            border-radius: 8px;
            padding: 4px 6px;
        }
        .explorer-up-btn.explorer-drop-parent {
            outline: 2px dashed rgba(0, 200, 120, 0.75);
        }
        .explorer-item:hover {
            transform: scale(1.01);
            background-color: color-mix(in srgb, var(--fe-palette-accent, #0a84ff) 14%, transparent);
        }
        .explorer-item:focus {
            box-shadow: var(--focus-glow);
        }
        .explorer-item-thumb {
            width: 100%;
            height: 96px;
            border-radius: 12px;
            overflow: hidden;
            background: color-mix(in srgb, var(--fe-palette-text, var(--theme-contrast-text)) 9%, transparent);
            display: flex;
            align-items: center;
            justify-content: center;
            margin-bottom: 8px;
        }
        .explorer-item-thumb img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            -webkit-user-drag: none;
            user-select: none;
        }
        .explorer-item-thumb video {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
            -webkit-user-drag: none;
            user-select: none;
        }
        /* Sobrescribe la regla base anterior: rejilla de iconos con proporción estable */
        .file-explorer .explorer-items:not(.explorer-items-list):not(.explorer-items-details) .explorer-item .explorer-item-thumb {
            height: auto !important;
            aspect-ratio: 1;
            max-height: 240px;
        }
        .file-explorer .explorer-items:not(.explorer-items-list):not(.explorer-items-details) .explorer-item .explorer-item-thumb img,
        .file-explorer .explorer-items:not(.explorer-items-list):not(.explorer-items-details) .explorer-item .explorer-item-thumb video {
            object-fit: contain !important;
            object-position: center;
        }
        .explorer-drag-preview {
            width: 132px;
            height: 110px;
            border-radius: 14px;
            background: rgba(30, 30, 30, 0.72);
            border: 1px solid rgba(255,255,255,0.18);
            box-shadow: 0 10px 26px rgba(0,0,0,0.35);
            backdrop-filter: blur(8px);
            -webkit-backdrop-filter: blur(8px);
            overflow: hidden;
            position: fixed;
            left: -9999px;
            top: -9999px;
            z-index: 999999;
            pointer-events: none;
        }
        .explorer-drag-preview-grid {
            position: absolute;
            left: 10px;
            top: 10px;
            width: 88px;
            height: 88px;
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            grid-template-rows: repeat(2, 1fr);
            gap: 6px;
        }
        .explorer-drag-preview-cell {
            border-radius: 10px;
            overflow: hidden;
            background: rgba(255,255,255,0.10);
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .explorer-drag-preview-cell .explorer-item-thumb {
            width: 100%;
            height: 100%;
            margin: 0;
            border-radius: 0;
            background: transparent;
        }
        .explorer-drag-preview-cell img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }
        .explorer-drag-preview-count {
            position: absolute;
            right: 10px;
            top: 10px;
            min-width: 26px;
            height: 26px;
            padding: 0 8px;
            border-radius: 999px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 12px;
            font-weight: 800;
            color: rgba(255,255,255,0.96);
            background: rgba(0, 122, 255, 0.92);
            box-shadow: 0 6px 14px rgba(0,0,0,0.25);
            border: 1px solid rgba(255,255,255,0.22);
        }
        .explorer-drag-preview-label {
            position: absolute;
            left: 10px;
            right: 10px;
            bottom: 8px;
            font-size: 11px;
            font-weight: 700;
            color: rgba(255,255,255,0.92);
            opacity: 0.95;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
        .explorer-item-name {
            font-size: 12px;
            font-weight: 700;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            color: var(--theme-contrast-text);
            text-shadow: 0 1px 2px var(--theme-contrast-shadow);
        }
        .explorer-item-sub {
            font-size: 11px;
            color: var(--theme-contrast-muted);
            margin-top: 2px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            text-shadow: 0 1px 2px var(--theme-contrast-shadow);
        }
        .explorer-upload-list {
            margin-top: 10px;
            font-size: 12px;
        }
        .explorer-upload-item {
            display: flex;
            justify-content: space-between;
            gap: 10px;
            padding: 6px 8px;
            border-radius: 10px;
            background: color-mix(in srgb, var(--theme-contrast-text) 8%, transparent);
            margin-bottom: 6px;
            color: var(--theme-contrast-text);
        }
        
        input[type="text"],
        input[type="url"],
        input[type="number"],
        select,
        textarea {
            width: 100%;
            padding: 10px;
            margin-bottom: 12px;
            border: 1px solid var(--control-field-border);
            border-radius: var(--control-radius);
            box-sizing: border-box;
            font-size: 15px;
            background-color: var(--control-field-bg);
            color: var(--control-chip-fg);
            box-shadow: none;
            -webkit-appearance: none;
            appearance: none;
        }

        @media (min-width: 768px) {
            input[type="text"],
            input[type="url"],
            input[type="number"],
            select,
            textarea {
                padding: 12px;
                margin-bottom: 15px;
                font-size: 16px;
            }
        }

        button {
            border-radius: var(--control-radius);
            cursor: pointer;
            flex-shrink: 0;
            transition: color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease, filter 0.2s ease, box-shadow 0.2s ease;
        }

        /* Botón estándar: chip con borde (excepciones: .close, controles de ventana, toggles widget, quick Spotify, notas, etc.) */
        button:not(.close):not(.strip-menu-link):not(.spotify-quick-panel__toggle):not(.os-widget-system-toggle):not(.os-widget-notes-toggle):not(.os-widget-weather-toggle):not(.os-widget-spotify-toggle):not(.os-widget-media-toggle):not(.os-notes-mobile-open):not(.os-system-mobile-open):not(.os-weather-mobile-open):not(.os-spotify-mobile-open):not(.os-media-mobile-open):not(.windows-menu-close):not(.minimize-btn):not(.maximize-btn):not(.fullscreen-btn):not(.close-btn):not(.external-btn):not(.zoom-in-btn):not(.zoom-out-btn):not(.zoom-reset-btn):not(.os-notes-add):not(.os-notes-nav):not(.os-media-slider-thumb) {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: var(--control-gap);
            background: var(--control-chip-bg);
            color: var(--control-chip-fg);
            padding: var(--shell-btn-pad-y) var(--shell-btn-pad-x);
            border: 1px solid var(--control-chip-border);
            font-size: var(--shell-btn-font-size);
            box-shadow: none;
            min-height: var(--shell-btn-min-h);
        }

        button.spotify-quick-panel__toggle:not(.close) {
            display: inline-flex;
            align-items: center;
            justify-content: center;
        }

        @media (min-width: 768px) {
            button:not(.close):not(.strip-menu-link):not(.spotify-quick-panel__toggle):not(.os-widget-system-toggle):not(.os-widget-notes-toggle):not(.os-widget-weather-toggle):not(.os-widget-spotify-toggle):not(.os-widget-media-toggle):not(.os-notes-mobile-open):not(.os-system-mobile-open):not(.os-weather-mobile-open):not(.os-spotify-mobile-open):not(.os-media-mobile-open):not(.windows-menu-close):not(.minimize-btn):not(.maximize-btn):not(.fullscreen-btn):not(.close-btn):not(.external-btn):not(.zoom-in-btn):not(.zoom-out-btn):not(.zoom-reset-btn):not(.os-notes-add):not(.os-notes-nav):not(.os-media-slider-thumb) {
                padding: var(--shell-btn-pad-y-md) var(--shell-btn-pad-x-md);
                font-size: var(--shell-btn-font-size-md);
            }
        }

        .window-controls button {
            min-height: 0 !important;
            padding: 0 !important;
            gap: 0 !important;
            box-sizing: border-box;
        }

        button.os-notes-add,
        button.os-notes-nav,
        button.os-media-slider-thumb {
            min-height: 0;
            gap: 0;
            box-shadow: none;
        }

        button.os-widget-system-toggle:not(.close),
        button.os-widget-notes-toggle:not(.close),
        button.os-widget-weather-toggle:not(.close),
        button.os-widget-spotify-toggle:not(.close),
        button.os-widget-media-toggle:not(.close) {
            min-height: 0;
            padding: 0;
            gap: 0;
            box-shadow: none;
        }

        button.spotify-quick-panel__toggle:not(.close) {
            padding: 0;
            min-height: 0;
            gap: 0;
            background: rgba(255, 255, 255, 0.06);
            border: 1px solid rgba(255, 255, 255, 0.12);
            box-shadow: none;
        }

        button.os-notes-mobile-open:not(.close),
        button.os-system-mobile-open:not(.close),
        button.os-weather-mobile-open:not(.close),
        button.os-spotify-mobile-open:not(.close),
        button.os-media-mobile-open:not(.close),
        button.windows-menu-close:not(.close) {
            min-height: 0;
            padding: 0;
            gap: 0;
            box-shadow: none;
            background: transparent;
            border: none;
        }

        button:not(.close):not(.strip-menu-link):not(.os-widget-system-toggle):not(.os-widget-notes-toggle):not(.os-widget-weather-toggle):not(.os-widget-spotify-toggle):not(.os-widget-media-toggle):not(.spotify-quick-panel__toggle):not(.os-notes-mobile-open):not(.os-system-mobile-open):not(.os-weather-mobile-open):not(.os-spotify-mobile-open):not(.os-media-mobile-open):not(.windows-menu-close):not(.minimize-btn):not(.maximize-btn):not(.fullscreen-btn):not(.close-btn):not(.external-btn):not(.zoom-in-btn):not(.zoom-out-btn):not(.zoom-reset-btn):not(.os-notes-add):not(.os-notes-nav):not(.os-media-slider-thumb):hover {
            background: var(--control-chip-hover-bg);
            filter: brightness(1.02);
        }

        button:not(.close):not(.strip-menu-link):not(.os-widget-system-toggle):not(.os-widget-notes-toggle):not(.os-widget-weather-toggle):not(.os-widget-spotify-toggle):not(.os-widget-media-toggle):not(.spotify-quick-panel__toggle):not(.os-notes-mobile-open):not(.os-system-mobile-open):not(.os-weather-mobile-open):not(.os-spotify-mobile-open):not(.os-media-mobile-open):not(.windows-menu-close):not(.minimize-btn):not(.maximize-btn):not(.fullscreen-btn):not(.close-btn):not(.external-btn):not(.zoom-in-btn):not(.zoom-out-btn):not(.zoom-reset-btn):not(.os-notes-add):not(.os-notes-nav):not(.os-media-slider-thumb):active {
            background: var(--control-chip-active-bg);
            filter: brightness(0.98);
        }

        /* Cierre modales: cuadrado, cristal, sin relieve del button global */
        .close {
            box-sizing: border-box;
            width: var(--shell-modal-close-size);
            height: var(--shell-modal-close-size);
            min-width: var(--shell-modal-close-size);
            min-height: 0;
            aspect-ratio: 1;
            margin: 0;
            margin-left: auto;
            padding: 0;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            line-height: 1;
            font-size: var(--shell-modal-close-font);
            font-weight: 600;
            color: color-mix(in srgb, var(--text-color) 58%, transparent);
            cursor: pointer;
            user-select: none;
            position: sticky;
            top: 0;
            z-index: 1;
            border: 1px solid color-mix(in srgb, var(--text-color) 12%, transparent);
            border-radius: var(--shell-modal-close-radius);
            background-color: color-mix(in srgb, var(--neumorphic-bg) 58%, transparent);
            box-shadow: none;
            backdrop-filter: blur(10px) saturate(1.08);
            -webkit-backdrop-filter: blur(10px) saturate(1.08);
            transition: color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
        }

        button.close {
            -webkit-appearance: none;
            appearance: none;
            font-family: inherit;
        }

        .close:hover {
            color: var(--text-color);
            background-color: color-mix(in srgb, var(--text-color) 10%, transparent);
            border-color: color-mix(in srgb, var(--text-color) 20%, transparent);
        }

        #deleteBtn {
            background-color: #f44336;
            color: white;
            border: none;
            padding: 10px 16px;
            border-radius: 10px;
            cursor: pointer;
            font-size: 16px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 5px;
        }

        #deleteBtn i {
            font-size: 18px;
        }

        #deleteBtn:hover {
            background-color: #d32f2f;
        }

        #iconGridPreview {
            display: none;
            width: 120px;
            height: 120px;
            max-width: 100%;
            box-sizing: border-box;
            background: var(--control-preview-bg);
            border: 1px solid var(--control-preview-border);
            border-radius: var(--control-radius);
            backdrop-filter: blur(6px);
            -webkit-backdrop-filter: blur(6px);
            align-items: center;
            justify-content: center;
            margin: 0 auto 12px auto;
            overflow: hidden;
        }
        
        @media (min-width: 768px) {
            #iconGridPreview {
                width: 132px;
                height: 132px;
            }
        }
        
        #iconPreviewImg {
            display: block;
            max-width: 92%;
            max-height: 92%;
            width: auto;
            height: auto;
            object-fit: contain;
            object-position: center;
            border-radius: calc(var(--control-radius) - 2px);
        }

        #startButtonPreview {
            text-align: center;
            margin-bottom: 10px;
        }
        #startButtonPreview .config-start-icon-preview {
            display: block;
            width: 72px;
            height: 72px;
            max-width: 100%;
            margin: 0 auto 8px;
            object-fit: contain;
            object-position: center;
            border-radius: 50%;
            background: var(--control-preview-bg);
            border: 1px solid var(--control-preview-border);
            box-sizing: border-box;
            padding: 6px;
        }

        .strip-menu {
            display: none;
            position: fixed;
            background-color: rgba(0,0,0,0.9);
            border-radius: 16px;
            padding: 12px;
            z-index: 2000;
            min-width: 200px;
            box-shadow: 0 8px 30px rgba(0,0,0,0.5);
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
            touch-action: manipulation;
        }
        
        @media (min-width: 768px) {
            .strip-menu {
                position: absolute;
                min-width: 180px;
                padding: 8px;
                left: auto;
                top: auto;
                transform: none;
            }
        }
        
        .strip-menu-link {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: flex-start;
            gap: 12px;
            width: 100%;
            text-align: left;
            padding: 14px 20px;
            margin: 5px 0;
            border: none;
            border-radius: 12px;
            background: transparent;
            background-color: transparent;
            color: white !important;
            cursor: pointer;
            font-size: 16px;
            text-decoration: none;
            box-sizing: border-box;
            box-shadow: none;
            transition: background-color 0.3s;
            min-height: 50px;
            touch-action: manipulation;
        }
        
        @media (min-width: 768px) {
            .strip-menu-link {
                padding: 10px 15px;
                font-size: 14px;
                min-height: 40px;
            }
        }
        
        .strip-menu-link:hover {
            background-color: rgba(255,255,255,0.2);
        }
        
        .strip-menu-backdrop {
            display: none;
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-color: rgba(0,0,0,0.5);
            z-index: 1999;
            touch-action: manipulation;
        }

        .category-form {
            display: flex;
            align-items: center;
            margin-bottom: 10px;
            gap: 10px;
            flex-wrap: wrap;
        }
        
        .category-form select {
            flex: 1;
            min-width: 150px;
        }
        
        #addCategoryModal .modal-content {
            width: 90%;
            max-width: 300px;
        }

        #editCategoryIconModal.modal {
            z-index: 1100;
        }

        .os-category-icon-select,
        select.os-category-icon-select {
            width: 100%;
            max-width: 100%;
            margin-top: 6px;
            margin-bottom: 4px;
            padding: 8px 10px;
            font-size: 14px;
            border-radius: var(--control-radius);
            box-sizing: border-box;
        }

        .topbar {
            background-color: var(--neumorphic-bg);
            padding: 6px 12px;
            display: flex;
            flex-direction: column;
            gap: 4px;
            box-shadow: 
                5px 5px 10px var(--neumorphic-shadow-dark), 
                -5px -5px 10px var(--neumorphic-shadow-light);
            color: var(--text-color);
            position: relative;
            z-index: 10;
        }
        
        @media (min-width: 768px) {
            .topbar {
                flex-direction: row;
                justify-content: space-between;
                align-items: center;
                padding: 6px 15px;
                gap: 8px;
                position: relative;
            }
        }
        
        .filter-container {
            position: relative;
            width: 100%;
        }
        
        @media (min-width: 768px) {
            .filter-container {
                width: 200px;
            }
        }
        
        .filter-container select {
            width: 100%;
            padding: 5px 10px;
            border-radius: 8px;
            border: none;
            background-color: var(--neumorphic-bg);
            color: var(--text-color);
            box-shadow: 
                inset 2px 2px 5px var(--neumorphic-shadow-dark), 
                inset -2px -2px 5px var(--neumorphic-shadow-light);
            -webkit-appearance: none;
            appearance: none;
            cursor: pointer;
            font-size: 13px;
            line-height: 1.25;
            margin-bottom: 0;
        }
        
        @media (min-width: 768px) {
            .filter-container select {
                padding: 6px 10px;
                font-size: 14px;
            }
        }
        
        .filter-container::after {
            content: '▼';
            font-size: 12px;
            position: absolute;
            right: 12px;
            top: 50%;
            transform: translateY(-50%);
            pointer-events: none;
            color: var(--text-color);
            opacity: 0.7;
        }
        
        .search-container {
            position: relative;
            width: 100%;
            display: flex;
            align-items: center;
            gap: 5px;
        }
        
        @media (min-width: 768px) {
            .search-container {
                width: 450px;
            }
        }
        
        .search-container input[type="text"] {
            flex: 1;
            padding: 5px 35px 5px 10px;
            border-radius: 8px;
            border: none;
            background-color: var(--neumorphic-bg);
            color: var(--text-color);
            caret-color: var(--text-color);
            box-shadow: 
                inset 2px 2px 5px var(--neumorphic-shadow-dark), 
                inset -2px -2px 5px var(--neumorphic-shadow-light);
            font-size: 13px;
            line-height: 1.25;
            margin-bottom: 0;
        }
        
        @media (min-width: 768px) {
            .search-container input[type="text"] {
                padding: 6px 35px 6px 10px;
                font-size: 14px;
            }
        }
        
        .search-clear {
            position: absolute;
            right: 10px;
            top: 50%;
            transform: translateY(-50%);
            color: var(--text-color);
            opacity: 0.7;
            cursor: pointer;
            font-size: 18px;
            display: none;
            z-index: 2;
            padding: 5px;
        }
        
        .search-clear:hover {
            opacity: 1;
        }
        
        .search-clear.visible {
            display: block;
        }

        .action-btn {
            background: transparent;
            border: none;
            color: var(--text-color);
            font-size: 18px;
            cursor: pointer;
            padding: 5px 8px;
            min-height: auto;
            box-shadow: none;
            display: inline-flex;
            align-items: center;
            justify-content: center;
        }
        .action-btn:hover {
            opacity: 0.7;
        }

        .zoom-controls {
            display: flex;
            gap: 5px;
            align-items: center;
        }
        .zoom-controls button {
            background: transparent;
            box-shadow: none;
            padding: 5px 8px;
            font-size: 16px;
            min-height: auto;
        }

        .config-btn {
            position: fixed;
            bottom: 81px;
            right: 4px;
            background-color: var(--neumorphic-bg);
            color: var(--text-color);
            border: none;
            width: 52px;
            height: 52px;
            border-radius: 50%;
            font-size: 22px;
            cursor: pointer;
            display: flex;
            justify-content: center;
            align-items: center;
            box-shadow: 
                5px 5px 10px var(--neumorphic-shadow-dark), 
                -5px -5px 10px var(--neumorphic-shadow-light);
            transition: all 0.3s ease;
            z-index: 101;
            touch-action: manipulation;
        }
        
        @media (min-width: 768px) {
            .config-btn {
                width: 60px;
                height: 60px;
                font-size: 24px;
            }
        }
        
        .config-btn:hover {
            box-shadow: 
                2px 2px 5px var(--neumorphic-shadow-dark), 
                -2px -2px 5px var(--neumorphic-shadow-light);
        }
        
        .config-btn:active {
            box-shadow: 
                inset 2px 2px 5px var(--neumorphic-shadow-dark), 
                inset -2px -2px 5px var(--neumorphic-shadow-light);
        }

        .add-app-btn {
            position: fixed;
            bottom: 137px;
            right: 4px;
            background-color: var(--neumorphic-bg);
            color: var(--text-color);
            border: none;
            width: 52px;
            height: 52px;
            border-radius: 50%;
            font-size: 22px;
            cursor: pointer;
            display: flex;
            justify-content: center;
            align-items: center;
            box-shadow: 
                5px 5px 10px var(--neumorphic-shadow-dark), 
                -5px -5px 10px var(--neumorphic-shadow-light);
            transition: all 0.3s ease;
            z-index: 102;
            touch-action: manipulation;
        }
        
        @media (min-width: 768px) {
            .add-app-btn {
                width: 60px;
                height: 60px;
                font-size: 24px;
                bottom: 145px;
                right: 4px;
            }
        }
        
        .add-app-btn:hover {
            box-shadow: 
                2px 2px 5px var(--neumorphic-shadow-dark), 
                -2px -2px 5px var(--neumorphic-shadow-light);
        }
        
        .add-app-btn:active {
            box-shadow: 
                inset 2px 2px 5px var(--neumorphic-shadow-dark), 
                inset -2px -2px 5px var(--neumorphic-shadow-light);
        }

        .tabs, .sub-tabs {
            display: flex;
            margin-bottom: 15px;
            border-bottom: 1px solid var(--neumorphic-shadow-dark);
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
            white-space: nowrap;
            flex-wrap: nowrap;
            padding-bottom: 2px;
            position: sticky;
            top: 0;
            background-color: var(--tab-bg);
            z-index: 5;
        }
        
        .tab {
            padding: 10px 12px;
            cursor: pointer;
            background-color: var(--tab-bg);
            border: none;
            border-radius: 8px 8px 0 0;
            margin-right: 3px;
            transition: all 0.3s ease;
            color: var(--tab-color);
            white-space: nowrap;
            font-size: 13px;
            touch-action: manipulation;
        }
        
        @media (min-width: 768px) {
            .tab {
                padding: 10px 20px;
                font-size: 16px;
                margin-right: 5px;
            }
        }
        
        .tab.active {
            background-color: var(--tab-active-bg);
            box-shadow: 
                inset 2px 2px 5px var(--neumorphic-shadow-dark), 
                inset -2px -2px 5px var(--neumorphic-shadow-light);
            color: var(--tab-color);
            font-weight: bold;
        }
        
        .tab-content {
            display: none;
            padding: 15px;
            border-radius: 0 0 10px 10px;
            color: var(--text-color);
        }
        
        @media (min-width: 768px) {
            .tab-content {
                padding: 20px;
            }
        }
        
        .tab-content.active {
            display: block;
        }

        /* ========== Configuración (#configModal): pestañas al tema + cierre ========== */
        #configModal .tabs,
        #configModal .sub-tabs {
            border-bottom-color: var(--config-tab-strip-border, var(--neumorphic-shadow-dark));
        }
        #configModal .tab.active {
            box-shadow: none;
            border: 1px solid var(--config-tab-active-outline, transparent);
        }
        #configModal .modal-content > .close {
            position: absolute;
            top: 14px;
            right: 14px;
            margin-left: 0;
            background-color: color-mix(in srgb, var(--config-modal-close-bg, var(--neumorphic-bg)) 72%, transparent);
            color: var(--config-modal-close-fg, color-mix(in srgb, var(--text-color) 58%, transparent));
        }
        #configModal .modal-content > .close:hover {
            color: var(--config-modal-close-hover, var(--text-color));
            background-color: color-mix(in srgb, var(--config-modal-close-bg, var(--neumorphic-bg)) 56%, transparent);
            border-color: color-mix(in srgb, var(--config-modal-close-hover, var(--text-color)) 24%, transparent);
        }

        body.neumorphism #configModal .tabs,
        body.neumorphism #configModal .sub-tabs {
            --tab-bg: var(--neumorphic-bg);
            --tab-active-bg: var(--neumorphic-shadow-light);
            --tab-color: var(--text-color);
            --config-tab-strip-border: var(--neumorphic-shadow-dark);
            --config-tab-active-outline: color-mix(in srgb, var(--neumorphic-shadow-dark) 35%, transparent);
        }
        body.neumorphism #configModal .tab.active {
            box-shadow:
                inset 2px 2px 5px var(--neumorphic-shadow-dark),
                inset -2px -2px 5px var(--neumorphic-shadow-light);
        }
        body.neumorphism #configModal .modal-content > .close {
            --config-modal-close-bg: var(--neumorphic-bg);
            --config-modal-close-fg: var(--text-color);
            --config-modal-close-hover: var(--text-color);
        }

        body.glassmorphism #configModal .tabs,
        body.glassmorphism #configModal .sub-tabs {
            --tab-bg: color-mix(in srgb, var(--glass-tint) 14%, transparent);
            --tab-active-bg: color-mix(in srgb, var(--glass-tint) 28%, transparent);
            --tab-color: var(--text-color);
            --config-tab-strip-border: color-mix(in srgb, var(--glass-border-tint) 22%, transparent);
            --config-tab-active-outline: color-mix(in srgb, var(--glass-border-tint) 35%, transparent);
        }
        body.glassmorphism #configModal .modal-content > .close {
            --config-modal-close-bg: color-mix(in srgb, var(--glass-tint) 22%, transparent);
            --config-modal-close-fg: var(--text-color);
            --config-modal-close-hover: var(--text-color);
        }

        body.skeuomorphism #configModal .tabs,
        body.skeuomorphism #configModal .sub-tabs {
            --tab-bg: var(--skeuo-gradient-top);
            --tab-active-bg: var(--skeuo-gradient-bottom);
            --tab-color: var(--text-color);
            --config-tab-strip-border: var(--skeuo-border);
            --config-tab-active-outline: var(--skeuo-border);
        }
        body.skeuomorphism #configModal .modal-content > .close {
            --config-modal-close-bg: var(--skeuo-gradient-top);
            --config-modal-close-fg: var(--text-color);
            --config-modal-close-hover: var(--text-color);
        }

        body.flat #configModal .tabs,
        body.flat #configModal .sub-tabs {
            --tab-bg: var(--flat-sidebar);
            --tab-active-bg: var(--flat-surface);
            --tab-color: var(--text-color);
            --config-tab-strip-border: var(--flat-sidebar-border);
            --config-tab-active-outline: var(--flat-sidebar-border);
        }
        body.flat #configModal .modal-content > .close {
            --config-modal-close-bg: var(--flat-surface);
            --config-modal-close-fg: var(--text-color);
            --config-modal-close-hover: var(--text-color);
        }

        body.material #configModal .tabs,
        body.material #configModal .sub-tabs {
            --tab-bg: var(--material-sidebar);
            --tab-active-bg: var(--material-surface);
            --tab-color: var(--text-color);
            --config-tab-strip-border: color-mix(in srgb, var(--material-shadow-color) 18%, transparent);
            --config-tab-active-outline: color-mix(in srgb, var(--material-shadow-color) 28%, transparent);
        }
        body.material #configModal .modal-content > .close {
            --config-modal-close-bg: var(--material-surface);
            --config-modal-close-fg: var(--text-color);
            --config-modal-close-hover: var(--text-color);
        }

        body.brutalism #configModal .tabs,
        body.brutalism #configModal .sub-tabs {
            --tab-bg: var(--brutal-bg);
            --tab-active-bg: color-mix(in srgb, var(--brutal-accent) 22%, var(--brutal-bg));
            --tab-color: var(--brutal-text);
            --config-tab-strip-border: var(--brutal-accent);
            --config-tab-active-outline: var(--brutal-accent);
        }
        body.brutalism #configModal .modal-content > .close {
            --config-modal-close-bg: var(--brutal-bg);
            --config-modal-close-fg: var(--brutal-text);
            --config-modal-close-hover: var(--brutal-accent);
        }

        body.retro #configModal .tabs,
        body.retro #configModal .sub-tabs {
            --tab-bg: var(--retro-sidebar);
            --tab-active-bg: var(--retro-bg);
            --tab-color: var(--retro-text);
            --config-tab-strip-border: var(--retro-border);
            --config-tab-active-outline: var(--retro-border);
        }
        body.retro #configModal .modal-content > .close {
            --config-modal-close-bg: var(--retro-bg);
            --config-modal-close-fg: var(--retro-text);
            --config-modal-close-hover: var(--retro-border);
        }

        body.dark #configModal .tabs,
        body.dark #configModal .sub-tabs {
            --tab-bg: color-mix(in srgb, var(--dark-sidebar) 88%, var(--dark-text));
            --tab-active-bg: var(--dark-surface);
            --tab-color: var(--dark-text);
            --config-tab-strip-border: color-mix(in srgb, var(--dark-text) 28%, transparent);
            --config-tab-active-outline: color-mix(in srgb, var(--dark-text) 45%, transparent);
        }
        body.dark #configModal .modal-content > .close {
            --config-modal-close-bg: var(--dark-surface);
            --config-modal-close-fg: var(--dark-text);
            --config-modal-close-hover: color-mix(in srgb, var(--dark-text) 85%, #fff);
        }

        body.minimalism #configModal .tabs,
        body.minimalism #configModal .sub-tabs {
            --tab-bg: var(--minimal-sidebar);
            --tab-active-bg: var(--minimal-surface);
            --tab-color: var(--minimal-text);
            --config-tab-strip-border: color-mix(in srgb, var(--minimal-text) 14%, transparent);
            --config-tab-active-outline: color-mix(in srgb, var(--minimal-text) 22%, transparent);
        }
        body.minimalism #configModal .modal-content > .close {
            --config-modal-close-bg: var(--minimal-surface);
            --config-modal-close-fg: var(--minimal-text);
            --config-modal-close-hover: var(--minimal-text);
        }

        body.morphing #configModal .tabs,
        body.morphing #configModal .sub-tabs {
            --tab-bg: color-mix(in srgb, var(--morph-panel) 92%, var(--text-color));
            --tab-active-bg: var(--morph-panel);
            --tab-color: var(--text-color);
            --config-tab-strip-border: color-mix(in srgb, var(--text-color) 16%, transparent);
            --config-tab-active-outline: color-mix(in srgb, var(--text-color) 24%, transparent);
        }
        body.morphing #configModal .modal-content > .close {
            --config-modal-close-bg: var(--morph-panel);
            --config-modal-close-fg: var(--text-color);
            --config-modal-close-hover: var(--text-color);
        }
        body.isometric #configModal .tabs,
        body.isometric #configModal .sub-tabs {
            --tab-bg: color-mix(in srgb, var(--iso-panel) 92%, var(--text-color));
            --tab-active-bg: var(--iso-panel);
            --tab-color: var(--text-color);
            --config-tab-strip-border: color-mix(in srgb, var(--text-color) 16%, transparent);
            --config-tab-active-outline: color-mix(in srgb, var(--text-color) 24%, transparent);
        }
        body.isometric #configModal .modal-content > .close {
            --config-modal-close-bg: var(--iso-panel);
            --config-modal-close-fg: var(--text-color);
            --config-modal-close-hover: var(--text-color);
        }

        body.cyberpunk #configModal .tabs,
        body.cyberpunk #configModal .sub-tabs {
            --tab-bg: color-mix(in srgb, var(--cyber-bg) 92%, var(--cyber-neon));
            --tab-active-bg: color-mix(in srgb, var(--cyber-accent) 18%, var(--cyber-bg));
            --tab-color: var(--cyber-neon);
            --config-tab-strip-border: var(--cyber-accent);
            --config-tab-active-outline: var(--cyber-accent);
        }
        body.cyberpunk #configModal .modal-content > .close {
            --config-modal-close-bg: var(--cyber-bg);
            --config-modal-close-fg: var(--cyber-neon);
            --config-modal-close-hover: var(--cyber-accent);
        }

        body.gradient #configModal .tabs,
        body.gradient #configModal .sub-tabs {
            --tab-bg: color-mix(in srgb, var(--gradient-color-2) 35%, #fff);
            --tab-active-bg: color-mix(in srgb, var(--gradient-color-1) 40%, #fff);
            --tab-color: var(--text-color);
            --config-tab-strip-border: color-mix(in srgb, var(--gradient-color-1) 45%, transparent);
            --config-tab-active-outline: color-mix(in srgb, var(--gradient-color-2) 50%, transparent);
        }
        body.gradient #configModal .modal-content > .close {
            --config-modal-close-bg: color-mix(in srgb, var(--gradient-color-1) 22%, #fff);
            --config-modal-close-fg: var(--text-color);
            --config-modal-close-hover: var(--text-color);
        }

        body.glassgradient #configModal .tabs,
        body.auroracrystal3d #configModal .tabs,
        body.glassgradient #configModal .sub-tabs,
        body.auroracrystal3d #configModal .sub-tabs {
            --tab-bg: color-mix(in srgb, var(--gradient-color-2) 22%, transparent);
            --tab-active-bg: color-mix(in srgb, var(--gradient-color-1) 30%, transparent);
            --tab-color: var(--text-color);
            --config-tab-strip-border: color-mix(in srgb, var(--glass-border-tint) 32%, transparent);
            --config-tab-active-outline: color-mix(in srgb, var(--glass-border-tint) 48%, transparent);
        }
        body.glassgradient #configModal .modal-content > .close,
        body.auroracrystal3d #configModal .modal-content > .close {
            --config-modal-close-bg: color-mix(in srgb, var(--glass-tint) 24%, transparent);
            --config-modal-close-fg: var(--text-color);
            --config-modal-close-hover: var(--text-color);
        }

        body.card #configModal .tabs,
        body.card #configModal .sub-tabs {
            --tab-bg: var(--card-sidebar);
            --tab-active-bg: var(--card-surface);
            --tab-color: var(--text-color);
            --config-tab-strip-border: color-mix(in srgb, var(--text-color) 12%, transparent);
            --config-tab-active-outline: color-mix(in srgb, var(--text-color) 20%, transparent);
        }
        body.card #configModal .modal-content > .close {
            --config-modal-close-bg: var(--card-surface);
            --config-modal-close-fg: var(--text-color);
            --config-modal-close-hover: var(--text-color);
        }

        body.typography #configModal .tabs,
        body.typography #configModal .sub-tabs {
            --tab-bg: color-mix(in srgb, var(--typography-panel) 88%, var(--text-color));
            --tab-active-bg: var(--typography-panel);
            --tab-color: var(--text-color);
            --config-tab-strip-border: var(--text-color);
            --config-tab-active-outline: var(--text-color);
        }
        body.typography #configModal .modal-content > .close {
            --config-modal-close-bg: var(--typography-panel);
            --config-modal-close-fg: var(--text-color);
            --config-modal-close-hover: var(--text-color);
        }

        /* Configuración: botones y file inputs = mismos tokens --control-* que el resto de la app */
        #configModal .modal-content {
            --cfg-btn-bg: var(--control-chip-bg);
            --cfg-btn-fg: var(--control-chip-fg);
            --cfg-btn-border: var(--control-chip-border);
            --cfg-btn-box: none;
            --cfg-btn-box-active: none;
            --cfg-file-bg: var(--control-file-track-bg);
            --cfg-file-fg: var(--control-chip-fg);
            --cfg-file-border: var(--control-field-border);
            --cfg-file-btn-bg: var(--control-chip-bg);
            --cfg-file-sh-a: transparent;
            --cfg-file-sh-b: transparent;
            --cfg-file-btn-sh-a: transparent;
            --cfg-file-btn-sh-b: transparent;
        }

        #configModal .modal-content button:not(.close),
        #configModal .modal-content .sub-tab {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: var(--control-gap);
            background: var(--cfg-btn-bg) !important;
            color: var(--cfg-btn-fg) !important;
            border: 1px solid var(--cfg-btn-border) !important;
            box-shadow: none !important;
            transition: filter 0.2s ease, transform 0.15s ease, border-color 0.2s ease, background-color 0.2s ease;
        }
        #configModal .modal-content button:not(.close):hover,
        #configModal .modal-content .sub-tab:hover {
            background: var(--control-chip-hover-bg) !important;
            filter: brightness(1.02);
        }
        #configModal .modal-content button:not(.close):active,
        #configModal .modal-content .sub-tab:active {
            background: var(--control-chip-active-bg) !important;
            box-shadow: none !important;
            filter: brightness(0.98);
        }
        #configModal .modal-content .sub-tab.active {
            background: var(--tab-active-bg) !important;
            background-color: var(--tab-active-bg) !important;
            font-weight: 700;
        }
        #configModal .modal-content .sub-tab.active:hover,
        #configModal .modal-content .sub-tab.active:active {
            background: var(--tab-active-bg) !important;
            background-color: var(--tab-active-bg) !important;
            filter: none;
        }
        #configModal .modal-content input[type="file"] {
            background: var(--cfg-file-bg) !important;
            color: var(--cfg-file-fg) !important;
            border: 1px solid var(--cfg-file-border) !important;
            box-shadow: none !important;
            border-radius: var(--control-radius);
            padding: 10px;
        }
        #configModal .modal-content input[type="file"]::file-selector-button {
            background: var(--cfg-file-btn-bg) !important;
            color: var(--cfg-file-fg) !important;
            border: 1px solid var(--cfg-file-border) !important;
            border-radius: var(--control-radius);
            padding: 8px 14px;
            margin-right: 12px;
            cursor: pointer;
            font-size: 14px;
            min-height: 40px;
            box-shadow: none !important;
            transition: filter 0.2s ease, background-color 0.2s ease;
        }
        #configModal .modal-content input[type="file"]::file-selector-button:hover {
            background: var(--control-chip-hover-bg) !important;
            filter: brightness(1.02);
        }
        #configModal .modal-content input[type="file"]::file-selector-button:active {
            background: var(--control-chip-active-bg) !important;
            box-shadow: none !important;
            filter: brightness(0.98);
        }

        #configModal .modal-content button.editCategoryBtn {
            background: #4caf50 !important;
            color: #fff !important;
            border-color: color-mix(in srgb, #000 18%, #4caf50) !important;
            box-shadow: 0 2px 8px rgba(76, 175, 80, 0.35) !important;
        }
        #configModal .modal-content button.editCategoryIconBtn {
            background: #0284c7 !important;
            color: #fff !important;
            border-color: color-mix(in srgb, #000 18%, #0284c7) !important;
            box-shadow: 0 2px 8px rgba(2, 132, 199, 0.35) !important;
        }
        #configModal .modal-content button.deleteCategoryBtn {
            background: #f44336 !important;
            color: #fff !important;
            border-color: color-mix(in srgb, #000 22%, #f44336) !important;
            box-shadow: 0 2px 8px rgba(244, 67, 54, 0.35) !important;
        }
        #configModal .modal-content button.apply-theme-btn {
            background: linear-gradient(95deg, #7000ff, #0072ff 55%, #00f2ff) !important;
            color: #fff !important;
            border: none !important;
            box-shadow: 0 0 18px rgba(0, 114, 255, 0.4) !important;
        }
        #configModal .modal-content button.apply-theme-btn:active {
            box-shadow: inset 0 2px 10px rgba(0, 0, 0, 0.25) !important;
        }
        #configModal .modal-content button.restore-theme-btn {
            background: linear-gradient(180deg, #ffb74d, #f57c00) !important;
            color: #fff !important;
            border-color: rgba(0, 0, 0, 0.12) !important;
            box-shadow: 0 2px 10px rgba(245, 124, 0, 0.35) !important;
        }
        #configModal .modal-content button.apply-theme-btn:hover,
        #configModal .modal-content button.restore-theme-btn:hover {
            filter: none;
        }

        /* Formateo / reinstalador: bloque centrado + interruptor estilo iOS + botón desactivado claro */
        #configModal .flexia-format-reinstall {
            text-align: center;
            margin-top: 4px;
        }
        #configModal .flexia-format-reinstall__heading {
            margin: 0 0 8px;
            text-align: center;
        }
        #configModal .flexia-format-reinstall__hint {
            text-align: center;
        }
        #configModal .flexia-format-reinstall__toggle-row {
            display: flex;
            justify-content: center;
            align-items: center;
            margin: 0 0 16px;
        }
        #configModal .flexia-ios-toggle-label {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 14px;
            cursor: pointer;
            user-select: none;
            -webkit-tap-highlight-color: transparent;
        }
        #configModal .flexia-ios-toggle-label__text {
            font-size: 0.9rem;
            font-weight: 600;
            color: color-mix(in srgb, var(--text-color) 90%, var(--grid-text-color) 10%);
            text-align: right;
            max-width: min(100%, 20rem);
            line-height: 1.35;
        }
        #configModal .flexia-ios-toggle {
            position: relative;
            width: 51px;
            height: 31px;
            flex-shrink: 0;
        }
        #configModal .flexia-ios-toggle__input {
            position: absolute;
            opacity: 0;
            width: 51px;
            height: 31px;
            margin: 0;
            left: 0;
            top: 0;
            z-index: 2;
            cursor: pointer;
        }
        /* Interruptor: colores del tema activo (variables del body / :root), no verde iOS fijo */
        #configModal .flexia-ios-toggle__track {
            position: absolute;
            inset: 0;
            border-radius: 31px;
            background: color-mix(in srgb, var(--control-field-bg, var(--neumorphic-bg)) 78%, var(--text-color) 22%);
            box-shadow: inset 0 0 0 1px var(--control-field-border, color-mix(in srgb, var(--text-color) 20%, transparent));
            transition: background 0.22s ease, box-shadow 0.22s ease;
        }
        #configModal .flexia-ios-toggle__track::after {
            content: '';
            position: absolute;
            width: 27px;
            height: 27px;
            left: 2px;
            top: 2px;
            border-radius: 50%;
            background: color-mix(in srgb, #ffffff 90%, var(--neumorphic-shadow-light, #ffffff) 10%);
            box-shadow:
                0 2px 6px color-mix(in srgb, var(--theme-contrast-shadow, rgba(0, 0, 0, 0.35)) 40%, transparent),
                0 0 0 0.5px color-mix(in srgb, var(--text-color) 10%, transparent);
            transition: transform 0.26s cubic-bezier(0.36, 0.66, 0.04, 1);
        }
        #configModal .flexia-ios-toggle__input:checked + .flexia-ios-toggle__track {
            background: linear-gradient(
                95deg,
                var(--gradient-color-1, #7000ff),
                var(--gradient-color-2, #0072ff) 52%,
                color-mix(in srgb, #00f2ff 80%, var(--grid-text-color, var(--text-color)) 20%)
            );
            box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--text-color) 12%, transparent);
        }
        #configModal .flexia-ios-toggle__input:checked + .flexia-ios-toggle__track::after {
            transform: translateX(20px);
        }
        #configModal .flexia-ios-toggle__input:focus-visible + .flexia-ios-toggle__track {
            box-shadow:
                inset 0 0 0 1px var(--control-field-border, color-mix(in srgb, var(--text-color) 20%, transparent)),
                0 0 0 3px color-mix(in srgb, var(--grid-text-color) 38%, transparent);
        }
        #configModal .flexia-ios-toggle__input:checked:focus-visible + .flexia-ios-toggle__track {
            box-shadow:
                inset 0 0 0 1px color-mix(in srgb, var(--text-color) 12%, transparent),
                0 0 0 3px color-mix(in srgb, var(--gradient-color-2, var(--grid-text-color)) 42%, transparent);
        }
        #configModal .flexia-format-reinstall__btn-wrap {
            display: flex;
            justify-content: center;
            margin-bottom: 4px;
        }
        #configModal .modal-content button.flexia-format-reinstall__btn {
            min-width: min(100%, 280px);
            padding: 10px 20px !important;
            border-radius: 12px !important;
            font-weight: 700 !important;
            letter-spacing: 0.02em;
            transition:
                opacity 0.2s ease,
                transform 0.18s ease,
                filter 0.2s ease,
                box-shadow 0.2s ease;
        }
        #configModal .modal-content button.flexia-format-reinstall__btn:disabled {
            opacity: 0.36 !important;
            cursor: not-allowed !important;
            pointer-events: none !important;
            filter: grayscale(0.55) brightness(0.88) !important;
            box-shadow: none !important;
            transform: none !important;
        }
        #configModal .modal-content button.flexia-format-reinstall__btn:not(:disabled) {
            cursor: pointer !important;
            pointer-events: auto !important;
            opacity: 1 !important;
            filter: none !important;
        }
        #configModal .modal-content button.flexia-format-reinstall__btn:not(:disabled):hover {
            filter: brightness(1.06) !important;
        }
        #configModal .flexia-format-reinstall--disk .flexia-format-reinstall__crosshint {
            text-align: center;
            max-width: 36rem;
            margin-left: auto !important;
            margin-right: auto !important;
        }

        /* Pestañas futuristas por sección (acento inferior + resplandor) */
        #configModal .tab {
            position: relative;
            letter-spacing: 0.04em;
            text-transform: uppercase;
            font-size: 11px;
            font-weight: 600;
            border-radius: 10px 10px 0 0;
            transition: color 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease, transform 0.18s ease;
        }
        @media (min-width: 768px) {
            #configModal .tab {
                font-size: 12px;
            }
        }
        #configModal .tab::after {
            content: '';
            position: absolute;
            left: 10%;
            right: 10%;
            bottom: 0;
            height: 2px;
            border-radius: 2px;
            opacity: 0;
            transform: scaleX(0.4);
            transition: opacity 0.22s ease, transform 0.22s ease;
            pointer-events: none;
        }
        #configModal .tab:hover {
            transform: translateY(-1px);
        }
        #configModal .tab:hover::after {
            opacity: 0.55;
            transform: scaleX(1);
        }
        #configModal .tab.active::after {
            opacity: 1;
            transform: scaleX(1);
            height: 3px;
        }
        #configModal .tab[data-tab="background"]::after {
            background: linear-gradient(90deg, #38bdf8, #818cf8);
            box-shadow: 0 0 12px rgba(56, 189, 248, 0.55);
        }
        #configModal .tab[data-tab="categories"]::after {
            background: linear-gradient(90deg, #a78bfa, #f472b6);
            box-shadow: 0 0 12px rgba(167, 139, 250, 0.55);
        }
        #configModal .tab[data-tab="themes"]::after {
            background: linear-gradient(90deg, #22d3ee, #34d399);
            box-shadow: 0 0 12px rgba(34, 211, 238, 0.5);
        }
        #configModal .tab[data-tab="desktopMode"]::after {
            background: linear-gradient(90deg, #fbbf24, #fb923c);
            box-shadow: 0 0 12px rgba(251, 191, 36, 0.5);
        }
        #configModal .tab[data-tab="security"]::after {
            background: linear-gradient(90deg, #f87171, #c084fc);
            box-shadow: 0 0 12px rgba(248, 113, 113, 0.45);
        }
        #configModal .tab[data-tab="explorerStorage"]::after {
            background: linear-gradient(90deg, #2dd4bf, #60a5fa);
            box-shadow: 0 0 12px rgba(45, 212, 191, 0.5);
        }
        #configModal .tab[data-tab="systemCredits"]::after {
            background: linear-gradient(90deg, #e879f9, #38bdf8);
            box-shadow: 0 0 14px rgba(232, 121, 249, 0.5);
        }
        #configModal .tab.active {
            text-shadow: 0 0 18px color-mix(in srgb, var(--tab-color) 35%, transparent);
        }

        .system-credits {
            max-width: 640px;
            margin: 0 auto;
        }
        .system-credits-license {
            text-align: center;
        }
        .system-credits-license > h3 {
            margin: 0 0 0.85rem;
        }
        .system-credits-license-logo-row {
            display: flex;
            justify-content: center;
            align-items: center;
            margin: 0.85rem 0 1.15rem;
        }
        .system-credits-license-logo-ring {
            position: relative;
            width: 128px;
            height: 128px;
            border-radius: 50%;
            background: #ffffff;
            border: 1px solid rgba(0, 0, 0, 0.08);
            display: flex;
            align-items: center;
            justify-content: center;
            box-sizing: border-box;
            padding: 14px;
            box-shadow: 0 2px 14px rgba(0, 0, 0, 0.18);
            overflow: hidden;
        }
        .system-credits-license-logo-ring .system-credits-license-logo,
        .system-credits-license-logo-ring [data-antara-profile-img],
        .system-credits-license-logo-ring [data-antara-profile-video] {
            position: absolute;
            inset: 14px;
            width: calc(100% - 28px);
            height: calc(100% - 28px);
            max-width: none;
            max-height: none;
            min-width: 0;
            min-height: 0;
            object-fit: cover;
            border-radius: 50%;
        }
        .system-credits-license-logo-ring [hidden] { display: none !important; }
        .system-credits-license-logo {
            display: block;
            max-width: 100%;
            max-height: 100%;
            width: auto;
            height: auto;
            min-width: 48px;
            min-height: 48px;
            object-fit: contain;
        }
        .system-credits-license-logo--video {
            object-fit: cover;
            border-radius: 10px;
            max-height: 100px;
        }
        .system-credits-license .system-credits-owner {
            text-align: center;
            margin: 0 0 0.35rem;
        }
        .system-credits-logo-missing--license {
            margin: 0.85rem 0 1rem;
            text-align: center;
        }
        .system-credits-logo-wrap {
            display: flex;
            justify-content: center;
            align-items: center;
            margin: 0 0 1.25rem;
            min-height: 72px;
        }
        .system-credits-logo {
            display: block;
            max-width: min(100%, 320px);
            max-height: 140px;
            width: auto;
            height: auto;
            object-fit: contain;
        }
        .system-credits-logo-missing {
            margin: 0;
            font-size: 0.88rem;
            opacity: 0.75;
            text-align: center;
        }
        .system-credits-owner {
            margin: 0 0 1.1rem;
            line-height: 1.5;
            font-size: 0.95rem;
        }
        .system-credits-notice {
            margin: 0 0 1.35rem;
            padding: 12px 14px;
            border-radius: 10px;
            background: rgba(0, 114, 255, 0.1);
            border: 1px solid rgba(0, 242, 255, 0.22);
        }
        .system-credits-notice h4 {
            margin: 0 0 8px;
            font-size: 1rem;
        }
        .system-credits-notice p {
            margin: 0;
            font-size: 0.88rem;
            line-height: 1.55;
            color: rgba(232, 244, 255, 0.9);
        }
        .system-credits-hosting-status {
            font-size: 0.85rem;
            margin: 0 0 10px;
            opacity: 0.85;
            min-height: 1.2em;
        }
        .system-credits-dl {
            margin: 0;
            display: grid;
            grid-template-columns: minmax(0, 38%) 1fr;
            gap: 6px 14px;
            font-size: 0.88rem;
            line-height: 1.45;
        }
        .system-credits-dl dt {
            margin: 0;
            font-weight: 600;
            opacity: 0.88;
        }
        .system-credits-dl dd {
            margin: 0;
            word-break: break-word;
        }

        .explorer-storage-env {
            font-size: 12px;
            margin: 0 0 12px;
            opacity: 0.85;
            white-space: pre-line;
        }
        .explorer-storage-stats {
            margin-bottom: 14px;
        }
        .explorer-storage-stat-grid {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
            gap: 12px 16px;
            font-size: 13px;
            line-height: 1.4;
        }
        .explorer-storage-stat-grid strong {
            display: block;
            margin-bottom: 4px;
        }
        .explorer-stat-label-rc { color: rgba(230, 126, 34, 0.98); }
        .explorer-stat-label-tr { color: rgba(192, 57, 43, 0.98); }
        .explorer-stat-label-fl { color: rgba(41, 128, 185, 0.98); }
        .explorer-stat-label-tot { color: rgba(120, 125, 140, 0.98); }
        .explorer-stat-label-other { color: rgba(118, 122, 138, 0.98); }
        .explorer-stat-label-free { color: rgba(39, 174, 96, 0.98); }
        .explorer-storage-legend {
            font-size: 11px;
            margin: 10px 0 0;
            opacity: 0.95;
        }
        .explorer-leg-rc { color: rgba(230, 126, 34, 0.95); }
        .explorer-leg-tr { color: rgba(192, 57, 43, 0.95); }
        .explorer-leg-fl { color: rgba(41, 128, 185, 0.95); }
        .explorer-leg-other { color: rgba(118, 122, 138, 0.95); }
        .explorer-leg-free { color: rgba(39, 174, 96, 0.95); }
        .explorer-leg-dot { margin-right: 2px; }
        .explorer-leg-toggle {
            cursor: pointer;
            user-select: none;
            -webkit-user-select: none;
            outline: none;
        }
        .explorer-leg-toggle:focus-visible {
            box-shadow: 0 0 0 2px rgba(0, 255, 255, 0.35);
            border-radius: 6px;
        }
        .explorer-leg--off {
            opacity: 0.35;
            text-decoration: line-through;
        }
        .explorer-chart-label-pie {
            color: rgba(200, 95, 55, 0.96);
        }
        .explorer-chart-label-pie--disk {
            color: rgba(90, 125, 105, 0.96);
        }
        @supports (-webkit-background-clip: text) or (background-clip: text) {
            .explorer-chart-label-pie {
                background: linear-gradient(90deg, rgba(230, 126, 34, 0.98), rgba(192, 57, 43, 0.98), rgba(41, 128, 185, 0.98));
                -webkit-background-clip: text;
                background-clip: text;
                color: transparent;
            }
            .explorer-chart-label-pie--disk {
                background: linear-gradient(90deg, rgba(230, 126, 34, 0.98), rgba(192, 57, 43, 0.98), rgba(41, 128, 185, 0.98), rgba(118, 122, 138, 0.95), rgba(39, 174, 96, 0.98));
                -webkit-background-clip: text;
                background-clip: text;
                color: transparent;
            }
        }
        .explorer-chart-label-disk {
            color: rgba(70, 130, 180, 0.96);
        }
        @supports (-webkit-background-clip: text) or (background-clip: text) {
            .explorer-chart-label-disk {
                background: linear-gradient(90deg, rgba(70, 130, 180, 0.98), rgba(95, 105, 118, 0.95));
                -webkit-background-clip: text;
                background-clip: text;
                color: transparent;
            }
        }
        .explorer-storage-loading {
            display: inline-flex;
            align-items: center;
            gap: 10px;
            opacity: 0.9;
            font-size: 13px;
            line-height: 1.35;
            min-height: 22px;
        }
        .explorer-storage-loading--active .explorer-storage-loading-text {
            animation: explorer-storage-pulse 1.1s ease-in-out infinite;
        }
        @keyframes explorer-storage-pulse {
            0%,
            100% { opacity: 0.7; }
            50% { opacity: 1; }
        }
        .explorer-storage-loading-spin {
            display: inline-block;
            width: 16px;
            height: 16px;
            box-sizing: border-box;
            border: 2px solid rgba(120, 125, 140, 0.35);
            border-top-color: rgba(100, 170, 220, 0.9);
            border-radius: 50%;
            flex-shrink: 0;
            animation: explorer-storage-spin 0.75s linear infinite;
        }
        @keyframes explorer-storage-spin {
            to { transform: rotate(360deg); }
        }
        .explorer-storage-loading-text {
            color: var(--text-color, #ddd);
        }
        .explorer-storage-charts {
            display: flex;
            flex-wrap: wrap;
            gap: 20px;
            align-items: flex-start;
            margin: 16px 0;
        }
        .explorer-storage-charts--top {
            margin: 10px 0 14px;
            flex-direction: column;
            flex-wrap: nowrap;
            align-items: center;
        }
        .explorer-storage-chart-block {
            flex: 1;
            min-width: 320px;
            max-width: 100%;
        }
        .explorer-storage-chart-block--pie {
            flex: 0 0 auto;
            width: min(980px, 100%);
        }
        .explorer-storage-chart-block--disk {
            flex: 0 0 auto;
            width: min(980px, 100%);
            margin-top: 14px;
        }
        .explorer-storage-chart-label {
            font-size: 13px;
            font-weight: 600;
            margin-bottom: 8px;
        }
        .explorer-storage-chart-block canvas {
            display: block;
            max-width: 100%;
            height: auto;
            border-radius: 8px;
            background: rgba(0, 0, 0, 0.12);
            margin-left: auto;
            margin-right: auto;
        }
        .explorer-storage-legend--chart {
            margin-top: 8px;
            opacity: 0.98;
            line-height: 1.55;
        }
        .explorer-storage-shortcuts {
            margin-top: 14px;
            padding-top: 12px;
            border-top: 1px solid rgba(0, 0, 0, 0.08);
        }
        .explorer-storage-shortcuts-hint {
            margin: 0 0 10px 0;
            font-size: 13px;
            opacity: 0.88;
            line-height: 1.4;
        }
        .explorer-storage-shortcuts-row {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
        }
        .explorer-storage-shortcut-btn {
            display: inline-flex;
            align-items: center;
            gap: var(--control-gap);
            padding: 8px 12px;
            border-radius: var(--control-radius);
            border: 1px solid var(--control-chip-border);
            background: var(--control-chip-bg);
            color: var(--control-chip-fg);
            cursor: pointer;
            font-size: 13px;
            box-shadow: none;
        }
        .explorer-storage-shortcut-btn:hover {
            background: var(--control-chip-hover-bg);
        }
        .explorer-storage-shortcut-btn:active {
            background: var(--control-chip-active-bg);
        }
        .explorer-storage-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
            margin-top: 8px;
        }
        .explorer-storage-actions button {
            flex: 0 1 auto;
        }

        .sub-tab {
            padding: 8px 12px;
            cursor: pointer;
            background: transparent;
            border: none;
            border-radius: 8px 8px 0 0;
            margin-right: 5px;
            font-size: 13px;
            white-space: nowrap;
        }
        .sub-tab.active {
            background-color: var(--tab-active-bg);
            font-weight: bold;
        }
        .sub-tab-content {
            display: none;
            padding: 10px 0;
        }
        .sub-tab-content.active {
            display: block;
        }

        .media-list {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
            gap: 12px;
            max-height: 300px;
            overflow-y: auto;
            margin-top: 10px;
            padding: 5px;
        }
        
        #imageListContainer .media-item {
            min-width: 100px;
            max-width: 120px;
        }
        #imageListContainer .media-item img {
            display: block;
            width: 100%;
            height: 88px;
            object-fit: contain;
            object-position: center;
            border-radius: var(--control-radius);
            background: var(--control-preview-bg);
            border: 1px solid var(--control-preview-border);
            box-sizing: border-box;
            padding: 4px;
        }
        
        #videoListContainer .media-item {
            min-width: 120px;
            max-width: 150px;
        }
        #videoListContainer .media-thumb {
            height: 88px;
            background-color: var(--control-preview-bg);
            border: 1px solid var(--control-preview-border);
            border-radius: var(--control-radius);
            background-size: contain;
            background-repeat: no-repeat;
            background-position: center;
        }
        #videoListContainer video {
            width: 100%;
            height: 88px;
            object-fit: contain;
            object-position: center;
            border-radius: var(--control-radius);
            background: var(--control-preview-bg);
            border: 1px solid var(--control-preview-border);
            box-sizing: border-box;
        }
        
        .media-item {
            display: flex;
            flex-direction: column;
            align-items: center;
            border: 1px solid var(--control-field-border);
            border-radius: var(--control-radius);
            padding: 8px;
            background: var(--control-preview-bg);
            word-break: break-word;
            cursor: pointer;
        }
        .media-item .media-thumb {
            width: 100%;
            height: 100px;
            background-size: contain;
            background-repeat: no-repeat;
            background-position: center;
            background-color: color-mix(in srgb, var(--control-preview-bg) 88%, transparent);
            border-radius: var(--control-radius);
            margin-bottom: 5px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            border: 1px solid var(--control-preview-border);
            box-sizing: border-box;
        }
        .media-item .media-thumb i {
            font-size: 40px;
        }
        .media-item span {
            font-size: 11px;
            text-align: center;
            width: 100%;
            margin: 5px 0;
            word-break: break-all;
        }
        .media-item button {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: transparent !important;
            color: #f44336 !important;
            border: none !important;
            font-size: 18px;
            cursor: pointer;
            padding: 5px;
            min-height: auto;
            box-shadow: none !important;
            filter: none !important;
        }
        .media-item button:hover,
        .media-item button:active {
            background: color-mix(in srgb, #f44336 14%, transparent) !important;
            filter: none !important;
        }

        .play-mode-options {
            display: flex;
            gap: 15px;
            flex-wrap: wrap;
            margin: 10px 0;
        }
        .play-mode-options label {
            display: flex;
            align-items: center;
            gap: 5px;
        }

        .add-url-form {
            display: flex;
            gap: 5px;
            margin: 10px 0;
        }
        .add-url-form input {
            flex: 1;
        }

        input[type="file"] {
            width: 100%;
            padding: 10px;
            margin-bottom: 12px;
            border: 1px solid var(--control-field-border);
            border-radius: var(--control-radius);
            box-sizing: border-box;
            font-size: 14px;
            background-color: var(--control-file-track-bg);
            color: var(--control-chip-fg);
            box-shadow: none;
        }

        input[type="file"]::file-selector-button {
            background: var(--control-chip-bg);
            color: var(--control-chip-fg);
            padding: 8px 14px;
            border: 1px solid var(--control-chip-border);
            border-radius: var(--control-radius);
            margin-right: 12px;
            cursor: pointer;
            transition: background-color 0.2s ease, filter 0.2s ease, border-color 0.2s ease;
            box-shadow: none;
            min-height: 36px;
            font-size: var(--shell-btn-font-size);
        }

        input[type="file"]::file-selector-button:hover {
            background: var(--control-chip-hover-bg);
            filter: brightness(1.02);
        }

        input[type="file"]::file-selector-button:active {
            background: var(--control-chip-active-bg);
            filter: brightness(0.98);
        }

        .editCategoryBtn, .editCategoryIconBtn, .deleteCategoryBtn {
            padding: 8px 12px;
            margin-right: 5px;
            border: 1px solid var(--control-chip-border);
            border-radius: var(--control-radius);
            cursor: pointer;
            font-size: 13px;
            transition: filter 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
            background: var(--control-chip-bg);
            background-color: var(--control-chip-bg);
            color: var(--control-chip-fg);
            box-shadow: none;
            min-height: 36px;
            touch-action: manipulation;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: var(--control-gap);
        }

        .editCategoryBtn:hover, .editCategoryIconBtn:hover, .deleteCategoryBtn:hover {
            filter: brightness(1.03);
        }

        .editCategoryBtn:active, .editCategoryIconBtn:active, .deleteCategoryBtn:active {
            filter: brightness(0.97);
        }

        .editCategoryIconBtn {
            background: #0284c7;
            background-color: #0284c7;
            color: #fff;
            border-color: color-mix(in srgb, #000 22%, #0284c7);
        }

        .editCategoryBtn {
            background: #4caf50;
            background-color: #4caf50;
            color: #fff;
            border-color: color-mix(in srgb, #000 22%, #4caf50);
        }

        .deleteCategoryBtn {
            background: #f44336;
            background-color: #f44336;
            color: #fff;
            border-color: color-mix(in srgb, #000 22%, #f44336);
        }

        select {
            background-color: var(--control-field-bg);
            color: var(--control-chip-fg);
            -webkit-appearance: none;
            appearance: none;
        }

        select option {
            background-color: var(--control-field-bg);
            color: var(--control-chip-fg);
        }

        /* Theme Styles - aplican a taskbar y windows menu */
        body.glassmorphism .modal-content,
        body.glassmorphism .topbar,
        body.glassmorphism .config-btn,
        body.glassmorphism .add-app-btn,
        body.glassmorphism .taskbar,
        body.glassmorphism .windows-menu,
        body.glassmorphism .windows-menu-categories,
        body.glassmorphism .windows-menu-categories input,
        body.glassmorphism .taskbar-app,
        body.glassmorphism .pinned-app,
        body.glassmorphism .mobile-app-hub-panel,
        body.glassmorphism .mobile-app-hub-item,
        body.glassmorphism .mobile-app-hub-panel .windows-mosaic-tile,
        body.glassmorphism .mobile-app-hub-close,
        body.glassmorphism .mobile-app-hub-close--corner {
            background: color-mix(in srgb, var(--glass-tint) 22%, transparent) !important;
            backdrop-filter: blur(10px) !important;
            -webkit-backdrop-filter: blur(10px) !important;
            border: 1px solid color-mix(in srgb, var(--glass-border-tint) 10%, transparent) !important;
        }

        body.skeuomorphism .modal-content,
        body.skeuomorphism .topbar,
        body.skeuomorphism .config-btn,
        body.skeuomorphism .add-app-btn,
        body.skeuomorphism .taskbar,
        body.skeuomorphism .windows-menu,
        body.skeuomorphism .windows-menu-categories,
        body.skeuomorphism .windows-menu-categories input,
        body.skeuomorphism .taskbar-app,
        body.skeuomorphism .pinned-app,
        body.skeuomorphism .mobile-app-hub-panel,
        body.skeuomorphism .mobile-app-hub-item,
        body.skeuomorphism .mobile-app-hub-panel .windows-mosaic-tile,
        body.skeuomorphism .mobile-app-hub-close,
        body.skeuomorphism .mobile-app-hub-close--corner {
            background: linear-gradient(to bottom, var(--skeuo-gradient-top), var(--skeuo-gradient-bottom)) !important;
            border: 1px solid var(--skeuo-border) !important;
            box-shadow: inset 0 1px 0 rgba(255,255,255,0.5), 0 2px 2px rgba(0,0,0,0.3) !important;
        }

        body.flat .modal-content,
        body.flat .topbar,
        body.flat .config-btn,
        body.flat .add-app-btn,
        body.flat .taskbar,
        body.flat .windows-menu,
        body.flat .windows-menu-categories,
        body.flat .windows-menu-categories input,
        body.flat .taskbar-app,
        body.flat .pinned-app,
        body.flat .mobile-app-hub-panel,
        body.flat .mobile-app-hub-item,
        body.flat .mobile-app-hub-panel .windows-mosaic-tile,
        body.flat .mobile-app-hub-close,
        body.flat .mobile-app-hub-close--corner {
            background: var(--flat-surface) !important;
            box-shadow: none !important;
            border: none !important;
        }

        body.material .modal-content,
        body.material .topbar,
        body.material .config-btn,
        body.material .add-app-btn,
        body.material .taskbar,
        body.material .windows-menu,
        body.material .windows-menu-categories,
        body.material .windows-menu-categories input,
        body.material .taskbar-app,
        body.material .pinned-app,
        body.material .mobile-app-hub-panel,
        body.material .mobile-app-hub-item,
        body.material .mobile-app-hub-panel .windows-mosaic-tile,
        body.material .mobile-app-hub-close,
        body.material .mobile-app-hub-close--corner {
            background: var(--material-surface) !important;
            box-shadow: 0 3px 6px color-mix(in srgb, var(--material-shadow-color) 16%, transparent), 0 3px 6px color-mix(in srgb, var(--material-shadow-color) 23%, transparent) !important;
        }

        body.brutalism .modal-content,
        body.brutalism .topbar,
        body.brutalism .config-btn,
        body.brutalism .add-app-btn,
        body.brutalism .taskbar,
        body.brutalism .windows-menu,
        body.brutalism .windows-menu-categories,
        body.brutalism .windows-menu-categories input,
        body.brutalism .taskbar-app,
        body.brutalism .pinned-app,
        body.brutalism .mobile-app-hub-panel,
        body.brutalism .mobile-app-hub-item,
        body.brutalism .mobile-app-hub-panel .windows-mosaic-tile,
        body.brutalism .mobile-app-hub-close,
        body.brutalism .mobile-app-hub-close--corner {
            background: var(--brutal-bg) !important;
            color: var(--brutal-text) !important;
            border: 3px solid var(--brutal-accent) !important;
            font-family: 'Courier New', monospace !important;
        }

        body.retro .modal-content,
        body.retro .topbar,
        body.retro .config-btn,
        body.retro .add-app-btn,
        body.retro .taskbar,
        body.retro .windows-menu,
        body.retro .windows-menu-categories,
        body.retro .windows-menu-categories input,
        body.retro .taskbar-app,
        body.retro .pinned-app,
        body.retro .mobile-app-hub-panel,
        body.retro .mobile-app-hub-item,
        body.retro .mobile-app-hub-panel .windows-mosaic-tile,
        body.retro .mobile-app-hub-close,
        body.retro .mobile-app-hub-close--corner {
            background: var(--retro-bg) !important;
            color: var(--retro-text) !important;
            font-family: 'VT323', monospace !important;
            border: 2px solid var(--retro-border) !important;
        }

        body.dark .modal-content,
        body.dark .topbar,
        body.dark .config-btn,
        body.dark .add-app-btn,
        body.dark .taskbar,
        body.dark .windows-menu,
        body.dark .windows-menu-categories,
        body.dark .windows-menu-categories input,
        body.dark .taskbar-app,
        body.dark .pinned-app,
        body.dark .mobile-app-hub-panel,
        body.dark .mobile-app-hub-item,
        body.dark .mobile-app-hub-panel .windows-mosaic-tile,
        body.dark .mobile-app-hub-close,
        body.dark .mobile-app-hub-close--corner {
            background: var(--dark-surface) !important;
            color: var(--dark-text) !important;
        }

        body.minimalism .modal-content,
        body.minimalism .topbar,
        body.minimalism .config-btn,
        body.minimalism .add-app-btn,
        body.minimalism .taskbar,
        body.minimalism .windows-menu,
        body.minimalism .windows-menu-categories,
        body.minimalism .windows-menu-categories input,
        body.minimalism .taskbar-app,
        body.minimalism .pinned-app,
        body.minimalism .mobile-app-hub-panel,
        body.minimalism .mobile-app-hub-item,
        body.minimalism .mobile-app-hub-panel .windows-mosaic-tile,
        body.minimalism .mobile-app-hub-close,
        body.minimalism .mobile-app-hub-close--corner {
            background: var(--minimal-surface) !important;
            color: var(--minimal-text) !important;
            border: none !important;
            box-shadow: none !important;
        }

        body.morphing .modal-content,
        body.morphing .topbar,
        body.morphing .config-btn,
        body.morphing .add-app-btn,
        body.morphing .taskbar,
        body.morphing .windows-menu,
        body.morphing .windows-menu-categories,
        body.morphing .windows-menu-categories input,
        body.morphing .taskbar-app,
        body.morphing .pinned-app,
        body.morphing .mobile-app-hub-panel,
        body.morphing .mobile-app-hub-item,
        body.morphing .mobile-app-hub-panel .windows-mosaic-tile,
        body.morphing .mobile-app-hub-close,
        body.morphing .mobile-app-hub-close--corner {
            background: var(--morph-panel) !important;
            transition: all 0.3s ease !important;
        }

        body.morphing .modal-content:hover,
        body.morphing .topbar:hover,
        body.morphing .config-btn:hover,
        body.morphing .add-app-btn:hover,
        body.morphing .taskbar:hover,
        body.morphing .windows-menu:hover,
        body.morphing .taskbar-app:hover,
        body.morphing .pinned-app:hover,
        body.morphing .mobile-app-hub-item:hover,
        body.morphing .mobile-app-hub-panel .windows-mosaic-tile:hover {
            transform: scale(1.05) !important;
        }

        body.isometric .modal-content,
        body.isometric .topbar,
        body.isometric .config-btn,
        body.isometric .add-app-btn,
        body.isometric .taskbar,
        body.isometric .windows-menu,
        body.isometric .windows-menu-categories,
        body.isometric .windows-menu-categories input,
        body.isometric .taskbar-app,
        body.isometric .pinned-app {
            background: var(--iso-panel) !important;
            transform: rotate(5deg) skew(-5deg) !important;
        }

        body.isometric .mobile-app-hub-panel,
        body.isometric .mobile-app-hub-item,
        body.isometric .mobile-app-hub-panel .windows-mosaic-tile,
        body.isometric .mobile-app-hub-close,
        body.isometric .mobile-app-hub-close--corner {
            background: var(--iso-panel) !important;
            transform: none !important;
        }

        body.cyberpunk .modal-content,
        body.cyberpunk .topbar,
        body.cyberpunk .config-btn,
        body.cyberpunk .add-app-btn,
        body.cyberpunk .taskbar,
        body.cyberpunk .windows-menu,
        body.cyberpunk .windows-menu-categories,
        body.cyberpunk .windows-menu-categories input,
        body.cyberpunk .taskbar-app,
        body.cyberpunk .pinned-app,
        body.cyberpunk .mobile-app-hub-panel,
        body.cyberpunk .mobile-app-hub-item,
        body.cyberpunk .mobile-app-hub-panel .windows-mosaic-tile,
        body.cyberpunk .mobile-app-hub-close,
        body.cyberpunk .mobile-app-hub-close--corner {
            background: var(--cyber-bg) !important;
            color: var(--cyber-neon) !important;
            border: 2px solid var(--cyber-accent) !important;
            text-shadow: 0 0 5px var(--cyber-neon) !important;
        }

        body.gradient .modal-content,
        body.gradient .topbar,
        body.gradient .config-btn,
        body.gradient .add-app-btn,
        body.gradient .taskbar,
        body.gradient .windows-menu,
        body.gradient .windows-menu-categories,
        body.gradient .windows-menu-categories input,
        body.gradient .taskbar-app,
        body.gradient .pinned-app,
        body.gradient .mobile-app-hub-panel,
        body.gradient .mobile-app-hub-panel .windows-mosaic-tile {
            background: linear-gradient(45deg, var(--gradient-color-1) 0%, var(--gradient-color-2) 100%) !important;
        }

        /* Aurora cristal: degradado + vidrio (blur, saturación, borde e interior luminoso) */
        body.glassgradient .modal-content,
        body.auroracrystal3d .modal-content,
        body.glassgradient .topbar,
        body.auroracrystal3d .topbar,
        body.glassgradient .config-btn,
        body.auroracrystal3d .config-btn,
        body.glassgradient .add-app-btn,
        body.auroracrystal3d .add-app-btn,
        body.glassgradient .taskbar,
        body.auroracrystal3d .taskbar,
        body.glassgradient .windows-menu,
        body.auroracrystal3d .windows-menu,
        body.glassgradient .windows-menu-categories,
        body.auroracrystal3d .windows-menu-categories,
        body.glassgradient .windows-menu-categories input,
        body.auroracrystal3d .windows-menu-categories input,
        body.glassgradient .taskbar-app,
        body.auroracrystal3d .taskbar-app,
        body.glassgradient .pinned-app,
        body.auroracrystal3d .pinned-app,
        body.glassgradient .mobile-app-hub-panel,
        body.auroracrystal3d .mobile-app-hub-panel,
        body.glassgradient .mobile-app-hub-item,
        body.auroracrystal3d .mobile-app-hub-item,
        body.glassgradient .mobile-app-hub-panel .windows-mosaic-tile,
        body.auroracrystal3d .mobile-app-hub-panel .windows-mosaic-tile,
        body.glassgradient .mobile-app-hub-close,
        body.auroracrystal3d .mobile-app-hub-close,
        body.glassgradient .mobile-app-hub-close--corner,
        body.auroracrystal3d .mobile-app-hub-close--corner,
        body.glassgradient .window-frame,
        body.auroracrystal3d .window-frame {
            background:
                linear-gradient(
                    135deg,
                    color-mix(in srgb, var(--gradient-color-1) var(--gg-layer1), transparent) 0%,
                    color-mix(in srgb, var(--gradient-color-2) var(--gg-layer2), transparent) 48%,
                    color-mix(in srgb, var(--glass-tint) var(--gg-tint-mix), transparent) 100%
                ) !important;
            backdrop-filter: blur(20px) saturate(170%) !important;
            -webkit-backdrop-filter: blur(20px) saturate(170%) !important;
            border: 1px solid color-mix(in srgb, var(--glass-border-tint) var(--gg-border-mix), transparent) !important;
            box-shadow:
                0 6px 28px rgba(15, 23, 42, 0.12),
                inset 0 1px 0 rgba(255, 255, 255, 0.42) !important;
        }

        /* Controles de ventana: círculos compactos (sin chip 36px de botones globales) */
        body.glassgradient .window-frame:not(.window-frame--win11) .window-controls button,
        body.glassmorphism .window-frame:not(.window-frame--win11) .window-controls button,
        body.auroracrystal3d .window-frame:not(.window-frame--win11) .window-controls button {
            width: 26px !important;
            height: 26px !important;
            min-width: 26px !important;
            min-height: 0 !important;
            max-width: 26px !important;
            max-height: 26px !important;
            padding: 0 !important;
            border-radius: 50% !important;
            border: 1px solid color-mix(in srgb, var(--glass-border-tint) 28%, transparent) !important;
            background: color-mix(in srgb, var(--glass-tint) 30%, rgba(255, 255, 255, 0.1)) !important;
            backdrop-filter: blur(8px) !important;
            -webkit-backdrop-filter: blur(8px) !important;
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.38) !important;
            color: var(--text-color, #1a1a1a) !important;
            filter: none !important;
        }

        body.glassgradient .window-frame:not(.window-frame--win11) .window-controls button:hover,
        body.glassmorphism .window-frame:not(.window-frame--win11) .window-controls button:hover,
        body.auroracrystal3d .window-frame:not(.window-frame--win11) .window-controls button:hover {
            background: color-mix(in srgb, var(--glass-tint) 42%, rgba(255, 255, 255, 0.16)) !important;
            filter: none !important;
        }

        body.glassgradient .window-frame:not(.window-frame--win11) .window-controls .close-btn,
        body.glassmorphism .window-frame:not(.window-frame--win11) .window-controls .close-btn,
        body.auroracrystal3d .window-frame:not(.window-frame--win11) .window-controls .close-btn,
        body.glassgradient .window-frame:not(.window-frame--win11) .window-controls .minimize-btn,
        body.glassmorphism .window-frame:not(.window-frame--win11) .window-controls .minimize-btn,
        body.auroracrystal3d .window-frame:not(.window-frame--win11) .window-controls .minimize-btn,
        body.glassgradient .window-frame:not(.window-frame--win11) .window-controls .maximize-btn,
        body.glassmorphism .window-frame:not(.window-frame--win11) .window-controls .maximize-btn,
        body.auroracrystal3d .window-frame:not(.window-frame--win11) .window-controls .maximize-btn,
        body.glassgradient .window-frame:not(.window-frame--win11) .window-controls .fullscreen-btn,
        body.glassmorphism .window-frame:not(.window-frame--win11) .window-controls .fullscreen-btn,
        body.auroracrystal3d .window-frame:not(.window-frame--win11) .window-controls .fullscreen-btn {
            background: color-mix(in srgb, var(--glass-tint) 30%, rgba(255, 255, 255, 0.1)) !important;
            color: var(--text-color, #1a1a1a) !important;
        }

        body.glassgradient .window-frame:not(.window-frame--win11) .window-controls .close-btn:hover,
        body.glassmorphism .window-frame:not(.window-frame--win11) .window-controls .close-btn:hover,
        body.auroracrystal3d .window-frame:not(.window-frame--win11) .window-controls .close-btn:hover {
            background: color-mix(in srgb, #c42b1c 72%, var(--glass-tint) 28%) !important;
            color: #fff !important;
        }

        body.glassgradient .window-frame.window-frame--win11 .window-controls button,
        body.glassmorphism .window-frame.window-frame--win11 .window-controls button,
        body.auroracrystal3d .window-frame.window-frame--win11 .window-controls button {
            border-radius: 4px !important;
            background: transparent !important;
            border: none !important;
            box-shadow: none !important;
            backdrop-filter: none !important;
            -webkit-backdrop-filter: none !important;
        }

        body.glassgradient .modal-content input:not([type="file"]):not([type="checkbox"]):not([type="radio"]):not([type="color"]),
        body.auroracrystal3d .modal-content input:not([type="file"]):not([type="checkbox"]):not([type="radio"]):not([type="color"]),
        body.glassgradient .modal-content select,
        body.auroracrystal3d .modal-content select,
        body.glassgradient .modal-content textarea,
        body.auroracrystal3d .modal-content textarea,
        body.glassgradient .topbar input,
        body.auroracrystal3d .topbar input,
        body.glassgradient .topbar select,
        body.auroracrystal3d .topbar select {
            background: color-mix(in srgb, var(--glass-tint) var(--gg-input-mix), transparent) !important;
            backdrop-filter: blur(10px) !important;
            -webkit-backdrop-filter: blur(10px) !important;
            border: 1px solid color-mix(in srgb, var(--glass-border-tint) var(--gg-input-border-mix), transparent) !important;
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35) !important;
        }

        /* Aurora cristal 3D: una sola capa de distorsión (evita congelar el navegador) */
        .ac3d-distort-layer {
            display: none;
            position: fixed;
            inset: -10%;
            z-index: 0;
            pointer-events: none;
            background-image: var(--ac3d-backdrop-image);
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
            background-attachment: fixed;
            transform: scale(var(--ac3d-lens-scale));
            transform-origin: center center;
        }
        body.auroracrystal3d:not(.ac3d-warp-off) .ac3d-distort-layer:not([hidden]) {
            display: block;
            filter: url(#ac3d-crystal-displace) saturate(165%);
            -webkit-filter: url(#ac3d-crystal-displace) saturate(165%);
        }
        body.auroracrystal3d.ac3d-warp-off .ac3d-distort-layer:not([hidden]) {
            display: block;
            filter: saturate(165%);
            -webkit-filter: saturate(165%);
            transform: none;
        }
        body.auroracrystal3d .grid-container,
        body.auroracrystal3d .topbar,
        body.auroracrystal3d .taskbar {
            position: relative;
            z-index: 2;
        }
        body.auroracrystal3d .modal-content,
        body.auroracrystal3d .topbar,
        body.auroracrystal3d .config-btn,
        body.auroracrystal3d .add-app-btn,
        body.auroracrystal3d .taskbar,
        body.auroracrystal3d .windows-menu,
        body.auroracrystal3d .windows-menu-categories,
        body.auroracrystal3d .windows-menu-categories input,
        body.auroracrystal3d .taskbar-app,
        body.auroracrystal3d .pinned-app,
        body.auroracrystal3d .mobile-app-hub-panel,
        body.auroracrystal3d .mobile-app-hub-item,
        body.auroracrystal3d .mobile-app-hub-panel .windows-mosaic-tile,
        body.auroracrystal3d .mobile-app-hub-close,
        body.auroracrystal3d .mobile-app-hub-close--corner,
        body.auroracrystal3d .grid-app-dialog-panel,
        body.auroracrystal3d .window-frame {
            backdrop-filter: blur(var(--ac3d-blur)) saturate(170%) !important;
            -webkit-backdrop-filter: blur(var(--ac3d-blur)) saturate(170%) !important;
        }
        body.auroracrystal3d .file-explorer .fe-sidebar {
            backdrop-filter: blur(var(--ac3d-blur)) saturate(160%) !important;
            -webkit-backdrop-filter: blur(var(--ac3d-blur)) saturate(160%) !important;
        }
        body.auroracrystal3d .modal-content input:not([type="file"]):not([type="checkbox"]):not([type="radio"]):not([type="color"]),
        body.auroracrystal3d .modal-content select,
        body.auroracrystal3d .modal-content textarea,
        body.auroracrystal3d .topbar input,
        body.auroracrystal3d .topbar select,
        body.auroracrystal3d .grid-app-dialog-input {
            backdrop-filter: blur(calc(var(--ac3d-blur) * 0.55)) !important;
            -webkit-backdrop-filter: blur(calc(var(--ac3d-blur) * 0.55)) !important;
        }
        body.auroracrystal3d .window-titlebar {
            backdrop-filter: blur(calc(var(--ac3d-blur) * 0.45)) !important;
            -webkit-backdrop-filter: blur(calc(var(--ac3d-blur) * 0.45)) !important;
        }
        @media (prefers-reduced-motion: reduce) {
            body.auroracrystal3d .ac3d-distort-layer {
                display: none !important;
            }
            body.auroracrystal3d.ac3d-warp-off .ac3d-distort-layer {
                display: none !important;
            }
        }

        body.card .modal-content,
        body.card .topbar,
        body.card .config-btn,
        body.card .add-app-btn,
        body.card .taskbar,
        body.card .windows-menu,
        body.card .windows-menu-categories,
        body.card .windows-menu-categories input,
        body.card .taskbar-app,
        body.card .pinned-app,
        body.card .mobile-app-hub-panel,
        body.card .mobile-app-hub-item,
        body.card .mobile-app-hub-panel .windows-mosaic-tile,
        body.card .mobile-app-hub-close,
        body.card .mobile-app-hub-close--corner {
            background: var(--card-surface) !important;
            border-radius: 10px !important;
            box-shadow: 0 4px 8px rgba(0,0,0,0.1) !important;
        }

        body.typography .modal-content,
        body.typography .topbar,
        body.typography .config-btn,
        body.typography .add-app-btn,
        body.typography .taskbar,
        body.typography .windows-menu,
        body.typography .windows-menu-categories,
        body.typography .windows-menu-categories input,
        body.typography .taskbar-app,
        body.typography .pinned-app,
        body.typography .mobile-app-hub-panel,
        body.typography .mobile-app-hub-item,
        body.typography .mobile-app-hub-panel .windows-mosaic-tile,
        body.typography .mobile-app-hub-close,
        body.typography .mobile-app-hub-close--corner {
            background: var(--typography-panel) !important;
            font-family: 'Arial Black', sans-serif !important;
            font-weight: bold !important;
            font-size: 1.2em !important;
        }

        /* Hub móvil con temas vidrio: bordes y controles coherentes con tinte/borde cristal */
        body.glassmorphism .mobile-app-hub-head,
        body.glassgradient .mobile-app-hub-head,
        body.auroracrystal3d .mobile-app-hub-head {
            border-bottom: 1px solid color-mix(in srgb, var(--glass-border-tint) 22%, transparent);
        }
        body.glassmorphism .mobile-app-hub-strip::-webkit-scrollbar-thumb,
        body.glassgradient .mobile-app-hub-strip::-webkit-scrollbar-thumb,
        body.auroracrystal3d .mobile-app-hub-strip::-webkit-scrollbar-thumb {
            background: color-mix(in srgb, var(--glass-border-tint) 32%, transparent);
        }
        body.glassmorphism .mobile-app-hub-panel .windows-mosaic-close,
        body.glassgradient .mobile-app-hub-panel .windows-mosaic-close,
        body.auroracrystal3d .mobile-app-hub-panel .windows-mosaic-close {
            background: color-mix(in srgb, var(--glass-tint) 40%, transparent) !important;
            color: var(--text-color) !important;
            backdrop-filter: blur(8px);
            -webkit-backdrop-filter: blur(8px);
            border: 1px solid color-mix(in srgb, var(--glass-border-tint) 24%, transparent) !important;
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.28), 0 4px 12px rgba(0, 0, 0, 0.12) !important;
        }
        body.glassmorphism .mobile-app-hub-panel .windows-mosaic-close:hover,
        body.glassgradient .mobile-app-hub-panel .windows-mosaic-close:hover,
        body.auroracrystal3d .mobile-app-hub-panel .windows-mosaic-close:hover {
            background: color-mix(in srgb, var(--glass-tint) 52%, transparent) !important;
        }
        body.glassmorphism .mobile-app-hub-panel .windows-mosaic-thumb,
        body.glassgradient .mobile-app-hub-panel .windows-mosaic-thumb,
        body.auroracrystal3d .mobile-app-hub-panel .windows-mosaic-thumb {
            background: color-mix(in srgb, var(--glass-tint) 24%, transparent) !important;
        }
        body.glassmorphism .mobile-app-hub-panel .windows-mosaic-tile:hover {
            background: color-mix(in srgb, var(--glass-tint) 30%, transparent) !important;
            backdrop-filter: blur(12px) !important;
            -webkit-backdrop-filter: blur(12px) !important;
        }
        body.glassgradient .mobile-app-hub-panel .windows-mosaic-tile:hover,
        body.auroracrystal3d .mobile-app-hub-panel .windows-mosaic-tile:hover {
            backdrop-filter: none !important;
            -webkit-backdrop-filter: none !important;
        }

        /* Explorador de archivos: panel lateral y árbol según tema del escritorio (paleta: --fe-palette-*) */
        body.glassmorphism .file-explorer {
            background: var(--fe-palette-main-bg, color-mix(in srgb, var(--glass-tint) 22%, transparent)) !important;
            color: var(--fe-palette-text, var(--theme-contrast-text)) !important;
        }
        body.glassmorphism .file-explorer .fe-sidebar {
            background: var(--fe-palette-sidebar-bg, color-mix(in srgb, var(--glass-tint) 28%, transparent)) !important;
            backdrop-filter: blur(12px);
            -webkit-backdrop-filter: blur(12px);
            border-right: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--glass-border-tint)) 14%, transparent) !important;
            box-shadow: none;
            color: var(--fe-palette-text, var(--theme-contrast-text)) !important;
        }
        body.glassmorphism .file-explorer .fe-sidebar-head,
        body.glassmorphism .file-explorer .fe-tree-node,
        body.glassmorphism .file-explorer .fe-breadcrumb,
        body.glassmorphism .file-explorer .explorer-path,
        body.glassmorphism .file-explorer .explorer-toolbar button {
            color: var(--fe-palette-text, var(--theme-contrast-text)) !important;
        }
        body.glassmorphism .file-explorer .fe-search-input {
            background: var(--fe-palette-input-bg, color-mix(in srgb, var(--glass-tint) 35%, transparent)) !important;
            color: var(--fe-palette-text, var(--theme-contrast-text)) !important;
            border-color: color-mix(in srgb, var(--fe-palette-border, var(--glass-border-tint)) 20%, transparent) !important;
        }
        /* Glassmorfismo: árbol (#feTree_*) y cuadrícula (#explorerItems_*) — texto e iconos con contraste forzado */
        body.glassmorphism .file-explorer .fe-tree,
        body.glassmorphism .file-explorer .fe-main,
        body.glassmorphism .file-explorer .fe-items-wrap,
        body.glassmorphism .file-explorer .explorer-items {
            color: var(--fe-palette-text, var(--theme-contrast-text)) !important;
            --fe-fg: var(--fe-palette-text, var(--theme-contrast-text)) !important;
            --fe-fg-muted: var(--fe-palette-muted, var(--theme-contrast-muted)) !important;
        }
        body.glassmorphism .file-explorer .fe-tree-expander,
        body.glassmorphism .file-explorer .fe-tree-label {
            color: var(--fe-palette-text, var(--theme-contrast-text)) !important;
            text-shadow: 0 1px 2px var(--theme-contrast-shadow) !important;
        }
        body.glassmorphism .file-explorer .fe-tree-node i.fe-tree-icon,
        body.glassmorphism .file-explorer .fe-tree-node > i.fas {
            color: var(--fe-palette-muted, var(--theme-contrast-muted)) !important;
        }
        body.glassmorphism .file-explorer .fe-tree-node.active i.fe-tree-icon,
        body.glassmorphism .file-explorer .fe-tree-node.active > i.fas {
            color: var(--fe-palette-text, var(--theme-contrast-text)) !important;
        }
        body.glassmorphism .file-explorer .fe-tree-branch-open:not(.active) .fe-tree-label {
            color: var(--fe-palette-muted, var(--theme-contrast-muted)) !important;
        }
        body.glassmorphism .file-explorer .explorer-item-name {
            color: var(--fe-palette-text, var(--theme-contrast-text)) !important;
            text-shadow: 0 1px 2px var(--theme-contrast-shadow) !important;
        }
        body.glassmorphism .file-explorer .explorer-item-sub,
        body.glassmorphism .file-explorer .explorer-col-size,
        body.glassmorphism .file-explorer .explorer-col-date,
        body.glassmorphism .file-explorer .explorer-item-pathline {
            color: var(--fe-palette-muted, var(--theme-contrast-muted)) !important;
        }
        body.glassmorphism .file-explorer .explorer-item-menu-btn {
            color: var(--fe-palette-text, var(--theme-contrast-text)) !important;
        }
        body.skeuomorphism .file-explorer {
            background: var(--fe-palette-main-bg, linear-gradient(to bottom, var(--skeuo-gradient-top), color-mix(in srgb, var(--skeuo-gradient-top) 60%, var(--skeuo-gradient-bottom) 40%))) !important;
            color: var(--fe-palette-text, var(--theme-contrast-text)) !important;
        }
        body.skeuomorphism .file-explorer .fe-sidebar {
            background: var(--fe-palette-sidebar-bg, linear-gradient(to bottom, color-mix(in srgb, var(--skeuo-gradient-top) 55%, var(--skeuo-gradient-bottom) 45%), color-mix(in srgb, var(--skeuo-gradient-top) 35%, var(--skeuo-gradient-bottom) 65%))) !important;
            border-right: 1px solid var(--fe-palette-border, var(--skeuo-border)) !important;
            box-shadow: inset -1px 0 0 rgba(255, 255, 255, 0.35);
        }
        body.flat .file-explorer {
            background: var(--fe-palette-main-bg, var(--flat-surface)) !important;
            color: var(--fe-palette-text, var(--theme-contrast-text)) !important;
        }
        body.flat .file-explorer .fe-sidebar {
            background: var(--fe-palette-sidebar-bg, var(--flat-sidebar)) !important;
            border-right: 1px solid var(--fe-palette-border, var(--flat-sidebar-border)) !important;
            box-shadow: none;
        }
        body.material .file-explorer {
            background: var(--fe-palette-main-bg, var(--material-surface)) !important;
            color: var(--fe-palette-text, var(--theme-contrast-text)) !important;
        }
        body.material .file-explorer .fe-sidebar {
            background: var(--fe-palette-sidebar-bg, var(--material-sidebar)) !important;
            border-right: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--material-shadow-color)) 8%, transparent) !important;
            box-shadow: 2px 0 8px color-mix(in srgb, var(--material-shadow-color) 6%, transparent);
        }
        body.brutalism .file-explorer {
            background: var(--fe-palette-main-bg, var(--brutal-bg)) !important;
            color: var(--fe-palette-text, var(--brutal-text)) !important;
            --fe-tree-accent: var(--fe-palette-accent, #ff3b30);
        }
        body.brutalism .file-explorer .fe-sidebar {
            background: var(--fe-palette-sidebar-bg, var(--brutal-bg)) !important;
            border-right: 3px solid var(--fe-palette-border, var(--brutal-accent)) !important;
            color: var(--fe-palette-text, var(--brutal-text)) !important;
            box-shadow: none;
        }
        body.brutalism .file-explorer .fe-sidebar-head,
        body.brutalism .file-explorer .fe-tree-node,
        body.brutalism .file-explorer .fe-breadcrumb,
        body.brutalism .file-explorer .explorer-toolbar button {
            color: var(--fe-palette-text, var(--brutal-text)) !important;
        }
        body.brutalism .file-explorer .fe-search-input {
            background: var(--fe-palette-input-bg, color-mix(in srgb, var(--brutal-bg) 85%, #ffffff 15%)) !important;
            color: var(--fe-palette-text, var(--brutal-text)) !important;
            border: 3px solid var(--fe-palette-border, var(--brutal-accent)) !important;
        }
        body.retro .file-explorer {
            background: var(--fe-palette-main-bg, var(--retro-bg)) !important;
            color: var(--fe-palette-text, var(--retro-text)) !important;
            --fe-tree-accent: var(--fe-palette-accent, #ffff99);
        }
        body.retro .file-explorer .fe-sidebar {
            background: var(--fe-palette-sidebar-bg, var(--retro-sidebar)) !important;
            border-right: 2px solid var(--fe-palette-border, var(--retro-border)) !important;
            color: var(--fe-palette-text, var(--retro-text)) !important;
            box-shadow: none;
        }
        body.retro .file-explorer .fe-sidebar-head,
        body.retro .file-explorer .fe-tree-node,
        body.retro .file-explorer .fe-breadcrumb,
        body.retro .file-explorer .explorer-toolbar button {
            color: var(--fe-palette-text, var(--retro-text)) !important;
        }
        body.dark .file-explorer {
            background: var(--fe-palette-main-bg, var(--dark-surface)) !important;
            color: var(--fe-palette-text, var(--dark-text)) !important;
            --fe-tree-accent: var(--fe-palette-accent, #5ac8fa);
        }
        body.dark .file-explorer .fe-sidebar {
            background: var(--fe-palette-sidebar-bg, var(--dark-sidebar)) !important;
            border-right: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--dark-text)) 10%, transparent) !important;
            color: var(--fe-palette-text, var(--dark-text)) !important;
            box-shadow: inset -1px 0 0 color-mix(in srgb, var(--dark-text) 4%, transparent);
        }
        body.dark .file-explorer .fe-sidebar-head,
        body.dark .file-explorer .fe-tree-node,
        body.dark .file-explorer .fe-breadcrumb,
        body.dark .file-explorer .explorer-path,
        body.dark .file-explorer .explorer-toolbar button {
            color: var(--fe-palette-text, var(--dark-text)) !important;
        }
        body.dark .file-explorer .fe-search-input {
            background: var(--fe-palette-input-bg, color-mix(in srgb, var(--dark-surface) 70%, var(--dark-text) 30%)) !important;
            color: var(--fe-palette-text, var(--dark-text)) !important;
            border-color: color-mix(in srgb, var(--fe-palette-border, var(--dark-text)) 15%, transparent) !important;
        }
        body.dark .file-explorer .fe-tree-node:hover {
            background: color-mix(in srgb, var(--fe-palette-text, var(--dark-text)) 8%, transparent) !important;
        }
        body.dark .file-explorer .fe-tree-children {
            border-left-color: color-mix(in srgb, var(--fe-palette-border, var(--dark-text)) 12%, transparent);
        }
        body.minimalism .file-explorer {
            background: var(--fe-palette-main-bg, var(--minimal-surface)) !important;
            color: var(--fe-palette-text, var(--minimal-text)) !important;
        }
        body.minimalism .file-explorer .fe-sidebar {
            background: var(--fe-palette-sidebar-bg, var(--minimal-sidebar)) !important;
            border-right: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--minimal-text)) 8%, transparent) !important;
            box-shadow: none;
        }
        body.cyberpunk .file-explorer {
            background: var(--fe-palette-main-bg, var(--cyber-bg)) !important;
            color: var(--fe-palette-text, var(--cyber-neon)) !important;
            --fe-tree-accent: var(--fe-palette-accent, #00ffff);
        }
        body.cyberpunk .file-explorer .fe-sidebar {
            background: var(--fe-palette-sidebar-bg, var(--cyber-bg)) !important;
            border-right: 2px solid var(--fe-palette-border, var(--cyber-accent)) !important;
            color: var(--fe-palette-text, var(--cyber-neon)) !important;
            box-shadow: none;
            text-shadow: 0 0 4px color-mix(in srgb, var(--cyber-neon) 45%, transparent);
        }
        body.cyberpunk .file-explorer .fe-sidebar-head,
        body.cyberpunk .file-explorer .fe-tree-node,
        body.cyberpunk .file-explorer .fe-breadcrumb,
        body.cyberpunk .file-explorer .explorer-toolbar button {
            color: var(--fe-palette-text, var(--cyber-neon)) !important;
        }
        body.cyberpunk .file-explorer .fe-search-input {
            background: var(--fe-palette-input-bg, color-mix(in srgb, var(--cyber-bg) 92%, var(--cyber-neon) 8%)) !important;
            color: var(--fe-palette-text, var(--cyber-neon)) !important;
            border-color: var(--fe-palette-border, var(--cyber-accent)) !important;
        }
        body.gradient .file-explorer {
            background: var(--fe-palette-main-bg, linear-gradient(45deg, var(--gradient-color-1) 0%, var(--gradient-color-2) 100%)) !important;
            color: var(--fe-palette-text, var(--theme-contrast-text)) !important;
            --fe-tree-accent: var(--fe-palette-accent, color-mix(in srgb, #0a84ff 65%, var(--theme-contrast-text) 35%));
        }
        body.gradient .file-explorer .fe-sidebar {
            background: var(--fe-palette-sidebar-bg, rgba(255, 255, 255, 0.22)) !important;
            backdrop-filter: blur(8px);
            -webkit-backdrop-filter: blur(8px);
            border-right: 1px solid color-mix(in srgb, var(--fe-palette-border, #ffffff) 25%, transparent) !important;
            color: var(--fe-palette-text, var(--theme-contrast-text)) !important;
            box-shadow: none;
        }
        body.gradient .file-explorer .fe-sidebar-head,
        body.gradient .file-explorer .fe-tree-node,
        body.gradient .file-explorer .fe-breadcrumb,
        body.gradient .file-explorer .explorer-toolbar button {
            color: var(--fe-palette-text, var(--theme-contrast-text)) !important;
        }

        body.glassgradient .file-explorer,
        body.auroracrystal3d .file-explorer {
            background: var(--fe-palette-main-bg, linear-gradient(
                145deg,
                color-mix(in srgb, var(--gradient-color-1) 58%, transparent),
                color-mix(in srgb, var(--gradient-color-2) 52%, transparent)
            )) !important;
            color: var(--fe-palette-text, var(--theme-contrast-text)) !important;
        }
        body.glassgradient .file-explorer .fe-sidebar,
        body.auroracrystal3d .file-explorer .fe-sidebar {
            background: var(--fe-palette-sidebar-bg, color-mix(in srgb, var(--glass-tint) 30%, transparent)) !important;
            backdrop-filter: blur(14px) saturate(160%);
            -webkit-backdrop-filter: blur(14px) saturate(160%);
            border-right: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--glass-border-tint)) 28%, transparent) !important;
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
            color: var(--fe-palette-text, var(--theme-contrast-text)) !important;
        }
        body.glassgradient .file-explorer .fe-sidebar-head,
        body.auroracrystal3d .file-explorer .fe-sidebar-head,
        body.glassgradient .file-explorer .fe-tree-node,
        body.auroracrystal3d .file-explorer .fe-tree-node,
        body.glassgradient .file-explorer .fe-breadcrumb,
        body.auroracrystal3d .file-explorer .fe-breadcrumb,
        body.glassgradient .file-explorer .explorer-path,
        body.auroracrystal3d .file-explorer .explorer-path,
        body.glassgradient .file-explorer .explorer-toolbar button,
        body.auroracrystal3d .file-explorer .explorer-toolbar button {
            color: var(--fe-palette-text, var(--theme-contrast-text)) !important;
        }
        body.glassgradient .file-explorer .fe-search-input,
        body.auroracrystal3d .file-explorer .fe-search-input {
            background: var(--fe-palette-input-bg, color-mix(in srgb, var(--glass-tint) 38%, transparent)) !important;
            color: var(--fe-palette-text, var(--theme-contrast-text)) !important;
            border-color: color-mix(in srgb, var(--fe-palette-border, var(--glass-border-tint)) 20%, transparent) !important;
        }
        body.glassgradient .file-explorer .fe-tree,
        body.auroracrystal3d .file-explorer .fe-tree,
        body.glassgradient .file-explorer .fe-main,
        body.auroracrystal3d .file-explorer .fe-main,
        body.glassgradient .file-explorer .fe-items-wrap,
        body.auroracrystal3d .file-explorer .fe-items-wrap,
        body.glassgradient .file-explorer .explorer-items,
        body.auroracrystal3d .file-explorer .explorer-items {
            color: var(--fe-palette-text, var(--theme-contrast-text)) !important;
            --fe-fg: var(--fe-palette-text, var(--theme-contrast-text)) !important;
            --fe-fg-muted: var(--fe-palette-muted, var(--theme-contrast-muted)) !important;
        }
        body.glassgradient .file-explorer .fe-tree-expander,
        body.auroracrystal3d .file-explorer .fe-tree-expander,
        body.glassgradient .file-explorer .fe-tree-label,
        body.auroracrystal3d .file-explorer .fe-tree-label {
            color: var(--fe-palette-text, var(--theme-contrast-text)) !important;
            text-shadow: 0 1px 2px var(--theme-contrast-shadow) !important;
        }
        body.glassgradient .file-explorer .fe-tree-node i.fe-tree-icon,
        body.auroracrystal3d .file-explorer .fe-tree-node i.fe-tree-icon,
        body.glassgradient .file-explorer .fe-tree-node > i.fas,
        body.auroracrystal3d .file-explorer .fe-tree-node > i.fas {
            color: var(--fe-palette-muted, var(--theme-contrast-muted)) !important;
        }
        body.glassgradient .file-explorer .fe-tree-node.active i.fe-tree-icon,
        body.auroracrystal3d .file-explorer .fe-tree-node.active i.fe-tree-icon,
        body.glassgradient .file-explorer .fe-tree-node.active > i.fas,
        body.auroracrystal3d .file-explorer .fe-tree-node.active > i.fas {
            color: var(--fe-palette-text, var(--theme-contrast-text)) !important;
        }
        body.glassgradient .file-explorer .fe-tree-branch-open:not(.active) .fe-tree-label,
        body.auroracrystal3d .file-explorer .fe-tree-branch-open:not(.active) .fe-tree-label {
            color: var(--fe-palette-muted, var(--theme-contrast-muted)) !important;
        }
        body.glassgradient .file-explorer .explorer-item-name,
        body.auroracrystal3d .file-explorer .explorer-item-name {
            color: var(--fe-palette-text, var(--theme-contrast-text)) !important;
            text-shadow: 0 1px 2px var(--theme-contrast-shadow) !important;
        }
        body.glassgradient .file-explorer .explorer-item-sub,
        body.auroracrystal3d .file-explorer .explorer-item-sub,
        body.glassgradient .file-explorer .explorer-col-size,
        body.auroracrystal3d .file-explorer .explorer-col-size,
        body.glassgradient .file-explorer .explorer-col-date,
        body.auroracrystal3d .file-explorer .explorer-col-date,
        body.glassgradient .file-explorer .explorer-item-pathline,
        body.auroracrystal3d .file-explorer .explorer-item-pathline {
            color: var(--fe-palette-muted, var(--theme-contrast-muted)) !important;
        }
        body.glassgradient .file-explorer .explorer-item-menu-btn,
        body.auroracrystal3d .file-explorer .explorer-item-menu-btn {
            color: var(--fe-palette-text, var(--theme-contrast-text)) !important;
        }
        body.card .file-explorer {
            background: var(--fe-palette-main-bg, var(--card-surface)) !important;
            color: var(--fe-palette-text, var(--theme-contrast-text)) !important;
        }
        body.card .file-explorer .fe-sidebar {
            background: var(--fe-palette-sidebar-bg, var(--card-sidebar)) !important;
            border-right: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 6%, transparent) !important;
            border-radius: 0 12px 12px 0;
            box-shadow: 4px 0 12px color-mix(in srgb, var(--theme-contrast-text) 6%, transparent);
        }
        body.neumorphism .file-explorer {
            background: var(--fe-palette-main-bg, var(--neumorphic-bg)) !important;
            color: var(--fe-palette-text, var(--theme-contrast-text)) !important;
        }
        body.neumorphism .file-explorer .fe-sidebar {
            background: var(--fe-palette-sidebar-bg, var(--neumorphic-bg));
            box-shadow:
                inset -4px 0 8px var(--neumorphic-shadow-dark),
                inset 4px 0 8px var(--neumorphic-shadow-light);
        }
        body.morphing .file-explorer {
            background: var(--fe-palette-main-bg, var(--morph-panel)) !important;
            color: var(--fe-palette-text, var(--theme-contrast-text)) !important;
        }
        body.morphing .file-explorer .fe-sidebar {
            background: var(--fe-palette-sidebar-bg, var(--morph-panel)) !important;
            border-right: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 14%, transparent) !important;
            box-shadow: inset -1px 0 0 color-mix(in srgb, var(--theme-contrast-text) 8%, transparent);
        }
        body.isometric .file-explorer {
            background: var(--fe-palette-main-bg, var(--iso-panel)) !important;
            color: var(--fe-palette-text, var(--theme-contrast-text)) !important;
        }
        body.isometric .file-explorer .fe-sidebar {
            background: var(--fe-palette-sidebar-bg, var(--iso-panel)) !important;
            border-right: 1px solid color-mix(in srgb, var(--fe-palette-border, var(--theme-contrast-text)) 14%, transparent) !important;
            box-shadow: inset -1px 0 0 color-mix(in srgb, var(--theme-contrast-text) 8%, transparent);
        }
        body.typography .file-explorer {
            background: var(--fe-palette-main-bg, var(--typography-panel)) !important;
            color: var(--fe-palette-text, var(--theme-contrast-text)) !important;
        }
        body.typography .file-explorer .fe-sidebar,
        body.typography .file-explorer .fe-tree-node {
            font-family: 'Arial Black', sans-serif !important;
            font-weight: bold !important;
        }

        .app-item {
            background-color: var(--mosaic-bg-color) !important;
        }

        body, input, select, textarea, button, .topbar, .modal-content, .config-btn, .add-app-btn, .app-item p {
            color: var(--text-color);
        }

        .action-type-selector {
            display: flex;
            flex-direction: column;
            gap: 8px;
            margin-bottom: 12px;
        }
        
        @media (min-width: 768px) {
            .action-type-selector {
                flex-direction: row;
                gap: 15px;
                margin-bottom: 15px;
            }
        }
        
        .action-type-selector label {
            display: flex;
            align-items: center;
            gap: 5px;
        }

        #previewModal {
            display: none;
            position: fixed;
            z-index: 1000;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            height: 100dvh;
            overflow: hidden;
            background-color: rgba(0,0,0,0.4);
        }

        #previewModal .modal-content {
            background-color: #fefefe;
            margin: 2% auto;
            padding: 15px;
            border: 1px solid #888;
            width: 95%;
            max-width: 90vw;
            height: 90vh;
            display: flex;
            flex-direction: column;
            overflow: hidden;
            border-radius: 12px;
        }

        @media (min-width: 1024px) {
            #previewModal .modal-content {
                width: 85%;
                height: 85vh;
                margin: 1% auto;
            }
        }

        #previewWindowFrame .window-content {
            display: flex;
            flex-direction: column;
            flex: 1;
            min-height: 0;
            overflow: hidden;
        }
        #previewContent {
            flex: 1;
            min-height: 0;
            width: 100%;
            height: auto;
            border: none;
            overflow: hidden;
            position: relative;
            display: flex;
            align-items: center;
            justify-content: center;
            background-color: #1a1a1a;
        }
        /* PDF.js en Android: ocupar todo el área del modal (flex no encoge el lienzo). */
        #previewContent > .pdf-canvas-root {
            width: 100%;
            align-self: stretch;
            flex: 1 1 auto;
            min-height: 0;
            min-width: 0;
            position: relative;
        }
        #previewContent .pdf-canvas-scroll-wrap {
            flex: 1 1 auto;
            min-height: 0;
            min-width: 0;
        }

        /* Pellizco PDF: evitar selección de texto/callout que compita con el gesto (sobre todo iOS). */
        .pdf-canvas-zoom-layer,
        .pdf-canvas-zoom-layer canvas {
            -webkit-user-select: none;
            user-select: none;
            -webkit-touch-callout: none;
        }

        /* Panel HUD de zoom (indicador + slider + reset) */
        .pdf-zoom-hud {
            position: fixed;
            top: 50px;
            right: 40px;
            z-index: 20000;
            background: rgba(0,0,0,0.45);
            color: #fff;
            border-radius: 12px;
            padding: 8px 10px;
            backdrop-filter: blur(8px);
            -webkit-backdrop-filter: blur(8px);
            max-width: 180px;
            pointer-events: auto;
            font-size: 12px;
            line-height: 1.2;
            opacity: 1;
            transition: opacity 0.35s ease;
        }
        .pdf-zoom-hud--dim {
            opacity: 0;
            pointer-events: none;
        }
        .pdf-zoom-hud .pdf-zoom-hud-row {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 8px;
            margin-bottom: 6px;
        }
        .pdf-zoom-hud-value {
            font-weight: 700;
            white-space: nowrap;
        }
        .pdf-zoom-hud-reset {
            background: rgba(255,255,255,0.18);
            border: 1px solid rgba(255,255,255,0.18);
            color: #fff;
            border-radius: 8px;
            padding: 6px 10px;
            cursor: pointer;
            font-weight: 700;
        }
        .pdf-zoom-hud-reset:active {
            transform: scale(0.98);
        }
        .pdf-zoom-hud-range {
            width: 100%;
            touch-action: manipulation;
        }
        .pdf-zoom-hud,
        .pdf-zoom-hud * {
            touch-action: manipulation;
        }

        #previewActions {
            margin-top: 15px;
            text-align: right;
            display: flex;
            gap: 10px;
            justify-content: flex-end;
            flex-wrap: wrap;
            flex-shrink: 0;
        }

        #previewModal .close {
            color: #aaa;
            font-size: 28px;
            font-weight: bold;
            cursor: pointer;
            position: sticky;
            top: 0;
            background-color: #fefefe;
            z-index: 2;
            width: 36px;
            height: 36px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 10px;
            line-height: 1;
            padding: 0;
            margin-left: auto;
        }

        #previewModal .close:hover,
        #previewModal .close:focus {
            color: #000;
            text-decoration: none;
            cursor: pointer;
        }

        #previewActions button {
            margin-left: 0;
            min-width: 100px;
        }

        #backgroundTab .input-group {
            display: flex;
            flex-direction: column;
            gap: 8px;
            margin-bottom: 15px;
        }
        
        @media (min-width: 768px) {
            #backgroundTab .input-group {
                flex-direction: row;
                align-items: center;
                gap: 10px;
            }
        }
        
        #backgroundTab .input-group label {
            margin-right: 0;
            min-width: 120px;
        }
        
        #youtubeLink, #bgFile {
            flex-grow: 1;
            width: 100%;
        }
        
        #previewContainer {
            position: relative;
            width: 100%;
            height: 150px;
            overflow: hidden;
            margin-bottom: 15px;
        }
        
        @media (min-width: 768px) {
            #previewContainer {
                height: 200px;
            }
        }
        
        #previewContainer img,
        #previewContainer video {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
        
        #youtubePreview {
            width: 100%;
            height: 100%;
        }
        
        .background-option {
            margin-bottom: 15px;
            display: flex;
            flex-direction: column;
            gap: 8px;
        }
        
        @media (min-width: 768px) {
            .background-option {
                flex-direction: row;
                gap: 15px;
                flex-wrap: wrap;
            }
        }
        
        .background-option label {
            display: flex;
            align-items: center;
            gap: 5px;
        }

        #youtubeInputGroup label {
            display: block;
            margin-bottom: 5px;
            font-weight: bold;
        }

        #youtubeInputGroup input {
            width: 100%;
            margin-bottom: 12px;
        }

        #youtubeInputGroup .fas {
            color: #007bff;
            font-size: 14px;
        }

        #youtubeInputGroup .fas:hover {
            color: #0056b3;
        }

        .youtube-field {
            margin-bottom: 15px;
        }
        
        .youtube-field label {
            display: block;
            margin-bottom: 5px;
        }

        #bgUploadProgress {
            display: none;
            margin-top: 8px;
            width: 100%;
        }
        
        #bgUploadProgress > div:first-child {
            background: #ccc;
            border-radius: 8px;
            overflow: hidden;
            height: 14px;
        }
        
        #bgProgressBar {
            height: 100%;
            background: linear-gradient(90deg, #4caf50, #81c784);
            width: 0%;
            transition: width 0.3s;
        }
        
        #bgProgressLabel {
            font-size: 12px;
            text-align: right;
            margin-top: 3px;
        }

        #appCategoryFilter {
            width: 100%;
            padding: 6px 10px;
            margin-bottom: 4px;
            border: none;
            border-radius: 8px;
            font-size: 13px;
            box-sizing: border-box;
        }
        
        .category-form > div {
            position: relative;
            flex: 1;
            min-width: 150px;
        }
        
        .theme-actions {
            display: flex;
            flex-direction: column;
            align-items: center;
            margin-top: 20px;
            gap: 10px;
        }
        
        .restore-theme-btn {
            width: 100%;
            max-width: 300px;
            background-color: #ff9800;
            color: white;
        }
        
        .apply-theme-btn {
            width: 100%;
            max-width: 300px;
        }
        
        .theme-preview-notice {
            display: none;
            margin: 10px 0;
            padding: 8px 15px;
            background-color: var(--neumorphic-shadow-light);
            border-radius: 20px;
            font-size: 14px;
            text-align: center;
        }
        
        .theme-preview-notice i {
            margin-right: 5px;
            color: #4CAF50;
        }

        .theme-palette-title {
            margin: 14px 0 6px;
            font-size: 15px;
        }
        .theme-palette-hint {
            margin: 0 0 10px;
            font-size: 13px;
            opacity: 0.9;
        }
        .theme-palette-panel {
            margin: 10px 0 14px;
            padding: 12px;
            border-radius: 12px;
            background: color-mix(in srgb, var(--neumorphic-shadow-light) 65%, transparent);
            border: 1px solid color-mix(in srgb, var(--neumorphic-shadow-dark) 25%, transparent);
        }
        .theme-palette-section .theme-palette-heading {
            margin: 0 0 10px;
            font-size: 14px;
        }
        .theme-palette-row {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
            margin-bottom: 8px;
            flex-wrap: wrap;
        }
        .theme-palette-row label {
            display: flex;
            align-items: center;
            gap: 8px;
            font-size: 13px;
            flex: 1;
            min-width: 0;
        }
        .theme-palette-row input[type="color"] {
            width: 44px;
            height: 32px;
            padding: 0;
            border: none;
            background: transparent;
            cursor: pointer;
        }
        .theme-palette-row input[type="range"] {
            flex: 1;
            min-width: 140px;
            max-width: 240px;
            height: 28px;
            accent-color: #6366f1;
            cursor: pointer;
        }
        .theme-palette-row label.theme-palette-range-label {
            flex-direction: column;
            align-items: stretch;
            gap: 6px;
        }
        .theme-palette-row label.theme-palette-range-label span.theme-palette-range-meta {
            font-size: 11px;
            opacity: 0.75;
            font-weight: 600;
        }
        
        #categoryList li {
            display: flex;
            flex-direction: column;
            gap: 10px;
            margin-bottom: 15px;
            padding: 10px;
            background-color: rgba(255,255,255,0.05);
            border-radius: 10px;
        }
        
        @media (min-width: 768px) {
            #categoryList li {
                flex-direction: row;
                justify-content: space-between;
                align-items: center;
            }
        }
        
        #categoryList li > div {
            display: flex;
            gap: 5px;
            justify-content: flex-end;
        }
        
        .strip-menu-backdrop {
            display: none;
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-color: rgba(0,0,0,0.5);
            z-index: 1999;
            touch-action: manipulation;
        }
        
        .image-preview-container {
            position: relative;
            width: 100%;
            height: 100%;
            overflow: hidden;
            background-color: #f0f0f0;
            touch-action: none;
        }

        .image-preview-wrapper {
            width: 100%;
            height: 100%;
            display: flex;
            flex-direction: column;
        }

        .image-preview-controls-bottom {
            flex-shrink: 0;
            padding: 10px 12px;
            display: flex;
            gap: 10px;
            justify-content: center;
            align-items: center;
            background: rgba(0,0,0,0.12);
            backdrop-filter: blur(6px);
        }

        .image-preview-controls-bottom button {
            min-width: 42px;
            height: 34px;
            border-radius: 8px;
            border: none;
            cursor: pointer;
            background: rgba(255,255,255,0.12);
            color: var(--theme-contrast-text);
            text-shadow: 0 1px 2px var(--theme-contrast-shadow);
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: 0 12px;
        }

        .image-preview-controls-bottom button i {
            margin-right: 8px;
        }
        
        .image-preview-container img {
            position: absolute;
            left: 50%;
            top: 50%;
            max-width: 95%;
            max-height: 95%;
            width: auto;
            height: auto;
            object-fit: contain;
            transition: transform 0.1s ease;
            cursor: grab;
            transform-origin: center center;
            transform: translate(-50%, -50%) scale(1);
            touch-action: none;
            user-select: none;
            -webkit-user-drag: none;
        }
        
        .image-preview-container img.zoomed {
            cursor: grabbing;
            max-width: none;
            max-height: none;
        }
        
        .image-preview-container img.dragging {
            cursor: grabbing;
        }
        
        .preview-controls {
            position: absolute;
            bottom: 20px;
            left: 50%;
            transform: translateX(-50%);
            display: flex;
            gap: 10px;
            background-color: rgba(0,0,0,0.7);
            padding: 8px 15px;
            border-radius: 30px;
            z-index: 10;
            touch-action: manipulation;
        }
        
        .preview-controls button {
            background: transparent;
            color: white;
            border: none;
            font-size: 20px;
            cursor: pointer;
            padding: 5px 10px;
            min-height: auto;
            box-shadow: none;
            background-color: rgba(255,255,255,0.1);
            border-radius: 5px;
            touch-action: manipulation;
        }
        
        .preview-controls button:hover {
            background-color: rgba(255,255,255,0.3);
        }
        
        .preview-controls button:focus-visible {
            outline: 2px solid var(--focus-color);
        }

        /* Ondas animadas para MP3 */
        .audio-animation {
            display: flex;
            gap: 4px;
            align-items: flex-end;
            justify-content: center;
            height: 24px;
        }
        .audio-animation span {
            width: 5px;
            border-radius: 6px;
            background: var(--text-color);
            height: 8px;
            animation: audioWave 0.9s infinite ease-in-out;
            opacity: 0.9;
        }
        .audio-animation span:nth-child(1) { animation-delay: 0s; }
        .audio-animation span:nth-child(2) { animation-delay: 0.15s; }
        .audio-animation span:nth-child(3) { animation-delay: 0.3s; }
        @keyframes audioWave {
            0%, 100% { transform: scaleY(0.5); height: 8px; }
            50% { transform: scaleY(1.4); height: 22px; }
        }
        
        .input-with-preview {
            display: flex;
            gap: 10px;
            align-items: center;
        }
        
        .input-with-preview input {
            flex: 1;
            margin-bottom: 0;
        }
        
        .preview-btn {
            padding: 10px 15px;
            min-width: 60px;
            margin-bottom: 0;
            background: var(--control-chip-bg) !important;
            background-color: var(--control-chip-bg) !important;
            color: var(--control-chip-fg) !important;
            border: 1px solid var(--control-chip-border) !important;
            box-shadow: none !important;
        }
        
        .preview-btn:hover {
            background: var(--control-chip-hover-bg) !important;
            background-color: var(--control-chip-hover-bg) !important;
            filter: brightness(1.02);
        }
        
        .file-info {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-top: -5px;
            margin-bottom: 10px;
            padding: 5px 10px;
            background-color: rgba(0,0,0,0.05);
            border-radius: 8px;
        }
        
        .file-info span {
            font-size: 13px;
            color: var(--text-color);
        }
        
        .f2-hint {
            position: fixed;
            bottom: 70px;
            left: 20px;
            background-color: rgba(0,0,0,0.5);
            color: white;
            padding: 5px 10px;
            border-radius: 5px;
            font-size: 12px;
            z-index: 100;
            pointer-events: none;
        }
        
        @media (max-width: 768px) {
            .f2-hint {
                display: none;
            }
        }
        
        .no-touch {
            touch-action: manipulation;
        }
        
        body.modal-open {
            overflow: hidden;
            position: fixed;
            width: 100%;
            height: 100%;
        }

        /* Modal de progreso de copia/subida (FTP/WebDAV) */
        .explorer-progress-modal {
            display: none;
            position: fixed;
            inset: 0;
            background: rgba(0, 0, 0, 0.55);
            z-index: 700000;
            align-items: center;
            justify-content: center;
            padding: 18px;
            box-sizing: border-box;
        }
        .explorer-progress-card {
            width: min(520px, 96vw);
            background: linear-gradient(165deg, rgba(255,255,255,0.10), rgba(255,255,255,0.04));
            border: 1px solid rgba(255,255,255,0.14);
            border-radius: 18px;
            box-shadow: 0 24px 48px rgba(0,0,0,0.45);
            padding: 18px 18px 14px;
            color: #fff;
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
        }
        .explorer-progress-title {
            font-weight: 700;
            font-size: 1.05rem;
            letter-spacing: -0.01em;
            margin-bottom: 6px;
        }
        .explorer-progress-sub {
            font-size: 0.9rem;
            opacity: 0.9;
            word-break: break-word;
            margin-bottom: 12px;
        }
        .explorer-progress-bar {
            height: 12px;
            border-radius: 999px;
            background: rgba(255,255,255,0.14);
            overflow: hidden;
            border: 1px solid rgba(255,255,255,0.12);
        }
        .explorer-progress-bar-fill {
            height: 100%;
            width: 0%;
            background: linear-gradient(90deg, #22c55e, #3b82f6);
            transition: width 0.12s ease;
        }
        .explorer-progress-meta {
            display: flex;
            justify-content: space-between;
            gap: 10px;
            margin-top: 10px;
            font-size: 0.88rem;
            opacity: 0.95;
        }

        /* Menú estilo Windows */
        body:not(.mobile-mode) .windows-menu,
        body.mobile-pc-mode .windows-menu {
            display: none;
            position: fixed;
            background-color: var(--neumorphic-bg);
            box-shadow: 5px 5px 10px var(--neumorphic-shadow-dark), -5px -5px 10px var(--neumorphic-shadow-light);
            margin: 10px;
            border-radius: 10px;
            overflow: hidden;
            z-index: 200;
            flex-direction: row;
            flex-wrap: wrap;
            align-content: flex-start;
        }
        .windows-menu-footer {
            flex: 1 1 100%;
            box-sizing: border-box;
            padding: 10px 12px 12px;
            border-top: 1px solid var(--neumorphic-shadow-dark);
            display: flex;
            flex-direction: column;
            gap: 8px;
            align-items: flex-start;
        }
        .windows-menu-footer__title {
            font-size: 11px;
            font-weight: 700;
            letter-spacing: 0.12em;
            text-transform: uppercase;
            opacity: 0.75;
            color: var(--text-color);
        }
        .windows-menu-footer__link {
            font-size: 13px;
            color: var(--text-color);
            text-decoration: underline;
            text-underline-offset: 3px;
        }
        .windows-menu-footer__btn {
            cursor: pointer;
            padding: 8px 14px;
            border-radius: 8px;
            border: 1px solid var(--neumorphic-shadow-dark);
            background: var(--neumorphic-bg);
            color: var(--text-color);
            font-size: 13px;
            box-shadow: 2px 2px 5px var(--neumorphic-shadow-dark), -2px -2px 5px var(--neumorphic-shadow-light);
        }
        .windows-menu-footer__btn:hover {
            filter: brightness(1.05);
        }
        .mobile-app-hub-section--session {
            border-top: 1px solid rgba(255,255,255,0.12);
            margin-top: 8px;
            padding-top: 10px;
        }
        .mobile-app-hub-session-actions {
            display: flex;
            flex-direction: column;
            gap: 10px;
            padding: 4px 0 8px;
        }
        .mobile-app-hub-session-link {
            color: inherit;
            font-size: 14px;
            text-decoration: underline;
        }
        .mobile-app-hub-session-logout {
            cursor: pointer;
            padding: 10px 12px;
            border-radius: 10px;
            border: 1px solid rgba(255,255,255,0.2);
            background: rgba(0,0,0,0.15);
            color: inherit;
            font-size: 14px;
        }
        body:not(.mobile-mode) .windows-menu-backdrop,
        body.mobile-pc-mode .windows-menu-backdrop {
            display: none;
            position: fixed;
            background-color: rgba(0,0,0,0.5);
            z-index: 199;
        }
        .windows-menu-categories {
            width: 200px;
            border-right: 1px solid var(--neumorphic-shadow-dark);
            overflow-y: auto;
            padding: 10px;
        }
        .windows-search-wrap {
            position: relative;
            margin-bottom: 10px;
        }
        .windows-menu-categories input {
            width: 100%;
            margin-bottom: 0;
            padding-right: 26px;
            padding: 5px;
            border-radius: 5px;
            border: none;
            background-color: var(--neumorphic-bg);
            /* inherit en inputs no es fiable entre navegadores; --text-color es el de configuración (JS). */
            color: var(--text-color);
            caret-color: var(--text-color);
            box-shadow: inset 2px 2px 5px var(--neumorphic-shadow-dark), inset -2px -2px 5px var(--neumorphic-shadow-light);
        }
        .windows-search-clear {
            position: absolute;
            right: 8px;
            top: 50%;
            transform: translateY(-50%);
            cursor: pointer;
            opacity: 0.6;
            font-size: 18px;
            line-height: 1;
            user-select: none;
            display: none;
        }
        .windows-search-clear.visible {
            display: inline-block;
        }
        .windows-search-clear:hover {
            opacity: 1;
        }
        .windows-menu-categories ul {
            list-style: none;
            padding: 0;
            margin: 0;
        }
        .windows-menu-categories li {
            padding: 10px;
            cursor: pointer;
            border-radius: 5px;
            margin-bottom: 5px;
            background-color: var(--category-bg);
            transition: background-color 0.2s;
        }
        .windows-menu-categories li:not(.active) {
            color: var(--text-color);
        }
        .windows-menu-categories li:hover {
            background-color: var(--category-hover);
        }
        .windows-menu-categories li.active {
            background-color: var(--category-active);
            color: white;
            font-weight: bold;
        }
        .windows-menu-apps {
            flex: 1;
            padding: 12px;
            overflow-y: auto;
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(96px, 112px));
            justify-content: start;
            gap: 12px;
            align-content: start;
        }
        .windows-menu-apps .app-item {
            background-color: var(--mosaic-bg-color);
            backdrop-filter: blur(8px);
            -webkit-backdrop-filter: blur(8px);
            padding: 8px 6px 6px;
            border-radius: 12px;
            border: 1px solid color-mix(in srgb, var(--text-color) 14%, transparent);
            box-shadow: inset 0 1px 0 color-mix(in srgb, var(--text-color) 8%, transparent);
            cursor: pointer;
            text-align: center;
            position: relative;
            touch-action: manipulation;
        }
        .windows-menu-apps .app-item img {
            width: 50px;
            height: 50px;
            object-fit: cover;
            border-radius: 10px;
        }
        .windows-menu-apps .app-item p {
            font-size: 11px;
            margin-top: 5px;
            color: var(--grid-text-color);
        }
        /* Solo menú legacy sin .os-shell; el menú Web OS usa cabecera flex/grid en os-shell.css */
        .windows-menu:not(.os-shell) .windows-menu-close {
            position: absolute;
            top: 10px;
            right: 10px;
            cursor: pointer;
            font-size: 24px;
            color: var(--text-color);
            z-index: 10;
            background: rgba(0,0,0,0.2);
            border-radius: 999px;
            width: 30px;
            height: 30px;
            display: flex;
            align-items: center;
            justify-content: center;
            line-height: 1;
        }
        .windows-menu:not(.os-shell) .windows-menu-close i {
            display: block;
            line-height: 1;
            transform: translateY(0.5px);
        }
        .windows-menu:not(.os-shell) .windows-menu-close:hover {
            background: rgba(0,0,0,0.4);
        }

        /* Barra de tareas estilo Windows */
        body:not(.mobile-mode) .taskbar,
        body.mobile-pc-mode .taskbar {
            display: none;
            position: fixed;
            background-color: var(--neumorphic-bg);
            box-shadow: 0 -2px 10px var(--neumorphic-shadow-dark);
            z-index: 300;
            align-items: center;
            padding: 0 10px;
            gap: 5px;
            overflow: hidden;
            min-width: 0;
        }
        .taskbar .start-button {
            background: transparent;
            border: none;
            width: 50px;
            height: 50px;
            border-radius: 50%;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            box-shadow: 2px 2px 5px var(--neumorphic-shadow-dark), -2px -2px 5px var(--neumorphic-shadow-light);
            overflow: hidden;
            padding: 0;
            flex-shrink: 0;
        }
        .taskbar .start-button img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            border-radius: 50%;
        }
        .taskbar .start-button i {
            font-size: 24px;
            color: var(--text-color);
        }
        .taskbar .recycle-bin {
            width: 50px;
            height: 50px;
            border-radius: 5px;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 24px;
            position: relative;
            flex-shrink: 0;
        }
        .taskbar .recycle-bin i {
            font-size: 24px;
            color: var(--text-color);
        }
        .taskbar .windows-mosaic-btn {
            width: 50px;
            height: 50px;
            border-radius: 5px;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 24px;
            position: relative;
            flex-shrink: 0;
        }
        .taskbar .windows-mosaic-btn i {
            font-size: 24px;
            color: var(--text-color);
        }
        .taskbar .windows-mosaic-btn:hover {
            transform: scale(1.05);
            background-color: rgba(255,255,255,0.2);
        }
        .taskbar .mobile-app-hub-btn {
            width: 50px;
            height: 50px;
            border-radius: 5px;
            cursor: pointer;
            display: none;
            align-items: center;
            justify-content: center;
            font-size: 24px;
            position: relative;
            flex-shrink: 0;
            color: var(--text-color);
        }
        .taskbar .mobile-app-hub-btn i {
            font-size: 22px;
            color: var(--text-color);
        }
        .taskbar .mobile-app-hub-btn .hub-count {
            position: absolute;
            top: -4px;
            right: -3px;
            min-width: 18px;
            height: 18px;
            padding: 0 4px;
            border-radius: 999px;
            background: #ef4444;
            color: #fff;
            font-size: 10px;
            font-weight: 700;
            display: none;
            align-items: center;
            justify-content: center;
            box-shadow: 0 2px 8px rgba(0,0,0,0.35);
        }
        .taskbar .mobile-app-hub-btn:hover {
            transform: scale(1.05);
            background-color: rgba(255,255,255,0.2);
        }
        body.mobile-pc-mode .taskbar .mobile-app-hub-btn {
            display: flex;
        }
        body:not(.mobile-pc-mode) .taskbar .mobile-app-hub-btn {
            display: none !important;
        }
        .mobile-app-hub-backdrop {
            display: none;
            position: fixed;
            inset: 0;
            z-index: 10040;
            background: rgba(0, 0, 0, 0.45);
        }
        .mobile-app-hub-backdrop.visible {
            display: block;
        }
        .mobile-app-hub-panel {
            position: absolute;
            left: 10px;
            right: 10px;
            bottom: calc(var(--taskbar-height) + 10px);
            height: calc(100vh - var(--taskbar-height) - 20px);
            max-height: calc(100vh - var(--taskbar-height) - 20px);
            width: auto;
            overflow: hidden;
            display: flex;
            flex-direction: column;
            border-radius: 14px;
            border: 1px solid color-mix(in srgb, var(--theme-contrast-text) 22%, transparent);
            background: color-mix(in srgb, var(--neumorphic-bg) 88%, var(--theme-contrast-text) 12%);
            color: var(--text-color);
            box-shadow: 0 14px 28px var(--theme-contrast-shadow);
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
            /* Poco margen superior + notch; el resto del alto queda para ancladas / abiertas */
            padding: calc(5px + env(safe-area-inset-top, 0px)) 12px 12px 12px;
            box-sizing: border-box;
        }
        .mobile-app-hub-head {
            display: flex;
            align-items: center;
            justify-content: flex-start;
            gap: 8px;
            padding-top: 5px;
            padding-bottom: 8px;
            margin-bottom: 8px;
            padding-right: 44px;
            border-bottom: 1px solid color-mix(in srgb, var(--theme-contrast-text) 18%, transparent);
            flex-shrink: 0;
        }
        .mobile-app-hub-title {
            font-weight: 700;
            font-size: 14px;
            color: var(--text-color);
        }
        .mobile-app-hub-close {
            border: none;
            background: color-mix(in srgb, var(--theme-contrast-text) 14%, transparent);
            color: inherit;
            width: 30px;
            height: 30px;
            border-radius: 10px;
            cursor: pointer;
            display: grid;
            place-items: center;
            padding: 0;
            line-height: 1;
        }
        .mobile-app-hub-close i {
            display: block;
            line-height: 1;
            transform: translateY(0.5px);
        }
        .mobile-app-hub-close--corner {
            position: absolute;
            top: calc(5px + env(safe-area-inset-top, 0px));
            right: max(10px, env(safe-area-inset-right, 0px));
            z-index: 10;
            width: 40px;
            height: 40px;
            min-width: 40px;
            min-height: 40px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 10px;
            font-size: 18px;
            line-height: 1;
            box-shadow: 0 2px 8px rgba(0,0,0,0.2);
        }
        .mobile-app-hub-close--corner:active {
            transform: scale(0.96);
        }
        .mobile-app-hub-panel > .mobile-app-hub-section + .mobile-app-hub-section {
            margin-top: 10px;
        }
        .mobile-app-hub-section {
            margin-top: 0;
            min-height: 0;
            display: flex;
            flex-direction: column;
        }
        /* Dos secciones: 50% / 50% del espacio disponible; una sola sección ocupa todo */
        .mobile-app-hub-section--pinned {
            flex: 1 1 0;
            min-height: 0;
        }
        .mobile-app-hub-section--open:not(.is-hidden) {
            flex: 1 1 0;
            min-height: 0;
        }
        .mobile-app-hub-section--open {
            min-height: 0;
        }
        .mobile-app-hub-section h4 {
            margin: 6px 0 8px;
            font-size: 12px;
            text-transform: uppercase;
            letter-spacing: 0.05em;
            color: color-mix(in srgb, var(--text-color) 72%, transparent);
            flex-shrink: 0;
        }
        .mobile-app-hub-strip {
            -webkit-overflow-scrolling: touch;
            scrollbar-width: thin;
            margin: 0;
            padding: 2px 4px 6px 2px;
        }
        .mobile-app-hub-strip--pinned {
            overflow-x: hidden;
            overflow-y: auto;
            flex: 1 1 auto;
            min-height: 0;
        }
        .mobile-app-hub-strip--open {
            overflow-x: hidden;
            overflow-y: auto;
            flex: 1 1 auto;
            min-height: 0;
        }
        /* Mantener el swipe dentro de la sección (no invadir “Ancladas”) SIN romper scroll vertical. */
        .mobile-app-hub-strip--open {
            position: relative;
            overflow-x: hidden;
            overflow-y: auto;
        }
        .mobile-app-hub-strip::-webkit-scrollbar {
            width: 6px;
            height: 6px;
        }
        .mobile-app-hub-strip::-webkit-scrollbar-thumb {
            background: color-mix(in srgb, var(--text-color) 28%, transparent);
            border-radius: 6px;
        }
        .mobile-app-hub-grid {
            display: grid;
            gap: 10px;
            align-content: start;
            width: 100%;
            box-sizing: border-box;
        }
        .mobile-app-hub-grid--pinned {
            grid-template-columns: repeat(auto-fill, minmax(86px, 1fr));
            gap: 10px;
        }
        .mobile-app-hub-grid--open {
            grid-template-columns: repeat(auto-fill, minmax(min(100%, 150px), 1fr));
            gap: 12px;
        }
        .mobile-app-hub-item {
            border: 1px solid color-mix(in srgb, var(--theme-contrast-text) 22%, transparent);
            background: color-mix(in srgb, var(--neumorphic-bg) 82%, var(--theme-contrast-text) 18%);
            color: var(--text-color);
            border-radius: 10px;
            padding: 8px 6px;
            cursor: pointer;
            min-height: 82px;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 6px;
            text-align: center;
            width: 100%;
            max-width: 100%;
            min-width: 0;
            box-sizing: border-box;
        }
        .mobile-app-hub-item--empty {
            width: auto;
            min-width: 100%;
            max-width: 100%;
            min-height: 56px;
            cursor: default;
            opacity: 0.9;
        }
        .mobile-app-hub-grid--open .windows-mosaic-tile {
            width: 100%;
            max-width: 100%;
            min-width: 0;
            margin: 0;
            box-sizing: border-box;
            /* Necesario para pointer swipe horizontal + permitir scroll vertical */
            touch-action: pan-y;
        }
        .mobile-app-hub-grid--open .windows-mosaic-thumb {
            height: clamp(100px, 24vw, 136px);
            margin-bottom: 6px;
        }
        .mobile-app-hub-grid--open .windows-mosaic-title {
            font-size: 12px;
        }
        .mobile-app-hub-grid--open .windows-mosaic-sub {
            color: color-mix(in srgb, var(--text-color) 68%, transparent);
        }
        .mobile-app-hub-panel .windows-mosaic-tile {
            background-color: color-mix(in srgb, var(--neumorphic-bg) 78%, var(--theme-contrast-text) 10%);
            border: 1px solid color-mix(in srgb, var(--theme-contrast-text) 20%, transparent);
            color: var(--text-color);
        }
        .mobile-app-hub-panel .windows-mosaic-tile.mobile-hub-swipe-active {
            transition: none !important;
            will-change: transform, opacity;
            touch-action: pan-y;
        }
        .mobile-app-hub-panel .windows-mosaic-tile.mobile-hub-swipe-closing {
            transition: transform 0.18s ease, opacity 0.18s ease !important;
        }
        .mobile-app-hub-panel .windows-mosaic-tile:hover {
            background-color: color-mix(in srgb, var(--neumorphic-bg) 68%, var(--theme-contrast-text) 14%);
        }
        .mobile-app-hub-panel .windows-mosaic-title {
            color: var(--text-color);
        }
        .mobile-app-hub-panel .windows-mosaic-sub {
            color: color-mix(in srgb, var(--text-color) 68%, transparent);
        }
        .mobile-app-hub-panel .windows-mosaic-thumb {
            background: color-mix(in srgb, var(--theme-contrast-text) 8%, transparent);
        }
        .mobile-app-hub-panel .windows-mosaic-meta i {
            color: color-mix(in srgb, var(--text-color) 62%, transparent);
        }
        .mobile-app-hub-section--open.is-hidden {
            display: none;
        }
        .mobile-app-hub-item:active {
            transform: scale(0.98);
        }
        .mobile-app-hub-item.mobile-hub-dragging {
            transform: scale(1.03);
            opacity: 0.92;
            box-shadow: 0 14px 28px rgba(0,0,0,0.35);
        }
        .mobile-app-hub-item img {
            width: 34px;
            height: 34px;
            border-radius: 8px;
            object-fit: cover;
        }
        .mobile-app-hub-item .name {
            font-size: 11px;
            line-height: 1.25;
            max-width: 100%;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        .mobile-app-hub-item .meta {
            font-size: 10px;
            color: color-mix(in srgb, var(--text-color) 68%, transparent);
        }
        /* Un solo bloque crece hacia el reloj; ancladas + abiertas van seguidas (sin dos columnas al 50%). */
        .taskbar .taskbar-strip {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 5px;
            flex: 1 1 auto;
            min-width: 0;
            overflow-x: auto;
            overflow-y: hidden;
            /* Padding superior para que el badge no quede recortado; sin fondo distinto del #taskbar */
            padding: 6px 8px 4px 6px;
            border-radius: 0;
            background: transparent;
            scrollbar-width: none;
            -webkit-overflow-scrolling: touch;
        }
        .taskbar .taskbar-strip::-webkit-scrollbar {
            height: 0;
        }
        .taskbar .pinned-apps {
            display: flex;
            gap: 5px;
            overflow-x: auto;
            padding: 0;
            overflow-y: hidden;
            flex: 0 0 auto;
            min-width: 0;
            max-width: none;
            scrollbar-width: none;
            -webkit-overflow-scrolling: touch;
        }
        .taskbar .pinned-apps::-webkit-scrollbar {
            height: 0;
        }
        .taskbar .pinned-app {
            width: 50px;
            height: 50px;
            border-radius: 8px;
            cursor: grab;
            display: flex;
            align-items: center;
            justify-content: center;
            background-color: var(--mosaic-bg-color);
            transition: all 0.2s;
            position: relative;
            flex-shrink: 0;
            /* Evita que border-radius recorte el badge (antes top/right negativos) */
            overflow: visible;
        }
        .taskbar .pinned-app:hover {
            transform: scale(1.05);
            background-color: rgba(255,255,255,0.2);
        }
        .taskbar .pinned-app:active,
        .taskbar .taskbar-app:active {
            cursor: grabbing;
        }
        .taskbar .pinned-app.taskbar-dragging,
        .taskbar .taskbar-app.taskbar-dragging {
            cursor: grabbing;
            opacity: 0.88;
            z-index: 5;
        }
        .taskbar .pinned-app img {
            width: 40px;
            height: 40px;
            object-fit: cover;
            border-radius: 6px;
        }
        .taskbar .pinned-app i {
            font-size: 24px;
        }
        .taskbar .taskbar-apps {
            display: flex;
            gap: 5px;
            overflow-x: auto;
            padding: 0;
            flex: 0 0 auto;
            overflow-y: hidden;
            min-width: 0;
            max-width: none;
            scrollbar-width: none;
            -webkit-overflow-scrolling: touch;
        }
        .taskbar .taskbar-apps::-webkit-scrollbar {
            height: 0;
        }
        .taskbar .taskbar-app {
            width: 50px;
            height: 50px;
            border-radius: 8px;
            cursor: grab;
            display: flex;
            align-items: center;
            justify-content: center;
            background-color: var(--mosaic-bg-color);
            transition: all 0.2s;
            position: relative;
            flex-shrink: 0;
            overflow: visible;
        }
        .taskbar .taskbar-app.active {
            background-color: rgba(255,255,255,0.3);
            box-shadow: inset 0 -2px 0 var(--focus-color);
        }
        .taskbar .taskbar-app:hover {
            transform: scale(1.05);
            background-color: rgba(255,255,255,0.2);
        }
        .taskbar .taskbar-app img {
            width: 40px;
            height: 40px;
            object-fit: cover;
            border-radius: 6px;
        }
        /* z-index solo por encima del icono/indicadores dentro del taskbar (ventanas usan ~10000).
           Posición inset: valores negativos quedaban fuera del tile y el border-radius recortaba el círculo. */
        .taskbar .pinned-app .window-count,
        .taskbar .taskbar-app .window-count {
            position: absolute;
            top: 2px;
            right: 2px;
            z-index: 2;
            background-color: #ff4444;
            color: white;
            border-radius: 50%;
            min-width: 18px;
            min-height: 18px;
            width: auto;
            max-width: none;
            padding: 0 4px;
            box-sizing: border-box;
            font-size: 10px;
            line-height: 1;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .taskbar .pinned-app .minimized-indicator,
        .taskbar .taskbar-app .minimized-indicator {
            z-index: 1;
        }
        .taskbar .pinned-app img,
        .taskbar .taskbar-app img {
            position: relative;
            z-index: 0;
        }
        .taskbar .clock {
            margin-left: auto;
            padding: 0 10px;
            font-size: 13px;
            white-space: pre-line;
            flex-shrink: 1;
            min-width: 0;
            /* Mismo criterio que .start-button i / .recycle-bin i: --text-color (configuración),
               no el color heredado del .taskbar ni --theme-contrast-text (a veces oscuro con barra en degradado oscuro). */
            color: var(--text-color);
            text-shadow: 0 1px 2px var(--theme-contrast-shadow);
            text-align: right;
            line-height: 1.3;
            max-width: min(100%, 380px);
            overflow-wrap: anywhere;
            word-break: break-word;
        }
        
        /* Vista previa de ventanas — estilo Windows 11 (tarjetas + miniatura tipo mosaico) */
        .window-preview {
            position: fixed;
            background-color: rgba(32, 32, 32, 0.92);
            border-radius: 14px;
            padding: 12px 12px 10px;
            z-index: 10001;
            box-shadow: 0 12px 40px rgba(0,0,0,0.45), 0 0 0 1px rgba(255,255,255,0.08);
            border: 1px solid rgba(255,255,255,0.12);
            min-width: 260px;
            max-width: min(420px, calc(100vw - 24px));
            pointer-events: auto;
            backdrop-filter: blur(28px) saturate(1.2);
            -webkit-backdrop-filter: blur(28px) saturate(1.2);
        }
        .window-preview:hover {
            pointer-events: auto;
        }
        .window-preview-scroll {
            max-height: min(70vh, 520px);
            overflow-y: auto;
            overflow-x: hidden;
            padding-right: 4px;
            margin-right: -4px;
            scrollbar-width: thin;
        }
        .window-preview-scroll::-webkit-scrollbar {
            width: 8px;
        }
        .window-preview-scroll::-webkit-scrollbar-thumb {
            background: rgba(255,255,255,0.22);
            border-radius: 8px;
        }
        .window-preview .preview-header {
            padding: 4px 6px 10px;
            border-bottom: 1px solid rgba(255,255,255,0.1);
            margin-bottom: 10px;
            font-weight: 600;
            font-size: 12px;
            color: rgba(255,255,255,0.92);
            letter-spacing: 0.02em;
        }
        .window-preview .preview-item {
            padding: 10px;
            margin: 0 0 10px;
            border-radius: 12px;
            cursor: pointer;
            display: flex;
            flex-direction: column;
            align-items: stretch;
            gap: 0;
            transition: background-color 0.15s ease, transform 0.12s ease;
            border: 1px solid rgba(255,255,255,0.08);
            background: rgba(255,255,255,0.04);
        }
        .window-preview .preview-item:last-child {
            margin-bottom: 0;
        }
        .window-preview .preview-item:hover {
            background-color: rgba(255,255,255,0.1);
            transform: translateY(-1px);
        }
        .window-preview .preview-item img.preview-thumb,
        .window-preview .preview-item video.preview-thumb-video,
        .window-preview .preview-item img.preview-thumb-fallback {
            width: 100%;
            height: 112px;
            border-radius: 10px;
            object-fit: cover;
            display: block;
        }
        .window-preview .preview-item .preview-thumb-iframe-wrap {
            width: 100%;
            height: 112px;
            border-radius: 10px;
            overflow: hidden;
            background: rgba(255,255,255,0.06);
            flex-shrink: 0;
            position: relative;
            border: 1px solid rgba(255,255,255,0.06);
        }
        .window-preview .preview-item .preview-thumb-iframe {
            width: 400%;
            height: 400%;
            transform: scale(0.25);
            transform-origin: 0 0;
            border: 0;
            pointer-events: none;
            filter: saturate(0.95) contrast(0.98);
        }
        .window-preview .preview-item .preview-info {
            flex: 1;
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 8px;
            padding-top: 8px;
        }
        .window-preview .preview-item .preview-info-text {
            flex: 1;
            min-width: 0;
        }
        .window-preview .preview-item .preview-title {
            font-size: 12px;
            color: rgba(255,255,255,0.95);
            font-weight: 600;
            line-height: 1.25;
        }
        .window-preview .preview-item .preview-state {
            font-size: 10px;
            color: rgba(255,255,255,0.55);
            margin-top: 2px;
        }
        .window-preview .preview-item .close-preview {
            background: rgba(255,255,255,0.08);
            border: none;
            color: rgba(255,255,255,0.75);
            cursor: pointer;
            font-size: 12px;
            padding: 6px 8px;
            border-radius: 8px;
            align-self: flex-start;
            flex-shrink: 0;
            line-height: 1;
        }
        .window-preview .preview-item .close-preview i {
            display: block;
            line-height: 1;
            transform: translateY(0.5px);
        }
        .window-preview .preview-item .close-preview:hover {
            background-color: rgba(220,53,69,0.85);
            color: white;
        }
        /* Barra flotante visor de archivos (no en title bar) */
        .file-viewer-float-toolbar {
            position: absolute;
            right: 12px;
            bottom: 12px;
            z-index: 20;
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            justify-content: flex-end;
            gap: 8px;
            padding: 8px 10px;
            border-radius: 12px;
            background: rgba(30,30,30,0.82);
            border: 1px solid rgba(255,255,255,0.12);
            box-shadow: 0 8px 32px rgba(0,0,0,0.35);
            backdrop-filter: blur(16px);
            -webkit-backdrop-filter: blur(16px);
            pointer-events: auto;
        }
        .file-viewer-float-toolbar button {
            background: rgba(255,255,255,0.1);
            border: none;
            color: #fff;
            border-radius: 8px;
            width: 38px;
            height: 38px;
            cursor: pointer;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 0.95rem;
            transition: background 0.15s ease, transform 0.1s ease;
        }
        .file-viewer-float-toolbar button:hover {
            background: rgba(255,255,255,0.2);
            transform: scale(1.04);
        }
        .file-viewer-float-toolbar .zoom-in-btn { background: rgba(0,122,255,0.35); }
        .file-viewer-float-toolbar .zoom-out-btn { background: rgba(255,159,10,0.4); }
        .file-viewer-float-toolbar .zoom-reset-btn { background: rgba(94,92,224,0.45); }
        /* Visor de archivos (PDF canvas): cadena flex para altura real en tablets / ventanas maximizadas */
        .window-content:has(.file-viewer-float-toolbar) {
            display: flex;
            flex-direction: column;
            min-height: 0;
            overflow: hidden;
        }
        .window-content:has(.file-viewer-float-toolbar) > div[id^="fileWinContent_"] {
            flex: 1 1 auto;
            min-height: 0;
            min-width: 0;
            display: flex;
            flex-direction: column;
            padding-bottom: 76px;
            box-sizing: border-box;
        }
        .window-content:has(.file-viewer-float-toolbar) > div[id^="fileWinContent_"] > .pdf-canvas-root {
            flex: 1 1 auto;
            min-height: 0;
            min-width: 0;
            align-self: stretch;
        }
        .window-content:has(.file-viewer-float-toolbar) .pdf-canvas-scroll-wrap {
            flex: 1 1 auto;
            min-height: 0;
            min-width: 0;
        }
        
        /* Menú contextual unificado (explorador, barra de tareas, etc.) */
        .context-menu {
            position: fixed;
            background-color: rgba(0,0,0,0.9);
            border-radius: 16px;
            padding: 12px;
            z-index: 10002;
            min-width: 200px;
            box-shadow: 0 8px 30px rgba(0,0,0,0.5);
            touch-action: manipulation;
            pointer-events: auto;
        }
        @media (min-width: 768px) {
            .context-menu {
                min-width: 180px;
                padding: 8px;
            }
        }
        /* Por encima de ventanas (10000), vista previa barra (10001), hub móvil (10040), etc. */
        .context-menu.context-menu--explorer {
            z-index: 500000 !important;
        }
        .context-menu hr {
            margin: 5px 0;
            border: none;
            border-top: 1px solid rgba(255,255,255,0.1);
        }
        
        /* Resize handle para ventanas no maximizadas */
        .window-resize-handle {
            position: absolute;
            bottom: 0;
            right: 0;
            width: 15px;
            height: 15px;
            cursor: se-resize;
            background: linear-gradient(135deg, transparent 50%, rgba(0,0,0,0.3) 50%);
            z-index: 10001;
        }
        
        /* Taskbar left/right adjustments - solo PC */
        body:not(.mobile-mode).taskbar-left .taskbar .taskbar-strip,
        body:not(.mobile-mode).taskbar-right .taskbar .taskbar-strip {
            flex-direction: column;
            align-items: stretch;
            overflow-y: auto;
            overflow-x: hidden;
            flex: 1 1 auto;
            min-height: 0;
            width: 100%;
            max-height: calc(100vh - 120px);
        }
        body:not(.mobile-mode).taskbar-left .taskbar .pinned-apps,
        body:not(.mobile-mode).taskbar-left .taskbar .taskbar-apps,
        body:not(.mobile-mode).taskbar-right .taskbar .pinned-apps,
        body:not(.mobile-mode).taskbar-right .taskbar .taskbar-apps {
            flex-direction: column;
            overflow-y: auto;
            overflow-x: hidden;
            flex: none;
            width: 100%;
            max-height: none;
        }
        body:not(.mobile-mode).taskbar-left .taskbar .clock,
        body:not(.mobile-mode).taskbar-right .taskbar .clock {
            margin-left: 0;
            margin-top: auto;
            writing-mode: horizontal-tb;
            text-orientation: mixed;
            font-size: 10px;
            padding: 8px 4px;
            white-space: pre-line;
            text-align: center;
            max-width: 100%;
            width: 100%;
            line-height: 1.25;
            overflow-wrap: anywhere;
            word-break: break-word;
        }
        body:not(.mobile-mode).taskbar-left .taskbar .start-button,
        body:not(.mobile-mode).taskbar-right .taskbar .start-button {
            margin-bottom: 10px;
        }
        body:not(.mobile-mode).taskbar-left .taskbar .recycle-bin,
        body:not(.mobile-mode).taskbar-right .taskbar .recycle-bin {
            margin-bottom: 10px;
        }
        
        /* Ventanas estilo macOS */
        .window-frame {
            position: fixed;
            background-color: rgba(255, 255, 255, 0.98);
            border-radius: 12px;
            box-shadow: 0 20px 40px rgba(0,0,0,0.3), 0 0 0 1px rgba(0,0,0,0.1);
            z-index: 10000;
            display: flex;
            flex-direction: column;
            overflow: hidden;
            min-width: 300px;
            min-height: 200px;
            backdrop-filter: blur(20px);
            background-color: rgba(255, 255, 255, 0.95);
            transition: all 0.2s ease;
        }
        .window-frame.maximized {
            top: 0 !important;
            left: 0 !important;
            right: 0 !important;
            bottom: 0 !important;
            width: 100% !important;
            height: 100% !important;
            border-radius: 0;
            resize: none;
        }
        .window-frame.minimized {
            display: none;
        }
        .window-titlebar {
            background-color: rgba(0,0,0,0.08);
            padding: 4px 10px;
            min-height: 0;
            display: flex;
            align-items: center;
            justify-content: space-between;
            cursor: move;
            user-select: none;
            backdrop-filter: blur(10px);
            border-bottom: 1px solid rgba(0,0,0,0.1);
            flex-shrink: 0;
        }
        .window-title {
            display: flex;
            align-items: center;
            gap: 6px;
            font-size: 12px;
            font-weight: 500;
            line-height: 1.2;
            flex: 1;
            min-width: 0;
        }
        .window-title span {
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
        .window-title img {
            width: 16px;
            height: 16px;
            border-radius: 4px;
            flex-shrink: 0;
        }
        @media (max-width: 768px) {
            .window-frame:not(#previewWindowFrame) .window-title span {
                display: none;
            }
            .window-frame:not(#previewWindowFrame) .window-controls {
                justify-content: flex-end;
                flex: 1;
            }
            .window-frame:not(#previewWindowFrame) .window-title {
                flex: 0;
            }
        }
        /* Visor modal: siempre mostrar título y botones de zoom */
        #previewWindowFrame .window-controls {
            flex-wrap: nowrap;
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
            gap: 4px;
            flex-shrink: 0;
            max-width: min(100%, 70vw);
        }
        #previewWindowFrame .window-controls button.zoom-in-btn,
        #previewWindowFrame .window-controls button.zoom-out-btn,
        #previewWindowFrame .window-controls button.zoom-reset-btn {
            display: inline-flex !important;
            visibility: visible !important;
            opacity: 1 !important;
        }
        #previewWindowFrame .window-titlebar {
            flex-wrap: wrap;
        }
        .window-controls {
            display: flex;
            gap: 8px;
        }
        .window-controls button {
            background: transparent;
            border: none;
            cursor: pointer;
            font-size: 11px;
            width: 24px !important;
            height: 24px !important;
            min-width: 24px !important;
            min-height: 0 !important;
            max-width: 24px !important;
            max-height: 24px !important;
            border-radius: 50%;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: 0 !important;
            gap: 0 !important;
            box-shadow: none;
            transition: background-color 0.2s;
            line-height: 1;
            flex-shrink: 0;
            filter: none;
        }
        .window-controls button i {
            display: block;
            line-height: 1;
            transform: translateY(0.5px);
        }
        .window-controls .close-btn {
            background-color: #ff5f57;
            color: #4a0e0e;
        }
        .window-controls .close-btn:hover {
            background-color: #ff3b30;
        }
        .window-controls .minimize-btn {
            background-color: #ffbd2e;
            color: #4a3a0a;
        }
        .window-controls .minimize-btn:hover {
            background-color: #ffa500;
        }
        .window-controls .maximize-btn {
            background-color: #28c840;
            color: #0a4a0a;
        }
        .window-controls .maximize-btn:hover {
            background-color: #1e9e32;
        }
        .window-controls .fullscreen-btn {
            background-color: #007aff;
            color: white;
        }
        .window-controls .fullscreen-btn:hover {
            background-color: #005bb5;
        }
        .window-controls .external-btn {
            background-color: #5856d6;
            color: white;
        }
        .window-controls .external-btn:hover {
            background-color: #4644b0;
        }
        .window-controls .zoom-in-btn {
            background-color: #34c759;
            color: white;
        }
        .window-controls .zoom-in-btn:hover {
            background-color: #2aa64a;
        }
        .window-controls .zoom-out-btn {
            background-color: #ff9f0a;
            color: white;
        }
        .window-controls .zoom-out-btn:hover {
            background-color: #e58e00;
        }
        .window-controls .zoom-reset-btn {
            background-color: #5e5ce0;
            color: white;
        }
        .window-controls .zoom-reset-btn:hover {
            background-color: #4a48b0;
        }
        .window-content {
            flex: 1;
            overflow: auto;
            background-color: white;
            position: relative;
        }
        .window-content:has(.file-explorer) {
            background-color: transparent;
        }
        .file-explorer .explorer-connections-panel {
            position: absolute;
            top: 42px;
            right: 10px;
            width: min(380px, calc(100% - 20px));
            max-height: min(72vh, 480px);
            overflow: auto;
            z-index: 50;
            border-radius: 16px;
            padding: 14px;
            border: 1px solid color-mix(in srgb, var(--theme-contrast-text) 22%, transparent);
            background: color-mix(in srgb, var(--neumorphic-bg) 78%, transparent);
            box-shadow: 0 16px 34px var(--theme-contrast-shadow), inset 0 1px 0 color-mix(in srgb, var(--theme-contrast-text) 12%, transparent);
            backdrop-filter: blur(16px) saturate(1.05);
            -webkit-backdrop-filter: blur(16px) saturate(1.05);
            color: var(--theme-contrast-text);
            text-shadow: 0 1px 2px var(--theme-contrast-shadow);
        }
        .explorer-connections-header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
            margin-bottom: 10px;
            padding-bottom: 10px;
            border-bottom: 1px solid color-mix(in srgb, var(--theme-contrast-text) 18%, transparent);
        }
        .explorer-connections-title {
            font-weight: 700;
            letter-spacing: 0.01em;
        }
        .explorer-connections-close-btn {
            box-sizing: border-box;
            border: 1px solid color-mix(in srgb, var(--theme-contrast-text) 16%, transparent);
            background: color-mix(in srgb, var(--theme-contrast-text) 10%, transparent);
            color: inherit;
            width: var(--shell-modal-close-size);
            height: var(--shell-modal-close-size);
            min-width: var(--shell-modal-close-size);
            min-height: 0;
            aspect-ratio: 1;
            padding: 0;
            margin: 0;
            border-radius: var(--shell-modal-close-radius);
            cursor: pointer;
            box-shadow: none;
            font-size: var(--shell-modal-close-font);
            line-height: 1;
            display: inline-grid;
            place-items: center;
            backdrop-filter: blur(8px) saturate(1.05);
            -webkit-backdrop-filter: blur(8px) saturate(1.05);
            transition: background 0.15s ease, border-color 0.15s ease;
        }
        .explorer-connections-close-btn:hover {
            background: color-mix(in srgb, var(--theme-contrast-text) 18%, transparent);
            border-color: color-mix(in srgb, var(--theme-contrast-text) 26%, transparent);
        }
        .explorer-connection-row {
            display: flex;
            flex-direction: column;
            gap: 6px;
            margin: 8px 0;
            padding: 8px;
            border-radius: 12px;
            background: color-mix(in srgb, var(--theme-contrast-text) 10%, transparent);
            border: 1px solid color-mix(in srgb, var(--theme-contrast-text) 20%, transparent);
        }
        .explorer-connection-head {
            display: flex;
            align-items: center;
            gap: 6px;
            min-width: 0;
        }
        .explorer-connection-open {
            flex: 1;
            min-width: 0;
            text-align: left;
            background: transparent;
            border: none;
            color: inherit;
            cursor: pointer;
            font-weight: 700;
            font-size: 13px;
            padding: 4px 2px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            display: flex;
            align-items: center;
            gap: 8px;
        }
        .explorer-connection-open i {
            opacity: 0.85;
            flex: 0 0 auto;
        }
        .explorer-connection-open-label {
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            min-width: 0;
        }
        .explorer-connection-open:hover {
            text-decoration: underline;
        }
        .explorer-connection-newtab {
            flex-shrink: 0;
            width: 32px;
            height: 32px;
            border: none;
            border-radius: 10px;
            background: color-mix(in srgb, var(--theme-contrast-text) 14%, transparent);
            color: inherit;
            cursor: pointer;
            display: inline-flex;
            align-items: center;
            justify-content: center;
        }
        .explorer-connection-newtab:hover {
            background: color-mix(in srgb, var(--theme-contrast-text) 22%, transparent);
        }
        .explorer-connection-actions-row {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            gap: 4px;
        }
        .explorer-connection-meta {
            font-size: 11px;
            opacity: 0.78;
            padding: 0 2px;
        }
        .explorer-connections-panel .explorer-btn-secondary,
        .explorer-connections-panel .explorer-btn-danger {
            display: inline-flex;
            align-items: center;
            gap: 8px;
        }
        .explorer-conn-btn-ico {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 16px;
        }
        .explorer-connection-actions-row .explorer-btn-secondary,
        .explorer-connection-actions-row .explorer-btn-danger {
            padding: 5px 8px;
            font-size: 11px;
            font-weight: 600;
        }
        .explorer-connections-panel .explorer-btn-secondary,
        .explorer-connections-panel .explorer-btn-danger {
            border: none;
            border-radius: 10px;
            padding: 8px 10px;
            cursor: pointer;
            font-weight: 600;
            color: #fff;
        }
        .explorer-connections-panel .explorer-btn-secondary {
            background: linear-gradient(160deg, #4f46e5, #2563eb);
        }
        .explorer-connections-panel .explorer-btn-danger {
            background: linear-gradient(160deg, #dc2626, #b91c1c);
        }
        .explorer-connections-actions {
            display: flex;
            gap: 8px;
            flex-wrap: wrap;
            margin-top: 12px;
            padding-top: 10px;
            border-top: 1px solid color-mix(in srgb, var(--theme-contrast-text) 18%, transparent);
        }
        .explorer-connections-actions > button {
            border: none;
            border-radius: 10px;
            padding: 10px 12px;
            cursor: pointer;
            font-weight: 700;
            color: #fff;
            background: linear-gradient(160deg, #0f766e, #0ea5e9);
            box-shadow: 0 6px 16px rgba(14, 165, 233, 0.22);
        }
        .explorer-connections-actions > button:hover {
            filter: brightness(1.05);
        }
        .window-content iframe {
            width: 100%;
            height: 100%;
            border: none;
            transition: transform 0.1s ease;
            transform-origin: 0 0;
        }

        /* Marco tipo Windows 11 (panel admin / usuarios en iframe) */
        .window-frame.window-frame--win11 {
            border-radius: 8px;
            border: 1px solid rgba(0, 0, 0, 0.12);
            box-shadow:
                0 10px 40px rgba(0, 0, 0, 0.22),
                0 0 0 1px rgba(255, 255, 255, 0.45) inset;
            background: #fff;
        }
        .window-frame.window-frame--win11.maximized {
            border-radius: 0;
            border: none;
            box-shadow: none;
        }
        .window-frame.window-frame--win11 .window-titlebar {
            background: linear-gradient(180deg, #f3f3f3 0%, #ececec 100%);
            border-bottom: 1px solid #d1d1d1;
            padding: 0 4px 0 12px;
            min-height: 40px;
        }
        .window-frame.window-frame--win11:not(.maximized) .window-titlebar {
            cursor: move;
        }
        .window-frame.window-frame--win11.maximized .window-titlebar {
            cursor: default;
        }
        .window-frame.window-frame--win11 .window-title {
            font-size: 13px;
            font-weight: 400;
            font-family: "Segoe UI Variable", "Segoe UI", system-ui, -apple-system, sans-serif;
            color: #1c1c1c;
            gap: 10px;
        }
        .window-frame.window-frame--win11 .window-title img {
            width: 20px;
            height: 20px;
            border-radius: 4px;
        }
        .window-frame.window-frame--win11 .window-controls {
            gap: 2px;
        }
        .window-frame.window-frame--win11 .window-controls button {
            width: 46px !important;
            height: 32px !important;
            min-width: 46px !important;
            min-height: 0 !important;
            max-width: 46px !important;
            max-height: 32px !important;
            border-radius: 4px;
            color: #1a1a1a;
            background: transparent;
            font-size: 12px;
            padding: 0 !important;
        }
        .window-frame.window-frame--win11 .window-controls .minimize-btn:hover,
        .window-frame.window-frame--win11 .window-controls .maximize-btn:hover,
        .window-frame.window-frame--win11 .window-controls .fullscreen-btn:hover,
        .window-frame.window-frame--win11 .window-controls .external-btn:hover,
        .window-frame.window-frame--win11 .window-controls .zoom-in-btn:hover,
        .window-frame.window-frame--win11 .window-controls .zoom-out-btn:hover,
        .window-frame.window-frame--win11 .window-controls .zoom-reset-btn:hover {
            background: rgba(0, 0, 0, 0.06);
        }
        .window-frame.window-frame--win11 .window-controls .close-btn {
            background: transparent;
            color: #1a1a1a;
        }
        .window-frame.window-frame--win11 .window-controls .close-btn:hover {
            background: #c42b1c;
            color: #fff;
        }
        .window-frame.window-frame--win11 .window-content {
            background: #fafafa;
        }

        .iframe-error-overlay {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-color: rgba(0,0,0,0.8);
            display: flex;
            align-items: center;
            justify-content: center;
            flex-direction: column;
            gap: 15px;
            z-index: 10;
        }
        .iframe-error-overlay button {
            background-color: #4CAF50;
            color: white;
            padding: 10px 20px;
            border: none;
            border-radius: 8px;
            cursor: pointer;
        }

        /* Toast — adopta los colores del tema activo (sin colores por tipo) */
        .toast {
            position: fixed;
            bottom: 20px;
            left: 50%;
            transform: translateX(-50%);
            background-color: var(--toast-bg);
            color: var(--toast-color);
            padding: 10px 16px;
            border-radius: 8px;
            box-shadow: 0 4px 12px rgba(0,0,0,0.3);
            z-index: 10000;
            font-size: 14px;
            text-align: center;
            opacity: 0.95;
            pointer-events: none;
            transition: opacity 0.3s;
            display: inline-flex;
            align-items: center;
            gap: 0.55rem;
            max-width: min(92vw, 28rem);
            border-left: 3px solid var(--toast-color);
        }
        .toast .toast-icon {
            font-size: 1rem;
            line-height: 1;
            color: var(--toast-color);
            opacity: 0.85;
            flex-shrink: 0;
        }
        .toast .toast-text {
            display: inline-block;
            text-align: left;
            word-break: break-word;
        }
        
        /* Accesos directos del escritorio: mismos iconos que el grid (.app-item) */
        .desktop-shortcuts {
            position: fixed;
            top: 80px;
            left: 20px;
            display: flex;
            flex-direction: column;
            gap: 12px;
            z-index: 50;
            pointer-events: none;
        }
        .desktop-shortcuts .app-item {
            pointer-events: auto;
            width: 88px;
            min-height: 96px;
            padding: 10px 8px;
            margin: 0;
            background-color: rgba(0,0,0,0.25);
            backdrop-filter: blur(6px);
            border-radius: 12px;
            border: 1px solid color-mix(in srgb, var(--text-color) 12%, transparent);
            box-shadow: inset 0 1px 0 color-mix(in srgb, var(--text-color) 6%, transparent);
            box-sizing: border-box;
        }
        .desktop-shortcuts .app-item:hover {
            background-color: rgba(255,255,255,0.15);
            transform: scale(1.04);
        }
        .desktop-shortcuts .app-item img.app-icon {
            width: 48px;
            height: 48px;
        }
        .desktop-shortcuts .app-item p {
            font-size: 11px;
            margin-top: 6px;
            text-shadow: 0 1px 2px rgba(0,0,0,0.6);
        }
        
        /* Responsive para controles de ventana en móvil */
        @media (max-width: 768px) {
            .window-controls button {
                width: 28px !important;
                height: 28px !important;
                min-width: 28px !important;
                max-width: 28px !important;
                max-height: 28px !important;
                font-size: 11px;
            }

            body.glassgradient .window-frame:not(.window-frame--win11) .window-controls button,
            body.glassmorphism .window-frame:not(.window-frame--win11) .window-controls button,
            body.auroracrystal3d .window-frame:not(.window-frame--win11) .window-controls button {
                width: 28px !important;
                height: 28px !important;
                min-width: 28px !important;
                max-width: 28px !important;
                max-height: 28px !important;
            }
            .window-title {
                font-size: 12px;
            }
            .window-title img {
                width: 16px;
                height: 16px;
            }
            .desktop-shortcuts {
                top: 70px;
                left: 10px;
            }
            .desktop-shortcuts .app-item {
                width: 76px;
                min-height: 88px;
                padding: 8px 4px;
            }
            .desktop-shortcuts .app-item img.app-icon {
                width: 40px;
                height: 40px;
            }
        }
        
        /* App de papelera en móvil */
        .recycle-bin-app {
            position: relative;
        }
        .recycle-bin-app .delete-app-btn {
            display: none !important;
        }
        
        /* Modal papelera: cabecera fija, lista con scroll, vaciar arriba y abajo */
        #recycleBinModal .recycle-bin-modal-content {
            display: flex;
            flex-direction: column;
            max-height: min(85vh, 720px);
            box-sizing: border-box;
        }
        #recycleBinModal .recycle-bin-modal-header {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            justify-content: space-between;
            gap: 10px 12px;
            margin-bottom: 8px;
            padding-right: 28px;
        }
        #recycleBinModal .recycle-bin-modal-header h2 {
            margin: 0;
            flex: 1 1 auto;
            min-width: 0;
            font-size: clamp(1rem, 4vw, 1.35rem);
        }
        #recycleBinModal .empty-trash-btn {
            flex: 0 0 auto;
            padding: 8px 14px;
            font-size: 13px;
            min-height: 40px;
            white-space: nowrap;
        }
        #recycleBinModal .empty-trash-btn:disabled {
            opacity: 0.45;
            cursor: not-allowed;
        }
        #recycleBinModal .trash-items {
            flex: 1 1 auto;
            min-height: 0;
            overflow-y: auto;
            -webkit-overflow-scrolling: touch;
            margin: 0 -4px;
            padding: 0 4px;
        }
        #recycleBinModal .trash-empty-msg {
            margin: 12px 0;
            color: var(--theme-contrast-text, inherit);
            opacity: 0.85;
        }
        #recycleBinModal .recycle-bin-modal-footer {
            margin-top: 12px;
            padding-top: 10px;
            border-top: 1px solid var(--neumorphic-shadow-dark);
            display: flex;
            justify-content: flex-end;
        }
        #recycleBinModal .recycle-bin-modal-footer .empty-trash-btn {
            min-width: min(100%, 200px);
        }

        /* Estilo para trash items */
        .trash-item {
            display: flex;
            flex-wrap: wrap;
            align-items: flex-start;
            padding: 12px 8px;
            border-bottom: 1px solid var(--neumorphic-shadow-dark);
            gap: 10px 12px;
        }
        .trash-item img {
            width: 48px;
            height: 48px;
            object-fit: cover;
            border-radius: 8px;
            flex-shrink: 0;
        }
        .trash-item .trash-item-title {
            flex: 1 1 140px;
            min-width: 0;
            font-size: 14px;
            line-height: 1.35;
            word-break: break-word;
        }
        .trash-item .trash-item-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            justify-content: flex-end;
            align-items: center;
            flex: 1 1 100%;
        }
        .trash-item .trash-btn {
            padding: 8px 14px;
            margin: 0;
            font-size: 13px;
            min-height: 40px;
            min-width: 96px;
            box-sizing: border-box;
            flex: 1 1 auto;
        }
        @media (min-width: 480px) {
            .trash-item {
                flex-wrap: nowrap;
                align-items: center;
            }
            .trash-item .trash-item-actions {
                flex: 0 1 auto;
                min-width: min(100%, 220px);
                max-width: 100%;
            }
            .trash-item .trash-btn {
                flex: 1 1 0;
                min-width: 0;
            }
        }
        @media (max-width: 479px) {
            .trash-item .trash-item-actions {
                width: 100%;
            }
            .trash-item .trash-btn {
                flex: 1 1 calc(33.333% - 6px);
                min-width: calc(33.333% - 6px);
            }
        }
        .trash-folder-preview-list {
            margin: 10px 0 0;
            padding: 0 0 0 1.25rem;
            max-height: 50vh;
            overflow-y: auto;
        }
        .trash-folder-preview-list li {
            margin: 6px 0;
            line-height: 1.35;
        }
        .trash-preview-meta {
            opacity: 0.8;
            font-size: 13px;
        }
        .trash-item .trash-btn-view {
            font-weight: 600;
        }
        
        /* Navegación de teclado en menú Windows */
        .windows-menu-categories li:focus-visible,
        .windows-menu-apps .app-item:focus-visible {
            outline: 2px solid var(--focus-color);
            outline-offset: 2px;
            background-color: var(--category-hover);
        }
        .windows-menu-categories li:focus-visible:not(.active) {
            color: var(--text-color);
        }
        .windows-menu-categories li.active:focus-visible {
            color: white;
        }
        .preview-thumb {
            width: 62px;
            height: 42px;
            border-radius: 6px;
            object-fit: cover;
            background: rgba(0,0,0,0.15);
            flex-shrink: 0;
            margin-right: 8px;
        }

        /* Launcher grid: carpetas y arrastre */
        .app-item.folder-tile {
            touch-action: none;
        }
        .folder-tile-inner {
            display: flex;
            flex-direction: column;
            align-items: center;
            width: 100%;
        }
        .folder-icon-stack {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 4px;
            width: 56px;
            height: 56px;
            padding: 6px;
            border-radius: 12px;
            background: linear-gradient(145deg, rgba(255,255,255,0.25), rgba(0,0,0,0.08));
            box-shadow: inset 0 1px 0 rgba(255,255,255,0.25);
            border: 2px solid var(--launcher-folder-color, #5c6bc0);
        }
        .folder-mini-icon {
            width: 100%;
            height: 100%;
            object-fit: cover;
            border-radius: 4px;
        }
        .folder-mini-placeholder {
            display: block;
            width: 100%;
            height: 100%;
            border-radius: 4px;
            background: rgba(0,0,0,0.12);
        }
        .app-item.launcher-drag-source {
            opacity: 0.35;
        }
        /* Indicador visual (móvil/tablet) cuando el drag está armado por long-press */
        .app-item.launcher-drag-armed {
            transform: translateY(-8px) scale(1.05);
            box-shadow: 0 18px 38px rgba(0,0,0,0.38);
            outline: 2px solid rgba(255,255,255,0.42);
            outline-offset: 2px;
            transition: transform 0.12s ease, box-shadow 0.12s ease, outline-color 0.12s ease;
        }
        .app-item.launcher-drop-target {
            outline: 2px dashed var(--focus-color);
            outline-offset: 2px;
        }
        .launcher-folder-modal .launcher-folder-inner-grid {
            min-height: 80px;
            margin-top: 12px;
            gap: 12px;
            padding: 12px;
        }
        .launcher-folder-modal .app-item {
            cursor: pointer;
            max-width: 104px;
        }
