:root {
    --harbor-canvas: #121818;
    --harbor-paper: #181f1f;
    --harbor-paper-muted: #1e2626;
    --harbor-ink: #e6efed;
    --harbor-muted: #8f9d99;
    --harbor-line: #2d3836;
    --harbor-strong-line: #3e4c49;
    --harbor-masthead: #0b1010;
    --harbor-masthead-raised: #161d1d;
    --harbor-accent: #3b9fa6;
    --harbor-accent-dark: #2d8087;
    --harbor-signal: #c9a03a;
    --harbor-positive: #3aa67e;
    --harbor-radius: 5px;
    --harbor-shell: 1320px;
}

* { box-sizing: border-box; }

html { background: var(--harbor-canvas); }

body {
    background: var(--harbor-canvas);
    color: var(--harbor-ink);
    font-family: "Source Sans 3", sans-serif;
    font-size: 15px;
    line-height: 1.45;
    margin: 0;
}

.content,
#top,
#menu,
#main,
#footer {
    max-width: var(--harbor-shell);
    width: calc(100% - 40px);
}

.content { margin-inline: auto; }

a { color: #6bc9d0; text-decoration: none; text-underline-offset: 3px; }
a:hover { color: var(--harbor-accent); text-decoration: underline; }

:focus-visible {
    outline: 3px solid rgba(59, 159, 166, .35);
    outline-offset: 2px;
}

.skip-link { display: none !important; }

img { height: auto; max-width: 100%; }

#top {
    background: var(--harbor-masthead);
    border-bottom: 3px solid var(--harbor-signal);
    margin: 0 auto;
    min-height: 96px;
    padding: 12px 0;
}

#top > .content {
    align-items: center;
    display: flex;
    gap: 20px;
    justify-content: space-between;
    width: calc(100% - 28px);
}

#top .logo { float: none; padding: 0; }
#top .logo img { display: block; max-height: 64px; object-fit: contain; object-position: left center; }

#top .memberArea {
    align-items: center;
    display: flex;
    float: none;
    gap: 6px;
    justify-content: flex-end;
    margin: 0 0 0 auto;
    position: relative;
}

#top .flags { display: none !important; }

#top .memberArea > a {
    align-items: center;
    background: rgba(255, 255, 255, .05);
    border: 1px solid var(--harbor-line);
    border-radius: var(--harbor-radius);
    color: #e6efed;
    display: inline-flex;
    font-size: 14px;
    gap: 7px;
    min-height: 42px;
    padding: 8px 13px;
}

#top .memberArea > a:hover { background: var(--harbor-accent); border-color: var(--harbor-accent); color: #fff; text-decoration: none; }
#top .memberArea .popup { background: #c9a03a; border: 2px solid var(--harbor-masthead); border-radius: 50%; color: #121818; font-size: 12px; font-weight: 700; line-height: 18px; min-height: 20px; min-width: 20px; padding: 0 4px; right: -7px; text-align: center; top: -7px; }

#top .memberArea .preview,
#top .memberArea .messagePreview {
    background: var(--harbor-paper);
    border: 1px solid var(--harbor-strong-line);
    border-radius: var(--harbor-radius);
    box-shadow: 0 16px 38px rgba(0, 0, 0, .45);
    color: var(--harbor-ink);
    right: 0;
    top: calc(100% + 8px);
    z-index: 1100;
}

#top .memberArea .preview,
#top .memberArea .messagePreview {
    display: none !important;
    position: absolute;
    visibility: hidden !important;
}

#top .memberArea .preview.is-open,
#top .memberArea .messagePreview.is-open {
    display: block !important;
    visibility: visible !important;
}

#top .memberArea .pactions { border-top: 1px solid var(--harbor-line); display: grid; grid-template-columns: repeat(2, 1fr); }
#top .memberArea .pactions a { background: var(--harbor-paper-muted); border-radius: 0; color: var(--harbor-accent); margin: 0; padding: 8px; }
#top .memberArea .pactions a:hover { background: var(--harbor-line); }
#top .memberArea .qactions { background: var(--harbor-masthead-raised); padding: 8px; }
#top .memberArea .qactions a { color: #a8d6db; }

#menu {
    background: var(--harbor-masthead-raised);
    border: 0;
    border-radius: 0 0 var(--harbor-radius) var(--harbor-radius);
    margin: 0 auto 18px;
    min-height: 56px;
}

