/* --- Base & Resets --- */
body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* --- View Transitions --- */
.page-section {
    display: none;
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}

.page-section.active {
    display: block;
    animation: fadeIn 0.4s forwards;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(5px); }
    to { opacity: 1; transform: translateY(0); }
}

/* --- List Items (Table Rows) --- */
.ts-row {
    transition: background-color 0.2s ease;
}
.ts-row:hover {
    background-color: rgba(0,0,0,0.02);
}
.dark .ts-row:hover {
    background-color: rgba(255,255,255,0.02);
}

/* --- Utilities --- */
@keyframes blink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.4; }
}
.animate-blink {
    animation: blink 2s infinite;
}

.logo-adaptive {
    filter: invert(1);
}
.dark .logo-adaptive {
    filter: invert(0);
}

/* --- Custom Scrollbar --- */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
::-webkit-scrollbar-track {
    background: transparent;
}
::-webkit-scrollbar-thumb {
    background-color: #cbd5e1;
    border-radius: 10px;
}
.dark ::-webkit-scrollbar-thumb {
    background-color: #334155;
}

.scrollbar-hide::-webkit-scrollbar {
    display: none;
}
.scrollbar-hide {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* --- Sidebar Collapse States --- */
.nav-btn { transition: padding 0.3s ease; }
.sidebar-text { transition: opacity 0.2s ease, width 0.2s ease; overflow: hidden; }
.sidebar-collapsed .sidebar-text { opacity: 0; width: 0; pointer-events: none; }
.sidebar-collapsed .nav-btn { justify-content: center; padding-left: 0; padding-right: 0; }

/* --- Dynamic Geometry Background --- */
.bg-layer { position: fixed; inset: 0; pointer-events: none; z-index: 0; overflow: hidden; }
.geo-shape {
    position: absolute;
    will-change: transform;
    transition: border-color 0.3s, background 0.3s, box-shadow 0.3s;
}

/* Ambient Orbs */
.geo-amb { position: absolute; border-radius: 50%; pointer-events: none; filter: blur(80px); will-change: transform; transition: background 0.3s; }
 
/* Shape Placements */
.geo-1 { width: 50vw; height: 65vh; top: -8vh; left: -8vw; clip-path: polygon(0 0, 100% 0, 78% 100%, 0 88%); }
.geo-2 { width: 42vw; height: 58vh; top: 5vh; right: -5vw; clip-path: polygon(22% 0, 100% 0, 100% 100%, 0 100%); }
.geo-3 { width: 55vw; height: 42vh; bottom: -8vh; left: 8vw; clip-path: polygon(0 12%, 88% 0, 100% 100%, 0 100%); }
.geo-4 { width: 28vw; height: 36vh; top: 28vh; left: 28vw; clip-path: polygon(18% 0, 100% 8%, 82% 100%, 0 92%); }
.geo-5 { width: 22vw; height: 28vh; bottom: 12vh; right: 8vw; clip-path: polygon(0 0, 100% 15%, 100% 100%, 8% 88%); }
.geo-6 { width: 35vw; height: 26vh; top: 50vh; left: -5vw; clip-path: polygon(0 0, 95% 0, 75% 100%, 0 85%); }
.geo-amb-1 { width: 320px; height: 320px; top: 5vh; left: 35vw; } 
.geo-amb-2 { width: 260px; height: 200px; bottom: 20vh; left: 14vw; }

/* Light Mode Specifics */
.geo-shape { border: 1px solid rgba(0, 0, 0, 0.18); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08), 8px 8px 32px rgba(0, 0, 0, 0.15), -2px -2px 12px rgba(255, 255, 255, 0.95); }
.geo-1 { background: linear-gradient(148deg, rgba(0,0,0,0.12) 0%, rgba(0,0,0,0.04) 100%); }
.geo-2 { background: linear-gradient(210deg, rgba(0,0,0,0.12) 0%, rgba(0,0,0,0.04) 100%); }
.geo-3 { background: linear-gradient(125deg, rgba(0,0,0,0.10) 0%, rgba(0,0,0,0.04) 100%); }
.geo-4 { background: rgba(0, 0, 0, 0.08); box-shadow: 4px 4px 20px rgba(0, 0, 0, 0.2); }
.geo-5 { background: linear-gradient(165deg, rgba(0,0,0,0.10) 0%, rgba(0,0,0,0.04) 100%); }
.geo-6 { background: rgba(0, 0, 0, 0.07); }
.geo-amb-1 { background: rgba(37, 99, 235, 0.22); } 
.geo-amb-2 { background: rgba(37, 99, 235, 0.18); }

/* Dark Mode Specifics */
.dark .geo-shape { border: 1px solid rgba(255, 255, 255, 0.22); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08), 6px 6px 40px rgba(0, 0, 0, 0.9), -2px -2px 16px rgba(255, 255, 255, 0.06); }
.dark .geo-1 { background: linear-gradient(148deg, rgba(255,255,255,0.14) 0%, rgba(255,255,255,0.04) 100%); }
.dark .geo-2 { background: linear-gradient(210deg, rgba(255,255,255,0.14) 0%, rgba(255,255,255,0.04) 100%); }
.dark .geo-3 { background: linear-gradient(125deg, rgba(255,255,255,0.12) 0%, rgba(255,255,255,0.04) 100%); }
.dark .geo-4 { background: rgba(255, 255, 255, 0.08); box-shadow: 4px 4px 32px rgba(0, 0, 0, 0.8); }
.dark .geo-5 { background: linear-gradient(165deg, rgba(255,255,255,0.12) 0%, rgba(255,255,255,0.04) 100%); }
.dark .geo-6 { background: rgba(255, 255, 255, 0.07); }
.dark .geo-amb-1 { background: rgba(37, 99, 235, 0.35); }
.dark .geo-amb-2 { background: rgba(37, 99, 235, 0.28); }

/* Animations */
.geo-1 { animation: gDrift1 18s ease-in-out infinite; }
.geo-2 { animation: gDrift2 22s ease-in-out infinite; }
.geo-3 { animation: gDrift3 16s ease-in-out infinite; }
.geo-4 { animation: gDrift4 20s ease-in-out infinite; }
.geo-5 { animation: gDrift5 14s ease-in-out infinite; }
.geo-6 { animation: gDrift1 24s ease-in-out infinite reverse; }
.geo-amb-1 { animation: gDrift2 26s ease-in-out infinite; }
.geo-amb-2 { animation: gDrift3 19s ease-in-out infinite reverse; }

@keyframes gDrift1 { 0%,100% { transform: translate(0px, 0px); } 33% { transform: translate(60px, -40px); } 66% { transform: translate(30px, 55px); } }
@keyframes gDrift2 { 0%,100% { transform: translate(0px, 0px); } 40% { transform: translate(-55px, 50px); } 70% { transform: translate(65px, -30px); } }
@keyframes gDrift3 { 0%,100% { transform: translate(0px, 0px); } 35% { transform: translate(45px, -60px); } 70% { transform: translate(-50px, 40px); } }
@keyframes gDrift4 { 0%,100% { transform: translate(0px, 0px); } 45% { transform: translate(-40px,-50px); } 80% { transform: translate(55px, 45px); } }
@keyframes gDrift5 { 0%,100% { transform: translate(0px, 0px); } 30% { transform: translate(50px, 35px); } 65% { transform: translate(-45px,-55px); } }