:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}:root{--bg-primary: #0f172a;--bg-secondary: #1e293b;--bg-tertiary: #334155;--text-primary: #f8fafc;--text-secondary: #94a3b8;--text-muted: #64748b;--accent: #3b82f6;--accent-hover: #2563eb;--success: #22c55e;--warning: #f59e0b;--danger: #ef4444;--border: #334155;--radius: 8px;--radius-lg: 12px;--shadow: 0 4px 6px -1px rgba(0, 0, 0, .3)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;background:var(--bg-primary);color:var(--text-primary);line-height:1.6}.app-container{min-height:100vh;display:flex;flex-direction:column}.header{background:var(--bg-secondary);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:100}.header-content{max-width:1400px;margin:0 auto;padding:1rem 2rem;display:flex;align-items:center;justify-content:space-between}.logo{display:flex;align-items:center;gap:.75rem;text-decoration:none;color:var(--text-primary);font-size:1.5rem;font-weight:700}.logo svg{color:var(--accent)}.desktop-nav{display:flex;align-items:center;gap:.5rem}.desktop-nav a{color:var(--text-secondary);text-decoration:none;padding:.5rem 1rem;border-radius:var(--radius);transition:all .2s;font-size:.9rem}.desktop-nav a:hover,.desktop-nav a.active{color:var(--text-primary);background:var(--bg-tertiary)}.dropdown{position:relative}.dropdown-trigger{background:none;border:none;color:var(--text-secondary);padding:.5rem 1rem;border-radius:var(--radius);cursor:pointer;font-size:.9rem}.dropdown-content{display:none;position:absolute;top:100%;right:0;background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius);min-width:220px;box-shadow:var(--shadow)}.dropdown:hover .dropdown-content{display:block}.dropdown-content a{display:flex;align-items:center;gap:.5rem;padding:.75rem 1rem;color:var(--text-secondary);text-decoration:none}.dropdown-content a:hover{background:var(--bg-tertiary);color:var(--text-primary)}.mobile-menu-btn{display:none;background:none;border:none;color:var(--text-primary);cursor:pointer}.mobile-menu{display:none;background:var(--bg-secondary);border-bottom:1px solid var(--border);padding:1rem}.mobile-menu a{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;color:var(--text-secondary);text-decoration:none;border-radius:var(--radius)}.mobile-menu a:hover{background:var(--bg-tertiary);color:var(--text-primary)}@media(max-width:900px){.desktop-nav{display:none}.mobile-menu-btn,.mobile-menu{display:block}}.main-content{flex:1;max-width:1400px;margin:0 auto;padding:2rem;width:100%}.footer{background:var(--bg-secondary);border-top:1px solid var(--border);padding:2rem;text-align:center;color:var(--text-muted);font-size:.9rem}.footer p{margin:.25rem 0}.home{text-align:center}.hero{padding:3rem 0}.hero h1{font-size:3rem;margin-bottom:1rem;background:linear-gradient(135deg,var(--accent),#8b5cf6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero-subtitle{font-size:1.25rem;color:var(--text-secondary);max-width:600px;margin:0 auto 2rem}.hero-badges{display:flex;justify-content:center;gap:1.5rem;flex-wrap:wrap}.hero-badges span{display:flex;align-items:center;gap:.5rem;background:var(--bg-secondary);padding:.5rem 1rem;border-radius:20px;font-size:.9rem;color:var(--text-secondary)}.tools-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem;padding:2rem 0}.tool-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-lg);padding:1.5rem;text-decoration:none;transition:all .2s;text-align:left}.tool-card:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:0 8px 16px #0000004d}.tool-icon{width:60px;height:60px;border-radius:var(--radius);display:flex;align-items:center;justify-content:center;margin-bottom:1rem}.tool-card h2{font-size:1.1rem;color:var(--text-primary);margin-bottom:.5rem}.tool-card p{font-size:.9rem;color:var(--text-secondary)}.features{padding:3rem 0}.features h2{font-size:2rem;margin-bottom:2rem}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem}.feature{padding:2rem;background:var(--bg-secondary);border-radius:var(--radius-lg)}.feature svg{color:var(--accent);margin-bottom:1rem}.feature h3{margin-bottom:.5rem}.feature p{color:var(--text-secondary);font-size:.95rem}.tool-page{max-width:1000px;margin:0 auto}.tool-header{display:flex;align-items:flex-start;gap:1rem;margin-bottom:2rem;padding-bottom:1.5rem;border-bottom:1px solid var(--border)}.tool-header svg{color:var(--accent);flex-shrink:0}.tool-header h1{font-size:1.75rem;margin-bottom:.25rem}.tool-header p{color:var(--text-secondary)}.tool-content{display:flex;flex-direction:column;gap:1.5rem}.two-column{display:grid;grid-template-columns:1fr 1fr;gap:2rem}@media(max-width:768px){.two-column{grid-template-columns:1fr}}.control-group{margin-bottom:1rem}.control-group label{display:block;font-size:.9rem;color:var(--text-secondary);margin-bottom:.5rem}.control-group input[type=text],.control-group input[type=email],.control-group input[type=number],.control-group select,.control-group textarea{width:100%;padding:.75rem;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-primary);font-size:1rem}.control-group input:focus,.control-group select:focus,.control-group textarea:focus{outline:none;border-color:var(--accent)}.control-group input[type=range]{width:100%;accent-color:var(--accent)}.control-group input[type=color]{width:50px;height:40px;padding:0;border:none;cursor:pointer}.control-row{display:flex;gap:1rem}.button-group{display:flex;gap:.5rem;flex-wrap:wrap}.button-group button{padding:.5rem 1rem;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-secondary);cursor:pointer;transition:all .2s;font-size:.85rem}.button-group button:hover{border-color:var(--accent);color:var(--text-primary)}.button-group button.active{background:var(--accent);border-color:var(--accent);color:#fff}.checkbox-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.75rem}.checkbox-option{display:flex;align-items:center;gap:.5rem;cursor:pointer;color:var(--text-secondary)}.checkbox-option input{accent-color:var(--accent)}button.primary-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 1.5rem;background:var(--accent);border:none;border-radius:var(--radius);color:#fff;font-size:1rem;cursor:pointer;transition:all .2s}button.primary-btn:hover{background:var(--accent-hover)}button.primary-btn:disabled{opacity:.6;cursor:not-allowed}.qr-preview{background:#fff;padding:1rem;border-radius:var(--radius);display:inline-block}.preview-actions{display:flex;gap:.5rem;margin-top:1rem}.preview-actions button{display:flex;align-items:center;gap:.25rem;padding:.5rem 1rem;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-primary);cursor:pointer}.tool-preview{display:flex;flex-direction:column;align-items:center}.password-display{display:flex;gap:.5rem;background:var(--bg-secondary);padding:.5rem;border-radius:var(--radius);border:1px solid var(--border)}.password-output{flex:1;background:transparent;border:none;color:var(--text-primary);font-family:monospace;font-size:1.1rem;padding:.5rem}.password-output:focus{outline:none}.password-display button{background:var(--bg-tertiary);border:none;padding:.5rem;border-radius:var(--radius);color:var(--text-primary);cursor:pointer}.strength-meter{display:flex;align-items:center;gap:1rem}.strength-bar{flex:1;height:8px;background:var(--bg-tertiary);border-radius:4px;overflow:hidden}.strength-fill{height:100%;transition:all .3s}.strength-meter span{display:flex;align-items:center;gap:.25rem;font-size:.9rem}.password-options,.password-history{background:var(--bg-secondary);padding:1.5rem;border-radius:var(--radius-lg)}.password-history h3{margin-bottom:1rem;font-size:1rem}.password-history ul{list-style:none}.password-history li{display:flex;align-items:center;justify-content:space-between;padding:.5rem 0;border-bottom:1px solid var(--border)}.password-history code{font-family:monospace;color:var(--text-secondary);word-break:break-all}.password-history button{background:none;border:none;color:var(--text-muted);cursor:pointer;padding:.25rem}.json-toolbar{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem;margin-bottom:1rem}.control-group.inline{display:flex;align-items:center;gap:.5rem;margin-bottom:0}.button-row{display:flex;gap:.5rem}.button-row button{display:flex;align-items:center;gap:.25rem;padding:.5rem 1rem;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-primary);cursor:pointer}.button-row button.primary-btn{background:var(--accent);border-color:var(--accent)}.json-panels{display:grid;grid-template-columns:1fr 1fr;gap:1rem}@media(max-width:768px){.json-panels{grid-template-columns:1fr}}.json-panel{background:var(--bg-secondary);border-radius:var(--radius-lg);overflow:hidden}.panel-header{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;background:var(--bg-tertiary);font-size:.9rem}.char-count{color:var(--text-muted)}.copy-btn{display:flex;align-items:center;gap:.25rem;background:none;border:none;color:var(--text-secondary);cursor:pointer;font-size:.85rem}.json-panel textarea{width:100%;min-height:300px;padding:1rem;background:transparent;border:none;color:var(--text-primary);font-family:monospace;font-size:.9rem;resize:vertical}.json-panel textarea:focus{outline:none}.json-output{padding:1rem;margin:0;font-family:monospace;font-size:.9rem;white-space:pre-wrap;word-break:break-word;max-height:400px;overflow-y:auto}.json-error{display:flex;align-items:center;gap:.5rem;padding:1rem;color:var(--danger)}.json-placeholder{padding:1rem;color:var(--text-muted);font-style:italic}.json-stats{display:flex;align-items:center;gap:1rem;padding:1rem;background:var(--bg-secondary);border-radius:var(--radius);font-size:.9rem}.json-stats .stat{color:var(--text-muted)}.uuid-controls{display:flex;align-items:flex-end;gap:1rem;flex-wrap:wrap;background:var(--bg-secondary);padding:1.5rem;border-radius:var(--radius-lg)}.uuid-controls .control-group{margin-bottom:0}.uuid-controls input[type=number]{width:80px}.uuid-results{background:var(--bg-secondary);border-radius:var(--radius-lg);overflow:hidden}.results-header{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.5rem;background:var(--bg-tertiary)}.results-actions{display:flex;gap:.5rem}.results-actions button{display:flex;align-items:center;gap:.25rem;padding:.5rem 1rem;background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-primary);cursor:pointer;font-size:.85rem}.results-actions button.danger{color:var(--danger)}.uuid-list{list-style:none;max-height:400px;overflow-y:auto}.uuid-list li{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1.5rem;border-bottom:1px solid var(--border)}.uuid-list code{font-family:monospace;color:var(--text-secondary)}.uuid-list button{background:none;border:none;color:var(--text-muted);cursor:pointer;padding:.25rem}.uuid-info{background:var(--bg-secondary);padding:1.5rem;border-radius:var(--radius-lg)}.uuid-info h3{margin-bottom:1rem}.uuid-info p{color:var(--text-secondary);margin-bottom:.5rem}.uuid-info code{background:var(--bg-tertiary);padding:.25rem .5rem;border-radius:4px;font-size:.9rem}.current-time-card{background:var(--bg-secondary);padding:1.5rem;border-radius:var(--radius-lg)}.current-time-label{font-size:.9rem;color:var(--text-muted);margin-bottom:1rem}.current-time-display{display:flex;flex-direction:column;gap:.75rem}.time-value{display:flex;align-items:center;gap:1rem}.time-label{min-width:80px;font-size:.85rem;color:var(--text-muted)}.time-value code{flex:1;font-family:monospace;background:var(--bg-tertiary);padding:.5rem 1rem;border-radius:var(--radius)}.time-value button{background:none;border:none;color:var(--text-muted);cursor:pointer}.converter-section{background:var(--bg-secondary);padding:1.5rem;border-radius:var(--radius-lg)}.converter-toggle{margin-bottom:1.5rem}.converter-panels{display:grid;grid-template-columns:1fr 1fr;gap:2rem;margin-bottom:1.5rem}@media(max-width:768px){.converter-panels{grid-template-columns:1fr}}.converter-panel label{display:block;font-size:.9rem;color:var(--text-secondary);margin-bottom:.5rem}.input-with-btn{display:flex;gap:.5rem;margin-bottom:.75rem}.input-with-btn input{flex:1;padding:.75rem;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-primary);font-family:monospace}.input-with-btn button{background:var(--bg-primary);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-muted);padding:.5rem;cursor:pointer}.convert-btn{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-primary);cursor:pointer;font-size:.9rem}.timestamp-formats{background:var(--bg-secondary);padding:1.5rem;border-radius:var(--radius-lg)}.timestamp-formats h3{margin-bottom:1rem}.timestamp-formats table{width:100%;border-collapse:collapse}.timestamp-formats td{padding:.5rem 0;border-bottom:1px solid var(--border)}.timestamp-formats td:first-child{color:var(--text-muted);width:100px}.timestamp-formats code{font-family:monospace;font-size:.9rem}.regex-input-section{background:var(--bg-secondary);padding:1.5rem;border-radius:var(--radius-lg)}.regex-input-wrapper{display:flex;align-items:center;gap:.25rem;background:var(--bg-tertiary);padding:.5rem;border-radius:var(--radius);margin-bottom:1rem}.regex-delimiter{color:var(--text-muted);font-family:monospace;font-size:1.2rem}.regex-input{flex:1;background:transparent;border:none;color:var(--text-primary);font-family:monospace;font-size:1rem;padding:.5rem}.regex-input:focus{outline:none}.regex-flags{width:60px;background:transparent;border:none;color:var(--accent);font-family:monospace;font-size:1rem;padding:.5rem}.regex-flags:focus{outline:none}.regex-flags-toggle{display:flex;gap:.5rem;margin-bottom:1rem}.regex-flags-toggle button{width:36px;height:36px;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-muted);font-family:monospace;cursor:pointer}.regex-flags-toggle button.active{background:var(--accent);border-color:var(--accent);color:#fff}.regex-presets{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.regex-presets span{color:var(--text-muted);font-size:.9rem}.regex-presets button{padding:.25rem .75rem;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-secondary);cursor:pointer;font-size:.85rem}.regex-error{display:flex;align-items:center;gap:.5rem;padding:1rem;background:#ef44441a;border:1px solid var(--danger);border-radius:var(--radius);color:var(--danger)}.regex-panels{display:grid;grid-template-columns:1fr 1fr;gap:1rem}@media(max-width:768px){.regex-panels{grid-template-columns:1fr}}.regex-panel{background:var(--bg-secondary);border-radius:var(--radius-lg);overflow:hidden}.regex-panel label{display:block;padding:.75rem 1rem;background:var(--bg-tertiary);font-size:.9rem}.regex-panel textarea{width:100%;min-height:200px;padding:1rem;background:transparent;border:none;color:var(--text-primary);font-family:monospace;resize:vertical}.highlighted-output{padding:1rem;font-family:monospace;white-space:pre-wrap;word-break:break-word;min-height:200px}.highlighted-output mark{background:#3b82f64d;color:var(--accent);padding:2px 0}.regex-matches{background:var(--bg-secondary);padding:1.5rem;border-radius:var(--radius-lg)}.regex-matches h3{display:flex;align-items:center;gap:.5rem;margin-bottom:1rem}.regex-matches table{width:100%;border-collapse:collapse}.regex-matches th,.regex-matches td{padding:.75rem;text-align:left;border-bottom:1px solid var(--border)}.regex-matches th{color:var(--text-muted);font-size:.85rem}.regex-matches code{background:var(--bg-tertiary);padding:.25rem .5rem;border-radius:4px;margin-right:.25rem}.regex-replace{background:var(--bg-secondary);padding:1.5rem;border-radius:var(--radius-lg)}.regex-replace h3{margin-bottom:1rem}.replace-input input{width:100%;padding:.75rem;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-primary);font-family:monospace}.replace-result{margin-top:1rem}.replace-result label{display:block;font-size:.9rem;color:var(--text-muted);margin-bottom:.5rem}.replace-result pre{background:var(--bg-tertiary);padding:1rem;border-radius:var(--radius);font-family:monospace;white-space:pre-wrap}.mode-toggle{display:flex;gap:.5rem;margin-bottom:1rem}.mode-toggle button{display:flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-secondary);cursor:pointer}.mode-toggle button.active{background:var(--accent);border-color:var(--accent);color:#fff}.dropzone{border:2px dashed var(--border);border-radius:var(--radius-lg);padding:2rem;text-align:center;cursor:pointer;transition:all .2s}.dropzone:hover,.dropzone.active{border-color:var(--accent);background:#3b82f60d}.dropzone svg{color:var(--text-muted);margin-bottom:.5rem}.dropzone p{color:var(--text-secondary);margin-bottom:.25rem}.dropzone .hint{color:var(--text-muted);font-size:.85rem}.dropzone.large{padding:3rem}.dropzone .file-info{margin-top:1rem;display:flex;gap:1rem;justify-content:center;font-size:.9rem;color:var(--text-muted)}.base64-panels{display:flex;flex-direction:column;gap:1rem}.base64-panel{background:var(--bg-secondary);border-radius:var(--radius-lg);overflow:hidden}.base64-panel label{display:block;padding:.75rem 1rem;background:var(--bg-tertiary);font-size:.9rem}.base64-panel textarea{width:100%;min-height:150px;padding:1rem;background:transparent;border:none;color:var(--text-primary);font-family:monospace;resize:vertical}.base64-error{padding:1rem;color:var(--danger)}.image-preview{padding:1rem;text-align:center}.image-preview span{display:flex;align-items:center;justify-content:center;gap:.5rem;color:var(--text-muted);margin-bottom:1rem}.image-preview img{max-width:100%;max-height:300px;border-radius:var(--radius)}.panel-actions{display:flex;gap:.5rem}.panel-actions button{padding:.25rem .75rem;background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-secondary);cursor:pointer;font-size:.85rem}.base64-info{background:var(--bg-secondary);padding:1.5rem;border-radius:var(--radius-lg)}.base64-info h3{margin-bottom:1rem}.base64-info p{color:var(--text-secondary);margin-bottom:.5rem}.base64-info ul{color:var(--text-secondary);padding-left:1.5rem}.video-preview{position:relative;background:var(--bg-secondary);border-radius:var(--radius-lg);overflow:hidden}.video-preview video{width:100%;max-height:400px;display:block}.play-btn{position:absolute;bottom:1rem;left:1rem;width:48px;height:48px;background:#000000b3;border:none;border-radius:50%;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center}.gif-controls{background:var(--bg-secondary);padding:1.5rem;border-radius:var(--radius-lg)}.gif-result{background:var(--bg-secondary);padding:1.5rem;border-radius:var(--radius-lg);text-align:center}.gif-result h3{margin-bottom:1rem}.gif-result img{max-width:100%;max-height:300px;border-radius:var(--radius);margin-bottom:1rem}.video-info,.bg-remove-info,.pdf-info{background:var(--bg-secondary);padding:1.5rem;border-radius:var(--radius-lg)}.video-info h3,.bg-remove-info h3,.pdf-info h3{margin-bottom:1rem}.video-info ul,.bg-remove-info ul,.pdf-info ul{color:var(--text-secondary);padding-left:1.5rem}.video-info li,.bg-remove-info li,.pdf-info li{margin-bottom:.5rem}.error-message{display:flex;align-items:center;gap:.5rem;padding:1rem;background:#ef44441a;border:1px solid var(--danger);border-radius:var(--radius);color:var(--danger)}.image-comparison{display:grid;grid-template-columns:1fr 1fr;gap:1rem}@media(max-width:768px){.image-comparison{grid-template-columns:1fr}}.comparison-side{background:var(--bg-secondary);border-radius:var(--radius-lg);overflow:hidden}.comparison-side h3{padding:.75rem 1rem;background:var(--bg-tertiary);font-size:.9rem}.image-container{padding:1rem;display:flex;justify-content:center;align-items:center;min-height:300px}.image-container img{max-width:100%;max-height:300px;border-radius:var(--radius)}.image-container.checkerboard{background-image:linear-gradient(45deg,#333 25%,transparent 25%),linear-gradient(-45deg,#333 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#333 75%),linear-gradient(-45deg,transparent 75%,#333 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0px}.bg-remove-actions{display:flex;gap:1rem;justify-content:center}.bg-remove-actions button{display:flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-primary);cursor:pointer}.bg-remove-actions button.primary-btn{background:var(--accent);border-color:var(--accent)}.compress-options{background:var(--bg-secondary);padding:1.5rem;border-radius:var(--radius-lg)}.quality-select{margin-bottom:1.5rem}.quality-select label{display:block;margin-bottom:.75rem;color:var(--text-secondary)}.compression-stats{display:flex;flex-direction:column;align-items:center;gap:1.5rem;background:var(--bg-secondary);padding:2rem;border-radius:var(--radius-lg);text-align:center}.stats-details h3{margin-bottom:1rem}.stat-row{display:flex;justify-content:space-between;gap:2rem;padding:.5rem 0;color:var(--text-secondary)}.stat-row.highlight{color:var(--success);font-size:1.1rem}.spin{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-secondary)}::-webkit-scrollbar-thumb{background:var(--bg-tertiary);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.lorem-controls{display:flex;flex-wrap:wrap;gap:1rem;align-items:flex-end;margin-bottom:1.5rem}.lorem-output{background:var(--bg-secondary);border-radius:var(--radius-lg);overflow:hidden}.lorem-output .output-header{display:flex;justify-content:space-between;align-items:center;padding:1rem;background:var(--bg-tertiary);border-bottom:1px solid var(--border)}.lorem-output .output-text{padding:1.5rem;max-height:400px;overflow-y:auto}.lorem-output .output-text p{margin-bottom:1rem;line-height:1.7}.lorem-output .output-text p:last-child{margin-bottom:0}.lorem-info{margin-top:2rem;padding:1.5rem;background:var(--bg-secondary);border-radius:var(--radius-lg)}.color-preview-section{display:flex;align-items:center;gap:1rem;margin-bottom:2rem}.color-preview-large{width:120px;height:120px;border-radius:var(--radius-lg);border:2px solid var(--border)}.color-picker-input{width:60px;height:60px;border:none;cursor:pointer;border-radius:var(--radius)}.color-inputs{display:flex;flex-direction:column;gap:1.5rem;margin-bottom:2rem}.color-input-group label{display:block;margin-bottom:.5rem;font-weight:600}.rgb-inputs,.hsl-inputs{display:flex;gap:.5rem}.rgb-inputs input,.hsl-inputs input{width:80px}.palette-section{background:var(--bg-secondary);padding:1.5rem;border-radius:var(--radius-lg);margin-bottom:2rem}.palette-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.palette-header h3{margin:0}.palette-actions{display:flex;gap:.5rem}.palette-actions button{padding:.5rem 1rem;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-primary);cursor:pointer;font-size:.85rem}.palette-colors{display:flex;gap:.5rem;flex-wrap:wrap}.palette-color{width:60px;height:60px;border-radius:var(--radius);cursor:pointer;display:flex;align-items:center;justify-content:center;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5);transition:transform .2s}.palette-color:hover{transform:scale(1.1)}.color-info .css-values{display:flex;flex-direction:column;gap:.5rem;background:var(--bg-tertiary);padding:1rem;border-radius:var(--radius)}.color-info .css-values code{font-size:.9rem}.hash-input-section{margin:1.5rem 0}.hash-input-section textarea{width:100%;min-height:100px;margin-bottom:1rem}.hash-results{background:var(--bg-secondary);border-radius:var(--radius-lg);padding:1.5rem}.hash-table{width:100%;border-collapse:collapse}.hash-table th,.hash-table td{padding:.75rem;text-align:left;border-bottom:1px solid var(--border)}.hash-table .algo-name{font-weight:600;width:100px}.hash-table .hash-value code{word-break:break-all;font-size:.85rem}.hash-info{margin-top:2rem;padding:1.5rem;background:var(--bg-secondary);border-radius:var(--radius-lg)}.hash-info .note{margin-top:1rem;padding:1rem;background:var(--bg-tertiary);border-radius:var(--radius);color:var(--text-secondary)}.encode-type-toggle{display:flex;gap:2rem;margin-bottom:1.5rem}.radio-option{display:flex;flex-direction:column;gap:.25rem;cursor:pointer}.radio-option span{font-weight:600}.radio-option small{color:var(--text-muted);font-size:.8rem}.url-panels{display:flex;flex-direction:column;gap:1rem}.url-panel label{display:block;margin-bottom:.5rem;font-weight:600}.url-panel textarea{width:100%;min-height:120px;font-family:var(--font-mono)}.url-actions{display:flex;gap:1rem;justify-content:center}.url-error{padding:1rem;background:#ef44441a;border:1px solid var(--danger);border-radius:var(--radius);color:var(--danger)}.url-reference{margin-top:2rem}.url-reference table{width:100%;background:var(--bg-secondary);border-radius:var(--radius-lg);overflow:hidden}.url-reference th,.url-reference td{padding:.75rem 1rem;text-align:left;border-bottom:1px solid var(--border)}.markdown-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.markdown-stats{color:var(--text-muted);font-size:.85rem}.markdown-container{display:grid;grid-template-columns:1fr 1fr;gap:1rem;min-height:500px}.markdown-container.view-edit,.markdown-container.view-preview{grid-template-columns:1fr}.markdown-editor,.markdown-preview{display:flex;flex-direction:column;background:var(--bg-secondary);border-radius:var(--radius-lg);overflow:hidden}.markdown-editor textarea{flex:1;resize:none;border:none;padding:1rem;font-family:var(--font-mono);font-size:.9rem;line-height:1.6}.preview-content{flex:1;padding:1.5rem;overflow-y:auto;line-height:1.7}.preview-content h1,.preview-content h2,.preview-content h3{margin-top:1.5rem;margin-bottom:.75rem}.preview-content h1{font-size:1.75rem}.preview-content h2{font-size:1.5rem}.preview-content h3{font-size:1.25rem}.preview-content p{margin-bottom:1rem}.preview-content code{background:var(--bg-tertiary);padding:.2rem .4rem;border-radius:var(--radius-sm);font-size:.9em}.preview-content pre{background:var(--bg-tertiary);padding:1rem;border-radius:var(--radius);overflow-x:auto;margin:1rem 0}.preview-content pre code{background:none;padding:0}.preview-content blockquote{border-left:4px solid var(--accent);padding-left:1rem;margin:1rem 0;color:var(--text-secondary)}.preview-content table{width:100%;border-collapse:collapse;margin:1rem 0}.preview-content th,.preview-content td{padding:.5rem;border:1px solid var(--border);text-align:left}.preview-content th{background:var(--bg-tertiary)}.preview-content ul,.preview-content ol{margin:1rem 0;padding-left:2rem}.preview-content li{margin-bottom:.5rem}.markdown-cheatsheet{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;margin-top:1rem}.cheatsheet-item{display:flex;flex-direction:column;gap:.25rem}.cheatsheet-item code{background:var(--bg-tertiary);padding:.25rem .5rem;border-radius:var(--radius-sm);font-size:.85rem}.resize-controls{background:var(--bg-secondary);padding:1.5rem;border-radius:var(--radius-lg);margin-bottom:2rem}.size-inputs{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}.size-inputs input{width:120px}.aspect-toggle{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;color:var(--text-secondary)}.aspect-toggle.locked{color:var(--accent);border-color:var(--accent)}.original-size{color:var(--text-muted);font-size:.9rem;margin-bottom:1rem}.size-presets{margin-bottom:1.5rem}.size-presets label{display:block;margin-bottom:.5rem;color:var(--text-secondary)}.preset-buttons{display:flex;flex-wrap:wrap;gap:.5rem}.preset-buttons button{padding:.5rem 1rem;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-primary);cursor:pointer;font-size:.85rem}.preset-buttons button:hover{border-color:var(--accent)}.format-controls{display:flex;gap:2rem;margin-bottom:1.5rem}.image-preview-section{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}.preview-panel{background:var(--bg-secondary);padding:1rem;border-radius:var(--radius-lg)}.preview-panel h4{margin-bottom:1rem;color:var(--text-secondary)}.preview-panel img{display:block;margin:0 auto}.preview-actions{display:flex;gap:1rem;justify-content:center;margin-top:1rem}.jwt-input-section{margin-bottom:1.5rem}.jwt-input-section textarea{width:100%;min-height:100px;font-family:var(--font-mono);font-size:.85rem;margin-bottom:1rem}.jwt-error{display:flex;align-items:center;gap:.5rem;padding:1rem;background:#ef44441a;border:1px solid var(--danger);border-radius:var(--radius);color:var(--danger);margin-bottom:1rem}.jwt-decoded{display:flex;flex-direction:column;gap:1.5rem}.jwt-status{display:flex;align-items:center;gap:.5rem;padding:1rem;border-radius:var(--radius)}.jwt-status.expired,.jwt-status.not-valid{background:#ef44441a;border:1px solid var(--danger);color:var(--danger)}.jwt-status.valid{background:#22c55e1a;border:1px solid var(--success);color:var(--success)}.jwt-section{background:var(--bg-secondary);border-radius:var(--radius-lg);overflow:hidden}.jwt-section .section-header{display:flex;justify-content:space-between;align-items:center;padding:1rem;background:var(--bg-tertiary)}.jwt-code{padding:1rem;margin:0;font-size:.85rem;overflow-x:auto}.jwt-code.header{border-left:4px solid var(--accent)}.jwt-code.payload{border-left:4px solid var(--success)}.jwt-code.signature{border-left:4px solid var(--warning);word-break:break-all}.jwt-timestamps{padding:1rem;border-top:1px solid var(--border)}.jwt-timestamps h4{margin-bottom:.75rem;color:var(--text-secondary)}.jwt-timestamps table{width:100%}.jwt-timestamps td{padding:.5rem 0}.jwt-timestamps tr.expired td{color:var(--danger)}.signature-note{padding:1rem;color:var(--text-muted);font-size:.85rem;border-top:1px solid var(--border)}.jwt-info .warning{margin-top:1rem;padding:1rem;background:#fbbf241a;border:1px solid var(--warning);border-radius:var(--radius);color:var(--warning)}.diff-options{display:flex;flex-wrap:wrap;gap:2rem;align-items:center;margin-bottom:1.5rem}.diff-toggles{display:flex;gap:1.5rem}.diff-inputs{display:grid;grid-template-columns:1fr auto 1fr;gap:1rem;margin-bottom:1rem}.diff-panel textarea{width:100%;min-height:200px;font-family:var(--font-mono);font-size:.9rem}.diff-actions-middle{display:flex;align-items:center}.diff-actions-middle button{padding:.5rem;background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;font-size:1.2rem}.diff-toolbar{display:flex;gap:1rem;margin-bottom:1.5rem}.diff-stats{display:flex;gap:1.5rem;padding:1rem;background:var(--bg-secondary);border-radius:var(--radius);margin-bottom:1.5rem}.diff-stats .stat{font-weight:600}.diff-stats .stat.added{color:var(--success)}.diff-stats .stat.removed{color:var(--danger)}.diff-stats .stat.unchanged{color:var(--text-muted)}.diff-stats .identical{color:var(--success)}.diff-output{background:var(--bg-secondary);border-radius:var(--radius-lg);padding:1.5rem}.diff-result{font-family:var(--font-mono);font-size:.9rem;line-height:1.6;white-space:pre-wrap;word-break:break-word}.diff-result .added{background:#22c55e33;color:var(--success)}.diff-result .removed{background:#ef444433;color:var(--danger);text-decoration:line-through}.diff-info .added{color:var(--success);background:#22c55e33;padding:.1rem .3rem;border-radius:2px}.diff-info .removed{color:var(--danger);background:#ef444433;padding:.1rem .3rem;border-radius:2px}.case-input-section{margin-bottom:2rem}.case-input-section textarea{width:100%;min-height:100px;font-size:1rem}.case-results{background:var(--bg-secondary);padding:1.5rem;border-radius:var(--radius-lg)}.case-grid{display:flex;flex-direction:column;gap:1rem;margin-top:1rem}.case-item{display:flex;justify-content:space-between;align-items:center;padding:1rem;background:var(--bg-tertiary);border-radius:var(--radius)}.case-label{display:flex;flex-direction:column;gap:.25rem}.case-name{font-weight:600}.case-example{color:var(--text-muted);font-size:.8rem}.case-result{display:flex;align-items:center;gap:.75rem}.case-result code{padding:.5rem 1rem;background:var(--bg-secondary);border-radius:var(--radius);font-size:.9rem;max-width:300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.case-actions{display:flex;gap:.25rem}.case-actions button{padding:.5rem;background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;color:var(--text-secondary)}.case-actions button:hover{color:var(--accent);border-color:var(--accent)}.case-info{margin-top:2rem}.case-info table{width:100%;background:var(--bg-secondary);border-radius:var(--radius-lg);overflow:hidden}.case-info th,.case-info td{padding:.75rem 1rem;text-align:left;border-bottom:1px solid var(--border)}.css-panels{display:flex;flex-direction:column;gap:1rem}.css-panel{background:var(--bg-secondary);border-radius:var(--radius-lg);overflow:hidden}.css-panel textarea{width:100%;min-height:250px;border:none;padding:1rem;font-family:var(--font-mono);font-size:.9rem;resize:vertical}.css-panel .char-count{padding:.5rem 1rem;background:var(--bg-tertiary);color:var(--text-muted);font-size:.85rem;text-align:right}.process-btn{align-self:center}.css-stats{display:flex;justify-content:space-between;padding:.75rem 1rem;background:var(--bg-tertiary);font-size:.85rem}.css-stats .savings{color:var(--success);font-weight:600}.css-info .info-columns{display:grid;grid-template-columns:1fr 1fr;gap:2rem;margin-top:1rem}.css-info h4{margin-bottom:.75rem;color:var(--accent)}@media(max-width:768px){.markdown-container,.image-preview-section,.diff-inputs{grid-template-columns:1fr}.diff-actions-middle{justify-content:center}.css-info .info-columns{grid-template-columns:1fr}.size-inputs{flex-wrap:wrap}.format-controls,.encode-type-toggle{flex-direction:column;gap:1rem}}