#menu > .content { align-items: center; display: flex; min-height: 56px; position: relative; width: calc(100% - 16px); }
.mobile-menu-toggle { align-items: center; background: rgba(255, 255, 255, .06); border: 1px solid var(--harbor-line); border-radius: var(--harbor-radius); color: #e6efed; cursor: pointer; display: none; gap: 8px; min-height: 40px; padding: 8px 12px; }
.mobile-menu-toggle:hover { background: rgba(255, 255, 255, .12); }
ul.TSSEMenu { background: transparent; border: 0; display: flex; flex: 1 1 auto; flex-wrap: nowrap; float: none; list-style: none; margin: 0; order: 1; padding: 0; }
ul.TSSEMenu li { list-style: none; position: relative; }
ul.TSSEMenu > li > a,
ul.TSSEMenu > li.dis > a:hover {
    background: transparent;
    border: 0;
    border-radius: 0;
    color: #e6efed;
    font-family: "Barlow Condensed", sans-serif;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0;
    padding: 17px 10px;
    text-transform: uppercase;
    white-space: nowrap;
}

ul.TSSEMenu > li > a:hover,
ul.TSSEMenu > li:hover > a,
ul.TSSEMenu > li > a:focus { background: var(--harbor-accent); color: #fff; }
ul.TSSEMenu ul,
ul.TSSEMenu ul ul { background: var(--harbor-paper-muted); border: 1px solid var(--harbor-strong-line); border-radius: var(--harbor-radius); box-shadow: 0 12px 30px rgba(0, 0, 0, .45); display: none !important; left: 0; padding: 5px; position: absolute; top: 100%; visibility: hidden !important; width: 220px; z-index: 1150; }
ul.TSSEMenu ul ul { left: calc(100% - 4px); top: -5px; }
ul.TSSEMenu li:hover > ul,
ul.TSSEMenu li:focus-within > ul { display: block !important; visibility: visible !important; }
ul.TSSEMenu ul li { float: none; width: 100%; }
ul.TSSEMenu ul li a { background: transparent; border: 0; border-radius: 2px; color: var(--harbor-ink); display: block; font-size: 14px; padding: 8px 9px; }
ul.TSSEMenu ul li a:hover { background: var(--harbor-line); color: #e6efed; }

#menu .search { flex: 0 0 360px; float: none; margin: 0 0 0 auto; order: 2; position: relative; width: 360px; }
#menu .buttonwithpadding,
#menu .fasicon { display: none !important; }
#menu .quicksearch { background: transparent; border: 0; box-shadow: none; color: var(--harbor-ink); display: block !important; padding: 0; position: static; visibility: visible !important; }
#ts_search_form { align-items: center; display: grid; gap: 6px; grid-template-columns: minmax(120px, 1fr) auto 100px 72px; }
#ts_search_form input[type="text"],
#ts_search_form select,
#ts_search_form input[type="submit"] { margin: 0; min-height: 36px; width: 100%; }
#ts_search_form select { padding-right: 4px; }
#ts_search_form input[type="submit"] { padding: 6px 9px; }
#ts_search_form input[type="text"] { background: rgba(255, 255, 255, .07); border-color: var(--harbor-line); color: #e6efed; }
#ts_search_form input[type="text"]:focus { background: rgba(255, 255, 255, .12); }
#ts_search_form select { background: rgba(255, 255, 255, .07); border-color: var(--harbor-line); color: #e6efed; }

#main { margin: 0 auto; }
#main .left_side {
    background: var(--harbor-paper);
    border: 1px solid var(--harbor-line);
    border-radius: var(--harbor-radius);
    box-shadow: 0 3px 10px rgba(0, 0, 0, .25);
    min-height: 420px;
    padding: 18px;
}

h1, h2, h3, h4, .thead, .colhead, .subheader { font-family: "Barlow Condensed", sans-serif; letter-spacing: 0; }
h1, h2, h3 { color: var(--harbor-ink); line-height: 1.15; }

#main table { border-color: var(--harbor-line); }
#main table.main,
#main table.tborder,
#main table.sortable {
    background: var(--harbor-paper);
    border: 1px solid var(--harbor-line);
    border-collapse: separate;
    border-radius: var(--harbor-radius);
    border-spacing: 0;
    overflow: hidden;
}

#main table tr.trow2,
#main table tr.alt2,
#main table tr.trow1,
#main table tr.alt1 { background: transparent; }

#main td,
#main th { border-color: var(--harbor-line); font-size: 14px; }
#main td:not(.none):not(.embedded),
#main th:not(.none) { padding: 8px 10px; }

.thead, .colhead, .unsortable {
    background: var(--harbor-masthead-raised);
    border: 0;
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    padding: 9px 10px;
    text-align: left;
}

.thead a, .colhead a { color: #fff !important; }
.subheader { background: var(--harbor-paper-muted); color: #b8c9c4; font-size: 14px; font-weight: 600; }
.trow1, .alt1 { background: var(--harbor-paper); color: var(--harbor-ink); }
.trow2, .alt2 { background: var(--harbor-paper-muted); color: var(--harbor-ink); }
#sortabletable tbody tr:hover td,
#main table.main tr:hover > td:not(.thead):not(.colhead):not(.subheader) { background: #23302d; }
td.rowhead { color: #a8bdb7; font-weight: 600; }

input[type="text"], input[type="password"], input[type="email"], input[type="number"], input[type="search"], textarea, select {
    background: rgba(255, 255, 255, .06);
    border: 1px solid var(--harbor-strong-line);
    border-radius: 3px;
    color: #e6efed;
    font: inherit;
    max-width: 100%;
    min-height: 34px;
    padding: 6px 8px;
}
textarea { min-height: 100px; resize: vertical; }
input:focus, textarea:focus, select:focus { border-color: var(--harbor-accent); box-shadow: 0 0 0 3px rgba(59, 159, 166, .18); outline: 0; }
input[type="submit"], input[type="button"], input[type="reset"], button, .button {
    background: var(--harbor-accent);
    border: 1px solid var(--harbor-accent);
    border-radius: 3px;
    color: #fff;
    cursor: pointer;
    font: 600 14px "Source Sans 3", sans-serif;
    min-height: 34px;
    padding: 7px 12px;
}
input[type="submit"]:hover, input[type="button"]:hover, button:hover, .button:hover { background: var(--harbor-accent-dark); border-color: var(--harbor-accent-dark); color: #fff; text-decoration: none; }
input[type="reset"] { background: transparent; border-color: var(--harbor-strong-line); color: var(--harbor-ink); }

.error, .mod_bb { background: rgba(177, 77, 61, .12); border: 1px solid rgba(255, 120, 100, .25); border-left: 4px solid #ff7864; border-radius: var(--harbor-radius); color: #f0c4bd; height: auto; margin-bottom: 12px; padding: 11px 13px; }
.success { background: rgba(58, 166, 126, .12); border: 1px solid rgba(88, 200, 155, .25); border-left: 4px solid var(--harbor-positive); border-radius: var(--harbor-radius); color: #b9ead5; height: auto; margin-bottom: 12px; padding: 11px 13px; }
.shoutboxnotice, .shoutboxprivatemsg { background: rgba(201, 160, 58, .12); border: 1px solid rgba(232, 190, 95, .25); border-radius: 3px; color: #f3dfa0; padding: 7px 9px; }

.navbits { background: var(--harbor-paper-muted); border: 1px solid var(--harbor-line); border-radius: 3px; color: var(--harbor-muted); margin-bottom: 10px; padding: 8px 10px; }
.small, .smalltext, .smallfont, .gray, .mkprettytime { color: var(--harbor-muted); }

/* Notifications (system messages) */
.notification-border-n,
.notification-border-e {
    background: var(--harbor-paper);
    border: 1px solid var(--harbor-line);
    border-radius: var(--harbor-radius);
    margin-bottom: 10px;
    overflow: hidden;
}
.notification-th-n,
.notification-th-e {
    background: var(--harbor-masthead-raised);
    height: auto;
    padding: 5px 10px;
}
.notification-title-n,
.notification-title-e {
    color: #e6efed;
    font-size: 13px;
    font-weight: 600;
}
.notification-body {
    background: transparent;
    color: var(--harbor-ink);
    padding: 8px 10px;
    text-align: left;
}
.notification-border-e .notification-body { color: #f0c4bd; }

.ui-tabs .ui-tabs-nav { background: transparent; border: 0; border-bottom: 2px solid var(--harbor-line); padding: 0; }
.ui-tabs .ui-tabs-nav li { background: transparent; border: 0; margin: 0 2px -2px 0; }
.ui-tabs .ui-tabs-nav li a { color: var(--harbor-muted); padding: 8px 11px; }
.ui-tabs .ui-tabs-nav li.ui-tabs-active { border-bottom: 2px solid var(--harbor-accent); }
.ui-tabs .ui-tabs-nav li.ui-tabs-active a { color: var(--harbor-ink); }
.ui-tabs .ui-tabs-panel { border: 0; padding: 14px 0; }

#torrent-details-tabs > div[id][hidden] { display: none !important; }

#torrent-details-tabs .torrent-cover {
    max-width: 175px;
    min-width: 175px;
    width: 175px;
}

#torrent-details-tabs .torrent-cover-image {
    display: block;
    height: 175px !important;
    max-height: 175px;
    max-width: 175px;
    object-fit: cover;
    width: 175px !important;
}

#footer { background: var(--harbor-masthead); border-top: 3px solid var(--harbor-signal); border-radius: var(--harbor-radius) var(--harbor-radius) 0 0; color: #8f9d99; margin: 20px auto 0; padding: 18px; }
#footer .fcontent { margin: 0 auto; text-align: center; }
#footer a { color: var(--harbor-accent); }
#footer a:hover { color: #8edce3; }
#toTop { background: var(--harbor-accent); border: 1px solid var(--harbor-line); border-radius: 50%; bottom: 18px; color: #fff; height: 38px; line-height: 36px; right: 18px; width: 38px; }

@media (max-width: 760px) {
    .content, #top, #menu, #main, #footer { width: 100%; }
    #top { padding: 12px 0; }
    #top > .content { align-items: flex-start; flex-direction: column; width: calc(100% - 24px); }
    #top .memberArea { justify-content: flex-end; }
    #menu, #menu.fixedMenu { border-radius: 0; margin-bottom: 12px !important; min-width: 0; width: 100% !important; }
    #main .left_side { border-left: 0; border-radius: 0; border-right: 0; padding: 12px; }
    #menu > .content { flex-wrap: wrap; }
    .mobile-menu-toggle { display: inline-flex !important; margin: 5px; order: 1; }
    #menu .search { flex-basis: 100%; margin: 5px 8px; order: 4; width: auto; }
    #ts_search_form { grid-template-columns: minmax(100px, 1fr) auto 92px 64px; }
    ul.TSSEMenu { flex-basis: 100%; flex-direction: column; order: 3; width: 100%; }
    html.js #menu:not(.menu-open) ul.TSSEMenu { display: none; }
    html.js #menu.menu-open ul.TSSEMenu { display: flex; }
    ul.TSSEMenu > li { width: 100%; }
    ul.TSSEMenu > li > a { font-size: 14px; padding: 12px; white-space: nowrap; width: 100%; }
    #ts_search_form { grid-template-columns: minmax(100px, 1fr) auto 92px 64px; }
    #menu ul.TSSEMenu li > ul,
    #menu ul.TSSEMenu ul ul { border-left: 3px solid var(--harbor-signal); box-shadow: none; left: auto; margin: 2px 0 6px; position: static; top: auto; width: 100%; }
    #menu ul.TSSEMenu li:hover > ul,
    #menu ul.TSSEMenu li:focus-within > ul { display: none !important; visibility: hidden !important; }
    #menu ul.TSSEMenu li.submenu-open > ul { display: block !important; visibility: visible !important; }
    #footer { border-radius: 0; }
}

/* Homepage density improvements */
body.homepage #main .left_side {
    min-height: auto;
    padding: 10px;
}

body.homepage .pluginTable {
    border-collapse: separate;
    border-spacing: 6px 0;
}

body.homepage .pluginTable > tbody > tr > td {
    vertical-align: top;
}

body.homepage .pluginTable > tbody > tr > td.none {
    padding: 0;
}

body.homepage .pluginTable > tbody > tr > td > div {
    margin: 0;
}

body.homepage .pluginWrapper {
    background: var(--harbor-paper);
    border: 1px solid var(--harbor-line);
    border-radius: var(--harbor-radius);
    margin-bottom: 8px;
    overflow: hidden;
}

body.homepage .pluginWrapper:last-child {
    margin-bottom: 0;
}

body.homepage .pluginHeader {
    background: var(--harbor-masthead-raised);
    border-bottom: 1px solid var(--harbor-line);
    color: #e6efed;
    font-family: "Barlow Condensed", sans-serif;
    font-size: 14px;
    font-weight: 600;
    padding: 6px 10px;
}

body.homepage .pluginContent {
    background: var(--harbor-paper);
    padding: 7px 10px;
}

body.homepage .pluginContent > table,
body.homepage .pluginContent table {
    width: 100%;
}

body.homepage .pluginContent td,
body.homepage .pluginContent th {
    padding: 2px 0;
}

body.homepage .error,
body.homepage .success,
body.homepage .mod_bb {
    margin-bottom: 6px;
    padding: 6px 9px;
}

body.homepage .shoutboxnotice,
body.homepage .shoutboxprivatemsg {
    margin-bottom: 3px;
    padding: 4px 6px;
}

@media (max-width: 1024px) {
    body.homepage .pluginTable,
    body.homepage .pluginTable > tbody,
    body.homepage .pluginTable > tbody > tr {
        display: block;
    }

    body.homepage .pluginTable > tbody > tr > td {
        display: block;
        width: 100% !important;
    }

    body.homepage .pluginTable > tbody > tr > td > div {
        margin: 0 0 10px 0 !important;
    }
}