*{box-sizing:border-box;margin:0;padding:0}:root{--sidebar-width:240px;--bg:#0f1117;--bg-surface:#181a20;--bg-hover:#23262f;--bg-active:#2a2d38;--border:#2a2d38;--text:#e1e4ea;--text-muted:#8b8fa3;--accent:#6c8aff;--accent-hover:#8aa2ff;--success:#4ade80;--radius:8px;--font-mono:"SF Mono", "Cascadia Code", "Fira Code", "JetBrains Mono", monospace}body{background:var(--bg);color:var(--text);min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}#root{min-height:100vh;display:flex}.sidebar{width:var(--sidebar-width);background:var(--bg-surface);border-right:1px solid var(--border);flex-direction:column;flex-shrink:0;padding:24px 0;display:flex;position:fixed;top:0;bottom:0;left:0;overflow-y:auto}.sidebar-title{color:var(--text);letter-spacing:-.3px;padding:0 20px 20px;font-size:18px;font-weight:700}.sidebar-title span{color:var(--text-muted);margin-top:2px;font-size:12px;font-weight:400;display:block}.sidebar nav{flex-direction:column;gap:2px;padding:0 8px;display:flex}.sidebar button{width:100%;color:var(--text-muted);cursor:pointer;text-align:left;background:0 0;border:none;border-radius:6px;align-items:center;gap:10px;padding:10px 12px;font-size:14px;transition:background .15s,color .15s;display:flex}.sidebar button:hover{background:var(--bg-hover);color:var(--text)}.sidebar button.active{background:var(--bg-active);color:var(--text)}.sidebar button .icon{text-align:center;flex-shrink:0;width:20px;font-size:16px}.main{margin-left:var(--sidebar-width);flex:1;max-width:900px;padding:40px}.tool-header{margin-bottom:32px}.tool-header h1{letter-spacing:-.3px;font-size:24px;font-weight:600}.tool-header p{color:var(--text-muted);margin-top:6px;font-size:14px}label{color:var(--text-muted);margin-bottom:6px;font-size:13px;font-weight:500;display:block}input[type=text],input[type=datetime-local],input[type=number],select,textarea{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius);width:100%;color:var(--text);font-size:14px;font-family:var(--font-mono);outline:none;padding:10px 12px;transition:border-color .15s}input:focus,select:focus,textarea:focus{border-color:var(--accent)}textarea{resize:vertical;min-height:120px}button.btn{background:var(--accent);color:#fff;border-radius:var(--radius);cursor:pointer;border:none;align-items:center;gap:6px;padding:10px 18px;font-size:14px;font-weight:500;transition:background .15s;display:inline-flex}button.btn:hover{background:var(--accent-hover)}button.btn-secondary{background:var(--bg-hover);color:var(--text)}button.btn-secondary:hover{background:var(--bg-active)}.result-box{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius);font-family:var(--font-mono);word-break:break-all;white-space:pre-wrap;padding:16px;font-size:14px;position:relative}.result-box .copy-btn{background:var(--bg-hover);border:1px solid var(--border);color:var(--text-muted);cursor:pointer;border-radius:4px;padding:4px 10px;font-size:12px;transition:all .15s;position:absolute;top:8px;right:8px}.result-box .copy-btn:hover{color:var(--text);border-color:var(--accent)}.field-group{margin-bottom:20px}.row{align-items:flex-end;gap:12px;display:flex}.row>*{flex:1}.actions{gap:10px;margin-top:20px;margin-bottom:20px;display:flex}.copied-toast{color:var(--success);font-size:12px}button.delimiter-active{background:var(--accent);color:#fff}