/* CSS taken from default main.css and non-tailwind css */

/* Windmill theme for default SB++ button used in pop-up */

.btn, .btnhvr {

    padding-top: 0.5rem;
    padding-bottom: 0.5rem; 
    padding-left: 1rem;
    padding-right: 1rem; 
    border-radius: 0.5rem; 
    border-width: 1px; 
    border-color: transparent; 
    width: 100%; 
    font-size: 0.875rem;
    line-height: 1.25rem; 
    font-weight: 500; 
    line-height: 1.25rem; 
    /* color: #ffffff; */
}

/** ======= Context Menu Styles ======= **/
/** Used on server page right click menu **/

div.contextmenu {
    position: absolute;
    top: 0;
    left: 0;
    background-color: #eaeaea;
    border: 1px solid #dddddd;
    border-left: 5px solid #dddddd;
}
div.contextmenu a {
    display: block;
    text-decoration: none;
    cursor: default;
    outline: none;
    font-size: 11px;
}
div.contextmenu .separator {
    height: 1px;
    padding: 0;
    overflow: hidden;
}

.contextmenu {
    width: 12em;
    /*background: #F4F5EB;*/
    border-top: 1px solid #ddd;
    /*border-left: 1px solid #ddd;*/
    border-right: 1px solid #666;
    border-bottom: 1px solid #666;
    padding: 2px 0;
}
.contextmenu a {
    color: #555;
    padding: 4px 15px;
    margin: 0 2px;
}
.contextmenu a:hover {
    background-color: #F4F5EB;
}
.contextmenu a.disabled {
    color: #bbb;
}
.contextmenu a.disabled:hover {
    background: #F4F5EB;
    color: #bbb;
}
.contextmenu .separator {
    border-bottom: 1px solid #fff;
    background: #999;
    margin: 4px 4px;
}
.contextmenu .head {
    font-size: 12px;
    background-color: #DFE3E9;
    padding-top: 4px;
    padding-right: 5px;
    padding-bottom: 3px;
    padding-left: 5px;
    color: #555;
}

/** ==== misc CSS may not be needed **/
/*
.select {
    background: #fff;
    font-size: 13px;
    padding: 5px 8px;
    border: 1px solid #ccc;
    border-radius: 3px;
}

.textbox {
    background: #fff;
    font-size: 13px;
    padding: 6px 12px;
    border: 1px solid #ccc;
    border-radius: 3px;
}

.file {
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 3px;
    padding: 3px;
}

.user {
    color: #eee;
    float: right;
    margin-top: 18px;
    margin-right: 10px;
}

.user a:visited, .user a:link, .user a:hover {
    color: #bd754b;
}

.front-module-header {
    margin-bottom: 3px;
    font-size: 12px;
    font-weight: 600;
}

hr {
    border: 1px solid #ddd;
}


/** ==== Admin Parent Tabs  ====**/ 

#admin-page-menu > a {
    display: block;
}

.tabcontent {
    display: none;
}

.tabcontent:first-of-type {
    display: block;
}

/* Scroll bar */
body {
    scrollbar-color: #4b5563 #1f2937;
  }
/* Stop content moving when there is scrollbar
main {
    scrollbar-gutter: stable;
}

/** ==================== Admin Child Tabs ==================== **/
/** Credit: https://codepen.io/ekscentrysytet/pen/QbNdEB **/
  .tabinator input {
    display: none;
  }
  .tabinator label {
    box-sizing: border-box;
    display: inline-block;
    padding: 15px 25px;
    color: #ccc;
    margin-bottom: -1px;
    margin-left: -1px;
  }

  .tabinator label:hover {
    color: #888;
    cursor: pointer;
  }
  .tabinator input:checked + label {
    position: relative;
    color: #fff;
    background: #7C3AED;
    border: 1px solid #1a1c23;
    border-bottom: 1px solid #7C3AED;
    border-radius: 5px 5px 0 0;
  }
  .tabinator input:checked + label:after {
    display: block;
    content: '';
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0;
  }




