.language-switch{display:flex;gap:4px;padding:4px;background:var(--bg-tertiary);border-radius:var(--radius)}.lang-btn{padding:4px 8px;font-size:12px;font-weight:500;background:transparent;color:var(--text-secondary);border-radius:4px;transition:all .2s ease}.lang-btn:hover{color:var(--text-primary)}.lang-btn.active{background:var(--accent);color:#fff}.sidebar{width:240px;height:100%;background:var(--bg-secondary);border-right:1px solid var(--border);display:flex;flex-direction:column;flex-shrink:0}.sidebar-header{padding:16px;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center}.logo{display:flex;align-items:center;gap:8px;font-size:18px;font-weight:600}.logo-icon{font-size:24px}.search-box{padding:12px 16px}.search-box input{width:100%;padding:10px 12px;border-radius:var(--radius);background:var(--bg-tertiary);border:1px solid transparent}.search-box input:focus{border-color:var(--accent);background:var(--bg-primary)}.nav{flex:1;overflow-y:auto;padding:8px 0}.nav-category{margin-bottom:8px}.category-title{padding:8px 16px;font-size:12px;font-weight:500;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.tool-list{list-style:none}.tool-item{display:flex;align-items:center;gap:10px;width:100%;padding:10px 16px;background:transparent;color:var(--text-secondary);text-align:left;border-radius:0}.tool-item:hover{background:var(--bg-tertiary);color:var(--text-primary)}.tool-item.active{background:var(--accent);color:#fff}.tool-icon{font-size:18px;width:24px;text-align:center}.tool-name{font-size:14px}.sidebar-footer{padding:12px 16px;border-top:1px solid var(--border);display:flex;justify-content:space-between;align-items:center}.footer-link{font-size:12px;color:var(--text-muted);background:transparent;padding:4px 8px;border-radius:4px}.footer-link:hover{color:var(--text-secondary);background:var(--bg-tertiary)}.version{font-size:12px;color:var(--text-muted)}.tool-page{height:100%;display:flex;flex-direction:column;padding:24px;overflow:hidden}.tool-header{margin-bottom:20px}.tool-header h2{font-size:24px;font-weight:600;margin-bottom:4px}.tool-desc{color:var(--text-secondary);font-size:14px}.tool-actions{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;flex-wrap:wrap;gap:12px}.action-group{display:flex;gap:8px;align-items:center}.btn{padding:8px 16px;border-radius:var(--radius);background:var(--bg-tertiary);color:var(--text-primary);font-weight:500;border:1px solid var(--border)}.btn:hover{background:var(--border)}.btn-primary{background:var(--accent);border-color:var(--accent)}.btn-primary:hover{background:var(--accent-hover)}.btn-icon{padding:6px 10px;background:transparent;color:var(--text-secondary);border-radius:var(--radius)}.btn-icon:hover{background:var(--bg-tertiary);color:var(--text-primary)}.tool-content{flex:1;overflow:auto}.tool-content.dual-panel{display:flex;gap:0;overflow:hidden}.panel{flex:1;display:flex;flex-direction:column;min-width:0}.panel-header{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;background:var(--bg-secondary);border:1px solid var(--border);border-bottom:none;border-radius:var(--radius) var(--radius) 0 0;font-size:13px;color:var(--text-secondary)}.panel-divider{display:flex;align-items:center;padding:0 8px}.swap-btn{font-size:18px}.code-editor{flex:1;resize:none;padding:12px;font-family:SF Mono,Monaco,Inconsolata,Fira Code,monospace;font-size:13px;line-height:1.6;background:var(--bg-primary);border:1px solid var(--border);border-radius:0 0 var(--radius) var(--radius);min-height:300px}.code-editor:focus{border-color:var(--accent)}.error-box{padding:12px;background:#ef44441a;border:1px solid var(--error);border-radius:var(--radius);color:var(--error);font-size:13px}.indent-label{display:flex;align-items:center;gap:8px;color:var(--text-secondary);font-size:13px}.indent-label select{padding:6px 10px;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-primary)}.type-tabs{display:flex;gap:4px;margin-bottom:16px;padding:4px;background:var(--bg-secondary);border-radius:var(--radius);width:fit-content}.tab-btn{padding:8px 16px;background:transparent;color:var(--text-secondary);border-radius:var(--radius)}.tab-btn:hover{color:var(--text-primary)}.tab-btn.active{background:var(--accent);color:#fff}.current-time-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px;margin-bottom:24px}.time-label{font-size:12px;color:var(--text-muted);margin-bottom:12px}.time-values{display:flex;gap:24px;flex-wrap:wrap}.time-item{cursor:pointer;padding:8px 12px;border-radius:var(--radius);transition:background .2s}.time-item:hover{background:var(--bg-tertiary)}.time-item .label{display:block;font-size:12px;color:var(--text-muted);margin-bottom:4px}.time-item .value{font-size:16px;font-weight:500}.time-hint{font-size:12px;color:var(--text-muted);margin-top:12px}.convert-section{margin-bottom:24px}.convert-section h3{font-size:14px;font-weight:500;color:var(--text-secondary);margin-bottom:12px}.input-row{display:flex;gap:12px}.input-row input{flex:1;padding:10px 14px}.quick-times{display:flex;flex-wrap:wrap;gap:8px}.result-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px;margin-top:24px}.result-card h3{font-size:14px;font-weight:500;color:var(--text-secondary);margin-bottom:16px}.result-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}.result-item{cursor:pointer;padding:12px;background:var(--bg-tertiary);border-radius:var(--radius);transition:background .2s}.result-item:hover{background:var(--border)}.result-item .label{display:block;font-size:12px;color:var(--text-muted);margin-bottom:4px}.result-item .value{font-size:14px;word-break:break-all}.section-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px;margin-bottom:20px}.section-card h3{font-size:16px;font-weight:500;margin-bottom:16px}.options-row{display:flex;gap:16px;align-items:flex-end;flex-wrap:wrap}.option-item{display:flex;flex-direction:column;gap:6px}.option-item label{font-size:12px;color:var(--text-secondary)}.option-item select{padding:8px 12px;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-primary);min-width:100px}.uuid-list{margin-top:16px}.list-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;font-size:13px;color:var(--text-secondary)}.uuid-items{display:flex;flex-direction:column;gap:6px;max-height:300px;overflow-y:auto}.uuid-item{padding:10px 14px;background:var(--bg-tertiary);border-radius:var(--radius);cursor:pointer;transition:background .2s;font-size:13px}.uuid-item:hover{background:var(--border)}.validate-result{margin-top:16px;padding:16px;border-radius:var(--radius)}.validate-result.valid{background:#10b9811a;border:1px solid var(--success)}.validate-result.invalid{background:#ef44441a;border:1px solid var(--error)}.result-status{font-size:15px;font-weight:500;margin-bottom:8px}.valid .result-status{color:var(--success)}.invalid .result-status{color:var(--error)}.result-details{display:flex;gap:16px;font-size:13px;color:var(--text-secondary)}.format-list{display:flex;flex-direction:column;gap:12px}.format-item{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;background:var(--bg-tertiary);border-radius:var(--radius)}.format-name{font-weight:500}.format-example{font-size:12px;color:var(--text-muted);background:var(--bg-primary);padding:4px 8px;border-radius:4px}.privacy-page{height:100%;overflow-y:auto;padding:40px;background:var(--bg-primary)}.privacy-content{max-width:800px;margin:0 auto}.privacy-content h1{font-size:32px;font-weight:600;margin-bottom:8px;color:var(--text-primary)}.privacy-content .last-updated{color:var(--text-muted);font-size:14px;margin-bottom:32px}.privacy-content section{margin-bottom:32px}.privacy-content h2{font-size:20px;font-weight:600;margin-bottom:12px;color:var(--text-primary);border-bottom:1px solid var(--border);padding-bottom:8px}.privacy-content h3{font-size:16px;font-weight:500;margin:16px 0 8px;color:var(--text-primary)}.privacy-content p{color:var(--text-secondary);line-height:1.8;margin-bottom:12px}.privacy-content ul{color:var(--text-secondary);line-height:1.8;margin-left:24px;margin-bottom:12px}.privacy-content li{margin-bottom:8px}.privacy-content strong{color:var(--text-primary)}.privacy-content a{color:var(--accent);text-decoration:none}.privacy-content a:hover{text-decoration:underline}:root{--bg-primary: #0f0f0f;--bg-secondary: #1a1a1a;--bg-tertiary: #252525;--text-primary: #ffffff;--text-secondary: #a0a0a0;--text-muted: #666666;--accent: #646cff;--accent-hover: #535bf2;--success: #10b981;--warning: #f59e0b;--error: #ef4444;--border: #333333;--border-hover: #444444;--radius: 8px;--radius-lg: 12px;--shadow: 0 4px 6px -1px rgba(0, 0, 0, .3)}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;width:100%}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:14px;line-height:1.6;color:var(--text-primary);background:var(--bg-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-secondary)}::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--border-hover)}::selection{background:var(--accent);color:var(--text-primary)}a{color:var(--accent);text-decoration:none}a:hover{color:var(--accent-hover)}button{cursor:pointer;font-family:inherit;font-size:inherit;border:none;outline:none;transition:all .2s ease}input,textarea{font-family:inherit;font-size:inherit;outline:none;border:1px solid var(--border);background:var(--bg-secondary);color:var(--text-primary);border-radius:var(--radius);padding:8px 12px;transition:border-color .2s ease}input:focus,textarea:focus{border-color:var(--accent)}input::placeholder,textarea::placeholder{color:var(--text-muted)}code,pre,.mono{font-family:SF Mono,Monaco,Inconsolata,Fira Code,monospace}.app{display:flex;height:100vh;width:100vw;overflow:hidden}.main-content{flex:1;overflow:hidden;background:var(--bg-primary)}
