:root{--primary: #2563eb;--bg: #f8fafc;--panel: #ffffff;--text: #1e293b;--border: #e2e8f0;--gray: #64748b;--slate: #334155;--red: #ef4444;--green: #22c55e}body{font-family:Inter,system-ui,sans-serif;background:var(--bg);color:var(--text);margin:0;display:flex;justify-content:center;min-height:100vh}.app{width:100%;max-width:800px;padding:2rem}.head{margin-bottom:2rem;text-align:center}.tabs{display:flex;gap:1rem;margin-bottom:1.5rem;justify-content:center}.tab{background:none;border:none;padding:.75rem 1.5rem;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:.5rem;border-bottom:2px solid transparent;color:var(--gray);transition:all .2s}.tab:hover{color:var(--primary)}.tab:focus-visible{outline:2px solid var(--primary);outline-offset:-2px;border-radius:4px 4px 0 0}.tab.active{color:var(--primary);border-bottom-color:var(--primary)}.content{background:var(--panel);border-radius:8px;box-shadow:0 4px 6px -1px #0000001a;padding:2rem;min-height:300px}.foot{text-align:center;margin-top:3rem;color:#94a3b8;font-size:.875rem}.drop{border:2px dashed var(--border);border-radius:8px;padding:3rem;text-align:center;cursor:pointer;transition:all .2s;background:#fdfdfd}.drop:hover,.drop.drag{border-color:var(--primary);background:#eff6ff}.drop:focus-visible{outline:2px solid var(--primary);outline-offset:2px;border-style:solid}.desc{color:#94a3b8;margin-top:.5rem;font-size:.875rem}.btn{background:var(--primary);color:#fff;border:none;padding:.75rem 1.5rem;border-radius:6px;font-weight:600;cursor:pointer;transition:background .2s;font-size:1rem;display:flex;align-items:center;justify-content:center;gap:.5rem}.btn:hover{background:#1d4ed8}.btn:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.btn.wide{width:100%}.sec{padding:.5rem 1rem;cursor:pointer;display:flex;align-items:center;gap:.5rem;border:1px solid var(--border);border-radius:4px;background:#fff;transition:background .2s;font-size:.9rem;font-weight:500;color:#334155}.sec:hover{background:#f1f5f9}.sec:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.link{background:none;border:none;color:var(--red);cursor:pointer;font-weight:600;padding:0;font-size:.9rem}.link:hover{text-decoration:underline}.link:focus-visible{outline:2px solid var(--primary);outline-offset:2px;border-radius:2px}.subhead{margin-bottom:1.5rem;border-bottom:1px solid var(--border);padding-bottom:1rem}.subhead>.flex:first-child{margin-bottom:1rem}.modes{display:flex;gap:1rem;background:var(--bg);padding:.5rem;border-radius:6px;margin-bottom:1rem}.subhead>.mt2{margin-top:0;margin-bottom:.5rem}.opts{cursor:pointer;display:flex;gap:.5rem;align-items:center;font-size:.9rem}.opts input[type=radio],.opts input[type=checkbox]{width:1.1em;height:1.1em;cursor:pointer}.opts input[type=radio]:focus-visible,.opts input[type=checkbox]:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.loading{text-align:center;padding:2rem;display:flex;flex-direction:column;align-items:center;gap:.5rem}.error{padding:1rem;background:#fee2e2;color:#ef4444;border-radius:4px;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem;font-size:.9rem}.done{text-align:center;padding:2rem}.card{border:1px solid var(--border);border-radius:8px;padding:1rem;margin-bottom:1rem}.card.info{background:#eff6ff;border-color:#bfdbfe;color:#1e40af}.info-text{color:#1e3a8a}.card.alt{background:#f1f5f9;border:none}.cell{background:#fff;padding:.5rem;border-radius:4px;border:1px solid #dbeafe}.grid{display:grid;grid-template-columns:auto 1fr;gap:.5rem 1rem;font-size:.9rem}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.status-ok{color:var(--green)}.status-err{color:var(--red)}.warn{background:#fff7ed;color:#c2410c;padding:1rem;border-radius:4px}.note{color:#ea580c;font-size:.75rem;margin-left:1.5rem}.tag{color:var(--gray);font-weight:500}.code{background:#1e293b;color:#e2e8f0;padding:1rem;border-radius:6px;overflow-x:auto;font-family:monospace;font-size:.85rem;margin-top:.5rem}.input{padding:.75rem;width:100%;border-radius:6px;border:1px solid var(--border);background:#fff;font-size:.9rem;box-sizing:border-box}.input:focus{outline:2px solid var(--primary);outline-offset:0;border-color:var(--primary)}.input::placeholder{color:#94a3b8}.badge{font-size:.8rem;background:#f1f5f9;padding:.2rem .6rem;border-radius:1rem;color:var(--slate)}.spin{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.mb4{margin-bottom:1rem}.mb2{margin-bottom:.5rem}.mb1{margin-bottom:.25rem}.mt4{margin-top:1rem}.mt2{margin-top:.5rem}.mt1{margin-top:.25rem}.ml1{margin-left:.25rem}.gap2{gap:.5rem}.flex{display:flex;align-items:center}.vcenter{align-items:center}.hcenter{justify-content:center}.between{justify-content:space-between}.w-full{width:100%}.text-sm{font-size:.875rem}.text-xs{font-size:.75rem}.bold{font-weight:700}.mono{font-family:monospace}.break{word-break:break-all}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.bg-white{background:#fff}.bg-slate-50{background:#f8fafc}.bg-green-50{background:#f0fdf4}.bg-red-50{background:#fef2f2}.bg-blue-600{background:var(--primary)}.bg-blue-600:hover{background:#1d4ed8}.text-white{color:#fff}.text-blue-600{color:var(--primary)}.text-green-600{color:var(--green)}.text-red-600{color:var(--red)}.text-gray-500{color:var(--gray)}.text-gray-900,.text-slate-900{color:var(--text)}.text-slate-700{color:var(--slate)}.text-slate-500{color:var(--gray)}.text-center{text-align:center}.text-right{text-align:right}.text-left{text-align:left}.border{border:1px solid var(--border)}.border-t{border-top:1px solid var(--border)}.border-l-2{border-left:2px solid var(--border)}.border-gray-200{border-color:var(--border)}.border-green-200{border-color:#bbf7d0}.border-red-200{border-color:#fecaca}.border-slate-200{border-color:var(--border)}.rounded{border-radius:4px}.rounded-lg{border-radius:8px}.rounded-md{border-radius:6px}.shadow-sm{box-shadow:0 1px 2px #0000000d}.p-2{padding:.5rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-6{padding:1.5rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.pl-2{padding-left:.5rem}.pl-4{padding-left:1rem}.pt-2,.pt2{padding-top:.5rem}.m-0{margin:0}.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mt-2{margin-top:.5rem}.mt-4{margin-top:1rem}.ml-2{margin-left:.5rem}.w-4{width:1rem}.h-4{height:1rem}.w-5{width:1.25rem}.h-5{height:1.25rem}.w-6{width:1.5rem}.h-6{height:1.5rem}.font-semibold{font-weight:600}.font-medium{font-weight:500}.font-bold{font-weight:700}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-end{justify-content:flex-end}.space-y-6>*+*{margin-top:1.5rem}.space-y-4>*+*{margin-top:1rem}.space-y-2>*+*{margin-top:.5rem}.block{display:block}.relative{position:relative}.flex-1{flex:1 1 0%}.grow{flex-grow:1}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.max-h-32{max-height:8rem}.hidden{display:none}