/** ================ Admin Sub Tabs ================ **/
/** === Used on Ban/comm current & archive pages === **/


#tabs {
    float: left;
    width: 100%;
    margin-left: 0;
}

#tabs ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

#tabs ul li {
    float: left;
}

#tabs ul li a {
    border: 0;
    display: block;
    padding: 0 16px;
    text-align: center;
    font-size: 11px;
    font-weight: bolder;
    line-height: 50px;
    text-decoration: none;
    text-transform: uppercase;
    color: grey;
}

/*
#tabs ul li.active {
}
*/
#tabs ul li.active a {
    /* padding: 0.1em 0.6em; */
    padding: 0 16px;
    color: #7C3AED;
}
/* HexaMods Control Center v1 design layer */
:root { --hm-bg:#0B0F14; --hm-surface:#111821; --hm-surface-2:#161E29; --hm-border:#263241; --hm-cyan:#00B8D9; --hm-purple:#7C5CFC; --hm-text:#E8EEF5; --hm-muted:#8C9AAA; --hm-success:#27C281; --hm-warning:#F2B84B; --hm-danger:#EF6475; }
html, body { background:var(--hm-bg); color:var(--hm-text); }
body { font-family:Inter,ui-sans-serif,system-ui,sans-serif; }
aside, header, .bg-white, .dark\:bg-gray-800 { background-color:var(--hm-surface) !important; }
main { background:var(--hm-bg); }
table, td, th { border-color:var(--hm-border) !important; }
th { color:var(--hm-muted) !important; letter-spacing:.08em; }
a { color:var(--hm-cyan); } a:hover { color:#67E8F9; }
input, select, textarea { background:var(--hm-surface-2) !important; color:var(--hm-text) !important; border-color:var(--hm-border) !important; }
input:focus, select:focus, textarea:focus, button:focus, a:focus { outline:2px solid var(--hm-cyan); outline-offset:2px; }
button, .btn, .btnhvr { background:var(--hm-cyan); color:#061016; border:1px solid transparent; }
button:hover, .btn:hover, .btnhvr:hover { background:#67E8F9; }
.windmill-title-bar { color:var(--hm-text) !important; background:linear-gradient(135deg,var(--hm-surface-2),var(--hm-surface)) !important; border:1px solid var(--hm-border); box-shadow:0 12px 30px rgba(0,0,0,.22); }
.windmill-button { background:var(--hm-cyan) !important; color:#061016 !important; }
.hm-brand-mark { display:inline-flex; align-items:center; justify-content:center; width:30px; height:30px; margin-right:10px; border:1px solid var(--hm-cyan); border-radius:8px; color:var(--hm-cyan); font-weight:800; }
.hm-brand-mark + span { display:inline-flex; flex-direction:column; line-height:1.05; }
.hm-brand-mark + span strong { color:var(--hm-text); letter-spacing:.12em; font-size:.9rem; }
.hm-brand-mark + span small { color:var(--hm-cyan); letter-spacing:.18em; font-size:.55rem; margin-top:4px; }
.hm-footer-brand { color:var(--hm-cyan); letter-spacing:.12em; } .hm-footer-muted { color:var(--hm-muted); }
.hm-status, .hm-badge { display:inline-flex; align-items:center; gap:.35rem; padding:.2rem .55rem; border:1px solid currentColor; border-radius:999px; font-size:.68rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.hm-status-online, .hm-badge-active { color:var(--hm-success); } .hm-status-offline, .hm-badge-removed { color:var(--hm-danger); }
.hm-status-unknown, .hm-badge-expired { color:var(--hm-warning); } .hm-badge-permanent { color:var(--hm-purple); }
.contextmenu { background:var(--hm-surface) !important; border-color:var(--hm-border) !important; } .contextmenu a { color:var(--hm-text); } .contextmenu a:hover { background:var(--hm-surface-2); }
.tabinator input:checked + label { background:var(--hm-purple); border-color:var(--hm-border); }
@media (max-width:767px) { main > .container { padding-left:1rem; padding-right:1rem; } .hm-footer-brand,.hm-footer-muted { display:block; margin-bottom:.35rem; } table { min-width:640px; } .overflow-x-auto { -webkit-overflow-scrolling:touch; } }

/* PASS 1 component layer: dashboard, bans and ban detail */
.hm-section-title { color:var(--hm-text) !important; letter-spacing:.02em; }
.hm-card, .hm-stat { border:1px solid var(--hm-border); box-shadow:0 14px 30px rgba(0,0,0,.18); }
.hm-dashboard-stats .hm-stat { min-height:92px; transition:transform .15s ease,border-color .15s ease; }
.hm-dashboard-stats .hm-stat:hover { transform:translateY(-2px); border-color:rgba(0,184,217,.65); }
.hm-stat p:last-child { color:var(--hm-text) !important; font-size:1.35rem; }
.hm-table { border:1px solid var(--hm-border); border-radius:.75rem; overflow:hidden; }
.hm-table thead { background:var(--hm-surface-2) !important; }
.hm-table tbody tr { border-color:var(--hm-border) !important; }
.hm-table tbody tr:hover { background:rgba(0,184,217,.06) !important; }
.hm-server-card, .hm-ban-list { background:var(--hm-surface); }
.hm-server-row { cursor:pointer; }
.hm-server-row td { vertical-align:middle; }
.hm-server-row td[id^="host_"] { color:var(--hm-text); font-weight:600; }
.hm-server-row td[id^="players_"], .hm-server-row td[id^="map_"] { color:var(--hm-muted); }
.hm-server-detail-card { border-color:var(--hm-border) !important; }
.hm-server-detail-card table { border:0; }
.hm-server-detail-card img { border:1px solid var(--hm-border); }
.hm-ban-toolbar { border:1px solid var(--hm-border); }
.hm-ban-table { min-width:760px; }
.hm-ban-table > tbody > tr.hm-ban-row { cursor:pointer; }
.hm-ban-row td { vertical-align:middle; }
.hm-ban-row td:nth-last-child(1) { white-space:nowrap; }
.hm-ban-status { margin-left:.65rem; vertical-align:middle; }
.hm-ban-detail-panel { background:var(--hm-surface-2); border-top:1px solid var(--hm-border); }
.hm-ban-detail { width:100%; border-collapse:separate; border-spacing:0; }
.hm-ban-detail td { padding:.7rem 1rem; border-bottom:1px solid rgba(38,50,65,.7); color:var(--hm-text); vertical-align:top; }
.hm-ban-detail td:first-child { width:190px; color:var(--hm-muted); font-size:.75rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.hm-ban-detail tr:first-child td { color:var(--hm-cyan); font-size:.9rem; letter-spacing:.12em; }
.hm-ban-detail a { overflow-wrap:anywhere; }
.hm-actions { display:flex; flex-wrap:wrap; gap:.45rem; }
.hm-actions ul { display:flex; flex-wrap:wrap; gap:.45rem; margin:0; padding:.75rem; }
.hm-actions li { list-style:none; }
.hm-actions button { width:auto; }
.hm-evidence { border-left:3px solid var(--hm-purple); }
.hm-footer-links { display:inline-flex; flex-wrap:wrap; gap:.75rem; margin-right:1rem; }
.hm-footer-links a { text-decoration:underline; text-underline-offset:2px; }
@media (max-width:767px) {
  .hm-dashboard-stats { gap:.75rem; }
  .hm-dashboard-stats .hm-stat { min-height:76px; }
  .hm-table { border-radius:.5rem; }
  .hm-ban-toolbar { align-items:flex-start; flex-direction:column; gap:.75rem; }
  .hm-ban-table { min-width:720px; }
  .hm-ban-detail td:first-child { width:125px; }
  .hm-server-detail-card { overflow-x:auto; }
  .hm-footer-links { margin:0 0 .5rem; }
}

/* Phase 9B: modern control-center shell */
.hm-sidebar { width:240px !important; background:var(--hm-surface) !important; }
.hm-sidebar-inner { min-height:100%; padding:1.35rem .75rem !important; }
.hm-sidebar .hm-brand-mark { margin-left:.65rem; }
.hm-nav-label { margin:1.8rem .8rem .55rem; color:var(--hm-muted); font-size:.66rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
.hm-nav-list { margin-top:0 !important; }
.hm-nav-item { padding:.22rem 0 !important; }
.hm-nav-link { min-height:2.55rem; padding:.65rem .8rem !important; gap:.7rem; border:1px solid transparent; border-radius:.65rem; color:var(--hm-muted) !important; background:transparent !important; }
.hm-nav-link:hover, .hm-nav-link:focus-visible { color:var(--hm-text) !important; background:rgba(255,255,255,.045) !important; }
.hm-nav-link[aria-current="page"], .hm-nav-link.active { color:var(--hm-text) !important; background:rgba(0,184,217,.12) !important; border-color:rgba(0,184,217,.22); box-shadow:inset 3px 0 0 var(--hm-cyan); }
.hm-nav-link .fa-caret-right { width:1rem; color:var(--hm-cyan); font-size:.7rem; }
.hm-nav-admin-item { padding-left:.55rem !important; border-left:1px solid var(--hm-border); }
.hm-nav-account-item { margin-top:.2rem; }
.hm-logout-form, .hm-logout-form button { width:100%; }
.hm-logout-form button { text-align:left; }
.hm-network-menu > button { display:inline-flex; align-items:center; gap:.45rem; color:var(--hm-muted) !important; }
.hm-network-menu > button:hover { color:var(--hm-text) !important; }
.hm-network-menu ul { background:var(--hm-surface-2) !important; border-color:var(--hm-border) !important; }
.hm-network-menu ul a { color:var(--hm-text) !important; }
.hm-network-menu ul a:hover { background:rgba(0,184,217,.1) !important; }

/* High-contrast action system; legacy utility classes are intentionally overridden only visually. */
.windmill-button, .btn, .ok, .save, .bg-purple-600 { background:var(--hm-cyan) !important; color:#061016 !important; border-color:transparent !important; text-shadow:none !important; }
.windmill-button:hover, .btn:hover, .ok:hover, .save:hover, .bg-purple-600:hover { background:#67e8f9 !important; color:#061016 !important; }
.cancel, .bg-gray-600, .bg-gray-700 { background:var(--hm-surface-2) !important; color:var(--hm-text) !important; border:1px solid var(--hm-border) !important; }
.cancel:hover, .bg-gray-600:hover, .bg-gray-700:hover { background:#202b39 !important; color:#fff !important; }
.hm-network-menu button, .hm-footer a, a { text-underline-offset:2px; }
button:disabled, input:disabled, select:disabled, textarea:disabled { opacity:.62; cursor:not-allowed; }

/* Tables, detail panels, and forms share one quiet elevation scale. */
.hm-table, .hm-card, .hm-form-section, .hm-server-detail-card { border-radius:.7rem !important; }
.hm-table thead th { height:2.9rem; }
.hm-table tbody td { min-height:2.75rem; }
.hm-table tbody tr:nth-child(even) { background:rgba(255,255,255,.025); }
.hm-table tbody tr:hover { background:rgba(0,184,217,.09) !important; }
.hm-ban-detail-panel, .hm-server-detail { background:var(--hm-surface-2) !important; }
.hm-server-detail-card { border:1px solid var(--hm-border) !important; }
.hm-server-card { overflow:visible !important; }
.hm-server-table { overflow:visible; }
.hm-server-detail { height:auto !important; min-height:0; }
.hm-server-detail > td { display:table-cell; vertical-align:top; }
.hm-server-detail-opener { display:block; width:100%; min-height:0; }
.hm-server-detail-card table { table-layout:fixed; }
.hm-server-detail-card table td { vertical-align:top; }
.hm-connect-button { display:inline-flex !important; align-items:center; justify-content:center; gap:.45rem; white-space:nowrap; }
.hm-actions { padding:.85rem; border-left:3px solid var(--hm-cyan); border-radius:.65rem; background:var(--hm-surface-2); }
.hm-actions.ban-edit aside { max-width:none !important; margin:0 !important; padding:0 !important; border:0 !important; background:transparent !important; }
.hm-actions.ban-edit ul { display:flex; flex-wrap:wrap; gap:.55rem; margin:0; padding:0; }
.hm-actions.ban-edit li { padding:0 !important; }
.hm-actions.ban-edit button, .hm-actions.ban-edit button a, .hm-actions.ban-edit button span { display:inline-flex; align-items:center; min-height:2.35rem; color:#061016 !important; font-weight:750; line-height:1.1; text-decoration:none; opacity:1 !important; -webkit-text-fill-color:#061016 !important; }
.hm-actions.ban-edit button { width:auto; padding:.65rem .85rem !important; background:var(--hm-cyan) !important; border:1px solid rgba(255,255,255,.08) !important; border-radius:.55rem; text-shadow:none !important; }
.hm-actions.ban-edit button:hover, .hm-actions.ban-edit button:focus-visible { color:#061016 !important; background:#67e8f9 !important; }
.hm-actions.ban-edit button:disabled { color:#aab7c5 !important; background:#273443 !important; -webkit-text-fill-color:#aab7c5 !important; }
.ban-edit aside { border:0 !important; border-left:3px solid var(--hm-cyan) !important; border-radius:.65rem !important; background:var(--hm-surface-2) !important; }
.ban-edit button { color:#061016 !important; background:var(--hm-cyan) !important; -webkit-text-fill-color:#061016 !important; text-shadow:none !important; }
.ban-edit button:hover, .ban-edit button:focus-visible { color:#061016 !important; background:#67e8f9 !important; }
.hm-ban-detail-panel { border-left:3px solid var(--hm-cyan); border-radius:.65rem; }
.hm-ban-status { color:var(--hm-text); background:var(--hm-surface-2); border-color:var(--hm-border); }
.hm-ban-status::before { background:var(--hm-warning); }
.hm-ban-row td:first-child img, .hm-dashboard-table td:first-child img { width:20px; height:20px; object-fit:contain; vertical-align:middle; }
img[src$="/zz.jpg"] { width:20px; height:20px; object-fit:contain; opacity:.72; }
.hm-ban-row td, .hm-dashboard-table td { overflow-wrap:anywhere; }
.hm-player-column { width:calc(100% - 355px); }
.hm-player-viewport { max-height:520px; overflow-y:auto; overflow-x:hidden; border:1px solid var(--hm-border); border-radius:.55rem; background:var(--hm-surface-2); scrollbar-color:#506276 var(--hm-surface-2); }
.hm-player-viewport > table { width:100%; table-layout:fixed; border:0; }
.hm-player-viewport tr:first-child { position:sticky; top:0; z-index:1; background:var(--hm-surface-2); }
.hm-player-viewport tr:first-child td { color:var(--hm-muted); font-size:.7rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; border-bottom:1px solid var(--hm-border); }
.hm-player-viewport td { padding:.45rem .6rem; color:var(--hm-text); border-bottom:1px solid rgba(38,50,65,.7); }
.hm-player-viewport td:first-child { width:55%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.hm-player-viewport td:not(:first-child) { width:22.5%; white-space:nowrap; }
.hm-map-card { position:relative; width:100%; max-width:340px; overflow:hidden; border:1px solid var(--hm-border); border-radius:.65rem; background:var(--hm-surface-2); }
.hm-map-card img { display:block; width:100%; aspect-ratio:16/9; max-height:220px; object-fit:cover; border:0 !important; padding:0 !important; }
.hm-map-caption { display:flex; flex-direction:column; gap:.15rem; padding:.65rem .75rem; color:var(--hm-text); }
.hm-map-caption strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.hm-map-caption span { color:var(--hm-muted); font-size:.75rem; }
.hm-map-missing img { display:none; }
.hm-map-missing { min-height:154px; display:flex; align-items:center; justify-content:center; background:linear-gradient(145deg,#182332,#101720); }
.hm-map-missing:before { content:'◈'; display:block; color:var(--hm-cyan); font-size:2rem; opacity:.8; }
.hm-map-missing .hm-map-caption { position:absolute; inset:auto 0 0; background:linear-gradient(transparent,rgba(11,15,20,.96)); }
.hm-server-address { display:flex; flex-direction:column; gap:.25rem; margin-top:.75rem; color:var(--hm-muted); font-size:.75rem; }
.hm-server-address code { color:var(--hm-text); font-size:.82rem; }
.hm-server-row td[id^="host_"] { max-width:28rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.hm-server-row td[id^="host_"] i { color:var(--hm-muted); font-weight:400; }

/* Native checkbox replacement: visible in both states and keyboard-friendly. */
input[type="checkbox"].form-checkbox, input[type="checkbox"] {
  appearance:none; -webkit-appearance:none; width:1.1rem; height:1.1rem; min-height:1.1rem; margin:0 .35rem 0 0;
  vertical-align:-.18rem; border:1px solid #617386; border-radius:.28rem; background:var(--hm-surface-2) !important; color:var(--hm-cyan); cursor:pointer;
}
input[type="checkbox"].form-checkbox:hover, input[type="checkbox"]:hover { border-color:var(--hm-cyan); }
input[type="checkbox"].form-checkbox:checked, input[type="checkbox"]:checked {
  border-color:var(--hm-cyan); background-color:var(--hm-cyan) !important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m3 8 3 3 7-7' fill='none' stroke='%23061016' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-position:center; background-repeat:no-repeat; background-size:.8rem .8rem;
}
input[type="checkbox"].form-checkbox:focus-visible, input[type="checkbox"]:focus-visible { outline:2px solid var(--hm-cyan); outline-offset:2px; }
input[type="checkbox"].form-checkbox:disabled, input[type="checkbox"]:disabled { background:#202b39 !important; border-color:#455466; }
label { color:var(--hm-text); font-weight:650; }
input, select, textarea { min-height:2.55rem; border-radius:.55rem !important; }
textarea { min-height:7rem; }

/* Standalone Phase-8 legal pages reuse the same local visual system. */
.hm-legal-shell { background:var(--hm-bg) !important; }
.hm-legal-page { padding:2rem 2.25rem !important; background:var(--hm-surface) !important; border:1px solid var(--hm-border); border-radius:1rem; box-shadow:0 18px 45px rgba(0,0,0,.22); }
.hm-legal-page h1 { margin-bottom:.5rem; color:var(--hm-text) !important; }
.hm-legal-page h2 { padding-top:.7rem; border-top:1px solid var(--hm-border); }
.hm-legal-page p, .hm-legal-page li { color:var(--hm-text); }
.hm-legal-page a { color:var(--hm-cyan); }
@media (max-width:767px) { .hm-sidebar { width:17rem !important; } .hm-legal-page { padding:1.25rem !important; border-radius:.7rem; } }
@media (prefers-reduced-motion:reduce) { .hm-dashboard-stats .hm-stat { transition:none; } .hm-dashboard-stats .hm-stat:hover { transform:none; } }

.hm-masked-id { font-variant-numeric:tabular-nums; letter-spacing:.03em; }
.hm-record-id { display:inline-block; margin-left:.65rem; padding:.18rem .5rem; border:1px solid var(--hm-border); border-radius:999px; color:var(--hm-muted); font-size:.72rem; letter-spacing:.04em; }
.hm-private-reference { color:var(--hm-muted); font-size:.85rem; }

/* HexaMods Control Center — dark-only UI layer */
html.hm-dark, html.hm-dark body { background:var(--hm-bg) !important; color:var(--hm-text) !important; }
html.hm-dark body { font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
.hm-icon { width:1.1rem; height:1.1rem; display:inline-block; flex:0 0 auto; vertical-align:-.18em; color:currentColor; fill:none; }
.hm-icon-lg { width:1.35rem; height:1.35rem; vertical-align:middle; }
aside { border-right:1px solid var(--hm-border); }
aside a { color:var(--hm-muted); }
aside a:hover, aside a:focus { color:var(--hm-text); background:rgba(0,184,217,.08); }
header { border-bottom:1px solid var(--hm-border); }
button { min-height:2.25rem; border-radius:.5rem; font-weight:650; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline:2px solid var(--hm-cyan); outline-offset:3px; }
.hm-stat { background:linear-gradient(145deg,var(--hm-surface-2),var(--hm-surface)) !important; }
.hm-stat > div:first-child { background:rgba(0,184,217,.1) !important; color:var(--hm-cyan) !important; border:1px solid rgba(0,184,217,.22); }
.hm-dashboard-table th, .hm-table th { background:var(--hm-surface-2) !important; color:var(--hm-muted) !important; }
.hm-dashboard-table td, .hm-table td { color:var(--hm-text); }
.hm-dashboard-table tbody tr:hover, .hm-table tbody tr:hover { background:rgba(0,184,217,.07) !important; }
.hm-table-wrap { overflow-x:auto; border:1px solid var(--hm-border); border-radius:.75rem; }
.hm-table-wrap > table { min-width:680px; }
.hm-form-section { background:var(--hm-surface) !important; border:1px solid var(--hm-border); border-radius:.75rem; }
.hm-help { color:var(--hm-muted); font-size:.82rem; }
.hm-button-primary { background:var(--hm-cyan) !important; color:#061016 !important; }
.hm-button-secondary { background:var(--hm-surface-2) !important; color:var(--hm-text) !important; border:1px solid var(--hm-border) !important; }
.hm-button-danger { background:var(--hm-danger) !important; color:#21070b !important; }
.hm-button-warning { background:var(--hm-warning) !important; color:#211500 !important; }
.hm-button-ghost { background:transparent !important; color:var(--hm-cyan) !important; border:1px solid transparent !important; }
.hm-status::before { content:""; width:.42rem; height:.42rem; border-radius:50%; background:currentColor; }
.hm-badge-expired::before, .hm-badge-removed::before { background:transparent; border:1px solid currentColor; }
.hm-legal-page { max-width:58rem; margin:0 auto; }
.hm-legal-page h1 { font-size:clamp(1.7rem,3vw,2.35rem); letter-spacing:-.02em; }
.hm-legal-page h2 { margin-top:2rem; font-size:1.15rem; color:var(--hm-cyan); }
.hm-legal-page table { width:100%; border-collapse:collapse; margin:1rem 0; }
.hm-legal-page th, .hm-legal-page td { padding:.7rem .8rem; border:1px solid var(--hm-border); text-align:left; vertical-align:top; }
.hm-legal-page th { background:var(--hm-surface-2); }
.hm-legal-page .hm-contact { padding:1rem 1.15rem; background:var(--hm-surface-2); border:1px solid var(--hm-border); border-left:3px solid var(--hm-cyan); border-radius:.5rem; }
@media (max-width:767px) { .hm-table-wrap { margin-left:-.25rem; margin-right:-.25rem; border-radius:.5rem; } .hm-legal-page table { font-size:.9rem; } }

/* Final readability pass: keep legacy utility classes legible on the dark surface. */
.hm-dark .text-gray-700 { color:var(--hm-text) !important; }
.hm-dark .text-gray-600, .hm-dark .text-gray-500, .hm-dark .dark\:text-gray-400 { color:var(--hm-muted) !important; }
.hm-dark .bg-gray-50, .hm-dark .bg-white, .hm-dark .dark\:bg-gray-800 { background-color:var(--hm-surface) !important; }
.hm-dark input::placeholder, .hm-dark textarea::placeholder { color:#aab7c5 !important; opacity:1; }
.hm-dark .hm-table th { padding:.8rem 1rem !important; }
.hm-dark .hm-table td { padding:.75rem 1rem !important; }
.hm-dark .hm-table tbody tr:nth-child(even) { background:rgba(255,255,255,.018); }
.hm-dark .hm-table a { color:var(--hm-cyan); }

/* Compact dashboard metrics: the icon supports the metric instead of dominating it. */
.hm-dashboard-stats .hm-stat { min-height:84px; padding:1rem 1.1rem !important; gap:.9rem; }
.hm-dashboard-stats .hm-stat > div:first-child { width:2.35rem; height:2.35rem; padding:0 !important; margin-right:0 !important; border-radius:.65rem; }
.hm-dashboard-stats .hm-stat .hm-icon-lg { width:1.05rem; height:1.05rem; }
.hm-dashboard-stats .hm-stat p:first-child { margin-bottom:.15rem; color:var(--hm-muted) !important; font-size:.76rem; line-height:1.2; }
.hm-dashboard-stats .hm-stat p:last-child { font-size:1.55rem; line-height:1; font-weight:750; }

/* Server detail panel: align live player data and map metadata as one surface. */
.hm-server-detail > td { padding:0 !important; background:var(--hm-surface-2) !important; }
.hm-server-detail-card { margin:0 !important; padding:1rem !important; background:var(--hm-surface) !important; box-shadow:none !important; }
.hm-server-detail-card [id^="playerlist_"] { width:100%; }
.hm-server-detail-card [id^="playerlist_"] td { padding:.45rem .6rem; color:var(--hm-text); border-bottom:1px solid var(--hm-border); }
.hm-server-detail-card [id^="mapimg_"] { width:min(100%,340px); height:auto; max-height:220px; object-fit:cover; padding:0 !important; border-radius:.5rem !important; }
.hm-server-detail-card .text-gray-600, .hm-server-detail-card .text-gray-500 { color:var(--hm-muted) !important; }
.hm-server-detail-card a { color:var(--hm-cyan); }

/* Footer hierarchy and wrapping. */
.hm-footer { align-items:center; background:var(--hm-surface) !important; border:1px solid var(--hm-border); box-shadow:none !important; color:var(--hm-muted) !important; }
.hm-footer > div { min-width:0; }
.hm-footer > div:last-child { text-align:right; }
.hm-footer-meta { display:block; }
.hm-footer-links { align-items:center; justify-content:flex-end; line-height:1.45; }
.hm-footer-links .hm-footer-brand { color:var(--hm-text); letter-spacing:.02em; }
@media (max-width:767px) {
  .hm-dashboard-stats .hm-stat { min-height:76px; }
  .hm-footer { align-items:flex-start; flex-direction:column; gap:.75rem; }
  .hm-footer > div:last-child { width:100%; text-align:left; }
  .hm-footer-links { justify-content:flex-start; margin:0 0 .35rem; }
  .hm-server-detail-card { padding:.75rem !important; }
  .hm-player-column { width:100%; display:block; }
  .hm-player-viewport { max-height:420px; }
  .hm-server-detail-card #sinfo_ > table, .hm-server-detail-card #sinfo_ > table > tbody, .hm-server-detail-card #sinfo_ > table > tbody > tr, .hm-server-detail-card #sinfo_ > table > tbody > tr > td { display:block; width:100% !important; }
  .hm-server-detail-card #sinfo_ > table > tbody > tr > td + td { margin-top:.85rem; padding:0 !important; }
  .hm-map-card { max-width:none; }
  .hm-server-row td[id^="host_"] { max-width:12rem; white-space:normal; overflow-wrap:anywhere; }
}