:root{--bg: #fafaf9;--panel: #ffffff;--panel-2: #f4f4f3;--line: rgba(0,0,0,.08);--line-2: rgba(0,0,0,.04);--text: #0a0a0a;--text-2: #525252;--text-3: #a3a3a3;--accent: #0a0a0a;--on-accent: #ffffff;--hover: rgba(0,0,0,.04);--active: rgba(0,0,0,.07);--good: #16a34a;--warn: #ca8a04;--bad: #dc2626;--radius: 8px;--radius-lg: 12px;--shadow: 0 1px 2px rgba(0,0,0,.04);--shadow-lg: 0 10px 40px -10px rgba(0,0,0,.18), 0 1px 0 rgba(0,0,0,.04)}:root.dark{--bg: #0a0a0a;--panel: #121212;--panel-2: #181818;--line: rgba(255,255,255,.08);--line-2: rgba(255,255,255,.04);--text: #fafafa;--text-2: #a1a1a1;--text-3: #525252;--accent: #fafafa;--on-accent: #0a0a0a;--hover: rgba(255,255,255,.05);--active: rgba(255,255,255,.08);--good: #4ade80;--warn: #facc15;--bad: #f87171;--shadow: 0 1px 2px rgba(0,0,0,.4);--shadow-lg: 0 10px 40px -10px rgba(0,0,0,.6), 0 1px 0 rgba(255,255,255,.04)}*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%;background:var(--bg);color:var(--text);font-family:Geist,ui-sans-serif,sans-serif;font-feature-settings:"ss01","cv11";-webkit-font-smoothing:antialiased;font-size:14px;line-height:1.5}::selection{background:var(--accent);color:var(--on-accent)}.mono{font-family:Geist Mono,ui-monospace,monospace;font-feature-settings:"ss03","ss06"}button,input,textarea,select{font-family:inherit}textarea{resize:none}.app{display:grid;grid-template-columns:256px 1fr;height:100vh;width:100vw;overflow:hidden}.side{background:var(--panel);border-right:1px solid var(--line);display:flex;flex-direction:column;overflow:hidden}.side-head{height:56px;padding:0 16px;display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--line);flex-shrink:0}.logo-mark{width:22px;height:22px;border-radius:6px;background:var(--accent);color:var(--on-accent);display:grid;place-items:center;font-weight:600;font-size:13px;letter-spacing:-.02em}.brand{font-weight:600;letter-spacing:-.01em;font-size:14.5px}.brand-dot{width:4px;height:4px;border-radius:50%;background:var(--text-3);margin:0 2px 0 4px}.brand-sub{color:var(--text-3);font-size:12.5px;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}.side-scroll{flex:1;overflow-y:auto;padding:8px 8px 16px}.side-scroll::-webkit-scrollbar{width:6px}.side-scroll::-webkit-scrollbar-thumb{background:var(--line);border-radius:6px}.group{padding:12px 8px 4px;font-size:11px;font-weight:500;color:var(--text-3);text-transform:uppercase;letter-spacing:.08em}.item{display:flex;align-items:center;gap:10px;height:30px;padding:0 9px;margin:1px 0;border-radius:6px;color:var(--text-2);cursor:pointer;font-size:13.5px;-webkit-user-select:none;user-select:none;transition:background .08s,color .08s}.item span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;flex:1}.item:hover{background:var(--hover);color:var(--text)}.item.active{background:var(--active);color:var(--text);font-weight:500}.item svg{width:15px;height:15px;flex-shrink:0;opacity:.8}.item.active svg{opacity:1}.item .kbd{margin-left:auto;font-size:11px;color:var(--text-3);font-family:Geist Mono,monospace}.side-foot{padding:10px 12px;border-top:1px solid var(--line);display:flex;align-items:center;gap:8px;flex-shrink:0}.seg{display:inline-flex;background:var(--panel-2);border-radius:7px;padding:2px;border:1px solid var(--line)}.seg button{border:0;background:transparent;padding:4px 9px;border-radius:5px;font-size:12px;color:var(--text-2);cursor:pointer;transition:background .1s,color .1s}.seg button.on{background:var(--panel);color:var(--text);box-shadow:var(--shadow)}.icon-btn{width:28px;height:28px;display:grid;place-items:center;border-radius:6px;border:0;background:transparent;color:var(--text-2);cursor:pointer;transition:background .1s,color .1s}.icon-btn:hover{background:var(--hover);color:var(--text)}.icon-btn svg{width:15px;height:15px}.grow{flex:1}.main{overflow-y:auto;padding:40px 56px 80px;max-width:100%}.main::-webkit-scrollbar{width:8px}.main::-webkit-scrollbar-thumb{background:var(--line);border-radius:8px}.container{max-width:760px;margin:0 auto}.crumb{color:var(--text-3);font-size:12.5px;margin-bottom:12px;display:flex;gap:6px;align-items:center}h1{font-size:30px;font-weight:600;letter-spacing:-.02em;margin:0 0 6px;line-height:1.15}.desc{color:var(--text-2);font-size:14.5px;margin:0 0 32px;max-width:56ch}.pwd-display{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-lg);padding:22px 24px;margin-bottom:14px;position:relative;box-shadow:var(--shadow)}.pwd-text{font-family:Geist Mono,monospace;font-size:22px;font-weight:500;line-height:1.35;letter-spacing:.005em;word-break:break-all;min-height:31px;padding-right:96px}.pwd-text .ch-d{color:#2563eb}.pwd-text .ch-s{color:#c026d3}:root.dark .pwd-text .ch-d{color:#60a5fa}:root.dark .pwd-text .ch-s{color:#e879f9}.pwd-actions{position:absolute;top:18px;right:18px;display:flex;gap:4px}.pwd-meta{display:flex;gap:14px;margin-top:14px;padding-top:14px;border-top:1px solid var(--line-2);font-size:12.5px;color:var(--text-2);align-items:center}.strength{flex:1;display:flex;gap:4px}.strength .seg-bar{flex:1;height:4px;background:var(--line);border-radius:999px;transition:background .25s}.strength.s1 .seg-bar:nth-child(-n+1),.strength.s2 .seg-bar:nth-child(-n+2),.strength.s3 .seg-bar:nth-child(-n+3),.strength.s4 .seg-bar:nth-child(-n+4),.strength.s5 .seg-bar:nth-child(-n+5){background:currentColor}.strength.s1,.strength.s2{color:var(--bad)}.strength.s3{color:var(--warn)}.strength.s4,.strength.s5{color:var(--good)}.strength-label{font-weight:500;min-width:90px;text-align:right}.controls{display:grid;gap:14px;margin-top:26px}.row{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-lg);padding:18px 22px;box-shadow:var(--shadow)}.row-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:14px}.row-label{font-size:13px;color:var(--text-2);font-weight:500}.row-val{font-family:Geist Mono,monospace;font-size:14px;font-weight:500}.slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:4px;background:var(--line);border-radius:999px;outline:none}.slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;background:var(--accent);cursor:grab;border:3px solid var(--panel);box-shadow:0 0 0 1px var(--line),0 1px 2px #00000026}.slider::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--accent);cursor:grab;border:3px solid var(--panel);box-shadow:0 0 0 1px var(--line)}.toggles{display:grid;grid-template-columns:1fr 1fr;gap:4px 24px}.toggle{display:flex;align-items:center;gap:10px;padding:7px 0;cursor:pointer;-webkit-user-select:none;user-select:none}.checkbox{width:18px;height:18px;border-radius:5px;border:1.5px solid var(--line);background:var(--panel);display:grid;place-items:center;transition:background .1s,border-color .1s;flex-shrink:0}.toggle:hover .checkbox{border-color:var(--text-3)}.checkbox svg{width:11px;height:11px;color:var(--on-accent);opacity:0;transition:opacity .1s}.toggle.on .checkbox{background:var(--accent);border-color:var(--accent)}.toggle.on .checkbox svg{opacity:1}.tog-label{font-size:13.5px;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tog-hint{font-size:12px;color:var(--text-3);margin-left:auto;font-family:Geist Mono,monospace}.btn{height:36px;padding:0 14px;border-radius:7px;border:1px solid var(--line);background:var(--panel);color:var(--text);font-size:13.5px;font-weight:500;display:inline-flex;align-items:center;gap:7px;cursor:pointer;transition:background .1s}.btn:hover{background:var(--hover)}.btn:disabled{opacity:.55;cursor:not-allowed}.btn.primary{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}.btn.primary:hover{opacity:.9}.btn.primary:disabled:hover{opacity:.55}.btn svg{width:14px;height:14px}.btn.copy.copied{color:var(--good)}.history{margin-top:26px}.history-head{font-size:11px;font-weight:500;color:var(--text-3);text-transform:uppercase;letter-spacing:.08em;padding:12px 4px 8px}.h-row{display:flex;align-items:center;gap:12px;padding:10px 12px;border-bottom:1px solid var(--line-2);font-family:Geist Mono,monospace;font-size:12.5px;color:var(--text-2);cursor:pointer}.h-row:hover{background:var(--hover)}.h-time{color:var(--text-3);flex-shrink:0;min-width:70px}.h-text{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mock-panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-lg);padding:0;box-shadow:var(--shadow);overflow:hidden}.mock-grid-2{display:grid;grid-template-columns:1fr 1fr}.mock-pane{padding:16px 18px}.mock-pane+.mock-pane{border-left:1px solid var(--line)}.mock-pane-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;font-size:12px;color:var(--text-3);text-transform:uppercase;letter-spacing:.06em;font-weight:500}.mock-pane-body{font-family:Geist Mono,monospace;font-size:13px;color:var(--text);white-space:pre-wrap;line-height:1.55;min-height:220px}.mock-pane-body .k{color:#2563eb}.mock-pane-body .s{color:#c026d3}.mock-pane-body .n{color:#16a34a}:root.dark .mock-pane-body .k{color:#60a5fa}:root.dark .mock-pane-body .s{color:#e879f9}:root.dark .mock-pane-body .n{color:#4ade80}.pill{display:inline-flex;align-items:center;gap:5px;padding:3px 8px;border-radius:999px;border:1px solid var(--line);background:var(--panel-2);font-size:11.5px;color:var(--text-2);cursor:pointer;font-weight:500}.pill.on{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}.pill-row{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px}.unit-grid{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.unit-row{display:grid;grid-template-columns:1fr 110px;background:var(--panel);align-items:center}.unit-row input{border:0;background:transparent;padding:14px 18px;font-family:Geist Mono,monospace;font-size:18px;color:var(--text);outline:none;width:100%}.unit-row .unit-tag{text-align:right;padding:14px 18px;color:var(--text-2);font-size:13px;border-left:1px solid var(--line-2)}.unit-row.focus{background:var(--panel-2)}.dropzone{border:1.5px dashed var(--line);border-radius:var(--radius-lg);padding:32px;text-align:center;background:var(--panel-2);color:var(--text-2);cursor:pointer;transition:border-color .15s,background .15s}.dropzone:hover{border-color:var(--text-3)}.dropzone.drag{border-color:var(--accent);background:var(--hover)}.dropzone .dz-icon{width:36px;height:36px;margin:0 auto 10px;color:var(--text-3)}.dropzone strong{color:var(--text);font-weight:500}.dropzone-hint{font-size:12.5px;color:var(--text-3);margin-top:4px}.dropzone-file{display:inline-flex;align-items:center;gap:8px;margin-top:14px;padding:8px 12px;border-radius:7px;border:1px solid var(--line);background:var(--panel);font-size:12.5px;color:var(--text);font-family:Geist Mono,monospace}.select{-moz-appearance:none;appearance:none;-webkit-appearance:none;width:100%;height:40px;padding:0 36px 0 14px;border-radius:8px;border:1px solid var(--line);background:var(--panel) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6' fill='none' stroke='%23a3a3a3' stroke-width='1.5'><path d='M1 1l4 4 4-4'/></svg>") no-repeat right 14px center;color:var(--text);font-size:13.5px;cursor:pointer}.select:focus{outline:none;border-color:var(--text-3)}.form-group{display:grid;gap:8px;margin-top:14px}.form-label{font-size:12.5px;color:var(--text-2);font-weight:500}.form-actions{display:flex;gap:10px;align-items:center;margin-top:16px}.status{margin-top:14px;padding:12px 14px;border-radius:8px;background:var(--panel-2);border:1px solid var(--line);font-size:13px;color:var(--text-2)}.status.success{color:var(--good)}.status.error{color:var(--bad)}.base-list{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.base-row{display:grid;grid-template-columns:100px 1fr;background:var(--panel);align-items:center}.base-row .base-name{padding:12px 16px;color:var(--text-3);font-size:12px;text-transform:uppercase;letter-spacing:.06em;border-right:1px solid var(--line-2)}.base-row .base-val{padding:12px 16px;font-family:Geist Mono,monospace;font-size:15px;color:var(--text);overflow:hidden;text-overflow:ellipsis}.base-row.input .base-val{color:var(--text-3)}.base-row.input .base-val input{width:100%;background:transparent;border:0;outline:none;font:inherit;color:var(--text)}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%) translateY(20px);background:var(--accent);color:var(--on-accent);padding:10px 16px;border-radius:8px;font-size:13px;font-weight:500;box-shadow:var(--shadow-lg);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:100}.toast.show{opacity:1;transform:translate(-50%) translateY(0)}.case-input{width:100%;min-height:110px;padding:16px 18px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-lg);color:var(--text);font-family:Geist Mono,monospace;font-size:14px;line-height:1.55;outline:none;box-shadow:var(--shadow)}.case-input:focus{border-color:var(--text-3)}.case-results{display:grid;gap:8px;margin-top:16px}.case-result{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:12px 16px;display:grid;grid-template-columns:130px 1fr auto;align-items:center;gap:14px;box-shadow:var(--shadow)}.case-result .case-name{color:var(--text-3);font-size:12px;text-transform:uppercase;letter-spacing:.06em;font-weight:500}.case-result .case-val{font-family:Geist Mono,monospace;font-size:13.5px;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.case-result .case-copy{width:28px;height:28px;display:grid;place-items:center;border-radius:6px;border:0;background:transparent;color:var(--text-3);cursor:pointer}.case-result .case-copy:hover{background:var(--hover);color:var(--text)}.case-result .case-copy.copied{color:var(--good)}.counter-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-top:16px}.counter-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px;box-shadow:var(--shadow)}.counter-card .num{font-size:28px;font-weight:600;letter-spacing:-.02em;line-height:1;font-family:Geist Mono,monospace}.counter-card .lbl{color:var(--text-3);font-size:12px;margin-top:6px;text-transform:uppercase;letter-spacing:.06em;font-weight:500}@media (max-width: 720px){.app{grid-template-columns:1fr}.side{display:none}.main{padding:24px 18px 80px}}.home-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px}.home-card{display:flex;gap:12px;align-items:flex-start;padding:14px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);color:inherit;transition:background .1s,border-color .1s}.home-card:hover{background:var(--hover);border-color:var(--text-3)}.home-card-icon{width:32px;height:32px;display:grid;place-items:center;border-radius:6px;background:var(--panel-2);color:var(--text-2);flex-shrink:0}.home-card-title{font-size:13.5px;font-weight:500;color:var(--text)}.home-card-desc{font-size:12px;color:var(--text-3);margin-top:4px;line-height:1.45}.faq{margin-top:40px}.faq-h{font-size:18px;font-weight:600;margin:0 0 14px;letter-spacing:-.01em}.faq-list{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.faq-item+.faq-item{border-top:1px solid var(--line)}.faq-q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border:0;background:var(--panel);color:var(--text);font-size:14px;font-weight:500;text-align:left;cursor:pointer}.faq-q:hover{background:var(--hover)}.faq-item.open .faq-q{background:var(--panel-2)}.faq-toggle{width:22px;height:22px;display:grid;place-items:center;color:var(--text-3);font-size:18px;font-weight:400;flex-shrink:0}.faq-a{padding:0 16px 16px;font-size:13.5px;color:var(--text-2);line-height:1.55}.crumb a:hover{color:var(--text-2)}
