.layout-wrapper{display:flex;min-height:100vh}.sidebar-overlay{position:fixed;inset:0;background:#000c;z-index:40;opacity:0;pointer-events:none;transition:opacity .3s}.sidebar-overlay.open{opacity:1;pointer-events:auto}.sidebar{position:fixed;top:0;left:0;bottom:0;width:280px;background:#020617f2;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-right:1px solid rgba(255,255,255,.08);z-index:50;transform:translate(-100%);transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column}.sidebar.open{transform:translate(0)}.sidebar.collapsed{width:80px}@media(max-width:1024px){.sidebar{width:100%}}.main-content{flex:1;width:100%;display:flex;flex-direction:column;min-height:100vh;transition:padding-left .3s;padding-left:0}@media(min-width:1024px){.sidebar{transform:translate(0)}.main-content{padding-left:280px}.main-content.collapsed{padding-left:80px}.mobile-trigger{display:none!important}.collapse-btn{display:block!important}}.collapse-btn{display:none}.sidebar.collapsed .logo-text,.sidebar.collapsed .nav-category,.sidebar.collapsed .link-text,.sidebar.collapsed .footer-text{opacity:0;width:0;display:none}.sidebar.collapsed .sidebar-link{justify-content:center;padding:.75rem 0}.sidebar.collapsed .logo-container{justify-content:center}.topbar{position:sticky;top:0;z-index:30;background:#020617cc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.05);height:64px;display:flex;align-items:center;justify-content:space-between;padding:0 1.5rem}.nav-category{font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;color:#64748b;margin:0;font-weight:700;opacity:.7;white-space:nowrap}.nav-category-link{text-decoration:none;display:block;margin:1.5rem 1rem .5rem;transition:opacity .2s}.nav-category-link:hover{opacity:1}.nav-category-link:hover .nav-category{color:#4da2ff}.sidebar-link{display:flex;align-items:center;gap:12px;padding:.75rem 1rem;margin:.25rem .5rem;border-radius:12px;color:#94a3b8;text-decoration:none;font-size:1rem;font-weight:500;transition:all .2s;border:1px solid transparent}.sidebar-link:hover{background:#ffffff0d;color:#fff}.sidebar-link.active{background:#4da2ff14;color:#fff;border-color:#4da2ff26}.icon-box{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:#ffffff0d;border-radius:8px;color:#cbd5e1;transition:all .2s;flex-shrink:0}.sidebar-link:hover .icon-box{background:#ffffff1a;color:#fff}.sidebar-link.active .icon-box{background:#4da2ff;color:#fff;box-shadow:0 4px 12px #4da2ff4d}:root{--sui-blue: #4DA2FF;--sui-cyan: #00D1FF;--sui-purple: #9563FF;--sui-bg: #020617;--sui-card: rgba(255, 255, 255, .03);--sui-glass-border: rgba(255, 255, 255, .08);--sui-glass-glow: rgba(77, 162, 255, .1);--sui-text: #F8FAFC;--sui-text-dim: #94A3B8;--font-main: "Outfit", sans-serif;--glass-blur: blur(20px)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-main);background-color:var(--sui-bg);background-image:radial-gradient(circle at 50% -20%,rgba(77,162,255,.15) 0%,transparent 50%),radial-gradient(circle at 0% 100%,rgba(149,99,255,.05) 0%,transparent 40%);color:var(--sui-text);min-height:100vh;overflow-x:hidden}.glass-panel{background:var(--sui-card);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--sui-glass-border);border-radius:28px;padding:2.5rem;box-shadow:0 10px 40px -10px #00000080;transition:all .4s cubic-bezier(.4,0,.2,1)}.glass-panel:hover{border-color:#4da2ff4d;transform:translateY(-5px);box-shadow:0 20px 50px -10px #4da2ff26;background:#ffffff0d}.app-container{max-width:1200px;margin:0 auto;padding:0 24px}h1,h2,h3{font-weight:900;letter-spacing:-.04em;line-height:1}.gradient-text{background:linear-gradient(90deg,#FFF 0%,#FFF 30%,var(--sui-blue) 45%,var(--sui-cyan) 50%,var(--sui-blue) 55%,#FFF 70%,#FFF 100%);background-size:200% auto;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:shine 6s linear infinite}@keyframes shine{to{background-position:200% center}}.mesh-bg{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;background:var(--sui-bg);overflow:hidden}.mesh-bg:after{content:"";position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");opacity:.03;pointer-events:none}.nav-link{color:var(--sui-text-dim);text-decoration:none;font-weight:600;padding:8px 16px;border-radius:12px;transition:all .3s ease}.nav-link:hover,.nav-link.active{color:#fff;background:#ffffff0d}.btn-primary{background:linear-gradient(135deg,var(--sui-blue),var(--sui-cyan));border:none;border-radius:14px;color:#fff;padding:1rem 2rem;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #4da2ff4d}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 25px #4da2ff66}.tool-card{border:1px solid rgba(255,255,255,.06)}.tool-card:hover h3{color:var(--sui-blue)}.tool-card:hover .card-button{background:var(--sui-blue)!important;color:#fff!important;box-shadow:0 4px 20px #4da2ff66;transform:scale(1.02)}@keyframes pulse{0%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.floating-icon{animation:float 6s ease-in-out infinite;display:inline-block}@keyframes float{0%{transform:translateY(0)}50%{transform:translateY(-12px)}to{transform:translateY(0)}}@media(max-width:768px){.app-container{padding:0 16px}.glass-panel{padding:1.5rem!important;border-radius:20px}h1{font-size:2rem!important}h2{font-size:1.5rem!important}input,select,button{min-height:48px;font-size:16px!important}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.movie-card:hover{transform:translateY(-5px)}