:root{--hx-yellow: #FFED00;--hx-yellow-hover: #ffd900;--hx-white: #FFFFFF;--hx-off-white: #F2F2F2;--hx-light-grey: #B3B3B3;--hx-grey: #313335;--hx-dark-grey: #212223;--hx-black: #000000;--hx-blue: #4A9FD8;--hx-green: #30B035;--hx-red: #FD655D;--hx-dark-red: #A71D16;--bg: var(--hx-dark-grey);--surface: var(--hx-grey);--surface-2: #2a2c2e;--border: #3d3f42;--text: var(--hx-off-white);--text-muted: var(--hx-light-grey);--accent: var(--hx-yellow);--accent-hover: var(--hx-yellow-hover);--success: var(--hx-green);--danger: var(--hx-red);--info: var(--hx-blue);--radius: 4px;--radius-lg: 6px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px}*,*:before,*:after{box-sizing:border-box}html,body,#root{margin:0;padding:0;min-height:100vh}body{font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:14px;line-height:1.4;color:var(--text);background:var(--bg)}h1,h2,h3{margin:0 0 var(--space-4);letter-spacing:-.01em}h1{font-size:22px;font-weight:700}h2{font-size:18px;font-weight:600}h3{font-size:15px;font-weight:600}a{color:var(--info);text-decoration:none}a:hover{text-decoration:underline}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer;padding:var(--space-2) var(--space-4);border:1px solid var(--accent);background:transparent;color:var(--accent);border-radius:var(--radius);font-weight:600;letter-spacing:.02em;transition:background .12s ease,color .12s ease,border-color .12s ease}button:hover:not(:disabled){background:var(--accent);color:var(--hx-black)}button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}button:disabled{opacity:.4;cursor:not-allowed}button.primary{background:var(--accent);color:var(--hx-black);border-color:var(--accent)}button.primary:hover:not(:disabled){background:var(--accent-hover);border-color:var(--accent-hover)}button.tertiary{border-color:var(--text);color:var(--text)}button.tertiary:hover:not(:disabled){background:transparent;border-color:var(--accent);color:var(--accent)}button.link{border:none;background:transparent;color:var(--accent);padding:var(--space-1) var(--space-2)}button.link:hover:not(:disabled){background:transparent;color:var(--accent-hover);text-decoration:underline}input,select,textarea{padding:var(--space-2) var(--space-3);border:1px solid var(--border);background:var(--bg);color:var(--text);border-radius:var(--radius);width:100%}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent)}input::placeholder{color:var(--text-muted)}input:disabled,select:disabled,textarea:disabled{opacity:.5;cursor:not-allowed}input.invalid,select.invalid,textarea.invalid{border-color:var(--danger)}input.valid,select.valid,textarea.valid{border-color:var(--success)}.form-label{font-weight:600;color:var(--text);margin-bottom:var(--space-1);display:block}.form-helper{font-size:12px;color:var(--text-muted);margin-top:var(--space-1)}.form-helper.error{color:var(--danger)}.pill{display:inline-flex;align-items:center;gap:var(--space-1);padding:2px var(--space-2);border-radius:3px;border:1px solid var(--border);background:var(--surface-2);color:var(--text);font-size:12px;font-weight:600;letter-spacing:.03em;text-transform:uppercase;line-height:1.4}.pill.success{background:#30b03524;border-color:var(--success);color:var(--success)}.pill.warning{background:#ffed0024;border-color:var(--accent);color:var(--accent)}.pill.danger{background:#fd655d24;border-color:var(--danger);color:var(--danger)}.pill.info{background:#4a9fd824;border-color:var(--info);color:var(--info)}.topnav{display:flex;justify-content:space-between;align-items:center;padding:var(--space-3) var(--space-5);border-bottom:1px solid var(--border);background:var(--surface)}.topnav .links{display:flex;gap:var(--space-5)}.topnav .links a{color:var(--text-muted);font-weight:600;letter-spacing:.02em;padding:var(--space-1) 0;border-bottom:2px solid transparent;transition:color .12s ease,border-color .12s ease}.topnav .links a:hover{color:var(--text);text-decoration:none}.topnav .links a.active{color:var(--accent);border-bottom-color:var(--accent)}.topnav .user{display:flex;align-items:center;gap:var(--space-3);color:var(--text-muted)}.content{padding:var(--space-5);max-width:1200px;margin:0 auto}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-5)}.card.no-pad{padding:0;overflow:hidden}.card.empty{text-align:center;padding:var(--space-6) var(--space-5)}.card.empty p{margin:0}.card.empty p+p{margin-top:var(--space-2)}.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-4);gap:var(--space-4)}.page-header h1{margin:0}.header-actions{display:flex;align-items:center;gap:var(--space-3)}.filter-toggle{display:inline-flex;align-items:center;gap:var(--space-2);border-color:var(--border);color:var(--text-muted)}.filter-toggle:hover:not(:disabled){background:transparent;border-color:var(--accent);color:var(--accent)}.filter-toggle.active,.filter-toggle.active:hover:not(:disabled){background:#ffed0024;border-color:var(--accent);color:var(--accent)}.filter-clear{font-size:11px;font-weight:700;line-height:1}.table{width:100%;border-collapse:collapse}.table th,.table td{text-align:left;padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--border);vertical-align:middle}.table th{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted);background:var(--surface-2)}.table tbody tr:last-child td{border-bottom:none}.table tbody tr:hover{background:var(--surface-2)}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px}.muted{color:var(--text-muted)}.table td.actions-cell{text-align:right}.menu-trigger{padding:var(--space-1) var(--space-2);font-size:18px;line-height:1;font-weight:700}.menu{position:fixed;z-index:1100;min-width:160px;display:flex;flex-direction:column;padding:var(--space-1);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 8px 24px #00000073}.menu button{border:none;background:transparent;color:var(--text);text-align:left;padding:var(--space-2) var(--space-3);border-radius:var(--radius);font-size:13px;font-weight:500;letter-spacing:normal}.menu button:hover:not(:disabled){background:var(--surface-2);color:var(--text)}.menu button.danger{color:var(--danger)}.menu button.danger:hover:not(:disabled){background:#fd655d1f;color:var(--danger)}.server-grid,.kit-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(440px,100%),1fr));gap:var(--space-4);align-items:start}.server-card,.kit-card{display:flex;flex-direction:column;gap:var(--space-3);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-4)}.server-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--space-3)}.server-ident{display:flex;align-items:baseline;flex-wrap:wrap;gap:var(--space-2);min-width:0}.server-name{margin:0;word-break:break-word}.server-location{font-size:13px}.server-status{display:flex;flex-direction:column;align-items:flex-end;gap:var(--space-1);flex-shrink:0;text-align:right}.server-lastseen{font-size:12px;white-space:nowrap}.server-metrics{border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}.metric-row{display:grid}.metric-row.cols-2{grid-template-columns:1fr 1fr}.metric-row.cols-3{grid-template-columns:1fr 1fr 1fr;border-top:1px solid var(--border)}.metric-cell{padding:var(--space-2) var(--space-3);min-width:0}.metric-cell+.metric-cell{border-left:1px solid var(--border)}.metric-label{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted);margin-bottom:2px}.metric-value{overflow-wrap:anywhere}.server-card-foot{display:flex;gap:var(--space-2);align-items:stretch}.comments-btn{flex:1;min-width:0}.action-trigger{display:inline-flex;align-items:center;gap:var(--space-1)}.action-trigger .caret{font-size:1.1em;line-height:1}.comment-list{display:flex;flex-direction:column;gap:var(--space-3);max-height:45vh;overflow-y:auto;padding:var(--space-3);border:1px solid var(--border);border-radius:var(--radius)}.comment{padding:var(--space-3);border:1px solid var(--border);border-radius:var(--radius)}.comment-head{display:flex;justify-content:space-between;align-items:baseline;gap:var(--space-4);margin-bottom:var(--space-2)}.comment-author{font-weight:600;color:var(--text);word-break:break-all}.comment-time{font-size:12px;white-space:nowrap;flex-shrink:0}.comment-body{white-space:pre-wrap;word-break:break-word;color:var(--text)}.comment-empty{color:var(--text-muted)}.ts-cell{display:inline-flex;align-items:center;gap:var(--space-2)}.ext-link{display:inline-flex;align-items:center;color:var(--text-muted)}.ext-link:hover{color:var(--accent);text-decoration:none}.pill+.pill{margin-left:var(--space-2)}.kit-name-link{color:var(--text);text-decoration:none}.kit-name-link:hover{color:var(--accent)}.kit-members{display:flex;flex-wrap:wrap;gap:var(--space-2)}.kit-chip{padding:2px var(--space-2);border:1px solid var(--border);border-radius:3px;background:var(--surface-2);font-size:12px;color:var(--text)}.kit-open{flex:1;min-width:0;display:inline-flex;align-items:center;padding:var(--space-2) var(--space-3);border:1px solid var(--text);border-radius:var(--radius);color:var(--text);text-decoration:none;font-size:14px}.kit-open:hover{border-color:var(--accent);color:var(--accent)}.kit-badge{display:inline-flex;align-items:center;gap:4px;padding:2px var(--space-2);border:1px solid var(--info);border-radius:3px;background:#4a9fd824;color:var(--info);font-size:12px;font-weight:600;text-decoration:none}.kit-badge:hover{background:#4a9fd83d}.kit-detail-top{margin-bottom:var(--space-4)}.back-link{display:inline-block;margin-bottom:var(--space-2);color:var(--text-muted);text-decoration:none;font-size:13px}.back-link:hover{color:var(--accent)}.kit-detail-header{margin-bottom:0;align-items:flex-start}.kit-detail-ident h1{margin:0}.kit-detail-location{margin:var(--space-1) 0 0;font-size:14px}.kit-detail-hint{font-size:12px;opacity:.8}.kit-section{margin-top:var(--space-4)}.kit-section h2{margin:0 0 var(--space-3);font-size:16px}.kit-section-head{display:flex;justify-content:space-between;align-items:center;gap:var(--space-3);margin-bottom:var(--space-3)}.kit-section-head h2{margin:0}.kit-member-list{display:flex;flex-direction:column;gap:var(--space-2)}.kit-member{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-3);border:1px solid var(--border);border-radius:var(--radius)}.kit-member-name{font-weight:600}.kit-member-target{margin-left:auto}.kit-thread-hint{margin:0 0 var(--space-3);font-size:13px}.kit-thread{max-height:55vh}.kit-comment{border-left-width:3px}.kit-comment.source-kit{border-left-color:var(--accent)}.kit-comment.source-server{border-left-color:var(--info)}.comment-origin{display:inline-flex;align-items:center;gap:var(--space-2);min-width:0}.origin-badge{padding:1px var(--space-2);border-radius:3px;font-size:11px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;white-space:nowrap;flex-shrink:0}.origin-kit{background:#ffed0029;border:1px solid var(--accent);color:var(--accent)}.origin-server{background:#4a9fd829;border:1px solid var(--info);color:var(--info);text-transform:none}.kit-composer{margin-top:var(--space-3)}.kit-composer-foot{display:flex;justify-content:space-between;align-items:center;gap:var(--space-3);margin-top:var(--space-2)}.kit-manage-hint{margin:0 0 var(--space-3);font-size:13px}.kit-pick-list{display:flex;flex-direction:column;gap:var(--space-1);max-height:50vh;overflow-y:auto}.kit-pick{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-3);border:1px solid var(--border);border-radius:var(--radius);cursor:pointer}.kit-pick:hover{border-color:var(--text-muted)}.kit-pick input{width:auto;margin:0;cursor:pointer}.kit-pick-name{font-weight:600}.kit-pick-target{margin-left:auto}.login{max-width:380px;margin:96px auto;padding:var(--space-6);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg)}.login h1{margin-bottom:var(--space-5)}.login form{display:flex;flex-direction:column;gap:var(--space-3)}.login label{font-weight:600;color:var(--text)}.login button[type=submit]{margin-top:var(--space-3)}.login .error{margin-top:var(--space-3);padding:var(--space-2) var(--space-3);background:#fd655d1f;border:1px solid var(--danger);border-radius:var(--radius);color:var(--danger);font-size:13px}.loading{padding:var(--space-5);color:var(--text-muted)}.modal-backdrop{position:fixed;inset:0;background:#0000008c;display:flex;align-items:center;justify-content:center;padding:var(--space-4);z-index:1000}.modal{position:relative;width:100%;max-width:480px;max-height:80vh;overflow:auto;display:flex;flex-direction:column;gap:var(--space-4)}.modal.modal-wide{max-width:640px}.modal-header{display:flex;justify-content:space-between;align-items:center;gap:var(--space-3)}.modal-header h2{margin:0}.modal-body{display:flex;flex-direction:column;gap:var(--space-3)}.modal-footer{display:flex;justify-content:flex-end;gap:var(--space-2);margin-top:var(--space-2)}.form-row{display:flex;flex-direction:column;gap:var(--space-1);margin-bottom:var(--space-3)}.form-row:last-child{margin-bottom:0}.copyable-token{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius);margin-top:var(--space-2)}.copyable-token code{flex:1;word-break:break-all;white-space:pre-wrap}::selection{background:var(--accent);color:var(--hx-black)}