:root{color-scheme:light dark;--bg: #0b0f14;--panel: #111823;--muted: #93a4b7;--text: #e6edf3;--border: #243244;--accent: #4da3ff;--danger: #ff5c70;--ok: #35c28f;--shadow: 0 10px 30px rgba(0, 0, 0, .35)}@media (prefers-color-scheme: light){:root{--bg: #f7f9fc;--panel: #ffffff;--muted: #5b6b7c;--text: #0b1220;--border: #d7e1ee;--accent: #1f6feb;--danger: #d1242f;--ok: #1a7f37;--shadow: 0 10px 30px rgba(16, 24, 40, .12)}}*{box-sizing:border-box}html,body{height:100%;width:100%}body{margin:0;overflow-x:hidden;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Arial,sans-serif;background:radial-gradient(1200px 800px at 20% 10%,rgba(77,163,255,.12),transparent 60%),radial-gradient(900px 600px at 80% 30%,rgba(53,194,143,.1),transparent 55%),var(--bg);color:var(--text)}.container{max-width:1320px;margin:0 auto;padding:24px}.header{display:flex;gap:16px;align-items:baseline;justify-content:space-between;margin-bottom:16px}.title{font-size:20px;font-weight:700}.subtitle{font-size:12px;color:var(--muted)}.grid{display:grid;grid-template-columns:minmax(300px,360px) minmax(0,1fr);gap:16px}@media (max-width: 980px){.grid{grid-template-columns:1fr}}.panel{position:relative;min-width:0;background:color-mix(in srgb,var(--panel) 92%,transparent);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow);padding:16px}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap;min-width:0}.row+.row{margin-top:10px}label{font-size:12px;color:var(--muted)}input[type=text],input[type=number]{width:100%;background:transparent;border:1px solid var(--border);color:var(--text);border-radius:10px;padding:10px 12px;outline:none}input[type=text]:focus,input[type=number]:focus{border-color:color-mix(in srgb,var(--accent) 70%,var(--border));box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 20%,transparent)}.btn{border:1px solid var(--border);background:color-mix(in srgb,var(--panel) 70%,transparent);color:var(--text);padding:9px 12px;border-radius:10px;cursor:pointer;font-weight:600;font-size:13px}.btn.primary{border-color:color-mix(in srgb,var(--accent) 70%,var(--border));background:color-mix(in srgb,var(--accent) 20%,transparent)}.btn.danger{border-color:color-mix(in srgb,var(--danger) 70%,var(--border));background:color-mix(in srgb,var(--danger) 15%,transparent)}.btn:disabled{opacity:.5;cursor:not-allowed}.drop{border:1px dashed color-mix(in srgb,var(--border) 80%,transparent);border-radius:14px;padding:14px;text-align:center;color:var(--muted);background:color-mix(in srgb,var(--panel) 55%,transparent)}.drop.dragover{border-color:color-mix(in srgb,var(--accent) 70%,var(--border));color:var(--text);background:color-mix(in srgb,var(--accent) 12%,transparent)}.status{font-size:12px;color:var(--muted);line-height:1.4;white-space:pre-wrap}.status.error{color:var(--danger)}.status.ok{color:var(--ok)}.pill{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;border-radius:999px;border:1px solid var(--border);font-size:12px;color:var(--muted)}.columns{max-height:320px;overflow:auto;overflow-x:hidden;border:1px solid var(--border);border-radius:12px;padding:10px}.columns .item{display:flex;gap:8px;align-items:center;padding:6px;border-radius:10px;min-width:0}.columns .item span{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.columns .item:hover{background:color-mix(in srgb,var(--panel) 70%,transparent)}.columns input[type=checkbox]{width:16px;height:16px}.table-wrap{overflow:auto;border:1px solid var(--border);border-radius:14px;max-width:100%}table{width:max-content;min-width:100%;border-collapse:collapse;font-size:12px}thead th{position:sticky;top:0;background:color-mix(in srgb,var(--panel) 90%,transparent);border-bottom:1px solid var(--border);text-align:left;padding:10px;white-space:nowrap;max-width:360px;overflow:hidden;text-overflow:ellipsis}tbody td{border-bottom:1px solid color-mix(in srgb,var(--border) 70%,transparent);padding:8px 10px;vertical-align:top;max-width:360px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.details{border:1px solid var(--border);border-radius:12px;padding:8px 10px;background:color-mix(in srgb,var(--panel) 70%,transparent)}.details summary{cursor:pointer;color:var(--muted);font-size:12px;-webkit-user-select:none;user-select:none}.details .details-body{margin-top:8px;max-height:200px;overflow:auto;font-size:12px;color:var(--text);white-space:pre-wrap}.loading-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;padding:18px;background:color-mix(in srgb,var(--panel) 65%,transparent);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.loading-card{width:min(520px,100%);border:1px solid var(--border);border-radius:14px;background:color-mix(in srgb,var(--panel) 88%,transparent);box-shadow:var(--shadow);padding:14px;display:flex;gap:12px;align-items:center}.spinner{width:28px;height:28px;border-radius:999px;border:3px solid color-mix(in srgb,var(--border) 80%,transparent);border-top-color:color-mix(in srgb,var(--accent) 80%,transparent);animation:spin .9s linear infinite;flex:none}.spinner-sm{width:14px;height:14px;border-radius:999px;border:2px solid color-mix(in srgb,var(--border) 80%,transparent);border-top-color:color-mix(in srgb,var(--accent) 80%,transparent);animation:spin .9s linear infinite;display:inline-block;vertical-align:-2px;margin-right:6px}@keyframes spin{to{transform:rotate(360deg)}}tbody tr:hover{background:color-mix(in srgb,var(--accent) 8%,transparent)}.footerbar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:12px}.muted{color:var(--muted)}
