@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&display=swap";@import "https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.css";:root{--bg-color:#020617;--surface:#0f172a66;--surface-hover:#1e293b99;--primary:#3b82f6;--primary-glow:#3b82f64d;--secondary:#6366f1;--accent:#f8fafc;--text-main:#f1f5f9;--text-muted:#94a3b8;--border:#ffffff0f;--glass-bg:#02061799;--sidebar-width:280px;--canvas-width:380px;--transition:all .3s cubic-bezier(.4, 0, .2, 1)}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-color);color:var(--text-main);background-image:radial-gradient(circle at 0 0,#3b82f626 0%,#0000 40%),radial-gradient(circle at 100% 100%,#6366f126 0%,#0000 40%);height:100vh;font-family:Outfit,sans-serif;overflow:hidden}.bg-blobs{z-index:-1;pointer-events:none;position:fixed;inset:0;overflow:hidden}.blob{background:var(--primary-glow);filter:blur(100px);border-radius:50%;width:500px;height:500px;animation:20s infinite alternate float;position:absolute}.blob-1{background:#3b82f633;top:-100px;left:-100px}.blob-2{background:#6366f133;animation-delay:-5s;bottom:-100px;right:-100px}@keyframes float{0%{transform:translate(0)scale(1)}to{transform:translate(100px,50px)scale(1.1)}}#app{grid-template-columns:var(--sidebar-width) 1fr var(--canvas-width);gap:1rem;height:100vh;padding:1rem;display:grid}.glass-panel{background:var(--glass-bg);-webkit-backdrop-filter:blur(20px);border:1px solid var(--border);border-radius:24px;flex-direction:column;display:flex;overflow:hidden;box-shadow:0 8px 32px #0006}.sidebar{padding:1.5rem}.logo-section{align-items:center;gap:.75rem;margin-bottom:2.5rem;padding:0 .5rem;display:flex}.logo-hex{background:linear-gradient(135deg, var(--primary), var(--secondary));width:40px;height:40px;box-shadow:0 0 20px var(--primary-glow);border-radius:12px;justify-content:center;align-items:center;display:flex}.nav-group{flex-direction:column;flex:1;gap:.5rem;display:flex}.nav-item{color:var(--text-muted);cursor:pointer;transition:var(--transition);border:1px solid #0000;border-radius:14px;align-items:center;gap:1rem;padding:.85rem 1rem;display:flex}.nav-item:hover{background:var(--surface-hover);color:var(--text-main);transform:translate(4px)}.nav-item.active{color:var(--primary);background:#3b82f61a;border-color:#3b82f633}.chat-container{flex-direction:column;display:flex}.chat-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:1.25rem 1.5rem;display:flex}.subject-tag{color:var(--primary);text-transform:uppercase;letter-spacing:.5px;background:#3b82f61a;border:1px solid #3b82f633;border-radius:10px;padding:.4rem .8rem;font-size:.75rem;font-weight:700}.messages-area{scroll-behavior:smooth;flex-direction:column;flex:1;gap:1.5rem;padding:1.5rem;display:flex;overflow-y:auto}.message{flex-direction:column;max-width:85%;display:flex}.message.user{align-self:flex-end}.message.ai{align-self:flex-start}.bubble{border-radius:20px;padding:1rem 1.25rem;font-size:.95rem;line-height:1.6}.message.user .bubble{background:linear-gradient(135deg, var(--primary), var(--secondary));color:#fff;border-bottom-right-radius:4px;box-shadow:0 4px 15px #3b82f633}.message.ai .bubble{background:var(--surface);border:1px solid var(--border);border-bottom-left-radius:4px}.input-section{border-top:1px solid var(--border);padding:1.5rem}.input-box{border:1px solid var(--border);transition:var(--transition);background:#0f172a99;border-radius:18px;align-items:center;gap:1rem;padding:.5rem .5rem .5rem 1.25rem;display:flex}.input-box:focus-within{border-color:var(--primary);box-shadow:0 0 20px #3b82f61a}.input-box input{color:var(--text-main);background:0 0;border:none;outline:none;flex:1;padding:.5rem 0;font-size:.95rem}.send-btn{background:var(--primary);color:#fff;cursor:pointer;width:40px;height:40px;transition:var(--transition);border:none;border-radius:12px;justify-content:center;align-items:center;display:flex}.send-btn:hover{background:var(--secondary);transform:scale(1.05)}.canvas{background:#0f172a33}.canvas-header{border-bottom:1px solid var(--border);align-items:center;gap:.75rem;padding:1.25rem 1.5rem;display:flex}.note-card{background:var(--surface);border:1px solid var(--border);transition:var(--transition);border-radius:16px;margin-bottom:1rem;padding:1.25rem}.note-card:hover{border-color:var(--primary);background:var(--surface-hover);transform:translateY(-2px)}.note-tag{color:var(--primary);text-transform:uppercase;letter-spacing:.5px;background:#3b82f61a;border-radius:6px;margin-bottom:.5rem;padding:.2rem .6rem;font-size:.7rem;font-weight:700;display:inline-block}.timer-box{text-align:center;background:linear-gradient(135deg,#3b82f61a,#6366f11a);border:1px solid #3b82f61a;border-radius:20px;margin-top:2rem;padding:1.25rem}.timer-val{background:linear-gradient(#fff,#94a3b8);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin-bottom:.75rem;font-size:2.25rem;font-weight:700}.timer-controls{justify-content:center;gap:1rem;display:flex}.icon-btn{color:var(--text-muted);cursor:pointer;transition:var(--transition);background:0 0;border:none}.icon-btn:hover{color:var(--primary)}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border);border-radius:10px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}@media (width<=1100px){#app{grid-template-columns:80px 1fr 0}.canvas,.nav-text,.logo-text{display:none}.sidebar{align-items:center;padding:1rem}}.typing-indicator{gap:4px;padding:4px 0;display:flex}.typing-dot{background:var(--text-muted);border-radius:50%;width:6px;height:6px;animation:1.4s ease-in-out infinite both bounce}.typing-dot:first-child{animation-delay:-.32s}.typing-dot:nth-child(2){animation-delay:-.16s}@keyframes bounce{0%,80%,to{transform:scale(0)}40%{transform:scale(1)}}@keyframes messageIn{0%{opacity:0;transform:translateY(10px)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}.message{animation:.3s ease-out forwards messageIn}.premium-badge{color:#000;text-transform:uppercase;letter-spacing:.5px;background:linear-gradient(135deg,gold 0%,#ff8c00 100%);border:1px solid #fff6;border-radius:20px;align-items:center;gap:4px;height:fit-content;padding:3px 8px;font-size:.65rem;font-weight:800;display:flex;box-shadow:0 0 15px #ffd7004d}.premium-badge i{animation:2s infinite sparkle}@keyframes sparkle{0%,to{opacity:.5;transform:scale(1)}50%{opacity:1;transform:scale(1.2)}}