:root {

    color-scheme:dark;
    --page-bg:#0d1117;
    --card-bg:#161b22;
    --surface-bg:#0f141b;
    --surface-raised:#202731;
    --border-color:#39424e;
    --border-strong:#576273;
    --text-color:#f0f3f6;
    --muted-text:#aab3bf;
    --subtle-text:#818b98;
    --primary:#1f6feb;
    --primary-hover:#388bfd;
    --primary-soft:rgba(47, 129, 247, 0.14);
    --success:#2ea043;
    --success-soft:rgba(46, 160, 67, 0.16);
    --danger:#da3633;
    --danger-soft:rgba(218, 54, 51, 0.15);
    --warning:#d9822b;
    --shadow:0 7px 22px rgba(0, 0, 0, 0.34);
    --overlay:rgba(0, 0, 0, 0.64);
    --icon-primary-filter:brightness(0) saturate(100%) invert(43%) sepia(94%) saturate(3035%) hue-rotate(203deg) brightness(102%) contrast(94%);
    --icon-success-filter:brightness(0) saturate(100%) invert(54%) sepia(60%) saturate(627%) hue-rotate(82deg) brightness(91%) contrast(91%);
    --icon-danger-filter:brightness(0) saturate(100%) invert(36%) sepia(93%) saturate(1351%) hue-rotate(332deg) brightness(94%) contrast(102%);
    --icon-warning-filter:brightness(0) saturate(100%) invert(66%) sepia(59%) saturate(1430%) hue-rotate(344deg) brightness(91%) contrast(88%);

}


:root[data-theme="light"] {

    color-scheme:light;
    --page-bg:#f3f6fa;
    --card-bg:#ffffff;
    --surface-bg:#f7f9fc;
    --surface-raised:#eaf0f6;
    --border-color:#c7d0dc;
    --border-strong:#98a6b8;
    --text-color:#172033;
    --muted-text:#556274;
    --subtle-text:#6f7c8e;
    --primary:#075fc7;
    --primary-hover:#044eaa;
    --primary-soft:rgba(7, 95, 199, 0.1);
    --success:#1f7a35;
    --success-soft:rgba(31, 122, 53, 0.11);
    --danger:#bd2926;
    --danger-soft:rgba(189, 41, 38, 0.1);
    --warning:#a85b0b;
    --shadow:0 7px 22px rgba(35, 52, 73, 0.12);
    --overlay:rgba(22, 30, 42, 0.46);

}


body{

background:var(--page-bg);

color:var(--text-color);

font-family:Arial;

transition:background-color .2s ease, color .2s ease;

}

