:root{--bg-dark: #0f0f13;--bg-card: rgba(255, 255, 255, .05);--bg-card-hover: rgba(255, 255, 255, .08);--primary: #8b5cf6;--primary-glow: rgba(139, 92, 246, .5);--secondary: #ec4899;--text-main: #ffffff;--text-muted: #a1a1aa;--border: rgba(255, 255, 255, .1);--glass: blur(12px);--font-main: "Outfit", sans-serif;--nav-mobile-bg: rgba(20, 20, 30, .95);--chat-bg-in: rgba(255, 255, 255, .08);--chat-bg-out: rgba(139, 92, 246, .15);--backdrop: rgba(0, 0, 0, .8)}[data-theme=light]{--bg-dark: #f5f5f7;--bg-card: rgba(255, 255, 255, .9);--bg-card-hover: rgba(255, 255, 255, 1);--primary: #7c3aed;--primary-glow: rgba(124, 58, 237, .3);--secondary: #db2777;--text-main: #1a1a1a;--text-muted: #71717a;--border: rgba(0, 0, 0, .1);--nav-mobile-bg: rgba(255, 255, 255, .95);--chat-bg-in: rgba(0, 0, 0, .05);--chat-bg-out: rgba(124, 58, 237, .15);--backdrop: rgba(255, 255, 255, .8)}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-dark);color:var(--text-main);font-family:var(--font-main);font-size:var(--global-font-size, 16px);overflow-x:hidden;min-height:100vh;background-image:radial-gradient(circle at 10% 20%,rgba(139,92,246,.15) 0%,transparent 40%),radial-gradient(circle at 90% 80%,rgba(236,72,153,.15) 0%,transparent 40%);transition:background-color .3s ease,color .3s ease}#root{display:flex;flex-direction:column;height:100vh}h1,h2,h3{font-weight:700;letter-spacing:-.02em}.glass-panel{background:var(--bg-card);backdrop-filter:var(--glass);-webkit-backdrop-filter:var(--glass);border:1px solid var(--border);border-radius:16px;transition:background .3s ease,border-color .3s ease}.btn{background:linear-gradient(135deg,var(--primary),var(--secondary));border:none;color:#fff;padding:10px 20px;border-radius:12px;font-weight:600;cursor:pointer;transition:all .3s ease;display:inline-flex;align-items:center;gap:8px;font-family:var(--font-main)}.btn:hover{transform:translateY(-2px);box-shadow:0 4px 20px var(--primary-glow)}.btn-ghost{background:transparent;border:1px solid var(--border);color:var(--text-main);cursor:pointer;transition:all .2s ease}.btn-ghost:hover{background:var(--bg-card-hover)}.app-container{display:flex;height:100%;max-width:1200px;margin:0 auto;width:100%;padding:20px;gap:20px}.sidebar{width:250px;display:flex;flex-direction:column;gap:10px}.main-content{flex:1;overflow-y:auto;padding-right:10px}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes gradient{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.animate-fade-in{animation:fadeIn .4s ease-out forwards}@keyframes newBornGlow{0%{box-shadow:0 0 #ec489900;border-color:var(--border)}10%{box-shadow:0 0 30px #ec4899cc;border-color:var(--secondary);transform:scale(1.02)}to{box-shadow:0 0 #ec489900;border-color:var(--border);transform:scale(1)}}.new-spark-glow{animation:newBornGlow 2.5s cubic-bezier(.4,0,.2,1) forwards;z-index:5;position:relative;background:linear-gradient(to bottom right,#ec48991a,#8b5cf61a)!important}.message-bubble .delete-btn{opacity:0;transition:opacity .2s ease}.message-bubble:hover .delete-btn{opacity:.5}.message-bubble .delete-btn:hover{opacity:1!important}.social-link{color:#999;transition:color .2s ease,transform .2s ease}.social-link:hover{transform:translateY(-2px)}.social-link.twitter:hover{color:#1da1f2}.social-link.instagram:hover{color:#e4405f}.social-link.youtube:hover{color:red}.social-link.portfolio:hover{color:var(--primary)}.social-link.twitch:hover{color:#9146ff}.social-link.github:hover{color:#fff}.social-link.linkedin:hover{color:#0077b5}.social-link.facebook:hover{color:#1877f2}.social-link.discord:hover{color:#5865f2}.social-link.spotify:hover{color:#1db954}.social-link.tiktok:hover{color:#ff0050}.social-link.website:hover{color:var(--primary)}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--backdrop);display:flex;align-items:center;justify-content:center;z-index:1000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.modal-content{background:var(--bg-dark);border:1px solid var(--border);padding:30px;border-radius:20px;width:90%;max-width:500px;position:relative;box-shadow:0 20px 50px #00000080;color:var(--text-main);animation:fadeIn .3s ease-out}.sidebar{width:250px;transition:width .3s ease;flex-shrink:0;position:relative;z-index:2002}.sidebar.collapsed{width:80px}.nav-panel{display:flex;flex-direction:column;justify-content:space-between;height:100%;width:100%;overflow-y:auto;overflow-x:hidden;padding:20px}.nav-panel.collapsed{padding:12px}.nav-header{margin-bottom:20px}.nav-items-container{display:flex;flex-direction:column;gap:8px;flex:1}.nav-item{width:100%;border-radius:12px;transition:all .2s ease;border:none;font-size:16px;font-weight:600}.nav-item.active{background:#8b5cf61a;color:var(--primary)}.mobile-hidden{display:block}.nav-item{color:#999;transition:all .2s ease;padding:16px 20px;font-size:18px;margin-bottom:4px}.nav-item:hover,.nav-item:hover .nav-icon{color:var(--primary)!important}.nav-item.active{color:var(--primary)!important;background:#8b5cf61a}.nav-controls button:hover{color:var(--primary)!important}.text-link{transition:color .2s ease}.text-link:hover{color:var(--primary)!important}@media (max-width: 768px){.app-container{flex-direction:column;padding:10px;gap:0}.main-content{padding-bottom:90px;width:100%}.sidebar{position:fixed;bottom:0;left:0;width:100%!important;height:auto;z-index:1000;background:transparent;border:none;box-shadow:none}.sidebar.collapsed{width:100%!important}.nav-panel{flex-direction:column;width:100%;height:auto;padding:15px;padding-bottom:calc(15px + env(safe-area-inset-bottom));border-radius:20px 20px 0 0;background:var(--nav-mobile-bg);backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);align-items:center;justify-content:center;border:1px solid var(--border);border-bottom:none;box-shadow:0 -5px 20px #00000080}.nav-items-container{flex-direction:row;justify-content:space-between;gap:0;width:100%;margin-bottom:0;margin-top:0}.nav-item{flex-direction:column;padding:8px 4px;font-size:10px;justify-content:center;align-items:center;background:transparent!important;gap:2px;width:auto;flex:1;margin-bottom:0}.nav-item.active{color:var(--primary)}.nav-item.active .nav-icon{transform:translateY(-2px);filter:drop-shadow(0 0 5px var(--primary-glow))}.mobile-hidden{display:none!important}.nav-header{display:flex!important;width:0;height:0;overflow:visible;margin:0!important;padding:0!important}.mobile-top-controls{display:flex;flex-direction:column;position:fixed;top:20px;left:15px;gap:8px;z-index:2001;pointer-events:auto}.mobile-control-btn{width:32px;height:32px;border-radius:8px;background:var(--nav-mobile-bg);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--border);color:var(--text-main);display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px #0000001a;transition:transform .2s ease,background .2s;cursor:pointer;padding:0}.mobile-control-btn:active{transform:scale(.92);background:var(--bg-secondary)}.nav-header{display:flex;flex-direction:column}.nav-controls{position:static;padding:0;display:flex}.nav-footer{display:flex;width:100%;justify-content:center;padding:0}.nav-links-section{margin-top:0!important;display:flex;flex-direction:row!important;width:100%;justify-content:space-between;padding:0 10px;align-items:center;flex-wrap:wrap;gap:10px}.nav-links-section h4{display:none}.legal-links-container{display:flex;flex-wrap:wrap;width:100%;justify-content:center;gap:25px!important}.text-link{font-size:10px!important;color:#888!important;white-space:nowrap}.nav-top-section{width:100%;display:flex;flex-direction:row;align-items:center;justify-content:space-between}.mobile-floating-logo-container{display:block;position:fixed;bottom:80px;left:50%;transform:translate(-50%);z-index:2000;pointer-events:none}.mobile-floating-logo{width:220px;height:auto;filter:drop-shadow(0 4px 10px rgba(0,0,0,.5));transition:transform .3s cubic-bezier(.34,1.56,.64,1)}.mobile-floating-logo{animation:popUp .5s cubic-bezier(.34,1.56,.64,1) forwards}@keyframes popUp{0%{transform:translateY(20px) scale(.8);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}}@media (min-width: 769px){.mobile-floating-logo-container,.mobile-top-controls{display:none!important;pointer-events:none!important;width:0!important;height:0!important;opacity:0!important}}.landscape-warning{display:none;position:fixed;top:0;left:0;width:100vw;height:100dvh;background:#0f0f13;color:#fff;z-index:9999;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:20px;overflow:hidden}.landscape-icon{width:48px;height:48px;margin-bottom:15px;animation:rotate-phone 2s infinite ease-in-out;color:#8b5cf6}.landscape-text{font-family:Outfit,sans-serif;font-size:16px;font-weight:600;max-width:90%;line-height:1.4}@keyframes rotate-phone{0%{transform:rotate(0)}25%{transform:rotate(-90deg)}50%{transform:rotate(-90deg)}75%{transform:rotate(0)}to{transform:rotate(0)}}@media screen and (max-height: 500px) and (orientation: landscape){.landscape-warning{display:flex!important}.main-content,.sidebar,.mobile-top-controls,.mobile-floating-logo-container{display:none!important}}@media (min-width: 769px){.desktop-hidden{display:none!important}}@keyframes newBornGlowMuse{0%{box-shadow:0 0 #8b5cf600;border-color:var(--border)}10%{box-shadow:0 0 30px #8b5cf6cc;border-color:var(--primary);transform:scale(1.02)}to{box-shadow:0 0 #8b5cf600;border-color:var(--border);transform:scale(1)}}@keyframes newBornGlowChallenge{0%{box-shadow:0 0 #ec489900;border-color:var(--border)}10%{box-shadow:0 0 30px #ec4899cc;border-color:#ec4899;transform:scale(1.02)}to{box-shadow:0 0 #ec489900;border-color:var(--border);transform:scale(1)}}.new-spark-glow-muse{animation:newBornGlowMuse 2.5s cubic-bezier(.4,0,.2,1) forwards;z-index:5;position:relative;background:linear-gradient(to bottom right,#8b5cf626,#8b5cf60d)!important}.new-spark-glow-challenge{animation:newBornGlowChallenge 2.5s cubic-bezier(.4,0,.2,1) forwards;z-index:5;position:relative;background:linear-gradient(to bottom right,#ec489926,#ec48990d)!important}
