.bg-border{background-color:hsl(210 15% 90%)}.bg-background{background-color:hsl(0 0% 100%)}.bg-accent:hover{background-color:hsl(185 30% 46%)}.text-accent-foreground:hover{background-color:hsl(0 0% 98%)}.bg-green-400{background-color:rgb(74 222 128)}*{border-color:hsl(210 15% 90%)}.text-muted-foreground{color:hsl(210 6% 46%)}.scribeai-layout{display:flex;min-height:100vh}.header_logo{text-decoration:none}.header_logo_img{width:160px;height:auto}.left-nav{width:80px;min-width:80px;background:hsl(0 0% 100%);border-right:1px solid #e2e6e9;padding:16px 12px;display:flex;flex-direction:column;align-items:center;gap:12px;box-shadow:var(--shadow-soft,0 4px 6px -1px hsl(210 40% 16%/.1));position:fixed;top:0;left:0;height:100vh;z-index:40;transition:width .25s cubic-bezier(.16,1,.3,1);overflow:hidden}.left-nav:hover{width:240px;box-shadow:0 8px 32px hsl(210 40% 16%/.12),0 0 0 1px hsl(210 15% 90%/.1)}.nav-brand{width:100%;display:flex;align-items:center;justify-content:center;margin-bottom:24px;padding:8px}.nav-brand-icon{color:hsl(210 40% 16%);font-weight:700;font-size:18px}.nav-brand-text{margin-left:10px;font-weight:600;color:hsl(var(--foreground));opacity:0;visibility:hidden;white-space:nowrap;transition:all .25s ease}.left-nav:hover .nav-brand-text{opacity:1;visibility:visible}.nav-logo{height:36px;max-width:100%;object-fit:contain;transition:height .25s ease}.left-nav:hover .nav-logo{height:40px;transition:height .25s ease}.nav-list{list-style:none;padding:0;margin:0;width:100%}.nav-item{margin-bottom:8px}.nav-button{width:100%;display:flex;align-items:center;gap:12px;padding:10px 12px;border:none;background:transparent;color:hsl(var(--muted-foreground));border-radius:10px;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);text-align:left;position:relative}.nav-button:hover{background:hsl(var(--muted));color:hsl(var(--foreground));transform:translateY(-1px)}.nav-button:focus-visible{outline:2px solid hsl(210 40% 16%);outline-offset:2px}.nav-button.active{background:hsl(210 40% 16%/.08);color:hsl(210 40% 16%);box-shadow:0 2px 4px hsl(210 40% 16%/.1);transform:translateY(-1px)}.nav-icon{width:20px;height:20px;color:hsl(var(--muted-foreground));flex-shrink:0}.left-nav:hover .nav-icon,.nav-button.active .nav-icon{color:hsl(210 40% 16%)}.nav-text{opacity:0;visibility:hidden;transition:all .25s ease;white-space:nowrap}.left-nav:hover .nav-text{opacity:1;visibility:visible}.main-content{flex:1;min-width:0;background:hsl(var(--background));margin-left:80px}.top-nav{position:sticky;top:0;z-index:30;background:hsl(0 0% 100%/.95);border-bottom:1px solid hsl(210 15% 90%);display:flex;align-items:center;justify-content:space-between;padding:8px 12px;gap:8px;backdrop-filter:blur(8px);min-height:56px;transition:all .2s ease}@media (min-width:640px){.top-nav{padding:12px 16px;min-height:60px;gap:12px}}@media (min-width:1024px){.top-nav{padding:12px 20px;gap:16px}}.screen{min-height:calc(100vh - 60px)}.screen.hidden{display:none}.screen{overflow-y:auto;scrollbar-width:thin;scrollbar-color:hsl(210 15% 90%) transparent}.screen::-webkit-scrollbar{width:6px}.screen::-webkit-scrollbar-track{background:transparent}.screen::-webkit-scrollbar-thumb{background-color:hsl(210 15% 90%);border-radius:3px}.screen::-webkit-scrollbar-thumb:hover{background-color:hsl(var(--muted-foreground)/.3)}.animate-fade-in{animation:fadeIn .15s ease-out forwards}.animate-scale-in{animation:scaleIn .3s ease-out}@keyframes scaleIn{0%{opacity:0;transform:scale(.9) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes fadeIn{0%{opacity:0;transform:translateX(-4px)}to{opacity:1;transform:translateX(0)}}.tooltip-container{position:absolute;left:calc(100% + 8px);top:50%;transform:translateY(-50%);z-index:9999;pointer-events:none;animation:tooltipFadeIn .2s ease-out forwards}@media (max-width:1023px){.tooltip-container{display:none}}.tooltip-content{background:hsl(var(--popover));color:hsl(var(--popover-foreground));border:1px solid hsl(210 15% 90%);padding:12px 16px;border-radius:8px;box-shadow:0 8px 32px hsl(210 40% 16%/.15);max-width:280px;font-size:13px;line-height:1.4;position:relative}.tooltip-content:before{right:100%;border:6px solid transparent;border-right-color:hsl(210 15% 90%)}.tooltip-content:after,.tooltip-content:before{content:"";position:absolute;top:50%;transform:translateY(-50%)}.tooltip-content:after{right:calc(100% - 1px);border:5px solid transparent;border-right:5px solid hsl(var(--popover))}.tooltip-title{font-weight:600;margin-bottom:4px;color:hsl(var(--popover-foreground))}.tooltip-description{color:hsl(var(--muted-foreground));font-size:12px}@keyframes tooltipFadeIn{0%{opacity:0;transform:translateY(-50%) translateX(-8px)}to{opacity:1;transform:translateY(-50%) translateX(0)}}@keyframes fadeInUp{0%{opacity:0;transform:translateX(-50%) translateY(8px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}@media (max-width:1024px){.left-nav{position:fixed;height:auto;bottom:16px;left:16px;right:16px;top:auto;min-width:0;border:0;border-radius:16px;flex-direction:row;justify-content:space-between;backdrop-filter:blur(12px);background:hsl(0 0% 100%/.95);overflow:hidden;outline:none;box-shadow:0 8px 32px hsl(210 40% 16%/.15),0 0 0 1px hsl(210 15% 90%/.1);padding:12px 16px}.left-nav,.left-nav:hover{width:calc(100% - 32px)}.left-nav .nav-brand,.left-nav .nav-brand-text,.left-nav .nav-text{display:none}.nav-list{display:flex;align-items:center;justify-content:space-between;width:100%;gap:8px}.nav-item{margin:0;flex:1}.nav-button{padding:12px 8px;justify-content:center;border-radius:12px;min-height:48px;position:relative}.nav-button:active:before{content:attr(title);bottom:calc(100% + 12px);background:rgba(0,0,0,.95);color:white;padding:8px 12px;border-radius:8px;font-size:12px;font-weight:500;white-space:nowrap;z-index:70;animation:fadeInUp .2s ease-out;max-width:200px;text-align:center}.nav-button:active:after,.nav-button:active:before{position:absolute;left:50%;transform:translateX(-50%)}.nav-button:active:after{content:"";bottom:calc(100% + 4px);width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:6px solid rgba(0,0,0,.95);z-index:71}.nav-icon{width:22px;height:22px}.main-content{margin-left:0;padding-bottom:100px}.screen{min-height:calc(100vh - 60px)}}@media (max-width:640px){.left-nav{bottom:12px;left:12px;right:12px;width:calc(100% - 24px);padding:8px 12px}.nav-button{padding:10px 6px;min-height:44px}.nav-icon{width:20px;height:20px}.main-content{padding-bottom:88px}.screen{min-height:calc(100vh - 56px)}}