@import"https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&family=Inter:wght@300;400;500;600&display=swap";:root{--bg-primary: hsl(240, 10%, 4%);--bg-secondary: hsl(240, 10%, 7%);--bg-tertiary: hsl(240, 10%, 10%);--text-primary: hsl(0, 0%, 98%);--text-secondary: hsl(240, 5%, 65%);--text-muted: hsl(240, 5%, 45%);--accent-primary: hsl(168, 100%, 44%);--accent-hover: hsl(168, 100%, 50%);--accent-glow: hsla(168, 100%, 44%, .3);--accent-secondary: hsl(239, 84%, 67%);--accent-secondary-glow: hsla(239, 84%, 67%, .3);--theme-transition: background-color .8s ease, color .8s ease, border-color .8s ease, box-shadow .8s ease;--danger: hsl(0, 100%, 65%);--success: hsl(150, 100%, 45%);--warning: hsl(45, 100%, 53%);--border-color: hsla(0, 0%, 100%, .06);--border-focus: hsla(168, 100%, 44%, .5);--glass-bg: hsla(240, 10%, 6%, .7);--glass-border: hsla(0, 0%, 100%, .08);--glass-reflection: linear-gradient(135deg, hsla(0, 0%, 100%, .15) 0%, transparent 50%, hsla(0, 0%, 100%, .05) 100%);--glass-shadow: 0 16px 48px -12px hsla(0, 0%, 0%, .9), inset 0 1px 1px hsla(0, 0%, 100%, .05);--radius-sm: .5rem;--radius-md: .85rem;--radius-lg: 1.25rem;--radius-xl: 2rem;--transition-fast: .25s cubic-bezier(.2, .8, .2, 1);--transition-normal: .5s cubic-bezier(.2, .8, .2, 1)}[data-theme=tab-1]{--accent-primary: hsl(210, 100%, 50%);--accent-hover: hsl(210, 100%, 55%);--accent-glow: hsla(210, 100%, 50%, .3);--accent-secondary: hsl(230, 80%, 60%);--accent-secondary-glow: hsla(230, 80%, 60%, .3)}[data-theme=tab-2]{--accent-primary: hsl(270, 100%, 60%);--accent-hover: hsl(270, 100%, 65%);--accent-glow: hsla(270, 100%, 60%, .3);--accent-secondary: hsl(300, 80%, 60%);--accent-secondary-glow: hsla(300, 80%, 60%, .3)}[data-theme=tab-3]{--accent-primary: hsl(190, 100%, 50%);--accent-hover: hsl(190, 100%, 55%);--accent-glow: hsla(190, 100%, 50%, .3);--accent-secondary: hsl(170, 80%, 50%);--accent-secondary-glow: hsla(170, 80%, 50%, .3)}[data-theme=tab-4]{--accent-primary: hsl(32, 100%, 55%);--accent-hover: hsl(32, 100%, 60%);--accent-glow: hsla(32, 100%, 55%, .3);--accent-secondary: hsl(45, 100%, 50%);--accent-secondary-glow: hsla(45, 100%, 50%, .3)}[data-theme=tab-5]{--accent-primary: hsl(160, 60%, 65%);--accent-hover: hsl(160, 60%, 70%);--accent-glow: hsla(160, 60%, 65%, .3);--accent-secondary: hsl(170, 50%, 65%);--accent-secondary-glow: hsla(170, 50%, 65%, .3)}[data-theme=tab-6]{--accent-primary: hsl(220, 90%, 60%);--accent-hover: hsl(220, 90%, 65%);--accent-glow: hsla(220, 90%, 60%, .3);--accent-secondary: hsl(240, 80%, 65%);--accent-secondary-glow: hsla(240, 80%, 65%, .3)}[data-theme=tab-7]{--accent-primary: hsl(145, 100%, 45%);--accent-hover: hsl(145, 100%, 50%);--accent-glow: hsla(145, 100%, 45%, .3);--accent-secondary: hsl(130, 80%, 45%);--accent-secondary-glow: hsla(130, 80%, 45%, .3)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,system-ui,-apple-system,sans-serif;background-color:var(--bg-primary);color:var(--text-primary);line-height:1.6;-webkit-font-smoothing:antialiased;min-height:100vh;overflow-x:hidden;position:relative}body:before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;z-index:-2;background-image:radial-gradient(at 0% 0%,var(--accent-secondary-glow) 0,transparent 60%),radial-gradient(at 100% 0%,var(--accent-glow) 0,transparent 60%),radial-gradient(at 50% 100%,hsla(260,80%,60%,.05) 0,transparent 50%),radial-gradient(at 80% 50%,var(--accent-glow) 0,transparent 50%);background-attachment:fixed;transition:var(--theme-transition)}body:after{content:"";position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;opacity:.025;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3BaseFilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/baseFilter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E")}h1,h2,h3,h4,h5,h6,.title{font-family:Outfit,sans-serif;letter-spacing:-.02em}#root{min-height:100vh;display:flex;flex-direction:column}.glass-panel{background:var(--glass-bg);backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow);border-radius:var(--radius-lg);position:relative;overflow:hidden;transition:var(--theme-transition)}.glass-panel:after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:var(--glass-reflection);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}.glass-panel-sm{background:#17171c66;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--glass-border);border-radius:var(--radius-md);box-shadow:0 8px 16px -4px #00000080;transition:var(--theme-transition)}.input-base{background:#00000040;border:1px solid var(--border-color);color:var(--text-primary);padding:.9rem 1.25rem;border-radius:var(--radius-md);transition:all var(--transition-fast);width:100%}.input-base:focus{outline:none;border-color:var(--accent-primary);box-shadow:0 0 0 4px var(--accent-glow);background:#00000059}.text-gradient{background:linear-gradient(135deg,var(--accent-primary) 0%,var(--accent-secondary) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:var(--bg-tertiary);border-radius:10px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.app-container{display:flex;flex-direction:column;min-height:100vh;padding:3rem 2rem;max-width:1600px;margin:0 auto;width:100%}.header{margin-bottom:3.5rem;text-align:center}.title{font-size:3.5rem;font-weight:800;margin-bottom:.75rem;letter-spacing:-.04em;filter:drop-shadow(0 0 20px var(--accent-glow))}.subtitle{color:var(--text-secondary);font-size:1.15rem;font-weight:400;letter-spacing:.02em;opacity:.8}.tabs-nav{display:flex;gap:.75rem;padding:.6rem;background:#1c1c2280;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:var(--radius-xl);margin-bottom:2.5rem;border:1px solid var(--border-color);box-shadow:0 12px 32px -8px #0006,0 0 0 1px var(--accent-glow);transition:var(--theme-transition)}.tab-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:.75rem;padding:1rem .75rem;background:transparent;color:var(--text-secondary);border-radius:var(--radius-lg);cursor:pointer;font-size:.9rem;font-weight:600;transition:all var(--transition-normal);border:1px solid transparent}.tab-btn:hover{background:#ffffff0a;color:var(--text-primary);transform:translateY(-2px)}.tab-btn.active{background:linear-gradient(135deg,#1c1c22cc,#09090be6);color:var(--accent-primary);border-color:var(--accent-glow);box-shadow:0 12px 24px -6px var(--accent-glow),inset 0 1px 2px #ffffff1a;text-shadow:0 0 12px var(--accent-glow);filter:drop-shadow(0 0 4px hsla(0,0%,100%,.1))}.tab-content{animation:tabFadeIn .6s cubic-bezier(.2,.8,.2,1);box-shadow:var(--glass-shadow);border:1px solid var(--glass-border)}@keyframes tabFadeIn{0%{opacity:0;transform:translateY(20px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;padding:.8rem 1.6rem;border-radius:var(--radius-md);font-weight:600;font-size:.9rem;transition:all var(--transition-fast);letter-spacing:-.01em}.btn-primary{background:var(--accent-primary);color:var(--bg-primary);box-shadow:0 8px 24px -6px var(--accent-glow)}.btn-primary:hover{background:var(--accent-hover);transform:translateY(-2px) scale(1.02);box-shadow:0 12px 28px -4px var(--accent-glow)}.btn-secondary{background:#ffffff0f;color:var(--text-primary);border:1px solid var(--border-color)}.btn-secondary:hover{background:#ffffff1a;border-color:#ffffff26;transform:translateY(-2px)}.btn-danger{background:#ff4d4d14;color:var(--danger);border:1px solid hsla(0,100%,65%,.2)}.btn-danger:hover{background:#ff4d4d26;border-color:#ff4d4d66;transform:translateY(-2px)}
