:root{--bg:#0b0b12;--panel:#131324;--muted:#8b8ca3;--text:#e8e9f3;--primary:#7c3aed;--primary-2:#5b21b6;--danger:#dc2626;--ok:#10b981}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.45 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}
.header{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;background:#0f1020;border-bottom:1px solid #22233d}
.logo{width:36px;height:36px;border-radius:12px;background:linear-gradient(135deg,var(--primary),var(--primary-2));display:flex;align-items:center;justify-content:center;font-weight:800}
.title h1{margin:0 0 2px 10px;font-size:20px}.title p{margin:0 0 0 10px;color:var(--muted);font-size:12px}
.actions button,.actions a{margin-left:8px;text-decoration:none;display:inline-block}
.controls{display:flex;gap:10px;padding:14px 18px;background:#131324;border-bottom:1px solid #22233d;flex-wrap:wrap}
.controls input,.controls select{background:#0f1020;border:1px solid #22233d;color:var(--text);padding:8px 10px;border-radius:10px;outline:none;min-width:0}
.btn-primary{background:var(--ok);color:#fff;border:0;padding:8px 12px;border-radius:10px;cursor:pointer}
.btn-secondary{background:#374151;color:#fff;border:0;padding:8px 12px;border-radius:10px;cursor:pointer}
.btn-danger{background:var(--danger);color:#fff;border:0;padding:8px 12px;border-radius:10px;cursor:pointer}
#domainTable{width:100%;border-collapse:collapse;margin:10px 18px;table-layout:fixed}
#domainTable th,#domainTable td{box-sizing:border-box;padding:12px 12px;height:44px;line-height:22px;border-bottom:1px solid #22233d;vertical-align:middle}
#domainTable thead th{color:#c7c8e3;background:#2d1b69;font-weight:600;letter-spacing:.02em;position:sticky;top:62px;z-index:1}
#domainTable col.col-select{width:36px}#domainTable col.col-domain{width:22%}#domainTable col.col-registrar{width:14%}#domainTable col.col-provider{width:16%}#domainTable col.col-tag{width:12%}#domainTable col.col-expiry{width:10%}#domainTable col.col-status{width:16%}#domainTable col.col-notes{width:auto}#domainTable col.col-actions{width:120px}
#domainTable td:nth-child(2),#domainTable td:nth-child(3),#domainTable td:nth-child(4),#domainTable td:nth-child(7),#domainTable td:nth-child(8){white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#domainTable td:nth-child(6),#domainTable td:nth-child(7){text-align:center}
#domainTable thead th:nth-child(6),#domainTable thead th:nth-child(7){text-align:center}
#domainTable thead th:nth-child(9),#domainTable td:nth-child(9){text-align:right;white-space:nowrap;padding-right:16px}
#domainTable td:nth-child(9) .editBtn + .deleteBtn{margin-left:8px}
#domainTable tbody tr:hover{background:#161632}
#domainTable td:nth-child(2) a{color:#a78bfa;text-decoration:none}#domainTable td:nth-child(2) img{width:16px;height:16px;border-radius:4px;vertical-align:middle;margin-right:6px}
.chip{display:inline-flex;align-items:center;padding:2px 8px;border-radius:999px;font-size:12px;font-weight:600;border:1px solid transparent}
.chip-ok{background:rgba(16,185,129,.15);color:#a7f3d0;border-color:rgba(16,185,129,.35)}
.chip-warn{background:rgba(245,158,11,.15);color:#fde68a;border-color:rgba(245,158,11,.35)}
.chip-bad{background:rgba(239,68,68,.18);color:#fecaca;border-color:rgba(239,68,68,.35)}
.meta{font-size:11px;color:#9aa0a6;margin-top:4px}.meta span{color:#bfc4cc;margin-right:6px}
.editBtn,.deleteBtn{border:0;padding:6px 10px;border-radius:8px;cursor:pointer;font-weight:600}
.editBtn{background:#4b5563;color:#fff}.editBtn:hover{background:#6b7280}
.deleteBtn{background:#dc2626;color:#fff}.deleteBtn:hover{background:#ef4444}
.no-data td{color:var(--muted);text-align:center;padding:20px}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center}.modal.hidden{display:none}
.modal-content{background:#121225;border:1px solid #272848;border-radius:16px;padding:16px;width:620px;max-width:calc(100% - 24px)}
.modal-content h2{margin:0 0 6px}.modal-content label{display:block;margin-top:12px;color:#b4b5d6;font-size:12px}
.modal-content input,.modal-content textarea,.modal-content select{width:100%;margin-top:6px;padding:8px 10px;border-radius:10px;border:1px solid #2a2b4a;background:#0f1020;color:#e8e9f3;outline:none}
.modal-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:16px}
.footer{padding:10px 18px;color:var(--muted);font-size:12px}
.modal{position:fixed;inset:0;z-index:1000;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center}
.modal.hidden{display:none}