:root{--bg:#09090b;--surface:#111113;--surface2:#1a1a1f;--surface3:#222228;--border:#27272a;--border-hover:#3f3f46;--text:#fafafa;--text-muted:#71717a;--text-dim:#52525b;--accent:#6366f1;--accent-light:#818cf8;--accent-bg:#6366f114;--accent-border:#6366f133;--success:#22c55e;--error:#ef4444;--warning:#eab308;--radius:10px;--radius-lg:14px;--shadow:0 1px 3px #0000004d;--shadow-lg:0 8px 30px #0000004d}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Inter,Segoe UI,Roboto,sans-serif;line-height:1.6}a{color:var(--accent-light);text-decoration:none}a:hover{color:var(--accent)}.app{min-height:100vh;display:flex}.sidebar{background:var(--surface);border-right:1px solid var(--border);z-index:100;flex-direction:column;width:270px;display:flex;position:fixed;top:0;bottom:0;left:0;overflow-y:auto}.sidebar::-webkit-scrollbar{width:4px}.sidebar::-webkit-scrollbar-track{background:0 0}.sidebar::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}.sidebar-logo{border-bottom:1px solid var(--border);padding:1.5rem 1.25rem 1rem}.sidebar-logo a{color:var(--text)}.sidebar-logo h1{letter-spacing:-.02em;font-size:1.15rem;font-weight:700}.sidebar-logo h1 span{background:linear-gradient(135deg, var(--accent), #a78bfa);-webkit-text-fill-color:transparent;-webkit-background-clip:text}.sidebar-logo p{color:var(--text-muted);letter-spacing:.02em;margin-top:.2rem;font-size:.7rem}.sidebar-nav{list-style:none}.sidebar-nav a{color:var(--text-muted);border-left:2px solid #0000;align-items:center;gap:.6rem;padding:.45rem 1.25rem;font-size:.8rem;transition:all .15s;display:flex}.sidebar-nav a:hover{color:var(--text);background:var(--surface2)}.sidebar-nav a.active{color:var(--accent-light);background:var(--accent-bg);border-left-color:var(--accent)}.sidebar-nav .icon{text-align:center;opacity:.8;width:1.4rem;font-size:1rem}.main{flex:1;max-width:960px;margin-left:270px;padding:2rem 2.5rem}.tool-header{margin-bottom:1.75rem}.tool-header h1{letter-spacing:-.02em;background:linear-gradient(135deg, var(--text), var(--text-muted));-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin-bottom:.25rem;font-size:1.5rem;font-weight:700}.tool-header p{color:var(--text-muted);font-size:.85rem}textarea,input[type=text],input[type=number],input[type=url],input[type=datetime-local]{background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius);width:100%;color:var(--text);resize:vertical;padding:.7rem .9rem;font-family:SF Mono,Cascadia Code,JetBrains Mono,Fira Code,monospace;font-size:.825rem;transition:border-color .2s,box-shadow .2s}textarea:focus,input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-bg);outline:none}textarea{min-height:160px}label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:.4rem;font-size:.7rem;font-weight:600;display:block}select{background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);cursor:pointer;padding:.45rem .75rem;font-size:.825rem}.btn{border:1px solid var(--border);background:var(--surface2);color:var(--text-muted);cursor:pointer;border-radius:8px;align-items:center;gap:.4rem;padding:.45rem .9rem;font-size:.8rem;font-weight:500;transition:all .15s;display:inline-flex}.btn:hover{border-color:var(--border-hover);color:var(--text);background:var(--surface3)}.btn-primary{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}.btn-primary:hover{background:var(--accent-light);border-color:var(--accent-light);color:#fff}.btn-sm{padding:.3rem .65rem;font-size:.75rem}.btn-group{flex-wrap:wrap;gap:.4rem;display:flex}.tool-grid{grid-template-columns:1fr 1fr;gap:1.25rem;display:grid}.tool-grid.single{grid-template-columns:1fr}.output-area{background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius);white-space:pre-wrap;word-break:break-all;min-height:160px;color:var(--text);padding:.9rem;font-family:SF Mono,JetBrains Mono,monospace;font-size:.8rem;line-height:1.6;position:relative}.output-area .copy-btn{opacity:0;transition:opacity .2s;position:absolute;top:.4rem;right:.4rem}.output-area:hover .copy-btn{opacity:1}.status{border-radius:8px;margin-top:.6rem;padding:.45rem .7rem;font-size:.78rem}.status-success{color:var(--success);background:#22c55e14;border:1px solid #22c55e26}.status-error{color:var(--error);background:#ef444414;border:1px solid #ef444426}.home-hero{text-align:center;padding:3.5rem 0 2rem}.home-hero h1{letter-spacing:-.03em;margin-bottom:.5rem;font-size:2.75rem;font-weight:800}.home-hero h1 span{background:linear-gradient(135deg, var(--accent), #a78bfa, #c084fc);-webkit-text-fill-color:transparent;-webkit-background-clip:text}.home-hero p{color:var(--text-muted);max-width:500px;margin:0 auto;font-size:1rem}.home-stats{justify-content:center;gap:2rem;margin-top:1.5rem;margin-bottom:1rem;display:flex}.home-stat{text-align:center}.home-stat-num{background:linear-gradient(135deg, var(--accent-light), #a78bfa);-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-size:1.75rem;font-weight:800}.home-stat-label{color:var(--text-dim);text-transform:uppercase;letter-spacing:.05em;font-size:.7rem}.tools-grid{grid-template-columns:repeat(auto-fill,minmax(195px,1fr));gap:.75rem;display:grid}.tool-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:1rem;transition:all .2s;display:block}.tool-card:hover{border-color:var(--accent-border);box-shadow:var(--shadow-lg), 0 0 0 1px var(--accent-border);transform:translateY(-2px)}.tool-card .icon{margin-bottom:.4rem;font-size:1.4rem}.tool-card h3{color:var(--text);margin-bottom:.15rem;font-size:.85rem;font-weight:600}.tool-card p{color:var(--text-muted);font-size:.72rem;line-height:1.4}.category-section{margin-bottom:2.5rem;scroll-margin-top:80px}.category-header-row{align-items:center;gap:.75rem;margin-bottom:.75rem;display:flex}.category-header-row h2{letter-spacing:-.01em;font-size:1.1rem;font-weight:700}.category-header-row .count{color:var(--text-dim);background:var(--surface2);border-radius:20px;padding:.15rem .5rem;font-size:.7rem}.mobile-header{background:var(--surface);border-bottom:1px solid var(--border);z-index:200;justify-content:space-between;align-items:center;height:54px;padding:0 1rem;display:none;position:fixed;top:0;left:0;right:0}.mobile-header span{font-size:.95rem}.mobile-header span span{background:linear-gradient(135deg, var(--accent), #a78bfa);-webkit-text-fill-color:transparent;-webkit-background-clip:text}.mobile-header button{color:var(--text);cursor:pointer;background:0 0;border:none;padding:.25rem;font-size:1.3rem}.sidebar-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:99;background:#0009;display:none;position:fixed;inset:0}@media (width<=768px){.mobile-header{display:flex}.sidebar{transition:transform .25s;transform:translate(-100%)}.sidebar.open{box-shadow:var(--shadow-lg);transform:translate(0)}.sidebar-overlay.open{display:block}.main{margin-left:0;padding:4.5rem 1rem 2rem}.tool-grid{grid-template-columns:1fr}.tools-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}.home-hero h1{font-size:2rem}}.footer{border-top:1px solid var(--border);text-align:center;color:var(--text-dim);margin-top:3rem;padding:2rem 0;font-size:.75rem}.sidebar-category{margin-bottom:.15rem}.category-header{width:100%;color:var(--text-dim);cursor:pointer;text-transform:uppercase;letter-spacing:.06em;background:0 0;border:none;justify-content:space-between;align-items:center;padding:.45rem 1.25rem;font-size:.68rem;font-weight:600;transition:color .15s;display:flex}.category-header:hover{color:var(--text-muted)}.category-header .arrow{font-size:.6rem;transition:transform .2s}.category-header.expanded .arrow{transform:rotate(90deg)}.sidebar-search{background:var(--surface2);border:1px solid var(--border);width:100%;color:var(--text);border-radius:8px;padding:.45rem .7rem;font-size:.8rem;transition:border-color .2s,box-shadow .2s}.sidebar-search:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-bg);outline:none}.category-pills{flex-wrap:wrap;gap:.4rem;margin-bottom:2rem;display:flex}.category-pill{background:var(--surface);border:1px solid var(--border);color:var(--text-muted);border-radius:20px;padding:.35rem .75rem;font-size:.75rem;text-decoration:none;transition:all .15s}.category-pill:hover{border-color:var(--accent-border);color:var(--accent-light);background:var(--accent-bg);text-decoration:none}