.server-column { min-width:0; }
.server-state { display:flex; align-items:center; gap:12px; padding:16px; background:var(--primary-soft); border-radius:10px; }
.server-state img { width:36px; height:36px; filter:var(--icon-primary-filter); }
.server-metrics { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:18px 0; }
.server-metrics div { display:flex; flex-direction:column; gap:9px; padding:16px; background:var(--surface-bg); border:1px solid var(--border-color); border-radius:10px; }
.server-metrics span, .server-note { color:var(--muted-text); font-size:13px; line-height:1.5; }
.server-mode-control { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.server-mode-control select { padding:9px; border:1px solid var(--border-color); border-radius:6px; background:var(--surface-bg); color:var(--text-color); }
.server-buttons { display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; }
.server-buttons button { flex:1; }
.server-map-control { margin-top:14px; }
.server-map-control select { max-width:65%; }
.server-disk-metric { grid-column:1 / -1; }
.server-disk-metric progress { width:100%; height:9px; accent-color:var(--primary); }
.server-disk-metric.disk-full progress { accent-color:var(--danger); }
.server-disk-warning { padding:12px; border:1px solid var(--danger); border-radius:8px; color:var(--text-color); background:var(--danger-soft); }
.server-metrics strong { overflow-wrap:anywhere; }
.server-player-list { color:var(--muted-text); font-size:13px; }
.server-player-row { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; padding:12px; margin-bottom:8px; border:1px solid var(--border-color); border-radius:8px; background:var(--surface-bg); }
.server-player-row strong { color:var(--text-color); overflow-wrap:anywhere; }
.player-card { justify-content:flex-start; flex-wrap:nowrap; align-items:flex-start; gap:14px; }
.player-avatar { width:52px; height:52px; flex:0 0 52px; border-radius:10px; object-fit:cover; background:var(--primary-soft); }
.player-avatar[src$="admin.svg"] { padding:8px; box-sizing:border-box; filter:var(--icon-primary-filter); }
.player-content { min-width:0; flex:1; }
.player-id { overflow-wrap:anywhere; margin:6px 0; font-size:12px; }
.player-details { display:flex; flex-wrap:wrap; gap:8px 18px; margin-top:5px; }
.player-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.player-profile-link { display:inline-flex; align-items:center; padding:8px 12px; border:1px solid var(--border-color); border-radius:6px; color:var(--text-color); background:var(--surface-raised); text-decoration:none; font-weight:600; }
.player-profile-link:hover { background:var(--border-color); }
.ban-duration-control { margin-top:14px; }
.ban-duration-control select { padding:10px; border:1px solid var(--border-color); border-radius:6px; background:var(--surface-bg); color:var(--text-color); }
.addon-name-row { display:flex; align-items:center; gap:8px; margin-bottom:10px; }
.addon-name-row h3 { margin:0; overflow-wrap:anywhere; }
.addon-rename { display:flex; align-items:center; padding:4px; background:transparent; flex:0 0 auto; }
.addon-rename img { width:21px; height:21px; filter:var(--icon-primary-filter); }
.addon-rename:hover:not(:disabled) { background:var(--primary-soft); }
.input-popup label { display:flex; flex-direction:column; gap:8px; }
.input-popup input { box-sizing:border-box; width:100%; padding:10px; border:1px solid var(--border-color); border-radius:6px; background:var(--surface-bg); color:var(--text-color); }
.input-error { color:var(--danger); }



.container{

width:90%;

margin:auto;

}



.page-header {

    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;

}


.header-controls {

    display:flex;
    align-items:center;
    gap:18px;

}


.language-control,
.theme-control {

    display:flex;
    align-items:center;
    gap:9px;
    color:var(--muted-text);
    font-size:14px;

}


.language-control select,
.theme-control select {

    padding:7px 30px 7px 10px;
    border:1px solid var(--border-color);
    border-radius:6px;
    background:var(--card-bg);
    color:var(--text-color);
    cursor:pointer;

}


.dashboard-layout {

    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:24px;
    align-items:start;

}


.management-column {

    min-width:0;

}


.card{

background:#1b1b1b;

padding:20px;

margin:20px 0;

border-radius:12px;

box-shadow:0 0 10px #000;

}



button{

background:#2980ff;

color:white;

border:0;

padding:8px 15px;

border-radius:6px;

cursor:pointer;

}



button:hover{

opacity:.8;

}


.addon-list-header {

    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:16px;
    margin-bottom:15px;

}


.addon-list-header h2 {

    margin:0;

}


.addon-sort-controls {

    display:flex;
    align-items:flex-end;
    gap:10px;

}


.addon-sort-controls label {

    display:flex;
    flex-direction:column;
    gap:6px;
    color:#aaa;
    font-size:13px;

}


.addon-sort-controls select {

    min-width:125px;
    padding:7px 30px 7px 10px;
    border:1px solid #3b3b3b;
    border-radius:6px;
    background:#141414;
    color:#eee;
    cursor:pointer;

}


@media (max-width: 650px) {

    .addon-list-header {

        align-items:stretch;
        flex-direction:column;

    }

    .addon-sort-controls {

        align-items:stretch;
        flex-direction:column;

    }

    .addon-sort-controls select {

        width:100%;

    }

}


@media (max-width: 1300px) {

    .dashboard-layout {

        grid-template-columns:minmax(0, 1fr);

    }

}


button:disabled {

    cursor:not-allowed;
    opacity:.6;

}


.native-file-input {

    position:absolute;
    width:1px;
    height:1px;
    overflow:hidden;
    clip:rect(0, 0, 0, 0);
    white-space:nowrap;
    clip-path:inset(50%);

}


.upload-drop-zone {

    box-sizing:border-box;
    width:100%;
    min-height:230px;
    padding:28px;
    border:2px dashed #4b4b4b;
    border-radius:10px;
    background:#151515;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:10px;
    color:#eee;
    cursor:pointer;
    text-align:center;
    transition:border-color .2s ease, background .2s ease, opacity .2s ease;

}


.upload-drop-zone:hover,
.upload-drop-zone.drag-over {

    border-color:#2980ff;
    background:#18202b;

}


.upload-drop-zone-icon {

    width:68px;
    height:68px;
    margin-bottom:4px;

}


.upload-drop-zone strong {

    font-size:21px;

}


.upload-drop-zone-instruction {

    color:#aaa;
    font-size:14px;

}


.upload-drop-zone-link {

    color:#5ca1ff;
    text-decoration:underline;
    text-underline-offset:3px;

}


.native-file-input:focus + .upload-drop-zone {

    outline:2px solid #68a5ff;
    outline-offset:3px;

}


.native-file-input:disabled + .upload-drop-zone {

    border-color:#353535;
    background:#141414;
    cursor:not-allowed;
    opacity:.48;

}


.native-file-input:disabled + .upload-drop-zone:hover {

    border-color:#353535;
    background:#141414;

}


.upload-queue {

    display:none;

}


.upload-queue.has-files {

    display:flex;
    flex-direction:column;
    gap:8px;
    max-height:250px;
    overflow-y:auto;
    margin:16px 0;

}


.upload-controls {

    display:flex;
    gap:10px;
    align-items:center;
    justify-content:center;
    margin-top:16px;

}


.upload-controls button {

    min-width:130px;

}


.secondary-button {

    background:#333;

}


.upload-queue-item {

    display:flex;
    align-items:center;
    gap:12px;
    padding:10px 12px;
    background:#111;
    border:1px solid #333;
    border-radius:8px;

}


.upload-queue-icon {

    width:34px;
    height:34px;
    object-fit:contain;

}


.upload-queue-info {

    display:flex;
    flex:1;
    min-width:0;
    flex-direction:column;
    gap:3px;

}


.upload-queue-info strong {

    overflow-wrap:anywhere;

}


.upload-queue-info span {

    color:#999;
    font-size:13px;

}


.upload-queue-meta {

    display:flex;
    justify-content:space-between;
    gap:12px;

}


.upload-queue-status {

    text-align:right;

}


.file-progress-track {

    width:100%;
    height:6px;
    margin-top:5px;
    overflow:hidden;
    background:#2a2a2a;
    border-radius:999px;

}


.file-progress-fill {

    width:0;
    height:100%;
    background:#2980ff;
    border-radius:inherit;
    transition:width .18s ease, background-color .18s ease;

}


.upload-queue-item.uploaded .file-progress-fill,
.upload-queue-item.replaced .file-progress-fill {

    background:#38a75a;

}


.upload-queue-item.skipped .file-progress-fill {

    background:#777;

}


.upload-queue-item.failed .file-progress-fill {

    background:#d9534f;

}


.upload-queue-remove {

    flex:0 0 auto;
    width:28px;
    height:28px;
    padding:3px;
    background:transparent;

}


.upload-queue-remove img {

    width:100%;
    height:100%;

}




.status-icon {
    width: 48px;
    height: 48px;
    object-fit: contain;
    display: inline-block;
    vertical-align: middle;
    margin-right: 8px;
}



/* addon list item */

.addon-card{

    background:#1b1b1b;

    margin:15px 0;

    padding:15px;

    border-radius:12px;

    display:flex;

    justify-content:space-between;

    align-items:center;

    box-shadow:0 0 10px #000;

}



/* left information area */

.addon-left{

    display:flex;

    align-items:center;

    gap:20px;

}



.addon-icon{

    width:90px;

    height:90px;

    object-fit:contain;

}



.addon-info h3{

    margin:0 0 10px 0;

}



.addon-info p{

    margin:5px 0;

}



/* right control area */

.addon-right{

    display:flex;

    flex-direction:column;

    align-items:center;

    gap:12px;

    min-width:120px;

}



.addon-status{

    display:flex;

    align-items:center;

    gap:8px;

}



.status-icon{

    width:42px;

    height:42px;

    object-fit:contain;

}



/* buttons vertical */

.addon-actions{

    display:flex;

    flex-direction:column;

    gap:8px;

    width:100%;

}



.addon-actions button{

    width:100%;

}



/* Toast Notification */


.toast {

    width: 340px;

    min-height: 70px;


    background: var(--card-bg, #1b1b1b);

    color: var(--text-color, #ffffff);


    border-radius: 12px;


    box-shadow:
        0 8px 25px rgba(0,0,0,0.35);


    z-index: 9999;


    overflow: hidden;


    display: flex;

    flex-direction: column;


    animation:
        toastShow 0.25s ease;

}




.toast-content {

    display:flex;

    align-items:center;

    gap:12px;


    padding:15px;

}




.toast-icon {

    width:28px;

    height:28px;

}




.toast-message {

    flex:1;

    font-size:15px;

}




.toast-close {

    cursor:pointer;

    font-size:18px;

    opacity:0.7;

}



.toast-close:hover {

    opacity:1;

}




/* bottom countdown line */

.toast-progress {

    height:4px;

    width:100%;

    background:#2f80ff;


    animation:
        toastCountdown 3s linear forwards;

}




@keyframes toastCountdown {


    from {

        width:100%;

    }


    to {

        width:0%;

    }

}




@keyframes toastShow {


    from {

        opacity:0;

        transform:translateY(-15px);

    }


    to {

        opacity:1;

        transform:translateY(0);

    }

}



@keyframes toastHide {

    from {
        opacity: 1;
        transform: translateY(0);
    }

    to {
        opacity: 0;
        transform: translateY(-15px);
    }

}


/* Toast container */

#toast-container {

    position: fixed;

    top: 20px;

    right: 20px;

    z-index: 9999;

    display: flex;

    flex-direction: column;

    gap: 12px;

}



/* Confirm popup overlay */

.confirm-overlay {
    position: fixed;
    inset: 0;

    background: rgba(0,0,0,0.55);

    display: flex;
    justify-content: center;
    align-items: center;

    z-index: 9999;

    animation: confirmFadeIn 0.25s ease;
}


/* Popup box */

.confirm-popup {

    width:420px;
    max-width:90%;

    background:#1b1b1b;

    border-radius:12px;

    padding:24px;

    box-shadow:0 0 10px #000;

    position:relative;

}


/* Header */

.confirm-header {

    display:flex;

    align-items:center;

    text-align:left;

    gap: 12px;

}


/* Buttons area */

.confirm-actions {

    display:flex;

    justify-content:flex-end;

    gap:12px;

}


/* Delete button */

.confirm-delete {

    background:#d9534f;

    color:white;

}


/* Cancel button */

.confirm-cancel {

    background:#333;

}


/* structured activity log */

.log-list {

    display:flex;
    flex-direction:column;
    gap:10px;

}


.log-entry {

    display:flex;
    align-items:flex-start;
    gap:14px;
    padding:14px;
    border:1px solid #303030;
    border-radius:10px;
    background:#151515;

}


.log-entry-icon {

    width:42px;
    height:42px;
    flex:0 0 42px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:9px;
    background:#202020;

}


.log-entry-icon img {

    width:25px;
    height:25px;
    object-fit:contain;

}


.log-entry-content {

    min-width:0;
    flex:1;

}


.log-entry-heading {

    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;

}


.log-entry-heading strong {

    font-size:15px;

}


.log-type-badge {

    padding:3px 7px;
    border:1px solid #3b3b3b;
    border-radius:999px;
    color:#aaa;
    font-size:11px;
    line-height:1;
    text-transform:uppercase;

}


.log-description {

    margin:5px 0 10px;
    color:#bcbcbc;
    font-size:13px;
    line-height:1.4;

}


.log-entry-meta {

    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    color:#808080;
    font-size:12px;

}


.log-file {

    min-width:0;
    overflow:hidden;
    color:#d8d8d8;
    font-weight:600;
    text-overflow:ellipsis;
    white-space:nowrap;

}


.log-entry--success .log-entry-icon,
.log-entry--enabled .log-entry-icon {

    background:rgba(46, 160, 67, 0.14);

}


.log-entry--replaced .log-entry-icon {

    background:rgba(41, 128, 255, 0.14);

}


.log-entry--disabled .log-entry-icon,
.log-entry--deleted .log-entry-icon,
.log-entry--error .log-entry-icon {

    background:rgba(210, 65, 65, 0.14);

}


.log-pagination {

    display:grid;
    grid-template-columns:minmax(90px, auto) 1fr minmax(90px, auto);
    align-items:center;
    gap:12px;
    margin-top:16px;

}


.log-pagination button:disabled {

    cursor:not-allowed;
    opacity:.35;

}


.log-page-summary {

    display:flex;
    flex-direction:column;
    align-items:center;
    gap:3px;
    color:#ddd;
    font-size:13px;

}


.log-page-summary span {

    color:#777;
    font-size:11px;

}


.log-empty {

    padding:28px 14px;
    border:1px dashed #383838;
    border-radius:10px;
    color:#888;
    text-align:center;

}


@media (max-width: 520px) {

    .log-entry-meta {

        align-items:flex-start;
        flex-direction:column;
        gap:5px;

    }

    .log-pagination {

        grid-template-columns:1fr 1fr;

    }

    .log-page-summary {

        grid-column:1 / -1;
        grid-row:1;

    }

}


.confirm-icon {

    width:48px;
    height:48px;

}


.confirm-message,
.replace-message {

    margin:20px 0;
    color:#d0d0d0;
    line-height:1.5;

}


.confirm-actions.single {

    justify-content:center;

}


.replace-popup {

    width:680px;

}


.replace-comparison {

    display:grid;
    grid-template-columns:minmax(0, 1fr) auto minmax(0, 1fr);
    align-items:stretch;
    gap:14px;
    margin:20px 0 24px;

}


.replace-file {

    min-width:0;
    padding:16px;
    background:#111;
    border:1px solid #333;
    border-radius:10px;

}


.replace-file h3 {

    margin:0 0 14px;
    font-size:16px;

}


.replace-file p {

    display:flex;
    justify-content:space-between;
    gap:16px;
    margin:9px 0;
    font-size:14px;

}


.replace-file span {

    color:#999;

}


.replace-file strong {

    min-width:0;
    overflow-wrap:anywhere;
    text-align:right;

}


.replace-arrow {

    align-self:center;
    color:#777;
    font-size:28px;

}


.confirm-replace {

    background:#d9822b;
    color:white;

}


.confirm-replace:disabled {

    cursor:wait;
    opacity:0.65;

}


.zip-conflict-popup {

    width:680px;
    max-height:82vh;
    display:flex;
    flex-direction:column;

}


.zip-conflict-message {

    color:#c9c9c9;
    line-height:1.5;
    margin:6px 0 16px;

}


.zip-conflict-summary {

    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-bottom:12px;

}


.zip-conflict-summary span {

    padding:7px 10px;
    border:1px solid #383838;
    border-radius:7px;
    background:#111;
    color:#aaa;
    font-size:13px;

}


.zip-conflict-summary strong {

    color:#fff;

}


.zip-conflict-list {

    min-height:64px;
    max-height:300px;
    overflow-y:auto;
    border:1px solid #383838;
    border-radius:8px;
    background:#111;

}


.zip-conflict-row {

    display:block;
    padding:12px;
    border-bottom:1px solid #292929;
    font-size:13px;

}


.zip-conflict-row:last-child {

    border-bottom:0;

}


.zip-conflict-row-header {

    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:16px;
    margin-bottom:10px;

}


.zip-conflict-row.blocking {

    background:rgba(210, 55, 55, 0.12);

}


.zip-conflict-comparison {

    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:10px;

}


.zip-conflict-version {

    padding:10px;
    border:1px solid #303030;
    border-radius:7px;
    background:#171717;

}


.zip-conflict-version h4 {

    margin:0 0 8px;
    color:#fff;
    font-size:13px;

}


.zip-conflict-version p {

    display:flex;
    justify-content:space-between;
    gap:10px;
    margin:5px 0;
    color:#929292;

}


.zip-conflict-version strong {

    min-width:0;
    color:#ddd;
    font-weight:500;
    text-align:right;
    overflow-wrap:anywhere;

}


.zip-conflict-path {

    min-width:0;
    overflow-wrap:anywhere;

}


.zip-conflict-action {

    color:#e1a15f;
    text-transform:capitalize;
    flex-shrink:0;

}


.zip-conflict-row.blocking .zip-conflict-action {

    color:#ef6b6b;

}


.zip-conflict-more {

    padding:10px 12px;
    color:#999;
    font-style:italic;

}


.batch-counts {

    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:8px;
    margin-bottom:16px;

}


.batch-counts span {

    display:flex;
    flex-direction:column;
    gap:4px;
    padding:10px;
    background:#111;
    border:1px solid #333;
    border-radius:8px;
    color:#aaa;
    text-align:center;
    font-size:12px;

}


.batch-counts strong {

    color:#fff;
    font-size:20px;

}


.batch-result-list {

    max-height:240px;
    overflow-y:auto;
    border:1px solid #333;
    border-radius:8px;

}


.batch-result-row {

    display:flex;
    justify-content:space-between;
    gap:16px;
    padding:10px 12px;
    border-bottom:1px solid #2a2a2a;

}


.batch-result-row:last-child {

    border-bottom:0;

}


.batch-result-row span {

    min-width:0;
    overflow-wrap:anywhere;

}


.batch-result-row.uploaded strong,
.batch-result-row.replaced strong {

    color:#69c779;

}


.batch-result-row.skipped strong {

    color:#aaa;

}


.batch-result-row.failed strong {

    color:#ef6b6b;

}


@media (max-width: 640px) {

    .page-header {

        align-items:flex-start;
        flex-direction:column;
        gap:0;

    }

    .upload-drop-zone {

        min-height:180px;
        padding:22px 16px;

    }

    .upload-controls button {

        flex:1;
        min-width:0;

    }

    .replace-comparison {

        grid-template-columns:1fr;

    }

    .replace-arrow {

        transform:rotate(90deg);
        justify-self:center;

    }

    .batch-counts {

        grid-template-columns:repeat(2, minmax(0, 1fr));

    }

    .zip-conflict-comparison {

        grid-template-columns:1fr;

    }

}



@keyframes confirmFadeIn {

    from {

        opacity:0;

    }

    to {

        opacity:1;

    }

}



.confirm-warning-icon {

    width:48px;
    height:48px;

}



.confirm-close {

    position:absolute;

    top:12px;

    right:12px;

    background:none;

    border:none;

    padding:0;

    width:24px;

    height:24px;

    display:flex;

    align-items:center;

    justify-content:center;

    cursor:pointer;

}


.confirm-close img {

    width:24px;

    height:24px;

}


.confirm-close:hover img {

    filter:brightness(3.0);

}



.confirm-overlay.closing {

    animation: confirmFadeOut 0.3s forwards;

}


@keyframes confirmFadeOut {

    from {

        opacity:1;

    }

    to {

        opacity:0;

    }

}


/* theme surfaces and high-contrast icon treatment */

.card,
.addon-card,
.confirm-popup,
.toast {

    background:var(--card-bg);
    color:var(--text-color);
    box-shadow:var(--shadow);

}


button {

    background:var(--primary);
    color:#fff;
    font-weight:600;

}


button:hover:not(:disabled) {

    background:var(--primary-hover);
    opacity:1;

}


button:focus-visible,
select:focus-visible,
.upload-drop-zone:focus-visible {

    outline:3px solid var(--primary-hover);
    outline-offset:2px;

}


.secondary-button,
.confirm-cancel {

    background:var(--surface-raised);
    color:var(--text-color);
    border:1px solid var(--border-color);

}


.secondary-button:hover:not(:disabled),
.confirm-cancel:hover:not(:disabled) {

    background:var(--border-color);

}


.language-control select,
.theme-control select,
.addon-sort-controls select {

    border-color:var(--border-color);
    background:var(--surface-bg);
    color:var(--text-color);

}


.language-control,
.theme-control,
.addon-sort-controls label,
.upload-drop-zone-instruction,
.upload-queue-info span,
.replace-file span,
.zip-conflict-message,
.zip-conflict-summary span,
.batch-counts span {

    color:var(--muted-text);

}


.upload-drop-zone {

    border-color:var(--border-strong);
    background:var(--surface-bg);
    color:var(--text-color);

}


.upload-drop-zone:hover,
.upload-drop-zone.drag-over {

    border-color:var(--primary);
    background:var(--primary-soft);

}


.native-file-input:disabled + .upload-drop-zone,
.native-file-input:disabled + .upload-drop-zone:hover {

    border-color:var(--border-color);
    background:var(--surface-bg);

}


.upload-queue-item,
.replace-file,
.zip-conflict-summary span,
.zip-conflict-list,
.zip-conflict-version,
.batch-counts span,
.batch-result-list,
.log-entry {

    border-color:var(--border-color);
    background:var(--surface-bg);
    color:var(--text-color);

}


.file-progress-track,
.log-entry-icon {

    background:var(--surface-raised);

}


.file-progress-fill,
.toast-progress {

    background:var(--primary);

}


.log-type-badge {

    border-color:var(--border-color);
    color:var(--muted-text);

}


.log-description,
.confirm-message,
.replace-message,
.zip-conflict-version strong,
.log-page-summary {

    color:var(--muted-text);

}


.log-entry-meta,
.log-page-summary span,
.log-empty,
.replace-arrow,
.zip-conflict-version p,
.zip-conflict-more {

    color:var(--subtle-text);

}


.log-file,
.zip-conflict-summary strong,
.zip-conflict-version h4,
.batch-counts strong {

    color:var(--text-color);

}


.log-empty {

    border-color:var(--border-color);

}


.confirm-overlay {

    background:var(--overlay);

}


.confirm-delete {

    background:var(--danger);

}


.confirm-replace {

    background:var(--warning);

}


.zip-conflict-row,
.batch-result-row {

    border-bottom-color:var(--border-color);

}


.zip-conflict-row.blocking {

    background:var(--danger-soft);

}


.upload-drop-zone-icon,
.addon-icon,
.upload-queue-icon,
.log-entry--replaced .log-entry-icon img {

    filter:var(--icon-primary-filter);

}


.addon-icon,
.upload-queue-icon {

    box-sizing:border-box;
    padding:10px;
    border-radius:10px;
    background:var(--primary-soft);

}


.addon-enabled .status-icon,
.log-entry--success .log-entry-icon img,
.log-entry--enabled .log-entry-icon img,
.confirm-icon[src$="/success.svg"] {

    filter:var(--icon-success-filter);

}


.addon-disabled .status-icon,
.log-entry--disabled .log-entry-icon img,
.log-entry--deleted .log-entry-icon img,
.log-entry--error .log-entry-icon img,
.confirm-icon[src$="/warning.svg"],
.confirm-warning-icon {

    filter:var(--icon-danger-filter);

}


.confirm-icon[src$="/upload.svg"],
.toast-icon {

    filter:var(--icon-primary-filter);

}


.toast-icon[src$="/enable.svg"],
.toast-icon[src$="/success.svg"],
.confirm-icon[src$="/enable.svg"] {

    filter:var(--icon-success-filter);

}


.toast-icon[src$="/disable.svg"],
.toast-icon[src$="/delete.svg"],
.toast-icon[src$="/warning.svg"],
.confirm-icon[src$="/disable.svg"],
.confirm-icon[src$="/delete.svg"] {

    filter:var(--icon-danger-filter);

}


.addon-enabled .status-icon,
.log-entry--success .log-entry-icon,
.log-entry--enabled .log-entry-icon {

    background:var(--success-soft);

}


.addon-disabled .status-icon,
.log-entry--disabled .log-entry-icon,
.log-entry--deleted .log-entry-icon,
.log-entry--error .log-entry-icon {

    background:var(--danger-soft);

}


.status-icon {

    box-sizing:border-box;
    padding:7px;
    border-radius:50%;

}


.upload-drop-zone-link,
.zip-conflict-action {

    color:var(--primary-hover);

}


.confirm-close:hover img,
.upload-queue-remove:hover img {

    filter:var(--icon-danger-filter);

}


.confirm-close img,
.upload-queue-remove img {

    filter:var(--icon-danger-filter);
    opacity:.82;

}


.confirm-close:hover:not(:disabled),
.upload-queue-remove:hover:not(:disabled) {

    background:transparent;

}


.confirm-delete:hover:not(:disabled) {

    background:#b62324;

}


.confirm-replace:hover:not(:disabled) {

    background:#a85b0b;

}


@media (max-width: 640px) {

    .header-controls {

        width:100%;
        align-items:stretch;
        flex-direction:column;
        gap:10px;

    }

    .language-control,
    .theme-control {

        justify-content:space-between;

    }

}


@media (prefers-reduced-motion: reduce) {

    body {

        transition:none;

    }

}
.blacklist-card { margin: 24px 0; padding: 16px; border: 1px solid var(--border-color, #555); border-radius: 10px; }
.blacklist-card h3 { margin: 0; flex: 1; }
#bannedUserList { display: grid; gap: 12px; overflow-wrap: anywhere; }
.ban-details { flex: 1; min-width: 0; display: grid; gap: 8px; }
.ban-details p { margin: 0; font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; }
.ban-details .player-actions { margin-top: 6px; }
.container { max-width: 1520px; }
.history-stats { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr)); gap:12px; margin:16px 0; }
.history-stat-group { min-width:0; padding:14px; border:1px solid var(--border-color); border-radius:8px; background:var(--surface-bg); }
.history-stat-group h3 { display:flex; align-items:center; gap:8px; margin:0 0 12px; font-size:15px; color:var(--text-color); }
.history-stat-group h3 img { width:22px; height:22px; flex-shrink:0; filter:var(--icon-primary-filter); }
.history-stat-group dl { margin:0; }
.history-stat-group dl > div { display:flex; align-items:baseline; justify-content:space-between; gap:16px; padding:6px 0; }
.history-stat-group dt { min-width:0; overflow-wrap:anywhere; }
.history-stat-group dd { margin:0; flex-shrink:0; font-weight:700; font-variant-numeric:tabular-nums; }
.history-player-details { flex:1; min-width:0; }
.history-player-details summary { position:relative; cursor:pointer; list-style:none; padding:4px 48px 4px 0; overflow-wrap:anywhere; }
.history-player-details summary::-webkit-details-marker { display:none; }
.history-player-details summary::marker { content:""; }
.history-player-details summary::after { content:""; position:absolute; right:12px; top:50%; width:0; height:0; border-top:9px solid transparent; border-bottom:9px solid transparent; border-left:13px solid var(--primary); transform:translateY(-50%); }
.history-player-details[open] summary::after { transform:translateY(-50%) rotate(90deg); }
.history-player-details summary:focus-visible { outline:2px solid var(--primary); outline-offset:4px; border-radius:4px; }
.history-compact-stats { display:flex; flex-wrap:wrap; gap:8px 24px; margin:10px 0 0; font-size:14px; color:var(--muted-text); }
.history-compact-stats b { color:var(--text-color); font-variant-numeric:tabular-nums; }
.history-player-details[open] .history-compact-stats { display:none; }
.history-expanded-content { margin-top:12px; }
.server-mutation-control[hidden] { display:none; }
.workshop-page { margin-bottom:24px; }
.workshop-browser-layout { display:grid; grid-template-columns:minmax(0,1fr) 290px; gap:24px; align-items:start; }
.workshop-catalog { min-width:0; }
.workshop-toolbar { display:flex; align-items:end; gap:12px; flex-wrap:wrap; }
.workshop-toolbar .search-control { margin:0; flex:1; min-width:130px; }
.workshop-toolbar .search-control:first-child { flex:2; min-width:180px; }
.workshop-toolbar select { padding:10px; background:var(--surface-bg); color:var(--text-color); border:1px solid var(--border-color); border-radius:8px; width:100%; }
.workshop-results { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.workshop-tile { display:flex; flex-direction:column; min-width:0; border:1px solid var(--border-color); border-radius:10px; overflow:hidden; background:var(--surface-bg); transition:border-color .15s; }
.workshop-tile:hover { border-color:var(--primary); }
.workshop-tile .workshop-tile-open { padding:0; border:0; border-radius:0; text-align:left; background:transparent; color:var(--text-color); width:100%; }
.workshop-thumbnail { display:block; aspect-ratio:16/10; object-fit:cover; width:100%; background:var(--primary-soft); }
.workshop-placeholder { display:grid; place-items:center; }
.workshop-placeholder img { width:48px; height:48px; filter:var(--icon-primary-filter); }
.workshop-tile strong { display:block; padding:14px 14px 0; line-height:1.5; overflow-wrap:anywhere; }
.workshop-tile p { padding:0 14px; font-size:13px; color:var(--muted-text); line-height:1.5; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.workshop-tile > button:last-child { margin:auto 14px 14px; }
.workshop-cart { position:sticky; top:16px; padding:18px; border:1px solid var(--border-color); border-radius:10px; background:var(--surface-bg); min-width:0; }
.workshop-cart h3 { margin:0; display:flex; justify-content:space-between; gap:8px; }
.workshop-cart h3 span:last-child { color:var(--muted-text); font-size:14px; white-space:nowrap; }
.workshop-cart-item { display:flex; align-items:center; gap:8px; padding:10px 0; border-top:1px solid var(--border-color); }
.workshop-cart-item .workshop-cart-title { flex:1; min-width:0; padding:0; text-align:left; background:none; border:0; color:var(--text-color); overflow-wrap:anywhere; line-height:1.5; }
.workshop-cart-actions { display:grid; gap:10px; margin-top:16px; }
.workshop-pagination { display:flex; justify-content:space-between; align-items:center; margin:20px 0; gap:12px; }
.workshop-quick { border-top:1px solid var(--border-color); padding:18px 0 0; margin:20px 0; }
.workshop-quick summary { cursor:pointer; color:var(--primary); }
.workshop-details { box-sizing:border-box; width:min(760px,calc(100% - 32px)); max-height:85vh; overflow:auto; padding:24px; border:1px solid var(--border-color); border-radius:12px; color:var(--text-color); background:var(--card-bg); }
.workshop-details::backdrop { background:rgba(0,0,0,.7); }
.workshop-details h2 { overflow-wrap:anywhere; }
.workshop-details .workshop-thumbnail { max-height:320px; object-fit:contain; }
.workshop-dialog-close { display:flex; justify-content:flex-end; }
.workshop-description { white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.7; }
.workshop-detail-actions, .workshop-detail-children { display:flex; flex-wrap:wrap; gap:10px; margin:16px 0; }
@media(max-width:1200px) { .workshop-results { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:850px) { .workshop-browser-layout { grid-template-columns:minmax(0,1fr); } .workshop-cart { position:static; } }
@media(max-width:480px) { .workshop-results { grid-template-columns:minmax(0,1fr); } .workshop-details { padding:16px; } }
.workshop-page textarea { width:100%; box-sizing:border-box; resize:vertical; min-height:100px; padding:12px; background:var(--surface-bg); color:var(--text-color); border:1px solid var(--border-color); border-radius:8px; font:inherit; }
.workshop-item, .workshop-job { padding:16px; margin:12px 0; border:1px solid var(--border-color); border-radius:8px; background:var(--surface-bg); overflow-wrap:anywhere; }
.workshop-item { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.workshop-item p { margin:8px 0 0; color:var(--muted-text); font-size:14px; }
.workshop-replace { display:flex; align-items:flex-start; gap:10px; margin:16px 0; }
.workshop-replace input { width:auto; margin-top:3px; }
.workshop-job-heading, .workshop-job-item { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px 16px; margin:10px 0; }
.workshop-job progress { width:100%; accent-color:var(--primary); }
.workshop-error { color:var(--danger, #e34c59); }
#workshopConfirm[hidden] { display:none; }
@media(max-width:600px) { .workshop-item { align-items:flex-start; flex-direction:column; } }
.panel-navigation { display:flex; gap:8px; flex-wrap:wrap; margin:12px 0 20px; padding:8px; border:1px solid var(--border-color); border-radius:12px; background:var(--card-bg); }
.panel-navigation a { display:flex; align-items:center; gap:8px; padding:10px 16px; border-radius:8px; color:var(--muted-text); text-decoration:none; }
.panel-navigation img { width:20px; height:20px; filter:var(--icon-primary-filter); }
.panel-navigation a:hover, .panel-navigation a[aria-current="page"] { color:var(--text-color); background:var(--primary-soft); }
.panel-navigation a[aria-current="page"] { box-shadow:inset 0 -2px var(--primary); }
.page-layout { min-width:0; }
.overview-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:24px; align-items:start; }
.function-layout { width:100%; margin:auto; }
.function-layout > section { min-width:0; }
.overview-entrances { margin:20px 0; }
.overview-entrances h2 { margin-top:0; }
.function-link { display:flex; align-items:center; gap:18px; color:var(--text-color); text-decoration:none; border:1px solid var(--border-color); transition:border-color .15s ease; }
.function-link:hover { border-color:var(--primary); }
.function-link > img { width:38px; height:38px; flex-shrink:0; filter:var(--icon-primary-filter); }
.function-link > div { min-width:0; flex:1; }
.function-link h3 { margin:0 0 8px; }
.function-link p { margin:0; color:var(--muted-text); line-height:1.5; font-size:14px; }
.blacklist-page h2 { flex:1; margin:0; }
@media (max-width: 800px) { .overview-layout { grid-template-columns:minmax(0,1fr); gap:0; } .panel-navigation a { padding:10px; } }
.addon-page-grid { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:24px; align-items:start; }
.server-page-grid { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:24px; align-items:start; }
.server-monitor-column, .server-launch-card { min-width:0; }
body[data-page="logs"] .log-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
body[data-page="logs"] .log-entry-content { min-width:0; }
body[data-page="logs"] .log-file { overflow-wrap:anywhere; }
@media (max-width: 1000px) {
    .addon-page-grid, .server-page-grid, body[data-page="logs"] .log-list { grid-template-columns:minmax(0,1fr); gap:0; }
    body[data-page="logs"] .log-list { gap:12px; }
}
[hidden] { display:none !important; }
.search-control { display:flex; flex-direction:column; gap:8px; margin:16px 0; color:var(--muted-text); font-size:14px; }
.search-control input, .console-controls input { box-sizing:border-box; width:100%; padding:11px; border:1px solid var(--border-color); border-radius:8px; background:var(--surface-bg); color:var(--text-color); }
.connect-server-link { margin-top:14px; background:var(--primary-soft); }
.history-page { margin-bottom:24px; }
#playerHistoryList { display:grid; gap:12px; }
.console-page pre { white-space:pre-wrap; overflow-wrap:anywhere; height:60vh; min-height:280px; overflow:auto; padding:16px; border:1px solid var(--border-color); border-radius:8px; background:var(--surface-bg); color:var(--text-color); font:13px/1.5 Consolas,monospace; }
.console-controls { display:flex; flex-wrap:wrap; align-items:end; gap:12px; }
.console-controls label { flex:1; min-width:180px; display:grid; gap:8px; }