/* --- PERFORMANCE & THEME VARIABLES --- */
:root {
    --glass-bg: rgba(255, 255, 255, 0.65);
    --glass-border: 1px solid rgba(255, 255, 255, 0.6);
    --glass-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
    --text-color: #0f172a;
    --text-muted: #475569;
}

/* Global Optimization for Chrome */
* {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    box-sizing: border-box;
}

/* --- NATURE THEMES --- */
[data-theme="forest"] { --accent: #059669; --accent-soft: #d1fae5; --bg-color: #0f4c3a; --bg-image: linear-gradient(to top, #0f4c3a, #15803d, #86efac); }
[data-theme="ocean"] { --accent: #0284c7; --accent-soft: #e0f2fe; --bg-color: #0c4a6e; --bg-image: linear-gradient(to top, #0c4a6e, #0369a1, #7dd3fc); }
[data-theme="sakura"] { --accent: #db2777; --accent-soft: #fce7f3; --bg-color: #831843; --bg-image: linear-gradient(to top, #831843, #be185d, #f9a8d4); }
[data-theme="sunset"] { --accent: #ea580c; --accent-soft: #ffedd5; --bg-color: #4c1d95; --bg-image: linear-gradient(to top, #4c1d95, #c026d3, #fb923c); }
[data-theme="lavender"] { --accent: #7c3aed; --accent-soft: #ede9fe; --bg-color: #4c1d95; --bg-image: linear-gradient(to top, #4c1d95, #7c3aed, #c4b5fd); }
[data-theme="mountain"] { --accent: #475569; --accent-soft: #f1f5f9; --bg-color: #0f172a; --bg-image: linear-gradient(to top, #0f172a, #334155, #94a3b8); }
[data-theme="autumn"] { --accent: #b91c1c; --accent-soft: #fee2e2; --bg-color: #450a0a; --bg-image: linear-gradient(to top, #450a0a, #b91c1c, #fdba74); }
[data-theme="bamboo"] { --accent: #65a30d; --accent-soft: #ecfccb; --bg-color: #365314; --bg-image: linear-gradient(to top, #365314, #65a30d, #bef264); }
[data-theme="night"] { --accent: #6366f1; --accent-soft: #e0e7ff; --bg-color: #020617; --bg-image: linear-gradient(to top, #020617, #1e1b4b, #312e81); --glass-bg: rgba(15, 23, 42, 0.85); --text-color: #f8fafc; --text-muted: #94a3b8; }
[data-theme="earth"] { --accent: #d97706; --accent-soft: #fef3c7; --bg-color: #451a03; --bg-image: linear-gradient(to top, #451a03, #92400e, #d97706); }

html, body {
    height: 100%;
    margin: 0;
    padding: 0;
    width: 100%;
    overflow: hidden; 
}

body {
    background-color: #0f4c3a; 
    color: var(--text-color);
    font-family: 'Nunito', 'Battambang', sans-serif;
}

/* FIXED BACKGROUND LAYER - GPU Accelerated */
#wallpaper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -2;
    background-color: var(--bg-color);
    background-image: var(--bg-image);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    /* Removed transition for instant background changes if any */
    transform: translate3d(0, 0, 0); /* Force GPU */
    will-change: background-image;
}

#particle-canvas { 
    position: fixed;
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
    z-index: -1;
    pointer-events: none; 
    opacity: 0.7; 
    mix-blend-mode: screen; 
    transform: translate3d(0, 0, 0); /* Force GPU */
}

/* --- STABILITY FIX: Layout & Scrollbar --- */
main {
    /* Prevents horizontal layout shift when vertical scrollbar appears/disappears */
    scrollbar-gutter: stable; 
    will-change: scroll-position;
}

/* --- FORCE STATIC UI OVERRIDE --- */
/* Disables all Tailwind animations and transitions on UI elements */
.animate-slide-up, 
.animate-pop-in, 
.animate-breathe {
    animation: none !important;
    transition: none !important;
    transform: none !important;
}

.nature-card {
    background: var(--glass-bg);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: var(--glass-border);
    border-radius: 24px;
    box-shadow: var(--glass-shadow);
    /* Removed transition for instant hover state */
    
    /* STABILITY FIX: GPU Compositing & Anti-Jitter */
    transform: translateZ(0); 
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.app-item {
    display: flex; flex-direction: column; align-items: center; gap: 12px;
    padding: 20px;
    cursor: pointer;
    border-radius: 24px;
    /* Removed transition */
    position: relative;
    background: rgba(255, 255, 255, 0.25);
    /* STABILITY FIX: Transparent Border by Default */
    border: 1px solid rgba(255,255,255,0.4);
    
    /* STABILITY FIX */
    will-change: transform; 
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    transform: translateZ(0);
}

.app-item:hover {
    background: rgba(255, 255, 255, 0.6);
    /* STATIC FIX: Removed translateY and scale */
    transform: translateZ(0); 
    box-shadow: 0 15px 30px rgba(0,0,0,0.15);
}

.icon-circle {
    width: 70px; height: 70px;
    border-radius: 24px;
    background: linear-gradient(135deg, white, var(--accent-soft));
    color: var(--accent);
    display: flex; align-items: center; justify-content: center;
    font-size: 36px;
    box-shadow: 0 8px 15px rgba(0,0,0,0.05);
    /* Removed transition */
    
    /* STABILITY FIX */
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.app-item:hover .icon-circle { 
    /* STATIC FIX: Removed scale and rotate */
    transform: translateZ(0);
    background: var(--accent); 
    color: white; 
}

.dock-bar {
    background: rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(30px);
    -webkit-backdrop-filter: blur(30px);
    border: 1px solid rgba(255,255,255,0.9);
    border-radius: 999px;
    padding: 6px 12px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.2);
    /* STABILITY FIX */
    transform: translateZ(0);
}

.window-frame {
    background: #fff;
    position: fixed; inset: 0;
    z-index: 100;
    
    /* CLASSIC WINDOWS FEEL: Display Toggle */
    display: none; 
    /* Removed opacity/scale/transition */
}
.window-frame.active { 
    display: flex; /* Instant appear */
    pointer-events: auto; 
}
.window-frame.minimized { 
    display: none; /* Instant hide */
}

.hidden-screen { display: none !important; }

.window-controls {
    position: absolute; top: 12px; right: 12px;
    display: flex; gap: 8px;
    z-index: 150;
}

.control-btn {
    width: 32px; height: 32px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    cursor: pointer;
    backdrop-filter: blur(5px);
    font-size: 16px;
    /* Removed transition */
    
    /* STABILITY FIX */
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.control-btn:hover { 
    /* STATIC FIX: Removed scale */
    /* transform: scale(1.1); */ 
    background-color: var(--glass-bg); /* Optional visual cue */
}
.control-btn.minimize { background: rgba(255,255,255,0.9); color: #475569; border: 1px solid rgba(0,0,0,0.05); }
.control-btn.close { background: #ef4444; color: white; box-shadow: 0 4px 12px rgba(239, 68, 68, 0.3); }

#task-switcher {
    position: fixed; inset: 0;
    background: rgba(0,0,0,0.3);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    z-index: 9999;
    display: flex; align-items: center; justify-content: center;
    transform: translateZ(0);
}
.switcher-card {
    background: rgba(255,255,255,0.9);
    padding: 24px;
    border-radius: 24px;
    box-shadow: 0 25px 50px rgba(0,0,0,0.3);
    display: flex; gap: 20px;
    border: 2px solid var(--accent);
}
.switcher-item {
    display: flex; flex-direction: column; items-center; gap: 8px;
    padding: 16px;
    border-radius: 16px;
    background: #f1f5f9;
    width: 100px;
    /* Removed transition */
    border: 2px solid transparent; 
}
.switcher-item.selected {
    background: var(--accent-soft);
    border-color: var(--accent);
    /* STATIC FIX: Removed scale */
    transform: none;
}