#spotify-theater-overlay{box-sizing:border-box}.theater-touch-btn{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation;background:transparent;border:none;color:#cbd5e1;transition:transform .15s,color .15s}.theater-touch-btn:active{transform:scale(.92)}.theater-player-bar,#theater-now-playing-drawer{padding-bottom:max(1.25rem,env(safe-area-inset-bottom))}.theater-tab-nav{display:flex;align-items:center;gap:6px;background:#ffffff0f;padding:4px;border-radius:999px;border:1px solid rgba(255,255,255,.12)}.theater-nav-tab{padding:6px 16px;border-radius:999px;font-size:.8rem;font-weight:700;color:#94a3b8;background:transparent;border:none;cursor:pointer;transition:all .2s ease;min-height:36px;display:inline-flex;align-items:center;justify-content:center}.theater-nav-tab.active{color:#fff;background:linear-gradient(135deg,#6366f1,#8b5cf6);box-shadow:0 4px 12px #6366f159}.mood-pill-btn{padding:8px 16px;border-radius:999px;font-size:.8rem;font-weight:600;color:#cbd5e1;background:#ffffff0f;border:1px solid rgba(255,255,255,.12);cursor:pointer;transition:all .2s;white-space:nowrap;min-height:40px;display:inline-flex;align-items:center;justify-content:center}.mood-pill-btn.active,.mood-pill-btn:hover{background:#6366f140;color:#fff;border-color:#818cf8}.theater-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px}@media(max-width:767px){#spotify-theater-overlay .theater-layout-grid{grid-template-columns:1fr!important}#theater-sidebar{display:none!important}#theater-hero-section{padding:16px 20px!important;min-height:140px!important;gap:14px!important}#theater-hero-art-box{width:80px!important;height:80px!important;border-radius:12px!important}#theater-hero-title{font-size:1.25rem!important}.theater-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))!important;gap:12px!important}.theater-desktop-only{display:none!important}.theater-mobile-only{display:flex!important}}@media(min-width:768px){.theater-mobile-only{display:none!important}.theater-desktop-only{display:flex!important}}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#ffffff4d}*{scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.15) transparent}.base-nav,.app-view,#app-shell{z-index:10!important}.mobile-bottom-dock,.navbar{z-index:30!important}#spotify-theater-overlay{z-index:50!important}#add-to-vault-modal,#youtube-vault-modal,.modal-overlay,.modal,#toast-container,.toast-container{z-index:9999!important}#add-to-vault-modal,#youtube-vault-modal{position:fixed!important;top:0!important;right:0!important;bottom:0!important;left:0!important}:root{--bg-base: #0b0f17;--bg-surface: #131b2e;--bg-surface-hover: #1c2744;--bg-overlay: rgba(11, 15, 23, .85);--border-subtle: rgba(255, 255, 255, .08);--border-accent: rgba(139, 92, 246, .3);--primary-accent: #8b5cf6;--primary-hover: #7c3aed;--primary-light: rgba(139, 92, 246, .15);--secondary-accent: #38bdf8;--secondary-hover: #0284c7;--secondary-light: rgba(56, 189, 248, .12);--text-primary: #f8fafc;--text-muted: #94a3b8;--text-inverse: #0f172a;--success: #10b981;--success-light: rgba(16, 185, 129, .15);--danger: #ef4444;--danger-light: rgba(239, 68, 68, .15);--glass-bg: rgba(19, 27, 46, .7);--glass-border: rgba(255, 255, 255, .1);--glass-blur: blur(16px);--shadow-sm: 0 2px 8px rgba(0, 0, 0, .3);--shadow-md: 0 8px 24px rgba(0, 0, 0, .4);--shadow-glow: 0 0 20px rgba(139, 92, 246, .25);--font-family: "Plus Jakarta Sans", "Inter", system-ui, -apple-system, sans-serif;--font-mono: "JetBrains Mono", monospace;--font-xs: .75rem;--font-sm: .875rem;--font-md: 1rem;--font-lg: 1.125rem;--font-xl: 1.375rem;--font-2xl: 1.75rem;--font-3xl: 2.25rem;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 16px;--radius-full: 9999px;--transition-speed: .2s ease;--transition-smooth: all .2s cubic-bezier(.16, 1, .3, 1);--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-6: 1.5rem;--space-8: 2rem;--space-12: 3rem}[data-theme=light]{--bg-base: #f8fafc;--bg-surface: #ffffff;--bg-surface-hover: #f1f5f9;--bg-overlay: rgba(248, 250, 252, .85);--border-subtle: #e2e8f0;--border-accent: rgba(124, 58, 237, .25);--primary-accent: #7c3aed;--primary-hover: #6d28d9;--primary-light: rgba(124, 58, 237, .1);--secondary-accent: #0284c7;--secondary-hover: #0369a1;--secondary-light: rgba(2, 132, 199, .1);--text-primary: #0f172a;--text-muted: #64748b;--text-inverse: #f8fafc;--success: #059669;--success-light: rgba(5, 150, 105, .1);--danger: #dc2626;--danger-light: rgba(220, 38, 38, .1);--glass-bg: rgba(255, 255, 255, .85);--glass-border: rgba(0, 0, 0, .08);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .05);--shadow-md: 0 10px 25px -5px rgba(0, 0, 0, .08);--shadow-glow: 0 0 20px rgba(124, 58, 237, .15)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-family:var(--font-family);font-size:16px;background-color:var(--bg-base);color:var(--text-primary);transition:background-color var(--transition-speed),color var(--transition-speed);scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;max-width:100vw;overscroll-behavior-y:none}body{width:100vw;height:100vh;max-width:100vw;max-height:100vh;display:flex;flex-direction:column;overflow:hidden;line-height:1.5;overscroll-behavior-y:none;padding-top:max(0rem,env(safe-area-inset-top))}a{color:var(--primary-accent);text-decoration:none;transition:color var(--transition-speed)}a:hover{color:var(--primary-hover)}button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}button{cursor:pointer;border:none;background:none}img,svg{display:block;max-width:100%}.container{width:100%;max-width:100%;margin:0 auto;padding:0 var(--space-4)}.hidden{display:none!important}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-2{gap:var(--space-2)}.gap-3{gap:var(--space-3)}.gap-4{gap:var(--space-4)}.gap-6{gap:var(--space-6)}.text-xs{font-size:var(--font-xs)}.text-sm{font-size:var(--font-sm)}.text-md{font-size:var(--font-md)}.text-lg{font-size:var(--font-lg)}.text-xl{font-size:var(--font-xl)}.text-2xl{font-size:var(--font-2xl)}.text-3xl{font-size:var(--font-3xl)}.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}.text-muted{color:var(--text-muted)}.text-accent{color:var(--primary-accent)}.glass-card{background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);transition:all .4s cubic-bezier(.16,1,.3,1);min-width:0;max-width:100%;box-sizing:border-box}.glass-card:hover{border-color:var(--border-accent)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:.65rem 1.25rem;font-weight:600;font-size:var(--font-sm);border-radius:var(--radius-md);transition:all .4s cubic-bezier(.16,1,.3,1);-webkit-user-select:none;user-select:none;white-space:nowrap}.btn-primary{background:linear-gradient(135deg,var(--primary-accent),var(--primary-hover));color:#fff;box-shadow:0 4px 14px #8b5cf659}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 6px 20px #8b5cf673}.btn-primary:active{transform:translateY(0)}.btn-secondary{background:var(--bg-surface);color:var(--text-primary);border:1px solid var(--border-subtle)}.btn-secondary:hover{background:var(--bg-surface-hover);border-color:var(--border-accent);transform:translateY(-1px)}.btn-secondary:active{transform:translateY(0)}.btn-google{background:var(--bg-surface);color:var(--text-primary);border:1px solid var(--border-subtle);width:100%}.btn-google:hover{background:var(--bg-surface-hover);border-color:var(--border-accent);transform:translateY(-1px)}.btn-icon{padding:.5rem;border-radius:var(--radius-md);color:var(--text-muted);border:1px solid var(--border-subtle);background:var(--bg-surface);transition:var(--transition-smooth)}.btn-icon:hover{color:var(--text-primary);border-color:var(--primary-accent);background:var(--bg-surface-hover);transform:scale(1.05)}.form-group{display:flex;flex-direction:column;gap:var(--space-1);margin-bottom:var(--space-4);text-align:left}.form-label{font-size:var(--font-xs);font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted)}.input-field{width:100%;padding:.75rem 1rem;background:var(--bg-base);border:1px solid var(--border-subtle);border-radius:var(--radius-md);color:var(--text-primary);outline:none;transition:var(--transition-smooth)}.input-field:focus{border-color:var(--primary-accent);box-shadow:0 0 0 3px var(--primary-light)}.input-field::placeholder{color:var(--text-muted);opacity:.6}.auth-tabs{display:flex;background:var(--bg-base);padding:4px;border-radius:var(--radius-md);border:1px solid var(--border-subtle);margin-bottom:var(--space-6)}.auth-tab{flex:1;padding:.5rem 1rem;font-size:var(--font-sm);font-weight:600;color:var(--text-muted);border-radius:var(--radius-sm);transition:var(--transition-smooth);text-align:center}.auth-tab.active{background:var(--bg-surface);color:var(--text-primary);box-shadow:var(--shadow-sm)}.navbar{position:sticky;top:0;z-index:50;background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border-bottom:1px solid var(--border-subtle);padding:var(--space-3) 0}.logo-badge{display:flex;align-items:center;gap:var(--space-2);font-size:var(--font-lg);font-weight:700;letter-spacing:-.02em}.logo-icon{width:32px;height:32px;border-radius:var(--radius-md);background:linear-gradient(135deg,var(--primary-accent),var(--secondary-accent));display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:var(--shadow-glow)}#toast-container{position:fixed;bottom:var(--space-6);right:var(--space-6);z-index:100;display:flex;flex-direction:column;gap:var(--space-2);pointer-events:none}.toast{pointer-events:auto;min-width:280px;max-width:400px;padding:.85rem 1.25rem;border-radius:var(--radius-md);background:var(--bg-surface);border:1px solid var(--border-subtle);color:var(--text-primary);font-size:var(--font-sm);font-weight:500;box-shadow:var(--shadow-md);display:flex;align-items:center;gap:var(--space-3);animation:toastSlideIn .3s cubic-bezier(.16,1,.3,1) forwards}.toast-success{border-left:4px solid var(--success)}.toast-error{border-left:4px solid var(--danger)}.toast-info{border-left:4px solid var(--primary-accent)}@keyframes toastSlideIn{0%{opacity:0;transform:translateY(16px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.spinner{width:18px;height:18px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .6s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.typing-cursor{display:inline-block;font-weight:700;color:var(--primary-accent);animation:blink .8s infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.nav-tabs{display:flex;gap:var(--space-2)}.nav-tab{padding:.5rem .85rem;border-radius:var(--radius-md);font-size:var(--font-sm);font-weight:600;color:var(--text-muted);transition:var(--transition-smooth);user-select:none;-webkit-user-select:none}.nav-tab:hover,.nav-tab.active{color:var(--text-primary);background:var(--primary-light)}button:active,.btn:active,.nav-tab:active,.dock-tab:active{transform:scale(.95)!important}@keyframes slideUpFade{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.app-view:not(.hidden){animation:slideUpFade .45s cubic-bezier(.16,1,.3,1) forwards}.glass-card{animation:slideUpFade .45s cubic-bezier(.16,1,.3,1) ease-out forwards}@media(min-width:769px){body{width:100vw;height:100vh;overflow:hidden;display:flex;flex-direction:column}.navbar{flex-shrink:0;width:100vw;position:sticky;top:0;z-index:50;padding:var(--space-3) var(--space-6)}.navbar .container{max-width:100%;padding:0}#app-shell{flex:1;width:100vw;max-width:100vw;height:calc(100vh - 65px);overflow-y:auto;overflow-x:hidden;padding:2rem 2.5rem 3rem!important;box-sizing:border-box;-webkit-overflow-scrolling:touch}#auth-overlay{flex:1;width:100vw;height:calc(100vh - 65px);overflow-y:auto;display:flex;justify-content:center;align-items:center}}.mobile-bottom-dock{display:none}.apps-drawer-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:980;background:#000000b3;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;flex-direction:column;justify-content:flex-end;opacity:1;transition:opacity .3s ease}.apps-drawer-overlay.hidden{display:none!important}.apps-drawer-sheet{background:var(--bg-surface);border-top:1px solid var(--border-accent);border-radius:20px 20px 0 0!important;padding:16px 20px 28px!important;box-shadow:0 -10px 40px #00000080;animation:slideUpSheet .35s cubic-bezier(.16,1,.3,1) forwards;max-height:80vh;overflow-y:auto}@keyframes slideUpSheet{0%{transform:translateY(100%)}to{transform:translateY(0)}}.apps-drawer-handle{width:36px;height:4px;background:#fff3;border-radius:999px;margin:0 auto 12px}.apps-drawer-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.apps-drawer-card{display:flex;align-items:center;gap:12px;padding:12px 14px;background:var(--bg-base);border:1px solid var(--border-subtle);border-radius:var(--radius-md);text-align:left;transition:all .2s ease;cursor:pointer;width:100%}.apps-drawer-card:hover,.apps-drawer-card:active{border-color:var(--primary-accent);background:var(--bg-surface-hover);transform:translateY(-2px)}.drawer-card-icon{width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1.2rem;flex-shrink:0}.drawer-card-info{display:flex;flex-direction:column;min-width:0}.drawer-card-title{font-size:.85rem;font-weight:700;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.drawer-card-desc{font-size:.7rem;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media(max-width:768px){body{width:100vw;min-height:100vh;overflow-x:hidden;overflow-y:auto}.navbar{padding:8px 12px!important}.navbar .container{padding:0!important}.logo-badge{font-size:.95rem;gap:6px}.logo-icon{width:28px;height:28px}.logo-icon svg{width:16px;height:16px}.header-actions{gap:6px!important}#karma-header-badge{padding:3px 8px!important;font-size:.72rem!important;border-radius:999px!important}#voice-ai-toggle-btn{padding:3px 6px!important;border-radius:999px!important}#voice-ai-label{display:none}.mobile-bottom-dock{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:90;height:calc(64px + env(safe-area-inset-bottom,0px));background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border-top:1px solid var(--border-subtle);justify-content:space-around;align-items:center;padding-top:6px;padding-left:4px;padding-right:4px;padding-bottom:max(6px,env(safe-area-inset-bottom,0px));box-shadow:0 -4px 20px #00000040;user-select:none;-webkit-user-select:none;box-sizing:border-box}.dock-tab{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:11px;font-weight:600;color:var(--text-muted);padding:4px 6px;flex:1;max-width:20%;height:100%;border-radius:var(--radius-md);transition:all .3s cubic-bezier(.16,1,.3,1);background:transparent;border:none;cursor:pointer;user-select:none;-webkit-user-select:none}.dock-tab span{white-space:nowrap!important;font-size:11px!important;overflow:hidden!important;text-overflow:ellipsis !overflow;max-width:100%;line-height:1.2;display:block}.dock-tab.active,.dock-tab:hover{color:var(--primary-accent);background:#8b5cf61f}.nav-tabs{display:none}#app-shell{flex:1;width:100%;max-width:100%;overflow-y:auto;-webkit-overflow-scrolling:touch;padding-top:var(--space-4)!important;padding-left:var(--space-3)!important;padding-right:var(--space-3)!important;padding-bottom:max(90px,calc(80px + env(safe-area-inset-bottom,0px)))!important}.flex:not(.nav-tabs):not(.mobile-bottom-dock):not(.dock-tab):not(.header-actions){flex-wrap:wrap}.input-field,.btn,select,textarea{max-width:100%;word-break:break-word}.glass-card{padding:var(--space-4)!important;max-width:100%;overflow:hidden}}p,h1,h2,h3,h4,h5,h6,span,li,td,th{overflow-wrap:break-word;word-break:break-word}#global-audio-player{position:fixed;bottom:0;left:0;right:0;z-index:990;transition:all .3s ease}@media(max-width:768px){#global-audio-player{bottom:60px!important;padding:var(--space-2) var(--space-3)!important}}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;background:#000000bf;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;padding:var(--space-4);animation:fadeIn .2s ease-out}.modal-content{background:var(--bg-surface);border:1px solid var(--border-accent);border-radius:var(--radius-lg);padding:var(--space-6);width:100%;max-width:500px;box-shadow:var(--shadow-lg);animation:fadeInUp .3s cubic-bezier(.16,1,.3,1)}#sleep-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:9999;background:#07090e;color:#f8fafc;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-6);text-align:center}.sleep-clock{font-family:JetBrains Mono,monospace;font-size:clamp(3rem,10vw,5.5rem);font-weight:700;letter-spacing:-.02em;color:#a78bfa;text-shadow:0 0 40px rgba(167,139,250,.4);margin:var(--space-4) 0}
