@import"https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=IBM+Plex+Mono:wght@400;500;700&family=Bricolage+Grotesque:wght@400;500;600;700;800&display=swap";*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg-hsl: 224, 71%, 4%;--bg: #030712;--surface-hsl: 222, 47%, 11%;--surface: rgba(10, 16, 28, .72);--surface2: rgba(20, 32, 54, .5);--surface3: rgba(30, 48, 80, .65);--border: rgba(255, 255, 255, .065);--border2: rgba(255, 255, 255, .14);--border-neon: rgba(96, 165, 250, .25);--accent: #3b82f6;--accent-glow: rgba(59, 130, 246, .15);--purple: #a855f7;--purple-glow: rgba(168, 85, 247, .15);--pink: #ec4899;--pink-glow: rgba(236, 72, 153, .12);--green: #10b981;--green-glow: rgba(16, 185, 129, .12);--orange: #f97316;--orange-glow: rgba(249, 115, 22, .12);--red: #ef4444;--red-glow: rgba(239, 68, 68, .12);--mono: "JetBrains Mono", "IBM Plex Mono", monospace;--sans: "Plus Jakarta Sans", "Bricolage Grotesque", sans-serif;--text: #f8fafc;--text2: #94a3b8;--text3: #475569;--text-muted: #64748b;--shadow-sm: 0 4px 12px rgba(0, 0, 0, .5), 0 1px 3px rgba(0, 0, 0, .3);--shadow-md: 0 16px 40px rgba(0, 0, 0, .7), 0 4px 16px rgba(0, 0, 0, .4);--shadow-lg: 0 24px 64px rgba(0, 0, 0, .85), 0 8px 24px rgba(0, 0, 0, .5);--shadow-inner: inset 0 2px 6px rgba(0, 0, 0, .6);--shadow-neon: 0 0 20px rgba(96, 165, 250, .25), 0 0 6px rgba(192, 132, 252, .15);--shadow-focus: 0 0 0 3px rgba(59, 130, 246, .25), 0 0 24px rgba(168, 85, 247, .18);--gradient-primary: linear-gradient(135deg, var(--accent), var(--purple));--gradient-neon: linear-gradient(135deg, var(--accent), var(--purple), var(--pink));--gradient-emerald: linear-gradient(135deg, var(--green), var(--accent));--prismatic-glow: linear-gradient(135deg, rgba(96,165,250,.12), rgba(192,132,252,.12), rgba(52,211,153,.06));--prismatic-active: linear-gradient(135deg, rgba(96,165,250,.22), rgba(192,132,252,.22))}html,body,#root{height:100%}body{background:var(--bg);color:var(--text);font-family:var(--sans);font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased;letter-spacing:.1px;overflow-x:hidden;width:100%}::selection{background:#60a5fa4d;color:#fff;text-shadow:0 0 8px rgba(96,165,250,.4)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#ffffff14;border-radius:4px;border:2px solid var(--bg)}::-webkit-scrollbar-thumb:hover{background:#fff3}.ide-layout-shell{display:flex;height:100vh;width:100%;max-width:100%;overflow:hidden;background:var(--bg);position:relative}.ide-layout-shell:before{content:"";position:absolute;width:600px;height:600px;top:-200px;left:-200px;background:radial-gradient(circle,rgba(192,132,252,.05) 0%,transparent 70%);pointer-events:none;z-index:0;filter:blur(100px);animation:floatGlow 20s ease-in-out infinite alternate}.ide-layout-shell:after{content:"";position:absolute;width:700px;height:700px;bottom:-250px;right:-150px;background:radial-gradient(circle,rgba(96,165,250,.04) 0%,transparent 70%);pointer-events:none;z-index:0;filter:blur(120px);animation:floatGlow 28s ease-in-out infinite alternate-reverse}@keyframes floatGlow{0%{transform:translate(0) scale(1)}to{transform:translate(80px,50px) scale(1.15)}}.drawer-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:80}.ide-pane-left{width:260px;flex-shrink:0;background:#03050899!important;-webkit-backdrop-filter:blur(28px) saturate(190%);backdrop-filter:blur(28px) saturate(190%);border-right:1px solid var(--border);display:flex;flex-direction:column;z-index:90;transition:transform .3s cubic-bezier(.16,1,.3,1);position:relative}.sidebar-logo{padding:24px;cursor:pointer;display:flex;align-items:center;gap:12px;transition:all .2s ease}.sidebar-logo:hover{background:#ffffff04}.logo-box{width:34px;height:34px;background:linear-gradient(135deg,#60a5fa,#34d399,#c084fc,#60a5fa);background-size:300% 300%;animation:logoGradient 6s ease infinite;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0;box-shadow:0 4px 16px #60a5fa40}@keyframes logoGradient{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.logo-name{font-size:19px;font-weight:800;letter-spacing:-.5px;text-shadow:0 2px 8px rgba(0,0,0,.4)}.logo-sub{font-size:10.5px;color:var(--text3);letter-spacing:1.5px;text-transform:uppercase;font-family:var(--mono)}.sidebar-section{padding:8px 12px 16px}.sidebar-section-label{font-size:10.5px;letter-spacing:1.5px;text-transform:uppercase;color:var(--text3);font-family:var(--mono);padding:0 10px;margin-bottom:8px}.sidebar-search-box{padding:0 20px 16px}.search-input-wrapper{position:relative;display:flex;align-items:center}.pane-search-input{width:100%;background:var(--surface2);border:1px solid var(--border);color:var(--text);border-radius:8px;padding:10px 40px 10px 14px;font-family:var(--sans);font-size:13px;outline:none;transition:all .2s;box-shadow:inset 0 2px 4px #0003}.pane-search-input:focus{border-color:var(--border2);background:var(--surface)}.search-kbd-badge{position:absolute;right:8px;background:var(--bg);border:1px solid var(--border2);padding:2px 6px;border-radius:4px;font-family:var(--mono);font-size:10px;color:var(--text3);pointer-events:none}.nav-scroll-area{flex:1;overflow-y:auto;padding:0 12px 24px}.category-details{margin-bottom:4px}.category-details summary{cursor:pointer;outline:none;list-style:none;display:flex;align-items:center;-webkit-user-select:none;user-select:none;transition:color .2s;padding:8px 10px;border-radius:6px}.category-details summary:hover{background:#ffffff05}.category-details summary::-webkit-details-marker{display:none}.category-details summary:before{content:"›";display:inline-block;margin-right:6px;transition:transform .2s;color:var(--text3);font-size:14px}.category-details[open] summary:before{transform:rotate(90deg)}.category-items{padding-left:8px;margin-bottom:8px;border-left:1px solid var(--border);margin-left:14px;margin-top:4px}.nav-item{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:8px;cursor:pointer;color:var(--text2);font-size:13.5px;font-weight:500;transition:all .25s cubic-bezier(.16,1,.3,1);border:1px solid transparent;margin-bottom:3px;position:relative}.nav-item:hover{background:#ffffff06;color:var(--text);transform:translate(4px)}.nav-item.active{background:var(--surface2);border-color:#ffffff08;color:#fff;box-shadow:var(--shadow-sm)}.nav-item.active:before{content:"";position:absolute;left:0;top:20%;height:60%;width:3px;background:linear-gradient(180deg,var(--accent),var(--purple));border-radius:4px}.nav-icon{font-size:15px;flex-shrink:0;transition:transform .25s cubic-bezier(.16,1,.3,1);display:inline-block}.nav-item:hover .nav-icon{transform:scale(1.15) rotate(-3deg)}.ide-pane-center{flex:1;display:flex;flex-direction:column;min-width:0;position:relative;background:radial-gradient(circle at 50% 0%,rgba(96,165,250,.04) 0%,transparent 60%)}.workspace-header{height:64px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:0 24px;border-bottom:1px solid var(--border);background:#03050880!important;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);z-index:20}.workspace-title-bar{display:flex;align-items:center;gap:12px}.tool-name{font-size:16px;font-weight:700;letter-spacing:-.2px;text-shadow:0 2px 8px rgba(0,0,0,.6)}.tool-badge{font-family:var(--mono);font-size:10px;padding:3px 9px;border-radius:12px;background:#34d3991a;color:var(--green);border:1px solid rgba(52,211,153,.18);font-weight:500}.mobile-drawer-btn{display:none;background:transparent;border:1px solid var(--border2);color:var(--text2);padding:6px 10px;border-radius:6px;cursor:pointer}.workspace-scroll-area{flex:1;overflow-y:auto;padding:36px 28px}.tool-surface-card{max-width:1200px;margin:0 auto;background:var(--surface);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:20px;padding:40px;border:1px solid var(--border);box-shadow:var(--shadow-md),0 0 40px #60a5fa04,inset 0 0 0 1px #ffffff03;min-height:calc(100vh - 140px)}.ide-pane-right{width:280px;flex-shrink:0;background:#03050899!important;-webkit-backdrop-filter:blur(28px) saturate(190%);backdrop-filter:blur(28px) saturate(190%);border-left:1px solid var(--border);display:flex;flex-direction:column;z-index:90;transition:transform .3s cubic-bezier(.16,1,.3,1)}.context-scroll-area{flex:1;overflow-y:auto;padding:24px 20px;display:flex;flex-direction:column;gap:24px}.context-title{font-size:11px;text-transform:uppercase;letter-spacing:1.5px;color:var(--text3);font-family:var(--mono);margin-bottom:12px}.context-card{background:var(--surface2);border:1px solid var(--border);border-radius:12px;padding:16px;box-shadow:0 4px 12px #0003}.context-list{list-style:none;display:flex;flex-direction:column;gap:12px;font-size:13px;color:var(--text2);line-height:1.5}.context-desc{font-size:12.5px;color:var(--text2);margin-bottom:12px;line-height:1.5}.mt-auto{margin-top:auto}.about-box{padding:18px 22px;background:linear-gradient(180deg,#58a6ff0f,#58a6ff05);border:1px solid rgba(88,166,255,.15);border-radius:12px;font-size:14px;color:var(--text2);line-height:1.75;box-shadow:var(--shadow-sm)}.about-box strong{color:var(--text);text-shadow:0 0 8px rgba(255,255,255,.1)}.privacy-banner{display:flex;align-items:flex-start;gap:14px;padding:16px 20px;background:linear-gradient(180deg,#3fb9500f,#3fb95005);border:1px solid rgba(63,185,80,.2);border-radius:12px;font-size:13.5px;color:var(--text2);line-height:1.65;box-shadow:var(--shadow-sm)}.privacy-icon{font-size:22px;flex-shrink:0;margin-top:1px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3))}.privacy-banner strong{color:var(--green)}.home-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.home-tool-card{background:var(--surface);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid var(--border);border-radius:16px;padding:24px;cursor:pointer;transition:all .35s cubic-bezier(.16,1,.3,1);box-shadow:var(--shadow-sm);position:relative;overflow:hidden}.home-tool-card:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,#60a5fa1f,#c084fc1f);opacity:0;transition:opacity .3s ease;z-index:0}.home-tool-card>*{position:relative;z-index:1}.home-tool-card:hover{border-color:#c084fc59;transform:translateY(-6px) scale(1.015);box-shadow:var(--shadow-md),0 8px 30px #c084fc1f,inset 0 0 16px #60a5fa0d}.home-tool-card:hover:before{opacity:1}.home-tool-icon{font-size:28px;margin-bottom:14px;transition:transform .35s cubic-bezier(.16,1,.3,1);display:inline-block}.home-tool-card:hover .home-tool-icon{transform:scale(1.2) rotate(-6deg)}.home-tool-name{font-size:15.5px;font-weight:700;margin-bottom:8px;letter-spacing:.1px;text-shadow:0 1px 2px rgba(0,0,0,.4)}.home-tool-desc{font-size:13px;color:var(--text2);line-height:1.55;font-family:var(--sans)}.site-footer{margin-top:16px;padding:32px 0 16px;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:16px}.footer-privacy{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:20px 24px;font-size:13.5px;color:var(--text2);line-height:1.7;box-shadow:var(--shadow-sm)}.footer-privacy h3{font-size:14px;font-weight:700;color:var(--green);margin-bottom:8px;display:flex;align-items:center;gap:6px}.footer-copy{text-align:center;font-size:11.5px;color:var(--text3);font-family:var(--mono)}.related-label{font-size:11.5px;letter-spacing:2px;text-transform:uppercase;color:var(--text3);font-family:var(--mono);margin-bottom:12px}@media (max-width: 1024px){.ide-pane-right{position:fixed;right:0;top:0;bottom:0;transform:translate(100%)}.ide-pane-right.mobile-open{transform:translate(0);box-shadow:-10px 0 40px #000c}.mobile-drawer-btn.right{display:block}}@media (max-width: 768px){.ide-pane-left{position:fixed;left:0;top:0;bottom:0;transform:translate(-100%)}.ide-pane-left.mobile-open{transform:translate(0);box-shadow:10px 0 40px #000c}.mobile-drawer-btn.left{display:block}.tool-surface-card{padding:20px;border-radius:12px}.workspace-scroll-area{padding:16px}.home-grid{grid-template-columns:1fr!important}}@keyframes fadeIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:fadeIn .25s cubic-bezier(.16,1,.3,1)}.skeleton-pulse{animation:pulse 1.5s cubic-bezier(.4,0,.6,1) infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.3}}.skeleton-block{background:var(--surface);border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow-sm)}.btn{padding:10px 22px;border-radius:10px;font-family:var(--sans);font-size:13.5px;font-weight:600;cursor:pointer;border:1px solid var(--border2);transition:all .25s cubic-bezier(.16,1,.3,1);display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--surface2);color:var(--text2);box-shadow:var(--shadow-sm);letter-spacing:.1px}.btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-md),0 4px 12px #60a5fa1a;border-color:#60a5fa59;background:#60a5fa0f;color:#fff}.btn:active{transform:translateY(0);box-shadow:var(--shadow-sm)}.btn-ghost{background:transparent;color:var(--text2);border-color:transparent;box-shadow:none}.btn-ghost:hover{background:#ffffff0a;color:var(--text);border-color:#ffffff14;box-shadow:var(--shadow-sm)}.btn-sm{padding:6px 12px;font-size:12.5px;height:32px;border-radius:6px}.btn.active,.btn-active{background:linear-gradient(135deg,var(--accent),var(--purple))!important;color:#fff!important;border-color:#ffffff26!important;box-shadow:var(--shadow-neon)!important;text-shadow:0 1px 2px rgba(0,0,0,.3)}.control-group,.tool-controls,.button-group{display:flex;gap:12px;align-items:center;margin-bottom:20px;flex-wrap:wrap}textarea,input[type=text],input[type=number],select{background:#03060b80!important;border:1px solid var(--border);color:var(--text);border-radius:12px;padding:14px 16px;font-family:var(--mono);font-size:14px;margin-bottom:20px;width:100%;box-shadow:var(--shadow-inner);transition:all .25s cubic-bezier(.16,1,.3,1);line-height:1.6}textarea{min-height:280px!important;resize:vertical!important}.main-area textarea{align-self:stretch}input:focus,textarea:focus,select:focus{outline:none!important;border-color:#60a5fa8c!important;background:#060a12bf!important;box-shadow:inset 0 1px 2px #00000080,var(--shadow-focus)!important;transform:translateY(-1px)}.copy-flash{animation:flashGlow .5s cubic-bezier(.16,1,.3,1)}@keyframes flashGlow{0%{border-color:#34d399cc!important;box-shadow:0 0 20px #34d39959,inset 0 0 10px #34d39926!important;background:#34d3990d}to{border-color:var(--border);box-shadow:var(--shadow-inner);background:#03060b80}}.content-scroll .ad-placeholder{margin-top:28px!important;margin-bottom:16px!important;box-shadow:var(--shadow-inner)}.ad-placeholder{background:#0a0e14;border:1px solid #1c2128;border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;overflow:hidden}.ad-placeholder:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;transform:translate(-100%);background:linear-gradient(90deg,transparent 0%,rgba(88,166,255,.04) 20%,rgba(88,166,255,.1) 60%,transparent 100%);animation:shimmer 2.5s infinite}.ad-text-placeholder{font-family:var(--mono);font-size:11px;color:var(--text3);letter-spacing:1.5px;text-transform:uppercase;z-index:1}@keyframes shimmer{to{transform:translate(100%)}}.textarea-dropzone-active{background-color:#bc8cff0d!important;border-color:var(--purple)!important;border-style:dashed!important;box-shadow:0 0 30px #bc8cff1a!important;transform:scale(1.01)}.palette-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#04060ab3;-webkit-backdrop-filter:blur(12px) saturate(160%);backdrop-filter:blur(12px) saturate(160%);z-index:99999;display:flex;justify-content:center;padding-top:14vh;animation:fadeIn .25s ease-out}.palette-window{width:100%;max-width:580px;background:#0d1117f2;border:1px solid #30363d;border-radius:16px;height:max-content;max-height:440px;display:flex;flex-direction:column;box-shadow:0 32px 64px #000c,0 0 0 1px #ffffff0d;overflow:hidden;animation:modalScale .2s cubic-bezier(.16,1,.3,1) forwards}@keyframes modalScale{0%{transform:scale(.94) translateY(10px);opacity:0}to{transform:scale(1) translateY(0);opacity:1}}.palette-input{width:100%;background:transparent;border:none;border-bottom:1px solid #21262d;padding:20px 24px;color:#e6edf3;font-size:16px;outline:none;font-family:var(--sans);box-shadow:none!important;margin-bottom:0}.palette-input:focus{border-color:#30363d!important;box-shadow:none!important;background:transparent!important;transform:none}.palette-results{overflow-y:auto;max-height:360px;padding:12px}.palette-item{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-radius:10px;cursor:pointer;color:#8b949e;font-size:14px;transition:all .15s;margin-bottom:2px}.palette-item.selected{background:var(--prismatic-active);color:#fff;box-shadow:var(--shadow-sm)}.palette-item-meta{font-family:var(--mono);font-size:10.5px;color:var(--text3);background:#ffffff0d;padding:3px 8px;border-radius:6px;transition:all .15s}.palette-item.selected .palette-item-meta{color:#fff;background:#fff3}.hint-dock{display:none}@media (min-width: 1024px){.hint-dock{display:flex;align-items:center;justify-content:center;gap:40px;padding:12px 28px;background:#0d1117e6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-top:1px solid var(--border);flex-shrink:0;box-shadow:0 -4px 20px #0000004d;z-index:5}.hint-dock-item{font-family:var(--mono);font-size:11.5px;color:var(--text3);display:flex;align-items:center;gap:10px;letter-spacing:.5px}.hint-dock-box{display:inline-flex;align-items:center;justify-content:center;padding:4px 8px;background:#ffffff08;border:1px solid var(--border);border-radius:6px;color:var(--text2);font-size:10.5px;line-height:1;box-shadow:0 2px 4px #0003}}.tips-toggle-btn{background:transparent;border:1px solid var(--border2);color:var(--text2);border-radius:6px;padding:4px 10px;font-size:10.5px;font-family:var(--mono);text-transform:uppercase;letter-spacing:.5px;cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:all .2s cubic-bezier(.16,1,.3,1);height:26px;box-shadow:var(--shadow-sm)}.tips-toggle-btn:hover{background:#ffffff0d;color:var(--text);border-color:#ffffff26;transform:translateY(-1px)}.tips-toggle-btn.active{background:var(--prismatic-active);color:#fff;border-color:#bc8cff4d;box-shadow:var(--shadow-neon)}.power-tips-accordion{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s cubic-bezier(.16,1,.3,1);background:var(--surface2);border-bottom:0px solid transparent;flex-shrink:0}.power-tips-accordion.open{grid-template-rows:1fr;border-bottom:1px solid var(--border);box-shadow:inset 0 -4px 12px #0003}.power-tips-content{overflow:hidden}.tips-list{margin:0;padding:20px 28px 20px 48px;color:var(--text2);font-size:14px;display:flex;flex-direction:column;gap:12px;font-family:var(--sans);list-style-type:none}.tips-list strong{color:var(--text);text-shadow:0 0 6px rgba(255,255,255,.1)}.hint-code{color:var(--accent);font-family:var(--mono);font-size:12px;background:#58a6ff1f;padding:3px 8px;border-radius:6px;box-shadow:inset 0 1px 2px #0003}.hint-kbd{background:var(--surface);border:1px solid var(--border2);padding:3px 8px;border-radius:6px;font-size:12px;font-family:var(--mono);color:var(--text);box-shadow:0 2px 4px #0006,inset 0 1px 1px #ffffff0d}.tool-pane-container{display:flex;flex-direction:column;gap:24px}.workspace-grid-layout{display:flex;flex-direction:row;gap:20px;width:100%;align-items:stretch;min-height:calc(100vh - 140px)}.pane-content-wrapper .workspace-grid-layout{min-height:auto}.workspace-grid-layout>*{flex:1;min-width:0}.pane-content-wrapper{display:flex;flex-direction:column;gap:20px}.split-pane-border{border-left:1px solid var(--border);padding-left:20px}.split-pane-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:12px;border-bottom:1px solid var(--border);margin-bottom:8px}.action-strip-card{background:var(--surface2);border:1px solid rgba(88,166,255,.15);border-radius:12px;padding:16px 20px;box-shadow:var(--shadow-sm),inset 0 0 12px #58a6ff05;position:relative;overflow:hidden;transition:all .25s ease}.action-strip-card:hover{border-color:#58a6ff4d;box-shadow:var(--shadow-md),0 0 16px #58a6ff0f}.action-strip-indicator-pulse{display:inline-block;width:6px;height:6px;background-color:var(--green);border-radius:50%;position:relative}.action-strip-indicator-pulse:after{content:"";position:absolute;top:-4px;left:-4px;right:-4px;bottom:-4px;border:2px solid var(--green);border-radius:50%;animation:pulseGlow 1.8s infinite ease-out;opacity:0}@keyframes pulseGlow{0%{transform:scale(.5);opacity:1}to{transform:scale(1.8);opacity:0}}.action-strip-dropdown button:hover{background:#ffffff0d!important;color:#fff!important}@media (max-width: 1200px){.workspace-grid-layout.splitscreen-active{flex-direction:column!important;gap:32px}.split-pane-border{border-left:none;border-top:1px dashed var(--border);padding-left:0;padding-top:32px}}.glass-card{background:#0a101c73;backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1px solid var(--border);border-radius:16px;padding:24px;box-shadow:var(--shadow-md),inset 0 1px 1px #ffffff08;transition:all .3s cubic-bezier(.16,1,.3,1)}.glass-card:hover{border-color:var(--border2);box-shadow:var(--shadow-lg),0 4px 20px #60a5fa08;transform:translateY(-2px)}.glass-card-neon{border:1px solid rgba(168,85,247,.2);background:linear-gradient(180deg,#0a101c99,#030712cc);box-shadow:var(--shadow-md),0 0 24px #a855f70d,inset 0 1px 1px #ffffff0a}.glass-card-neon:hover{border-color:#a855f773;box-shadow:var(--shadow-lg),0 0 32px #a855f71f}.hero-glow-container{position:absolute;top:0;left:0;right:0;bottom:0;overflow:hidden;pointer-events:none;z-index:0}.hero-glow-sphere{position:absolute;width:500px;height:500px;border-radius:50%;filter:blur(140px);opacity:.15;mix-blend-mode:plus-lighter}.hero-glow-1{background:radial-gradient(circle,var(--accent) 0%,transparent 70%);top:-10%;left:20%;animation:floatGlow 25s ease-in-out infinite alternate}.hero-glow-2{background:radial-gradient(circle,var(--purple) 0%,transparent 70%);bottom:10%;right:15%;animation:floatGlow 30s ease-in-out infinite alternate-reverse}.grid-mesh{position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(rgba(255,255,255,.015) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.015) 1px,transparent 1px);background-size:40px 40px;background-position:center top;pointer-events:none;z-index:1;opacity:.85;mask-image:radial-gradient(circle at 50% 30%,black 30%,transparent 85%);-webkit-mask-image:radial-gradient(circle at 50% 30%,black 30%,transparent 85%)}.text-gradient{background:linear-gradient(135deg,#fff 30%,#a855f7 70%,#3b82f6);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}.text-gradient-neon{background:var(--gradient-neon);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;text-shadow:0 0 30px rgba(168,85,247,.2)}.badge-neon{font-family:var(--mono);font-size:11px;font-weight:600;padding:4px 12px;border-radius:100px;letter-spacing:.5px;display:inline-flex;align-items:center;gap:6px;text-transform:uppercase;box-shadow:var(--shadow-sm);border:1px solid rgba(255,255,255,.05)}.badge-neon-accent{background:#3b82f61a;color:#60a5fa;border-color:#3b82f640;box-shadow:0 0 15px #3b82f61a}.badge-neon-purple{background:#a855f71a;color:#c084fc;border-color:#a855f740;box-shadow:0 0 15px #a855f71a}.badge-neon-green{background:#10b9811a;color:#34d399;border-color:#10b98140;box-shadow:0 0 15px #10b9811a}.badge-neon-orange{background:#f973161a;color:#fb923c;border-color:#f9731640;box-shadow:0 0 15px #f973161a}.interactive-lab-container{display:flex;flex-direction:column;gap:28px;margin:36px 0;padding:32px;border-radius:20px;background:#0a101c59;border:1px solid var(--border);position:relative;overflow:hidden}.interactive-lab-container:before{content:"";position:absolute;top:-100px;right:-100px;width:250px;height:250px;background:radial-gradient(circle,rgba(168,85,247,.04) 0%,transparent 70%);filter:blur(40px);pointer-events:none}.lab-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}@media (max-width: 768px){.lab-grid{grid-template-columns:1fr}}.lab-section{display:flex;flex-direction:column;gap:14px}.lab-section-title{font-size:12px;font-family:var(--mono);text-transform:uppercase;letter-spacing:1.5px;color:var(--text3);margin-bottom:6px;display:flex;align-items:center;gap:8px}.lab-row{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.micro-alert{padding:12px 16px;border-radius:10px;font-size:13px;display:flex;align-items:center;gap:12px;line-height:1.5;border:1px solid transparent;box-shadow:var(--shadow-sm);transition:all .25s ease}.micro-alert-info{background:#3b82f60f;border-color:#3b82f626;color:var(--text2)}.micro-alert-info strong{color:var(--accent)}.micro-alert-success{background:#10b9810f;border-color:#10b98126;color:var(--text2)}.micro-alert-success strong{color:var(--green)}.prismatic-accent-bar{height:3px;width:100%;background:var(--gradient-neon);border-radius:10px;box-shadow:0 1px 8px #a855f74d;margin-bottom:12px}.landing-category-nav{display:flex;gap:8px;overflow-x:auto;padding-bottom:8px;margin-bottom:24px}.category-tab-btn{padding:8px 16px;border-radius:20px;background:var(--surface2);border:1px solid var(--border);color:var(--text2);font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap;transition:all .25s cubic-bezier(.16,1,.3,1)}.category-tab-btn:hover{background:#ffffff08;color:#fff;border-color:var(--border2);transform:translateY(-1px)}.category-tab-btn.active{background:var(--gradient-primary);color:#fff;border-color:#ffffff26;box-shadow:var(--shadow-neon)}.faq-container{display:flex;flex-direction:column;gap:12px;margin-top:24px}.faq-item{background:var(--surface2);border:1px solid var(--border);border-radius:12px;overflow:hidden;transition:all .25s ease}.faq-item:hover{border-color:#ffffff1a;background:#14203699}.faq-question{padding:18px 24px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;font-weight:600;font-size:14.5px;-webkit-user-select:none;user-select:none}.faq-answer{max-height:0;overflow:hidden;transition:max-height .3s cubic-bezier(.16,1,.3,1),padding .3s ease;padding:0 24px;color:var(--text2);font-size:13.5px;line-height:1.6}.faq-item.open .faq-answer{max-height:200px;padding-bottom:18px}.faq-arrow{transition:transform .25s ease;font-size:12px;color:var(--text3)}.faq-item.open .faq-arrow{transform:rotate(180deg);color:var(--accent)}.cursor-blink{animation:blink 1s step-end infinite}@keyframes blink{0%,to{color:transparent}50%{color:var(--purple)}}.ph-launch-banner{display:flex;align-items:center;justify-content:center;gap:12px;padding:8px 16px;border-radius:30px;background:#da5a2a1a;border:1px solid rgba(218,90,42,.3);color:#ff8a65;font-size:12.5px;font-family:var(--mono);margin-bottom:24px;display:inline-flex;box-shadow:0 0 20px #da5a2a0d}.ph-launch-banner strong{color:#ff7043}.collapsible-wrapper{display:grid;grid-template-rows:1fr;transition:grid-template-rows .35s cubic-bezier(.16,1,.3,1),opacity .3s ease,margin-bottom .3s ease;overflow:hidden;opacity:1}.collapsible-wrapper.collapsed{grid-template-rows:0fr;opacity:0;margin-bottom:-20px;pointer-events:none}.collapsible-inner{min-height:0;transition:visibility .35s;visibility:visible}.collapsible-wrapper.collapsed .collapsible-inner{visibility:hidden}.banner-close-btn{background:none;border:none;color:var(--text-muted);cursor:pointer;font-size:14px;padding:6px;border-radius:6px;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.banner-close-btn:hover{background:#ffffff0d;color:var(--text);transform:scale(1.1)}.fav-star-btn{background:transparent;border:1px solid var(--border);color:var(--text3);border-radius:8px;width:36px;height:36px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .25s cubic-bezier(.16,1,.3,1)}.fav-star-btn:hover{border-color:#fde04759;background:#fde0470d;color:#fde047;box-shadow:0 0 12px #fde04726}.fav-star-btn.active{color:#fde047;border-color:#fde04780;background:#fde0471a;box-shadow:0 0 18px #fde04740;text-shadow:0 0 8px rgba(253,224,71,.6)}.card-star-trigger{position:absolute;top:14px;right:14px;background:#03071280;border:1px solid var(--border);color:var(--text3);width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .25s cubic-bezier(.16,1,.3,1);z-index:10}.card-star-trigger:hover{transform:scale(1.15);border-color:#fde04766;color:#fde047;background:#030712d9}.card-star-trigger.starred{color:#fde047;border-color:#fde04780;background:#fde04714;box-shadow:0 0 12px #fde0474d}.workspace-actions-wrapper{display:flex;align-items:center;gap:8px}.sidebar-section-starred{border-bottom:1px solid var(--border);padding-bottom:10px;margin-bottom:14px}.pipeline-builder-container{display:flex;flex-direction:column;gap:24px}.pipeline-flow-diagram{background:#03071259;border:1px solid var(--border);border-radius:16px;padding:24px;display:flex;flex-direction:column;gap:16px;position:relative;box-shadow:var(--shadow-inner)}.pipeline-step-node{background:var(--surface2);border:1px solid var(--border);border-radius:12px;padding:16px 20px;display:flex;flex-direction:column;gap:12px;position:relative;transition:all .25s cubic-bezier(.16,1,.3,1)}.pipeline-step-node:hover{border-color:#a855f74d;box-shadow:0 4px 16px #a855f70d}.pipeline-step-header{display:flex;align-items:center;justify-content:space-between;gap:12px}.step-num-badge{font-family:var(--mono);font-size:11px;background:var(--gradient-primary);color:#fff;width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;box-shadow:0 2px 6px #a855f766}.flow-connector-line{display:flex;align-items:center;justify-content:center;height:24px;color:var(--text3);font-size:16px;font-family:var(--mono);animation:pulseArrow 2s infinite ease-in-out}@keyframes pulseArrow{0%,to{opacity:.4;transform:translateY(0)}50%{opacity:.9;transform:translateY(3px)}}.intermediate-preview-panel{background:#03071299;border:1px solid rgba(255,255,255,.03);border-radius:8px;padding:12px;font-family:var(--mono);font-size:12.5px;color:var(--text2);max-height:120px;overflow-y:auto;white-space:pre-wrap;word-break:break-all;box-shadow:var(--shadow-inner)}.pipeline-step-select{margin-bottom:0!important;padding:8px 12px!important;font-size:13px!important;width:220px!important;border-radius:8px!important}.pipeline-step-remove-btn{background:none;border:none;color:var(--text-muted);cursor:pointer;font-size:13px;transition:all .2s}.pipeline-step-remove-btn:hover{color:var(--red);transform:scale(1.1)}.pipeline-action-bar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:10px}.pipeline-save-box{background:var(--surface2);border:1px solid var(--border);border-radius:12px;padding:16px;display:flex;gap:12px;align-items:center}.pipeline-save-box input{margin-bottom:0!important;padding:10px 14px!important;font-size:13.5px!important}textarea::-webkit-scrollbar,.result-box::-webkit-scrollbar,.intermediate-preview-panel::-webkit-scrollbar{width:6px;height:6px}textarea::-webkit-scrollbar-thumb,.result-box::-webkit-scrollbar-thumb,.intermediate-preview-panel::-webkit-scrollbar-thumb{background:#ffffff0d;border-radius:3px}textarea::-webkit-scrollbar-thumb:hover,.result-box::-webkit-scrollbar-thumb:hover,.intermediate-preview-panel::-webkit-scrollbar-thumb:hover{background:#ffffff26}.action-icon-wrapper{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:8px;background:var(--surface2);border:1px solid var(--border);font-size:16px}.footer-donate-link{color:#fd0;text-decoration:none;font-weight:600;transition:color .2s,opacity .2s;opacity:.85}.footer-donate-link:hover{color:#ffea00;opacity:1;text-decoration:underline}.sidebar-donate-pinned{padding:12px 16px;border-top:1px solid var(--border);background:#161b2273;display:flex;align-items:center;justify-content:space-between;font-size:11px;font-family:var(--mono);color:var(--text3);flex-shrink:0}.sidebar-donate-link{color:#fd0;text-decoration:none;font-weight:600;display:inline-flex;align-items:center;gap:4px;transition:color .2s,transform .2s}.sidebar-donate-link:hover{color:#ffea00;transform:translateY(-1px)}
