@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Outfit:wght@500;600;700&family=JetBrains+Mono:wght@400;500&display=swap";:root{--bg-color: #0f111a;--sidebar-bg: #161925;--surface-color: #1e2235;--surface-hover: #282e4a;--border-color: rgba(255, 255, 255, .12);--text-primary: #ffffff;--text-secondary: #94a3b8;--accent-color: #6366f1;--accent-glow: rgba(99, 102, 241, .4);--error-color: #f43f5e;--success-color: #10b981;--font-main: "Inter", -apple-system, system-ui, sans-serif;--font-heading: "Outfit", sans-serif;--font-mono: "JetBrains Mono", "Fira Code", monospace;--transition-smooth: all .25s cubic-bezier(.4, 0, .2, 1);--sidebar-width: 280px}*{box-sizing:border-box;margin:0;padding:0}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#fff3}body{background-color:var(--bg-color);color:var(--text-primary);font-family:var(--font-main);line-height:1.6;-webkit-font-smoothing:antialiased;overflow:hidden}.app-container{display:flex;height:100vh;width:100vw}.sidebar{width:var(--sidebar-width);background:var(--sidebar-bg);border-right:1px solid var(--border-color);display:flex;flex-direction:column;flex-shrink:0;z-index:100}.sidebar-header{padding:24px;border-bottom:1px solid var(--border-color)}.logo{display:flex;align-items:center;gap:12px;cursor:pointer;margin-bottom:24px}.logo-icon{font-size:24px}.logo-text{font-family:var(--font-heading);font-size:20px;font-weight:700;letter-spacing:-.02em}.sidebar-search input{width:100%;background:var(--surface-color);border:1px solid var(--border-color);border-radius:12px;padding:10px 16px;color:#fff;font-size:14px;transition:var(--transition-smooth)}.sidebar-search input:focus{outline:none;border-color:var(--accent-color);background:var(--surface-hover)}.sidebar-nav{flex:1;overflow-y:auto;padding:16px 12px}.nav-item{padding:12px 16px;border-radius:10px;cursor:pointer;display:flex;align-items:center;gap:12px;color:var(--text-secondary);transition:var(--transition-smooth);margin-bottom:4px;font-weight:500}.nav-item:hover,.nav-item.active{background:var(--surface-hover);color:#fff}.nav-item.active{color:var(--accent-color);background:#3b82f61a}.nav-group{margin-top:24px}.nav-group-title{padding:0 16px;font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--text-secondary);margin-bottom:12px;opacity:.5}.nav-sub-item{padding:10px 16px 10px 44px;font-size:14px;color:var(--text-secondary);cursor:pointer;border-radius:8px;transition:var(--transition-smooth)}.nav-sub-item:hover{color:#fff;background:#ffffff0d}.nav-sub-item.active{color:var(--accent-color);font-weight:600;background:#3b82f614}.main-content{flex:1;overflow-y:auto;display:flex;flex-direction:column;background:radial-gradient(circle at 50% -20%,rgba(99,102,241,.1),transparent 70%),linear-gradient(135deg,#0f111a,#161925)}.content-wrapper{flex:1;padding:48px;max-width:1100px;margin:0 auto;width:100%}.focused-tool{animation:fadeIn .4s cubic-bezier(.16,1,.3,1)}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.tool-header{margin-bottom:48px;display:flex;flex-direction:column;gap:20px}.back-button{width:fit-content;background:transparent;color:var(--text-secondary);padding:0;font-size:14px;border:none;cursor:pointer;display:flex;align-items:center;gap:8px;transition:var(--transition-smooth)}.back-button:hover{color:#fff;transform:translate(-4px)}.tool-title-group{display:flex;flex-direction:column;gap:12px}.category-badge{font-size:11px;font-weight:700;background:#3b82f626;color:var(--accent-color);padding:4px 10px;border-radius:6px;width:fit-content;text-transform:uppercase;letter-spacing:.05em}h1{font-family:var(--font-heading);font-size:44px;font-weight:700;background:linear-gradient(180deg,#fff,#aaa);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.field-block{display:flex;flex-direction:column;gap:10px}.field-label-row{display:flex;justify-content:space-between;align-items:center}.field-block span{font-size:14px;font-weight:600;color:var(--text-secondary)}.editor-container{background:#0000004d;border:1px solid var(--border-color);border-radius:16px;overflow:hidden;transition:var(--transition-smooth)}.editor-container:focus-within{border-color:var(--accent-color);box-shadow:0 0 0 1px var(--accent-color)}.field-block input{width:100%;background:#ffffff0a;border:1px solid var(--border-color);border-radius:12px;padding:16px 20px;color:#fff;font-family:inherit;font-size:16px;transition:var(--transition-smooth)}.field-block input:focus{outline:none;background:#ffffff12;border-color:var(--accent-color);box-shadow:0 0 0 1px var(--accent-color)}.field-block textarea{width:100%;min-height:180px;background:#ffffff0a;border:1px solid var(--border-color);border-radius:16px;padding:20px;color:#fff;font-family:var(--font-mono);font-size:15px;line-height:1.6;resize:vertical;transition:var(--transition-smooth)}.field-block textarea:focus{outline:none;background:#ffffff12;border-color:var(--accent-color);box-shadow:0 0 0 1px var(--accent-color)}.tool-actions{display:flex;gap:16px;margin:32px 0}button:not(.back-button):not(.copy-button){padding:14px 28px;font-size:16px;border-radius:14px}.result-panel{background:#0006;border:1px solid var(--border-color);border-radius:20px;padding:32px}.result-block{background:#ffffff05;border:1px solid var(--border-color);border-radius:14px;padding:20px}.result-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.result-header strong{font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--text-secondary)}.copy-button{background:#3b82f61a;color:var(--accent-color);padding:6px 14px;font-size:12px;font-weight:600;border-radius:8px;cursor:pointer;border:1px solid rgba(59,130,246,.2);transition:var(--transition-smooth)}.copy-button:hover{background:var(--accent-color);color:#fff;border-color:var(--accent-color)}pre{background:transparent;padding:0;font-size:14px;line-height:1.7;white-space:pre-wrap;word-break:break-all;font-family:var(--font-mono)}.token.property{color:#88c0d0}.token.string{color:#a3be8c}.token.number{color:#b48ead}.token.boolean,.token.null{color:#d08770}.token.operator{color:#81a1c1}.token.punctuation{color:#eceff4}.hero{padding:80px 0 120px;text-align:center}.hero-text{font-size:18px;color:var(--text-secondary);max-width:700px;margin:0 auto 24px;line-height:1.8}.search-container{max-width:600px;margin:0 auto 60px;position:relative}.search-input{width:100%;background:var(--surface-color);border:1px solid var(--border-color);border-radius:100px;padding:16px 32px;font-size:18px;color:#fff;transition:var(--transition-smooth)}.search-input:focus{outline:none;border-color:var(--accent-color);box-shadow:0 0 20px #3b82f633;transform:translateY(-2px)}.hero-panel{display:flex;justify-content:center;align-items:center;gap:32px;margin-top:60px;background:#ffffff0d;padding:24px 48px;border-radius:28px;border:1px solid rgba(255,255,255,.15);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);width:fit-content;margin-left:auto;margin-right:auto;box-shadow:0 12px 40px #0000004d}.metric{position:relative;display:flex;flex-direction:column;align-items:center;padding:0 32px}.metric:not(:last-child):after{content:"";position:absolute;right:0;top:20%;height:60%;width:1px;background:var(--border-color)}.metric-value{font-family:var(--font-heading);font-size:36px;font-weight:800;color:#fff;line-height:1;margin-bottom:8px;text-shadow:0 0 20px var(--accent-glow)}.metric-label{font-size:12px;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.1em}.metric:last-child .metric-value{color:var(--success-color);text-shadow:0 0 20px rgba(16,185,129,.4)}.footer{padding:60px;border-top:1px solid var(--border-color)}@media(max-width:1024px){.sidebar{width:80px}.logo-text,.nav-group-title,.nav-sub-item,.sidebar-search{display:none}.content-wrapper{padding:32px 20px}}