/* STREAMING_CHUNK:Configuring custom properties and theme variables... */
:root {
/* Base Color Tokens (Minimalist Grayscale & Dark Aesthetics) */
--bg-main: #050505;
--bg-darker: #000000;
--panel-bg: #09090b;
--panel-border: #18181b;
--panel-border-hover: #27272a;
--text-primary: #f4f4f5;
--text-secondary: #a1a1aa;
--text-muted: #52525b;
--text-disabled: #27272a;

/* System Accents */
--accent-color: #CCBBEE;
--accent-dim: rgba(204, 187, 238, 0.15);

/* Core Gradient Color Palettes (MyGO!!!!! Authorized) */
/* 1. Anon/Tomori Starry Skies (星空蓝紫) */
--grad-starry-from: #FFFFFF;
--grad-starry-via: #CCBBEE;
--grad-starry-to: #002255;
--grad-starry: linear-gradient(135deg, var(--grad-starry-from) 0%, var(--grad-starry-via) 25%, var(--grad-starry-to) 100%);

/* 2. Soyo Jade Depths (翡翠深海) */
--grad-soyosea-from: #FFFFFF;
--grad-soyosea-via: #CCFFFF;
--grad-soyosea-to: #003333;
--grad-soyosea: linear-gradient(135deg, var(--grad-soyosea-from) 0%, var(--grad-soyosea-via) 20%, var(--grad-soyosea-to) 100%);

/* 3. Taki/Rāna Violet Illusions (迷幻粉紫) */
--grad-violet-from: #FFFEF5;
--grad-violet-via: #F9C0E7;
--grad-violet-to: #38064F;
--grad-violet: linear-gradient(135deg, var(--grad-violet-from) 0%, var(--grad-violet-via) 25%, var(--grad-violet-to) 100%);

/* Utility Dimensions */
--sidebar-width: 16rem;
--sidebar-collapsed-width: 4.5rem;
--transition-smooth: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
--transition-fast: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}/* STREAMING_CHUNK:Defining global base styles and custom scrolls... /
/ Global Reset and High-Performance Optimizations */html, body {background-color: var(--bg-main);color: var(--text-primary);overflow: hidden;height: 100%;margin: 0;padding: 0;}/* Smooth custom-scrollbar implementation */.custom-scrollbar::-webkit-scrollbar {width: 4px;height: 4px;}.custom-scrollbar::-webkit-scrollbar-track {background: transparent;}.custom-scrollbar::-webkit-scrollbar-thumb {background: var(--panel-border);border-radius: 9999px;}.custom-scrollbar::-webkit-scrollbar-thumb:hover {background: var(--text-muted);}/* STREAMING_CHUNK:Specifying keyframe animations for interactive glows... /
/ Advanced Animation Keyframes */@keyframes spin-slow {0% { transform: rotate(0deg); }100% { transform: rotate(360deg); }}@keyframes pulse-glow {0%, 100% {opacity: 0.6;box-shadow: 0 0 4px rgba(255, 255, 255, 0.1);}50% {opacity: 1;box-shadow: 0 0 12px rgba(204, 187, 238, 0.4);}}@keyframes scan {0% { transform: translateX(-100%); }100% { transform: translateX(100%); }}@keyframes star-drift {0% { transform: translateY(0) rotate(0deg); opacity: 0.3; }50% { opacity: 0.9; }100% { transform: translateY(-80px) rotate(360deg); opacity: 0.1; }}/* Animation Helper Classes */.animate-spin-slow {animation: spin-slow 25s linear infinite;}.pulse-glow {animation: pulse-glow 3s cubic-bezier(0.4, 0, 0.6, 1) infinite;}.animate-scan {animation: scan 3.5s cubic-bezier(0.4, 0, 0.2, 1) infinite;}/* STREAMING_CHUNK:Styling the navigation sidebar and collapse behavior... /
/ Sidebar Layout Transitions */#sidebar {width: var(--sidebar-width);transition: var(--transition-smooth);flex-shrink: 0;}#sidebar.collapsed {width: var(--sidebar-collapsed-width);}/* Sidebar collapse - Hideable element controls */#sidebar.collapsed .sidebar-hideable {opacity: 0;max-width: 0;padding: 0;margin: 0;pointer-events: none;overflow: hidden;white-space: nowrap;}#sidebar.collapsed .nav-item {justify-content: center;padding-left: 0;padding-right: 0;border-left-width: 0px !important;}#sidebar.collapsed .nav-item i {font-size: 1.15rem;}/* Sidebar Hover Interactions */.nav-item {transition: var(--transition-fast);}.nav-item:hover {background-color: var(--panel-border);}/* STREAMING_CHUNK:Formatting custom layout cards and forms... /
/ Card with glassmorphic depth & premium borders */.samui-card {background: linear-gradient(180deg, rgba(9, 9, 11, 0.95) 0%, rgba(5, 5, 5, 0.98) 100%);box-shadow: 0 20px 40px -15px rgba(0, 0, 0, 0.8);position: relative;border: 1px solid var(--panel-border);}.samui-card:hover {border-color: var(--text-muted);}/* Interactive Input States */input, textarea, select {background-color: rgba(9, 9, 11, 0.6);backdrop-filter: blur(4px);transition: var(--transition-fast) !important;}input:focus, textarea:focus, select:focus {background-color: rgba(0, 0, 0, 0.9);box-shadow: 0 0 10px rgba(204, 187, 238, 0.1), inset 0 1px 2px rgba(0, 0, 0, 0.8);}/* STREAMING_CHUNK:Adding responsive drawer panels and dynamic transitions... /
/ Off-canvas Slide Drawer panel system */#drawer {box-shadow: -15px 0 35px -5px rgba(0, 0, 0, 0.95);transition: var(--transition-smooth);}#drawer-overlay {transition: opacity 0.3s cubic-bezier(0.25, 1, 0.5, 1);}/* STREAMING_CHUNK:Designing status indicators and customized list headers... /
/ Custom Starry Background generator elements */.star {position: absolute;background-color: #fff;border-radius: 50%;pointer-events: none;animation: star-drift linear infinite;}/* Accordion custom group configurations */.accordion-group {transition: var(--transition-fast);}.accordion-group:hover {border-color: var(--panel-border-hover);}.accordion-content {transition: max-height 0.3s cubic-bezier(0.25, 1, 0.5, 1);}/* Task Badge Custom Gradients */.priority-glow-P0 {box-shadow: 0 0 12px rgba(249, 192, 231, 0.15), inset 0 0 6px rgba(56, 6, 79, 0.4);}.priority-glow-P1 {box-shadow: 0 0 12px rgba(204, 255, 255, 0.15), inset 0 0 6px rgba(0, 51, 51, 0.4);}.priority-glow-P2 {box-shadow: 0 0 12px rgba(204, 187, 238, 0.15), inset 0 0 6px rgba(0, 34, 85, 0.4);}/* Premium gradient border for approved projects (Starry sky theme) */.grad-border-starry {border: 1px solid transparent;background-image: linear-gradient(var(--panel-bg), var(--panel-bg)), var(--grad-starry);background-origin: border-box;background-clip: padding-box, border-box;}/* Premium gradient border for ongoing approvals (Soyo Emerald Theme) */.grad-border-sea {border: 1px solid transparent;background-image: linear-gradient(var(--panel-bg), var(--panel-bg)), var(--grad-soyosea);background-origin: border-box;background-clip: padding-box, border-box;}/* Premium gradient border for urgent boards (Taki Purple Theme) */.grad-border-violet {border: 1px solid transparent;background-image: linear-gradient(var(--panel-bg), var(--panel-bg)), var(--grad-violet);background-origin: border-box;background-clip: padding-box, border-box;}