/* Wastor shared component styles */
.version-badge { color: var(--text-secondary); font-size: .82rem; padding: 6px 10px; border: 1px solid var(--rust-light-gray); border-radius: 999px; }
.stat-value-time { font-size: 2rem; }
.server-rating-small { margin-left: auto; color: var(--rust-primary); font-weight: 700; white-space: nowrap; }
.top-list { display: grid; gap: 12px; }
.top-row { display: grid; grid-template-columns: 86px minmax(0,1fr) 130px 110px; gap: 18px; align-items: center; background: var(--rust-gray); border-radius: var(--border-radius); padding: 18px 22px; box-shadow: var(--shadow); }
.top-position-wrap { display:flex; flex-direction:column; align-items:flex-start; gap:4px; min-width:0; }
.top-position { font-size: 1.35rem; font-weight: 800; color: var(--text-secondary); line-height:1; }
.rank-change { display:inline-flex; align-items:center; justify-content:center; min-width:34px; padding:3px 7px; border-radius:999px; font-size:.72rem; font-weight:800; line-height:1.2; white-space:nowrap; }
.rank-change-up { color:#77d99a; background:rgba(73, 181, 112, .12); border:1px solid rgba(73, 181, 112, .22); }
.rank-change-down { color:#ef8c82; background:rgba(210, 79, 65, .11); border:1px solid rgba(210, 79, 65, .20); }
.rank-change-neutral { color:var(--text-secondary); background:rgba(168,162,158,.07); border:1px solid rgba(168,162,158,.11); }
.metric-rating-value { display:flex; align-items:baseline; flex-wrap:wrap; gap:0; }
.metric-rating-value .rank-change { margin-left:8px; transform:translateY(-2px); }
.top-position-1 { color: #f5c542; }.top-position-2 { color: #cbd5e1; }.top-position-3 { color: #cd7f32; }
.top-name { color: var(--rust-primary); font-size: 1.08rem; font-weight: 700; text-decoration: none; }
.top-name:hover { text-decoration: underline; }
.top-meta { color: var(--text-secondary); font-size: .9rem; margin-top: 4px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.top-online,.top-rating { font-weight: 800; text-align: right; }.top-rating { color: var(--rust-primary); }
.server-detail-header { margin-bottom: 22px; }
.server-meta-row { display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.server-map-badge { display:inline-flex; align-items:center; padding:7px 14px; border-radius:999px; background:rgba(168,162,158,.10); color:var(--text-secondary); }
.server-actions-container { display:flex; justify-content:space-between; gap:24px; align-items:stretch; margin-bottom:32px; }
.server-metrics { display:flex; gap:14px; flex:1; }.metric { background:var(--rust-gray); border-radius:var(--border-radius); padding:20px 24px; min-width:150px; box-shadow:var(--shadow); }
.metric-label { color:var(--text-secondary); font-size:.92rem; }.metric-value { margin-top:7px; font-size:1.7rem; font-weight:800; }.metric-sub { margin-left:8px; color:var(--text-secondary); font-size:.9rem; }
.server-actions { display:flex; gap:12px; align-items:stretch; }.btn-play-large { display:flex; align-items:center; justify-content:center; background:linear-gradient(90deg,var(--rust-primary),var(--rust-secondary)); color:#fff; text-decoration:none; font-weight:700; border-radius:14px; padding:16px 26px; }
.players-display { border-radius:14px; padding:12px 20px; min-width:150px; text-align:center; }.players-count { font-size:1.35rem; font-weight:800; }.players-label { font-size:.8rem; opacity:.8; }
.server-layout { display:grid; grid-template-columns:minmax(0,2fr) minmax(280px,1fr); gap:28px; }.mb-32 { margin-bottom:32px; }.section-title { font-size:1.35rem; margin-bottom:18px; }.section-header-row { display:flex; justify-content:space-between; align-items:center; gap:16px; }.muted-text { color:var(--text-secondary); }.server-description-text { color:var(--text-secondary); line-height:1.75; }
.chart-wrap { height:340px; }.detail-stats-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:20px; }.detail-stats-grid div { background:var(--rust-darker); border-radius:12px; padding:14px; }.detail-stats-grid span { display:block; color:var(--text-secondary); font-size:.82rem; }.detail-stats-grid strong { display:block; margin-top:4px; font-size:1.2rem; }
.info-row { display:flex; justify-content:space-between; gap:16px; padding:12px 0; border-bottom:1px solid var(--rust-light-gray); }.info-row span { color:var(--text-secondary); }.info-row strong { text-align:right; overflow-wrap:anywhere; }.copy-command { width:100%; margin-top:18px; padding:12px 14px; border-radius:12px; border:1px solid var(--rust-light-gray); background:var(--rust-darker); color:var(--text-primary); cursor:pointer; }.copy-command:hover { border-color:var(--rust-primary); }
.about-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }.feature-list { padding-left:20px; color:var(--text-secondary); }.feature-list li { margin-bottom:10px; }
.breadcrumbs { margin-bottom:18px; }.breadcrumbs ul { list-style:none; display:flex; gap:10px; padding:0; flex-wrap:wrap; }.breadcrumbs li+li:before { content:'›'; margin-right:10px; color:var(--text-secondary); }.breadcrumbs a { color:var(--rust-primary); text-decoration:none; }.debug-box { max-width:100%; overflow:auto; white-space:pre-wrap; text-align:left; margin:20px auto; background:#0c0b0a; padding:16px; border-radius:10px; }
@media(max-width:900px){.top-row{grid-template-columns:66px minmax(0,1fr);}.top-online,.top-rating{grid-column:2;text-align:left}.server-actions-container{flex-direction:column}.server-layout{grid-template-columns:1fr}.about-grid{grid-template-columns:1fr}.version-badge{display:none}}
@media(max-width:640px){.server-metrics{display:grid;grid-template-columns:1fr}.server-actions{flex-direction:column}.top-row{padding:16px}.detail-stats-grid{grid-template-columns:1fr}.server-rating-small{margin-left:0}.chart-wrap{height:280px}}

/* === Catalog server cards (0.1.2) === */
.servers-list {
    display: grid;
    gap: 14px;
    margin-bottom: 40px;
}

.server-row {
    position: relative;
    overflow: hidden;
    padding: 20px 22px;
    border: 1px solid rgba(168, 162, 158, 0.12);
    border-radius: 16px;
    background:
        linear-gradient(110deg, rgba(212, 106, 61, 0.045), transparent 36%),
        var(--rust-gray);
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.24);
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.server-row::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 3px;
    background: linear-gradient(180deg, var(--rust-primary), var(--rust-secondary));
    opacity: .85;
}

.server-row:hover {
    transform: translateY(-2px);
    border-color: rgba(212, 106, 61, 0.30);
    box-shadow: 0 9px 26px rgba(0, 0, 0, 0.32);
}

.server-row-main {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 20px;
    align-items: center;
}

.server-row .server-name {
    min-width: 0;
    margin: 0;
    font-size: 1.13rem;
    line-height: 1.35;
}

.server-row .server-name a {
    color: var(--rust-primary);
    text-decoration: none;
    font-weight: 750;
    transition: color .2s ease;
}

.server-row .server-name a:hover {
    color: #f27b48;
}

.server-row .server-players {
    display: flex;
    justify-content: flex-end;
}

.server-row .players-badge {
    min-width: 118px;
    padding: 8px 15px;
    font-size: 1rem;
    border: 1px solid transparent;
}

.server-row .players-online {
    border-color: rgba(34, 197, 94, 0.18);
}

.server-row .players-offline {
    border-color: rgba(239, 68, 68, 0.18);
}

.server-row .server-actions {
    display: flex;
    align-items: center;
    gap: 9px;
}

.server-row .btn-detail,
.server-row .btn-play {
    min-height: 42px;
    padding: 9px 17px;
    border-radius: 11px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: .96rem;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    transition: transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.server-row .btn-detail {
    color: var(--text-primary);
    background: rgba(168, 162, 158, .10);
    border: 1px solid var(--rust-light-gray);
}

.server-row .btn-detail:hover {
    color: var(--text-primary);
    background: rgba(168, 162, 158, .18);
    border-color: var(--rust-lighter-gray);
    transform: translateY(-1px);
}

.server-row .btn-play {
    color: #fff;
    border: 1px solid rgba(212, 106, 61, .28);
    background: linear-gradient(100deg, var(--rust-primary), #ad5934);
    box-shadow: 0 4px 12px rgba(212, 106, 61, .16);
}

.server-row .btn-play:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(212, 106, 61, .27);
}

.server-row-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 9px 10px;
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid rgba(168, 162, 158, 0.10);
    color: var(--text-secondary);
    font-size: .91rem;
}

.server-row-meta > div:not(.server-rating-small) {
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    max-width: 100%;
    padding: 5px 10px;
    border: 1px solid rgba(168, 162, 158, 0.10);
    border-radius: 9px;
    background: rgba(18, 16, 14, 0.42);
}


.server-row .server-map {
    min-width: 0;
}

.server-row .server-map span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.server-row .server-address {
    font-size: .89rem;
    letter-spacing: 0;
}

.server-row .address-text {
    font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', monospace;
    color: #c2bbb5;
}

.server-row .server-rating-small {
    margin-left: auto;
    padding: 4px 2px 4px 10px;
    color: var(--rust-primary);
    font-size: .98rem;
    font-weight: 800;
}

@media (max-width: 900px) {
    .server-row-main {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 15px;
    }

    .server-row .server-actions {
        grid-column: 1 / -1;
    }

    .server-row .btn-detail,
    .server-row .btn-play {
        min-width: 116px;
    }
}

@media (max-width: 640px) {
    .servers-list {
        gap: 12px;
    }

    .server-row {
        padding: 17px 16px 16px 18px;
    }

    .server-row-main {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .server-row .server-players {
        justify-content: flex-start;
    }

    .server-row .players-badge {
        min-width: 0;
    }

    .server-row .server-actions {
        grid-column: auto;
        width: 100%;
    }

    .server-row .btn-detail,
    .server-row .btn-play {
        flex: 1 1 0;
        min-width: 0;
    }

    .server-row-meta {
        align-items: stretch;
    }

    .server-row-meta > div:not(.server-rating-small) {
        max-width: 100%;
    }

    .server-row .server-map {
        width: 100%;
    }

    .server-row .server-rating-small {
        width: 100%;
        margin-left: 0;
        padding: 5px 2px 0;
    }
}

/* === Header + server detail polish (0.1.3) === */
.site-header {
    padding: 0;
    min-height: 72px;
}

.site-header .header-content {
    min-height: 72px;
    display: grid;
    grid-template-columns: auto 1fr auto auto;
    align-items: center;
    gap: 26px;
    flex-wrap: nowrap;
}

.site-header .logo {
    display: inline-flex;
    align-items: center;
    gap: 0;
    min-width: 0;
}

.site-header .logo-img {
    display: block;
    width: auto;
    height: 34px;
    object-fit: contain;
}

.site-header .main-nav {
    justify-self: end;
    width: auto;
    margin: 0;
}

.site-header .main-nav ul {
    margin: 0;
    gap: clamp(12px, 1.5vw, 26px);
    align-items: center;
}

.site-header .main-nav a {
    display: inline-flex;
    align-items: center;
    min-height: 72px;
    padding: 0 4px;
    border-radius: 0;
    font-size: .96rem;
}

.site-header .main-nav a.active::after,
.site-header .main-nav a:hover::after {
    bottom: 0;
    height: 2px;
}

.site-header .version-badge {
    justify-self: end;
    font-size: .74rem;
    line-height: 1;
    padding: 7px 10px;
    color: #b7afa9;
    border-color: rgba(168, 162, 158, .22);
    background: rgba(18, 16, 14, .35);
}

.site-header .burger {
    justify-self: end;
}

/* Wide application pages inherit the single main .container grid. */
.server-page {
    width: 100%;
    max-width: none;
    min-width: 0;
    margin: 0;
}

.server-page .breadcrumbs {
    margin: 15px 0 18px;
    color: var(--text-secondary);
    font-size: .86rem;
}

.server-page .breadcrumbs ul {
    align-items: center;
    gap: 8px;
}

.server-page .breadcrumbs li {
    min-width: 0;
    color: #8f8883;
}

.server-page .breadcrumbs li:last-child {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.server-page .breadcrumbs li + li::before {
    content: '/';
    margin-right: 8px;
    color: #5e5854;
}

.server-page .breadcrumbs a {
    font-weight: 650;
}

.server-hero {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 235px;
    gap: 30px;
    align-items: stretch;
    margin-bottom: 26px;
    padding: 28px 30px;
    overflow: hidden;
    border: 1px solid rgba(168, 162, 158, .13);
    border-radius: 20px;
    background:
        radial-gradient(circle at 85% 10%, rgba(212, 106, 61, .11), transparent 30%),
        linear-gradient(120deg, rgba(212, 106, 61, .035), transparent 45%),
        #211e1b;
    box-shadow: 0 10px 34px rgba(0, 0, 0, .25);
}

.server-hero::before {
    content: '';
    position: absolute;
    inset: 0 0 auto;
    height: 3px;
    background: linear-gradient(90deg, var(--rust-primary), var(--rust-secondary), transparent 72%);
}

.server-page-title {
    margin: 0;
    max-width: 900px;
    color: var(--text-primary);
    font-size: clamp(1.8rem, 3vw, 2.55rem);
    line-height: 1.12;
    letter-spacing: -.035em;
    overflow-wrap: anywhere;
}

.server-hero .server-meta-row {
    margin-top: 16px;
}

.server-hero .server-map-badge {
    min-height: 34px;
    padding: 7px 12px;
    border: 1px solid rgba(168, 162, 158, .10);
    background: rgba(18, 16, 14, .44);
    color: #bcb4ae;
    font-size: .88rem;
}

.server-hero .server-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(112px, 1fr));
    gap: 10px;
    margin-top: 22px;
}

.server-hero .metric {
    min-width: 0;
    padding: 14px 16px;
    border: 1px solid rgba(168, 162, 158, .10);
    border-radius: 13px;
    background: rgba(18, 16, 14, .46);
    box-shadow: none;
}

.server-hero .metric-label {
    font-size: .79rem;
}

.server-hero .metric-value {
    margin-top: 4px;
    font-size: 1.43rem;
    line-height: 1.2;
}

.server-hero .metric-sub {
    font-size: .72rem;
}

.server-hero-actions {
    display: grid;
    grid-template-rows: 1fr auto auto;
    gap: 10px;
    min-width: 0;
}

.server-hero .players-display {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-width: 0;
    min-height: 92px;
    padding: 18px;
    border: 1px solid rgba(34, 197, 94, .12);
    border-radius: 15px;
}

.server-hero .players-count {
    font-size: 1.6rem;
    line-height: 1.1;
}

.server-hero .players-label {
    margin-top: 7px;
    font-size: .76rem;
}

.server-hero .btn-play-large {
    min-height: 50px;
    border-radius: 13px;
    padding: 12px 18px;
    box-shadow: 0 6px 16px rgba(212, 106, 61, .18);
    transition: transform .18s ease, box-shadow .18s ease;
}

.server-hero .btn-play-large:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 20px rgba(212, 106, 61, .28);
}

.hero-copy-command {
    min-height: 42px;
    width: 100%;
    padding: 10px 13px;
    border: 1px solid rgba(168, 162, 158, .18);
    border-radius: 12px;
    background: rgba(18, 16, 14, .62);
    color: #c9c2bc;
    font: inherit;
    font-size: .82rem;
    font-weight: 650;
    cursor: pointer;
    transition: border-color .18s ease, color .18s ease, background .18s ease;
}

.hero-copy-command:hover {
    border-color: rgba(212, 106, 61, .48);
    background: rgba(212, 106, 61, .07);
    color: var(--text-primary);
}

.server-page .server-layout {
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 22px;
    align-items: start;
}

.server-page .detail-card {
    padding: 24px;
    border: 1px solid rgba(168, 162, 158, .11);
    border-radius: 17px;
    box-shadow: 0 8px 26px rgba(0, 0, 0, .20);
}

.server-page .detail-card:hover {
    transform: none;
    box-shadow: 0 8px 26px rgba(0, 0, 0, .20);
}

.server-page .detail-card::after {
    height: 2px;
    opacity: .82;
}

.server-page .section-title {
    margin: 0 0 15px;
    font-size: 1.18rem;
    letter-spacing: -.01em;
}

.server-page .section-header-row .section-title {
    margin-bottom: 0;
}

.server-page .server-description-text,
.server-page .muted-text {
    font-size: .92rem;
}

.server-page .chart-wrap {
    height: 360px;
    margin-top: 18px;
}

.server-page .detail-stats-grid {
    margin-top: 16px;
}

.server-page .detail-stats-grid div {
    border: 1px solid rgba(168, 162, 158, .08);
    background: rgba(18, 16, 14, .54);
}

.server-sidebar {
    min-width: 0;
}

.server-info-card {
    position: sticky;
    top: 92px;
}

.server-page .info-row {
    align-items: flex-start;
    padding: 13px 0;
    border-bottom-color: rgba(168, 162, 158, .11);
    font-size: .89rem;
}

.server-page .info-row strong {
    max-width: 62%;
    color: #eeeae7;
    font-size: .88rem;
}

@media (max-width: 900px) {
    /* Keep the off-canvas navigation from extending the mobile document width. */
    html,
    body {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden;
    }

    @supports (overflow: clip) {
        html,
        body {
            overflow-x: clip;
        }
    }

    .site-header .header-content {
        grid-template-columns: auto 1fr auto;
        min-height: 66px;
        gap: 16px;
    }

    .site-header .logo-img {
        height: 31px;
    }

    .site-header .main-nav {
        position: fixed;
        top: 0;
        right: 0;
        width: min(310px, 88vw);
        height: 100vh;
        margin: 0;
        padding: 96px 26px 36px;
        transform: translate3d(100%, 0, 0);
        visibility: hidden;
        pointer-events: none;
        background: linear-gradient(180deg, #15120f, #1c1815);
        border-left: 1px solid rgba(168, 162, 158, .15);
        box-shadow: -12px 0 40px rgba(0, 0, 0, .55);
        z-index: 999;
        will-change: transform;
        transition:
            transform .3s ease,
            visibility 0s linear .3s;
    }

    .site-header .main-nav.active {
        transform: translate3d(0, 0, 0);
        visibility: visible;
        pointer-events: auto;
        transition-delay: 0s;
    }

    .site-header .main-nav ul {
        flex-direction: column;
        align-items: stretch;
        gap: 5px;
    }

    .site-header .main-nav a {
        min-height: 52px;
        padding: 0 12px;
        border-radius: 10px;
        font-size: 1.04rem;
    }

    .site-header .main-nav a.active,
    .site-header .main-nav a:hover {
        background: rgba(212, 106, 61, .08);
    }

    .site-header .main-nav a.active::after,
    .site-header .main-nav a:hover::after {
        display: none;
    }

    .site-header .version-badge {
        display: inline-flex;
        margin-left: auto;
    }

    .site-header .burger {
        display: flex;
    }

    .server-hero {
        grid-template-columns: 1fr;
    }

    .server-hero-actions {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto auto;
    }

    .server-hero .players-display {
        grid-row: 1 / 3;
        min-height: 102px;
    }

    .server-page .server-layout {
        grid-template-columns: 1fr;
    }

    .server-info-card {
        position: static;
    }
}

@media (max-width: 640px) {
    .site-header .header-content {
        grid-template-columns: minmax(0, 1fr) auto auto;
        padding-left: 16px;
        padding-right: 16px;
    }

    .site-header .logo {
        position: static;
        transform: none;
        justify-self: start;
    }

    .site-header .logo-img {
        height: 28px;
        max-width: 155px;
    }

    .site-header .version-badge {
        font-size: .68rem;
        padding: 6px 8px;
    }

    .server-page .breadcrumbs {
        margin-top: -2px;
    }

    .server-hero {
        padding: 22px 18px 18px;
        border-radius: 16px;
        gap: 22px;
    }

    .server-page-title {
        font-size: 1.72rem;
    }

    .server-hero .server-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .server-hero .metric {
        padding: 12px 10px;
    }

    .server-hero .metric-label {
        min-height: 2.25em;
        font-size: .69rem;
    }

    .server-hero .metric-value {
        font-size: 1.16rem;
    }

    .server-hero .metric-sub {
        display: block;
        margin: 3px 0 0;
    }

    .server-hero-actions {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
    }

    .server-hero .players-display {
        grid-row: auto;
        min-height: 82px;
    }

    .server-page .detail-card {
        padding: 20px 17px;
    }

    .server-page .section-header-row {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
    }

    .server-page .chart-wrap {
        height: 285px;
        margin-top: 14px;
    }

    .server-page .detail-stats-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 7px;
    }

    .server-page .detail-stats-grid div {
        padding: 11px 9px;
    }

    .server-page .detail-stats-grid strong {
        font-size: 1rem;
    }

    .server-page .info-row {
        gap: 12px;
    }
}


/* === Catalog filters UX (0.1.8) === */
.filters-card-modern {
    overflow: visible;
}

.filters-grid-catalog {
    grid-template-columns: minmax(220px, 1.15fr) minmax(260px, 1.2fr) minmax(220px, .9fr) minmax(180px, .72fr);
    gap: 18px;
    align-items: end;
}

.filters-grid-catalog .filter-control,
.date-range-trigger {
    min-height: 52px;
}

.filter-group-players,
.filter-group-wipe {
    min-width: 0;
}

.player-range {
    min-height: 52px;
    padding: 8px 13px 9px;
    border: 1px solid var(--rust-light-gray);
    border-radius: 12px;
    background: var(--rust-darker);
}

.player-range:focus-within {
    border-color: var(--rust-primary);
    box-shadow: 0 0 0 3px rgba(212, 106, 61, .16);
}

.player-range-head {
    display: flex;
    align-items: center;
    gap: 7px;
    min-height: 20px;
    margin-bottom: 4px;
    font-size: .82rem;
    line-height: 1;
}

.player-range-value {
    color: #ece7e3;
    font-weight: 700;
    white-space: nowrap;
}

.player-range-separator {
    color: #6f6761;
}

.dual-range {
    position: relative;
    height: 18px;
}

.dual-range-track,
.dual-range-fill {
    position: absolute;
    left: 0;
    right: 0;
    top: 8px;
    height: 4px;
    border-radius: 999px;
}

.dual-range-track {
    background: #3a3531;
}

.dual-range-fill {
    left: var(--range-left);
    right: var(--range-right);
    background: linear-gradient(90deg, var(--rust-primary), #ef824f);
}

.dual-range input[type="range"] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 18px;
    margin: 0;
    padding: 0;
    pointer-events: none;
    appearance: none;
    -webkit-appearance: none;
    background: transparent;
    outline: none;
}

.dual-range input[type="range"]::-webkit-slider-thumb {
    width: 16px;
    height: 16px;
    border: 2px solid #1b1816;
    border-radius: 50%;
    background: #e27643;
    box-shadow: 0 1px 7px rgba(0,0,0,.45);
    pointer-events: auto;
    cursor: grab;
    appearance: none;
    -webkit-appearance: none;
}

.dual-range input[type="range"]::-moz-range-thumb {
    width: 13px;
    height: 13px;
    border: 2px solid #1b1816;
    border-radius: 50%;
    background: #e27643;
    box-shadow: 0 1px 7px rgba(0,0,0,.45);
    pointer-events: auto;
    cursor: grab;
}

.dual-range input[type="range"]:focus-visible::-webkit-slider-thumb {
    box-shadow: 0 0 0 3px rgba(212,106,61,.24);
}

.date-range-picker {
    position: relative;
}

.date-range-trigger {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 15px;
    border: 1px solid var(--rust-light-gray);
    border-radius: 12px;
    background: var(--rust-darker);
    color: var(--text-primary);
    font: inherit;
    font-size: .94rem;
    text-align: left;
    cursor: pointer;
    transition: border-color .18s ease, box-shadow .18s ease;
}

.date-range-trigger:hover,
.date-range-trigger[aria-expanded="true"] {
    border-color: rgba(212,106,61,.65);
}

.date-range-trigger[aria-expanded="true"] {
    box-shadow: 0 0 0 3px rgba(212,106,61,.13);
}

.date-range-chevron {
    color: #928982;
    font-size: 1.05rem;
}

.date-range-popover {
    position: absolute;
    z-index: 60;
    top: calc(100% + 10px);
    right: 0;
    width: 330px;
    padding: 14px;
    border: 1px solid rgba(168,162,158,.18);
    border-radius: 16px;
    background: #191614;
    box-shadow: 0 18px 50px rgba(0,0,0,.48);
}

.date-range-popover[hidden] {
    display: none;
}

.calendar-head {
    display: grid;
    grid-template-columns: 34px 1fr 34px;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.calendar-title {
    text-align: center;
    text-transform: capitalize;
    font-size: .96rem;
}

.calendar-nav {
    width: 34px;
    height: 34px;
    border: 1px solid rgba(168,162,158,.13);
    border-radius: 9px;
    background: #24201d;
    color: #d6cec8;
    font-size: 1.3rem;
    cursor: pointer;
}

.calendar-nav:hover {
    border-color: rgba(212,106,61,.45);
    color: #fff;
}

.calendar-weekdays,
.calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
}

.calendar-weekdays {
    margin-bottom: 5px;
    color: #756e69;
    font-size: .68rem;
    text-align: center;
}

.calendar-grid {
    gap: 3px 0;
}

.calendar-day {
    position: relative;
    z-index: 1;
    min-width: 0;
    height: 36px;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: #c8c1bb;
    font: inherit;
    font-size: .82rem;
    cursor: pointer;
}

.calendar-day:hover {
    background: rgba(212,106,61,.11);
    color: #fff;
}

.calendar-day.is-outside {
    color: #514b47;
}

.calendar-day.is-today {
    box-shadow: inset 0 0 0 1px rgba(212,106,61,.32);
}

.calendar-day.is-in-range {
    border-radius: 0;
    background: rgba(212,106,61,.13);
    color: #f4ece7;
}

.calendar-day.is-start,
.calendar-day.is-end {
    border-radius: 9px;
    background: var(--rust-primary);
    color: #fff;
    font-weight: 750;
}

.calendar-footer {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 8px;
    margin-top: 11px;
    padding-top: 11px;
    border-top: 1px solid rgba(168,162,158,.10);
}

.calendar-clear,
.calendar-done {
    border: 0;
    background: transparent;
    color: #aaa19a;
    font: inherit;
    font-size: .76rem;
    cursor: pointer;
}

.calendar-clear:hover {
    color: #fff;
}

.calendar-done {
    padding: 7px 10px;
    border-radius: 8px;
    background: rgba(212,106,61,.14);
    color: #ef8755;
    font-weight: 700;
}

.calendar-selection {
    overflow: hidden;
    color: #807872;
    font-size: .68rem;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.filters-footer {
    display: flex;
    justify-content: flex-end;
    margin-top: 14px;
}

.filters-reset {
    color: var(--text-secondary);
    font-size: .9rem;
    text-decoration: none;
}

.filters-reset:hover {
    color: var(--rust-primary);
}

.server-wipe {
    color: #d7c6b8;
}

@media (max-width: 1080px) {
    .filters-grid-catalog {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .filter-group-submit {
        align-self: end;
    }
}

@media (max-width: 680px) {
    .filters-grid-catalog {
        grid-template-columns: 1fr;
    }

    .date-range-popover {
        left: 0;
        right: auto;
        width: min(330px, calc(100vw - 64px));
    }
}

/* === About / footer polish (0.1.7) === */
.about-free-card {
    margin-top: 24px;
}

.about-free-card .section-title {
    margin-bottom: 12px;
}

.footer-grid-compact {
    grid-template-columns: minmax(0, 1.5fr) minmax(240px, .7fr);
}

@media (max-width: 760px) {
    .footer-grid-compact {
        grid-template-columns: 1fr;
    }
}

/* === Rust Discovery (0.2.0) === */
.filters-grid-catalog {
    grid-template-columns: minmax(205px, 1.1fr) minmax(245px, 1.15fr) minmax(205px, .9fr) minmax(180px, .78fr) minmax(170px, .7fr);
}

.filter-group-sort {
    min-width: 0;
}

.server-row-tags,
.top-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.server-row-tags {
    margin-top: 12px;
}

.top-tags {
    margin-top: 8px;
}

.server-tag {
    display: inline-flex;
    align-items: center;
    min-height: 27px;
    padding: 4px 9px;
    border: 1px solid rgba(168, 162, 158, .14);
    border-radius: 999px;
    background: rgba(18, 16, 14, .56);
    color: #c8c0ba;
    font-size: .76rem;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
}

.server-tag.tag-pvp {
    border-color: rgba(220, 83, 73, .25);
    color: #e9948d;
    background: rgba(128, 42, 36, .13);
}

.server-tag.tag-pve {
    border-color: rgba(60, 179, 113, .24);
    color: #83d2a6;
    background: rgba(31, 111, 70, .13);
}

.server-tag.tag-vanilla {
    border-color: rgba(221, 176, 93, .24);
    color: #dfbc79;
    background: rgba(125, 88, 30, .12);
}

.server-tag.tag-modded {
    border-color: rgba(172, 126, 217, .25);
    color: #c9a8e6;
    background: rgba(95, 59, 128, .13);
}

.server-tag.tag-team {
    border-color: rgba(94, 154, 214, .24);
    color: #9fc5e8;
    background: rgba(43, 83, 124, .13);
}

.server-tag.tag-wipe-cycle {
    border-color: rgba(212, 106, 61, .25);
    color: #e79a78;
    background: rgba(137, 66, 36, .13);
}

.server-meta-row .server-tag {
    min-height: 36px;
    padding: 7px 13px;
    font-size: .82rem;
}

@media (max-width: 1240px) {
    .filters-grid-catalog {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .filters-grid-catalog {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    .filters-grid-catalog {
        grid-template-columns: 1fr;
    }
}


/* === Rust Discovery filters + rates (0.2.1) === */
.filters-grid-catalog {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.filter-group-search {
    grid-column: span 2;
}

.filter-group-play-mode,
.filter-group-mod-type,
.filter-group-team-size,
.filter-group-wipe-cycle {
    min-width: 0;
}

.server-tag.tag-rate {
    border-color: rgba(238, 194, 74, .27);
    color: #f0cc6b;
    background: rgba(137, 99, 20, .14);
}

@media (max-width: 1240px) {
    .filters-grid-catalog {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .filter-group-search {
        grid-column: span 2;
    }
}

@media (max-width: 900px) {
    .filters-grid-catalog {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .filter-group-search {
        grid-column: span 2;
    }
}

@media (max-width: 680px) {
    .filters-grid-catalog {
        grid-template-columns: 1fr;
    }

    .filter-group-search {
        grid-column: span 1;
    }
}

/* === Unified catalog filters + compact mobile UX (0.2.3) === */
.filters-card-modern {
    padding: 24px;
    border: 1px solid rgba(168, 162, 158, .08);
    border-radius: 18px;
    background:
        linear-gradient(120deg, rgba(212, 106, 61, .025), transparent 42%),
        var(--rust-gray);
}

.filters-primary-grid,
.filters-secondary-grid {
    display: grid;
    gap: 16px;
    align-items: end;
}

.filters-primary-grid {
    grid-template-columns: minmax(280px, 1.65fr) minmax(240px, 1fr) minmax(220px, .9fr) minmax(190px, .78fr);
}

.filters-secondary-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 16px;
}

.filters-card-modern .filter-group {
    min-width: 0;
}

.filters-card-modern .filter-group label {
    margin-bottom: 7px;
    color: #b9b1ab;
    font-size: .84rem;
    font-weight: 650;
    letter-spacing: .01em;
}

.filters-card-modern .filter-control,
.filters-card-modern .filter-surface {
    width: 100%;
    min-height: 54px;
    border: 1px solid rgba(168, 162, 158, .22);
    border-radius: 12px;
    background-color: #12100e;
    color: var(--text-primary);
    font: inherit;
    font-size: .96rem;
    transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.filters-card-modern .filter-control {
    padding: 0 16px;
}

.filters-card-modern input.filter-control::placeholder {
    color: #77706a;
}

.filters-card-modern .filter-control:hover,
.filters-card-modern .filter-surface:hover {
    border-color: rgba(168, 162, 158, .38);
}

.filters-card-modern .filter-control:focus,
.filters-card-modern .filter-surface:focus-within,
.filters-card-modern .date-range-trigger[aria-expanded="true"] {
    outline: none;
    border-color: rgba(212, 106, 61, .78);
    box-shadow: 0 0 0 3px rgba(212, 106, 61, .12);
}

.filters-card-modern .filter-select {
    appearance: none;
    -webkit-appearance: none;
    padding-right: 44px;
    background-image:
        linear-gradient(45deg, transparent 50%, #968e88 50%),
        linear-gradient(135deg, #968e88 50%, transparent 50%);
    background-position:
        calc(100% - 20px) 50%,
        calc(100% - 15px) 50%;
    background-size: 5px 5px, 5px 5px;
    background-repeat: no-repeat;
    cursor: pointer;
}

.filters-card-modern .player-range {
    min-height: 54px;
    padding: 7px 14px 8px;
}

.filters-card-modern .player-range-head {
    min-height: 18px;
    margin-bottom: 4px;
    font-size: .78rem;
}

.filters-card-modern .date-range-trigger {
    min-height: 54px;
    padding: 0 16px;
    border-color: rgba(168, 162, 158, .22);
    background-color: #12100e;
    font-size: .96rem;
}

.control-chevron,
.filters-toggle-chevron {
    width: 8px;
    height: 8px;
    flex: 0 0 auto;
    border-right: 2px solid #968e88;
    border-bottom: 2px solid #968e88;
    transform: rotate(45deg) translateY(-2px);
    transition: transform .18s ease;
}

.date-range-trigger[aria-expanded="true"] .control-chevron {
    transform: rotate(225deg) translate(-2px, -2px);
}

.filters-advanced-toggle {
    display: none;
}

.filters-actions {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 16px;
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid rgba(168, 162, 158, .09);
}

.filters-actions .btn-apply {
    width: auto;
    min-width: 240px;
    min-height: 50px;
    padding: 12px 26px;
    border-radius: 12px;
    font-size: 1rem;
}

.filters-actions .filters-reset {
    display: inline-flex;
    align-items: center;
    min-height: 42px;
    padding: 8px 4px;
    color: #958d87;
    font-size: .88rem;
}

@media (max-width: 1180px) {
    .filters-primary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .filters-secondary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    .filters-card-modern {
        width: min(100%, 520px);
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 30px;
        padding: 18px;
        border-radius: 17px;
    }

    .filters-primary-grid,
    .filters-secondary-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .filters-card-modern .filter-group label {
        margin-bottom: 6px;
        font-size: .82rem;
    }

    .filters-card-modern .filter-control,
    .filters-card-modern .filter-surface,
    .filters-card-modern .date-range-trigger {
        min-height: 50px;
        font-size: .94rem;
    }

    .filters-card-modern .player-range {
        min-height: 58px;
    }

    .filters-advanced-toggle {
        width: 100%;
        min-height: 48px;
        display: grid;
        grid-template-columns: 1fr auto auto;
        align-items: center;
        gap: 10px;
        margin-top: 16px;
        padding: 0 14px;
        border: 1px solid rgba(168, 162, 158, .17);
        border-radius: 11px;
        background: rgba(18, 16, 14, .52);
        color: #d4cdc7;
        font: inherit;
        font-size: .9rem;
        font-weight: 650;
        text-align: left;
        cursor: pointer;
    }

    .filters-advanced-toggle:hover {
        border-color: rgba(212, 106, 61, .38);
    }

    .filters-advanced-toggle[aria-expanded="true"] {
        border-color: rgba(212, 106, 61, .34);
        background: rgba(212, 106, 61, .055);
    }

    .filters-advanced-toggle[aria-expanded="true"] .filters-toggle-chevron {
        transform: rotate(225deg) translate(-2px, -2px);
    }

    .filters-active-count {
        min-width: 24px;
        height: 24px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 0 7px;
        border-radius: 999px;
        background: rgba(212, 106, 61, .16);
        color: #ee8d60;
        font-size: .74rem;
        font-weight: 800;
    }

    .filters-active-count.is-empty {
        display: none;
    }

    .filters-advanced:not(.is-open) {
        display: none;
    }

    .filters-secondary-grid {
        margin-top: 14px;
        padding-top: 14px;
        border-top: 1px solid rgba(168, 162, 158, .08);
    }

    .filters-actions {
        display: grid;
        grid-template-columns: 1fr;
        gap: 10px;
        margin-top: 16px;
        padding-top: 16px;
    }

    .filters-actions .btn-apply {
        width: 100%;
        min-width: 0;
        min-height: 50px;
        grid-row: 1;
        font-size: .98rem;
    }

    .filters-actions .filters-reset {
        min-height: 34px;
        justify-content: center;
        grid-row: 2;
        padding: 4px;
    }

    .date-range-popover {
        width: min(330px, calc(100vw - 76px));
        max-width: 100%;
    }
}


/* SEO / useful catalog content */
.catalog-guide {
    max-width: 980px;
    margin: 46px auto 0;
    padding: 28px 30px;
    border: 1px solid rgba(168, 162, 158, .12);
    border-radius: 18px;
    background: rgba(36, 32, 29, .58);
}
.catalog-guide h2 {
    margin: 0 0 14px;
    font-size: 1.35rem;
}
.catalog-guide p {
    margin: 0 0 12px;
    color: var(--text-secondary);
    line-height: 1.75;
}
.catalog-guide p:last-child { margin-bottom: 0; }
.catalog-guide a { color: var(--accent); }
.server-fact-summary {
    margin: 0 0 16px;
    color: #ddd5cf;
    line-height: 1.75;
}
.top-name-heading,
.server-name {
    margin-top: 0;
    margin-bottom: 0;
}
@media (max-width: 680px) {
    .catalog-guide {
        margin-top: 32px;
        padding: 20px;
        border-radius: 16px;
    }
}


/* === Rust Discovery statistics (0.2.5) === */
.server-uptime span {
    color: #91c9a2;
}

.chart-section-header {
    gap: 16px;
}

.chart-range-tabs {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 4px;
    border: 1px solid rgba(168, 162, 158, .12);
    border-radius: 12px;
    background: rgba(18, 16, 14, .52);
}

.chart-range-tab {
    min-height: 34px;
    padding: 7px 11px;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: var(--text-secondary);
    font: inherit;
    font-size: .78rem;
    font-weight: 700;
    cursor: pointer;
    transition: background .18s ease, color .18s ease;
}

.chart-range-tab:hover {
    color: var(--text-primary);
}

.chart-range-tab.active {
    background: rgba(212, 106, 61, .16);
    color: var(--rust-primary);
}

@media (max-width: 640px) {
    .chart-section-header {
        width: 100%;
    }

    .chart-range-tabs {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        width: 100%;
    }

    .chart-range-tab {
        padding-left: 7px;
        padding-right: 7px;
    }
}


/* === Similar servers (0.2.8) === */
.similar-servers {
    margin-top: 36px;
    margin-bottom: 18px;
}

.similar-servers-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 18px;
}

.similar-servers-heading .section-title {
    margin-bottom: 6px;
}

.similar-servers-heading p {
    margin: 0;
    max-width: 760px;
    color: var(--text-secondary);
    line-height: 1.55;
}

.similar-catalog-link {
    flex: 0 0 auto;
    color: var(--rust-primary);
    font-weight: 700;
    text-decoration: none;
}

.similar-catalog-link:hover {
    color: #f27b48;
}

.similar-servers-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.similar-server-card {
    display: flex;
    min-width: 0;
    min-height: 210px;
    flex-direction: column;
    padding: 17px;
    border: 1px solid rgba(168, 162, 158, .12);
    border-radius: 15px;
    background:
        linear-gradient(125deg, rgba(212, 106, 61, .04), transparent 48%),
        var(--rust-gray);
    box-shadow: 0 5px 18px rgba(0, 0, 0, .20);
    transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.similar-server-card:hover {
    transform: translateY(-2px);
    border-color: rgba(212, 106, 61, .28);
    box-shadow: 0 8px 24px rgba(0, 0, 0, .28);
}

.similar-server-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.similar-server-card h3 {
    min-width: 0;
    margin: 0;
    font-size: 1rem;
    line-height: 1.35;
}

.similar-server-card h3 a {
    color: var(--text-primary);
    text-decoration: none;
}

.similar-server-card h3 a:hover {
    color: var(--rust-primary);
}

.similar-online {
    flex: 0 0 auto;
    padding: 5px 8px;
    border: 1px solid rgba(168, 162, 158, .12);
    border-radius: 9px;
    background: rgba(18, 16, 14, .44);
    color: var(--text-secondary);
    font-size: .78rem;
    font-weight: 800;
    white-space: nowrap;
}

.similar-online.is-online {
    color: #82dca0;
    border-color: rgba(73, 181, 112, .20);
    background: rgba(73, 181, 112, .08);
}

.similar-server-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 13px;
}

.similar-server-tags .server-tag {
    font-size: .69rem;
    padding: 4px 7px;
}

.similar-server-meta {
    display: grid;
    gap: 7px;
    margin-top: 14px;
    color: var(--text-secondary);
    font-size: .82rem;
    line-height: 1.35;
}

.similar-server-meta span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.similar-server-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: auto;
    padding-top: 15px;
}

.similar-rating {
    color: var(--rust-primary);
    font-weight: 800;
}

.similar-server-link {
    padding: 7px 11px;
    border: 1px solid rgba(168, 162, 158, .14);
    border-radius: 9px;
    background: rgba(168, 162, 158, .07);
    color: var(--text-primary);
    font-size: .82rem;
    font-weight: 700;
    text-decoration: none;
}

.similar-server-link:hover {
    border-color: rgba(212, 106, 61, .28);
    color: var(--rust-primary);
}

@media (max-width: 980px) {
    .similar-servers-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .similar-servers {
        margin-top: 28px;
    }

    .similar-servers-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
    }

    .similar-servers-grid {
        grid-template-columns: 1fr;
    }

    .similar-server-card {
        min-height: 0;
    }
}

/* === Accounts & authentication (0.3.0) === */
.nav-logout-form {
    margin: 0;
}

.nav-logout-button {
    appearance: none;
    border: 0;
    background: transparent;
    color: var(--text-secondary);
    font: inherit;
    font-weight: 600;
    font-size: 1.08rem;
    padding: 8px 10px;
    border-radius: 10px;
    cursor: pointer;
    transition: var(--transition);
}

.nav-logout-button:hover,
.nav-logout-button:focus-visible {
    color: var(--rust-primary);
    background: rgba(212, 106, 61, .08);
    outline: none;
}

.global-flash {
    margin: 0 0 24px;
    padding: 13px 16px;
    border-radius: 12px;
    border: 1px solid rgba(168, 162, 158, .14);
    box-shadow: var(--shadow);
}

.global-flash-success,
.form-alert-success {
    color: #b7f2c9;
    border-color: rgba(34, 197, 94, .24);
    background: rgba(34, 197, 94, .08);
}

.global-flash-error,
.form-alert-error {
    color: #ffc1bb;
    border-color: rgba(239, 68, 68, .24);
    background: rgba(239, 68, 68, .08);
}

.auth-shell {
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 28px 0 48px;
}

.auth-card {
    width: min(100%, 520px);
    padding: clamp(24px, 4vw, 38px);
    border-radius: 20px;
    border: 1px solid rgba(168, 162, 158, .13);
    background:
        radial-gradient(circle at 100% 0%, rgba(212, 106, 61, .09), transparent 38%),
        var(--rust-gray);
    box-shadow: var(--shadow);
}

.auth-card-wide {
    width: min(100%, 680px);
}

.auth-heading {
    margin-bottom: 28px;
}

.auth-kicker {
    display: block;
    margin-bottom: 7px;
    color: var(--rust-primary);
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.auth-heading h1,
.profile-hero h1 {
    margin: 0;
    font-size: clamp(2rem, 5vw, 2.55rem);
    line-height: 1.1;
}

.auth-heading p,
.profile-hero p {
    margin-top: 10px;
    color: var(--text-secondary);
}

.auth-form {
    display: grid;
    gap: 18px;
}

.auth-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.form-field {
    display: grid;
    gap: 7px;
    color: var(--text-primary);
    font-weight: 650;
}

.form-field input {
    width: 100%;
    min-height: 48px;
    padding: 0 14px;
    color: var(--text-primary);
    background: var(--rust-darker);
    border: 1px solid var(--rust-light-gray);
    border-radius: 11px;
    font: inherit;
    outline: none;
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.form-field input:hover {
    border-color: var(--rust-lighter-gray);
}

.form-field input:focus {
    border-color: var(--rust-primary);
    box-shadow: 0 0 0 3px rgba(212, 106, 61, .12);
    background: #171310;
}

.field-hint {
    color: var(--text-secondary);
    font-size: .78rem;
    font-weight: 400;
}

.field-error {
    color: #ff9d94;
    font-size: .8rem;
    font-weight: 500;
}

.form-alert {
    margin-bottom: 18px;
    padding: 12px 14px;
    border-radius: 11px;
    border: 1px solid;
}

.auth-submit {
    min-height: 50px;
    margin-top: 4px;
    border: 0;
    border-radius: 12px;
    color: #fff;
    background: linear-gradient(100deg, var(--rust-primary), #ad5934);
    box-shadow: 0 5px 18px rgba(212, 106, 61, .18);
    font: inherit;
    font-weight: 800;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
}

.auth-submit:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 22px rgba(212, 106, 61, .28);
}

.auth-switch {
    margin-top: 22px;
    color: var(--text-secondary);
    text-align: center;
}

.auth-switch a {
    color: var(--rust-primary);
    font-weight: 700;
    text-decoration: none;
}

.auth-switch a:hover {
    text-decoration: underline;
}

.profile-shell {
    width: 100%;
    min-width: 0;
    padding-bottom: 24px;
}

.profile-hero {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 28px;
}

.profile-avatar {
    width: 76px;
    height: 76px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 22px;
    color: #fff;
    background: linear-gradient(135deg, var(--rust-primary), var(--rust-secondary));
    box-shadow: 0 8px 24px rgba(212, 106, 61, .24);
    font-size: 2rem;
    font-weight: 900;
    text-transform: uppercase;
}

.profile-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
}

.profile-card {
    margin: 0;
}

.profile-info-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 20px;
    padding: 12px 0;
    border-bottom: 1px solid rgba(168, 162, 158, .10);
}

.profile-info-row:last-child {
    border-bottom: 0;
}

.profile-info-row span {
    color: var(--text-secondary);
}

.profile-info-row strong {
    text-align: right;
    overflow-wrap: anywhere;
}

.profile-next-list {
    margin: 16px 0 0 20px;
    color: var(--text-secondary);
}

.profile-next-list li {
    margin-bottom: 8px;
}

.error-page {
    max-width: 720px;
    margin: 30px auto;
}

@media (max-width: 900px) {
    .site-header .main-nav .nav-logout-button {
        width: 100%;
        min-height: 52px;
        padding: 0 12px;
        text-align: left;
        font-size: 1.04rem;
    }
}

@media (max-width: 640px) {
    .auth-shell {
        padding-top: 8px;
    }

    .auth-form-grid,
    .profile-grid {
        grid-template-columns: 1fr;
    }

    .profile-hero {
        align-items: flex-start;
    }

    .profile-avatar {
        width: 62px;
        height: 62px;
        border-radius: 18px;
        font-size: 1.6rem;
    }

    .profile-info-row {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
    }

    .profile-info-row strong {
        text-align: left;
    }
}


/* === Favorites (0.3.1) === */
.btn-favorite,
.hero-favorite-button {
    appearance: none;
    border: 1px solid rgba(212, 106, 61, .28);
    color: var(--text-secondary);
    background: rgba(212, 106, 61, .06);
    font: inherit;
    font-weight: 700;
    cursor: pointer;
    text-decoration: none;
    transition: border-color .18s ease, color .18s ease, background .18s ease, transform .18s ease;
}

.server-row .btn-favorite {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 0 12px;
    border-radius: 10px;
    white-space: nowrap;
}

.btn-favorite:hover,
.hero-favorite-button:hover {
    border-color: rgba(212, 106, 61, .55);
    color: #fff;
    background: rgba(212, 106, 61, .13);
}

.btn-favorite.is-favorite,
.hero-favorite-button.is-favorite {
    color: #ffb199;
    border-color: rgba(212, 106, 61, .48);
    background: rgba(212, 106, 61, .15);
}

.favorite-icon {
    font-size: 1.08em;
    line-height: 1;
}

.btn-favorite.is-loading,
.hero-favorite-button.is-loading {
    opacity: .58;
    pointer-events: none;
}

.btn-favorite.is-error,
.hero-favorite-button.is-error {
    border-color: rgba(239, 68, 68, .7);
}

.hero-favorite-button {
    min-height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 10px 14px;
    border-radius: 12px;
}

.hero-favorite-login {
    color: var(--text-secondary);
}

.favorites-page {
    width: 100%;
    min-width: 0;
    padding-bottom: 24px;
}

.favorites-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 28px;
    margin: 28px 0 26px;
}

.favorites-heading h1 {
    margin: 0;
    font-size: clamp(2rem, 5vw, 3rem);
}

.favorites-heading p {
    margin: 8px 0 0;
    color: var(--text-secondary);
}

.favorites-total {
    display: flex;
    align-items: baseline;
    gap: 8px;
    flex: 0 0 auto;
    padding: 12px 16px;
    border: 1px solid rgba(168, 162, 158, .12);
    border-radius: 14px;
    background: var(--rust-gray);
}

.favorites-total strong {
    color: var(--rust-primary);
    font-size: 1.8rem;
    line-height: 1;
}

.favorites-total span {
    color: var(--text-secondary);
    font-size: .82rem;
}

.favorite-row.is-removing,
[data-favorite-row].is-removing {
    opacity: 0;
    transform: translateY(-5px);
    transition: opacity .18s ease, transform .18s ease;
}

.profile-card-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.profile-card-heading .section-title {
    margin-bottom: 6px;
}

.profile-favorites-count {
    min-width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(135deg, var(--rust-primary), var(--rust-secondary));
    font-size: 1.35rem;
}

.profile-favorites-link {
    display: inline-flex;
    margin-top: 20px;
    color: var(--rust-primary);
    font-weight: 750;
    text-decoration: none;
}

.profile-favorites-link:hover {
    text-decoration: underline;
}

@media (max-width: 760px) {
    .favorites-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 16px;
    }

    .server-row .btn-favorite .favorite-label {
        display: none;
    }

    .server-row .btn-favorite {
        min-width: 42px;
        padding-inline: 10px;
    }
}

/* === Email verification & password recovery (0.3.2) === */
.auth-note {
    margin: -8px 0 22px;
    padding: 13px 14px;
    border: 1px solid rgba(212, 106, 61, .18);
    border-radius: 12px;
    color: var(--text-secondary);
    background: rgba(212, 106, 61, .055);
    line-height: 1.55;
}

.auth-form-actions {
    display: flex;
    justify-content: flex-end;
    margin-top: -6px;
}

.auth-form-actions a,
.auth-switch-secondary a {
    color: var(--rust-primary);
    font-size: .9rem;
    font-weight: 700;
    text-decoration: none;
}

.auth-form-actions a:hover,
.auth-switch-secondary a:hover {
    text-decoration: underline;
}

.auth-switch-secondary {
    margin-top: 10px;
    font-size: .88rem;
}

.auth-submit-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 0 18px;
    text-decoration: none;
}

.email-status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.email-status-verified {
    color: #b7f2c9;
}

.email-status-verified::before {
    content: "✓";
    display: inline-grid;
    place-items: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    color: #b7f2c9;
    background: rgba(34, 197, 94, .12);
    font-size: .72rem;
}

/* === SMTP / legal / consent UX (0.3.3) === */
.auth-consents {
    display: grid;
    gap: 12px;
    margin: 4px 0 6px;
}

.consent-checkbox {
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    align-items: start;
    gap: 10px;
    padding: 12px 13px;
    border: 1px solid rgba(168, 162, 158, .13);
    border-radius: 12px;
    color: var(--text-secondary);
    background: rgba(255, 255, 255, .018);
    font-size: .88rem;
    line-height: 1.5;
    cursor: pointer;
}

.consent-checkbox:hover {
    border-color: rgba(212, 106, 61, .28);
}

.consent-checkbox input {
    width: 18px;
    height: 18px;
    margin: 2px 0 0;
    accent-color: var(--rust-primary);
}

.consent-checkbox a,
.legal-card a {
    color: var(--rust-primary);
    font-weight: 700;
}

.legal-page {
    width: min(920px, 100%);
    margin: 34px auto 54px;
}

.legal-hero {
    margin-bottom: 22px;
}

.legal-hero h1 {
    margin: 7px 0 10px;
    font-size: clamp(2rem, 5vw, 3.15rem);
    line-height: 1.08;
}

.legal-hero p {
    max-width: 760px;
    margin: 0;
    color: var(--text-secondary);
    line-height: 1.65;
}

.legal-card {
    padding: clamp(22px, 4vw, 38px);
    border: 1px solid rgba(168, 162, 158, .12);
    border-radius: 20px;
    background: var(--rust-gray);
    box-shadow: 0 18px 50px rgba(0, 0, 0, .14);
}

.legal-card h2 {
    margin: 30px 0 10px;
    font-size: 1.25rem;
}

.legal-card h2:first-child {
    margin-top: 0;
}

.legal-card p,
.legal-card li {
    color: var(--text-secondary);
    line-height: 1.7;
}

.legal-card ul {
    padding-left: 22px;
}

@media (max-width: 680px) {
    .legal-page {
        margin-top: 24px;
    }

    .legal-card {
        padding: 20px 17px;
        border-radius: 16px;
    }

}

.global-flash-warning {
    color: #ffe7b0;
    border-color: rgba(245, 158, 11, .28);
    background: rgba(245, 158, 11, .08);
}

.global-flash-warning a {
    color: #ffd36d;
    font-weight: 800;
}

/* === Server ownership (0.3.5) === */
.hero-owner-form {
    width: 100%;
    margin: 0;
}

.hero-owner-button {
    appearance: none;
    width: 100%;
    min-height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 14px;
    border: 1px solid rgba(168, 162, 158, .18);
    border-radius: 12px;
    color: var(--text-secondary);
    background: rgba(255, 255, 255, .025);
    font: inherit;
    font-weight: 750;
    text-decoration: none;
    cursor: pointer;
    transition: border-color .18s ease, color .18s ease, background .18s ease, transform .18s ease;
}

.hero-owner-button:hover {
    color: #fff;
    border-color: rgba(212, 106, 61, .45);
    background: rgba(212, 106, 61, .08);
}

.hero-owner-button.is-owner,
.hero-owner-button.is-verified {
    color: #a7f3d0;
    border-color: rgba(16, 185, 129, .32);
    background: rgba(16, 185, 129, .08);
}

.hero-owner-button.is-verified {
    cursor: default;
}

.hero-owner-button.is-pending {
    color: #fde68a;
    border-color: rgba(245, 158, 11, .3);
    background: rgba(245, 158, 11, .08);
}

.ownership-page {
    max-width: 900px;
    margin: 0 auto;
    padding-bottom: 36px;
}

.ownership-card {
    margin: 30px 0 0;
    padding: clamp(22px, 5vw, 38px);
}

.ownership-card h1 {
    margin: 8px 0 12px;
    font-size: clamp(1.8rem, 5vw, 2.7rem);
    line-height: 1.08;
}

.ownership-kicker {
    display: inline-flex;
    color: var(--rust-primary);
    font-size: .78rem;
    font-weight: 850;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.ownership-intro,
.ownership-success-card > p {
    max-width: 720px;
    color: var(--text-secondary);
    line-height: 1.65;
}

.ownership-server-name {
    margin: 22px 0;
    padding: 14px 16px;
    border: 1px solid rgba(168, 162, 158, .12);
    border-radius: 13px;
    color: #fff;
    background: rgba(255, 255, 255, .025);
    font-weight: 750;
    overflow-wrap: anywhere;
}

.ownership-token-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin: 20px 0;
    padding: 18px;
    border: 1px solid rgba(212, 106, 61, .30);
    border-radius: 16px;
    background: rgba(212, 106, 61, .08);
}

.ownership-token-box > div {
    min-width: 0;
}

.ownership-token-box span,
.ownership-example span,
.ownership-status-grid span {
    display: block;
    color: var(--text-secondary);
    font-size: .8rem;
}

.ownership-token-box strong {
    display: block;
    margin-top: 5px;
    color: #fff;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: clamp(1.25rem, 4vw, 1.75rem);
    letter-spacing: .04em;
    overflow-wrap: anywhere;
}

.ownership-example {
    margin-bottom: 22px;
}

.ownership-example code {
    display: block;
    margin-top: 7px;
    padding: 12px 14px;
    border-radius: 11px;
    color: #e7e5e4;
    background: rgba(0, 0, 0, .2);
    overflow-wrap: anywhere;
}

.ownership-steps {
    margin: 24px 0;
    padding-left: 23px;
    color: var(--text-secondary);
}

.ownership-steps li {
    margin: 0 0 10px;
    padding-left: 5px;
    line-height: 1.55;
}

.ownership-status-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin: 22px 0;
}

.ownership-status-grid > div {
    padding: 14px 16px;
    border: 1px solid rgba(168, 162, 158, .10);
    border-radius: 12px;
    background: rgba(255, 255, 255, .02);
}

.ownership-status-grid strong {
    display: block;
    margin-top: 5px;
    color: #fff;
}

.ownership-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 24px;
}

.ownership-actions form {
    margin: 0;
}

.ownership-actions .button-primary,
.ownership-actions .button-secondary {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 16px;
    border-radius: 11px;
    font: inherit;
    font-weight: 750;
    text-decoration: none;
    cursor: pointer;
}

.ownership-actions .button-primary {
    border: 1px solid transparent;
    color: #fff;
    background: linear-gradient(90deg, var(--rust-primary), var(--rust-secondary));
}

.ownership-actions .button-secondary,
.ownership-token-box .button-secondary {
    appearance: none;
    border: 1px solid rgba(168, 162, 158, .18);
    color: var(--text-primary);
    background: rgba(255, 255, 255, .035);
}

.button-danger-soft {
    color: #fca5a5 !important;
    border-color: rgba(239, 68, 68, .25) !important;
}

.profile-owned-servers {
    margin-top: 22px;
}

.owned-server-list,
.pending-ownership-block {
    margin-top: 18px;
}

.pending-ownership-block {
    padding-top: 18px;
    border-top: 1px solid rgba(168, 162, 158, .10);
}

.pending-ownership-block h3 {
    margin: 0 0 10px;
    font-size: 1rem;
}

.owned-server-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 14px 0;
    border-bottom: 1px solid rgba(168, 162, 158, .10);
    color: inherit;
    text-decoration: none;
}

.owned-server-row:last-child {
    border-bottom: 0;
}

.owned-server-row > div {
    min-width: 0;
}

.owned-server-row strong,
.owned-server-row span {
    display: block;
}

.owned-server-row strong {
    color: #fff;
    overflow-wrap: anywhere;
}

.owned-server-row > div > span {
    margin-top: 4px;
    color: var(--text-secondary);
    font-size: .82rem;
}

.owned-server-status {
    flex: 0 0 auto;
    padding: 6px 9px;
    border-radius: 999px;
    color: #a7f3d0;
    background: rgba(16, 185, 129, .10);
    font-size: .74rem;
    font-weight: 800;
}

.owned-server-status.pending {
    color: #fde68a;
    background: rgba(245, 158, 11, .10);
}

@media (max-width: 640px) {
    .ownership-token-box,
    .owned-server-row {
        align-items: flex-start;
        flex-direction: column;
    }

    .ownership-token-box .button-secondary,
    .ownership-actions,
    .ownership-actions > *,
    .ownership-actions form,
    .ownership-actions button,
    .ownership-actions a {
        width: 100%;
    }

    .ownership-status-grid {
        grid-template-columns: 1fr;
    }

    .owned-server-status {
        align-self: flex-start;
    }
}

.ownership-token-box .button-secondary {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    padding: 9px 14px;
    border-radius: 10px;
    font: inherit;
    font-weight: 750;
    cursor: pointer;
}

/* === Owner cabinet (0.3.6) === */
.owner-manage-shell {
    width: 100%;
    max-width: none;
    min-width: 0;
    margin: 0;
    padding: 30px 0 42px;
    display: grid;
    gap: 20px;
}

.owner-manage-heading,
.owner-card-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
}

.owner-manage-heading {
    margin-bottom: 0;
}

.owner-manage-heading h1 {
    margin: 4px 0 7px;
    font-size: clamp(2rem, 5vw, 3rem);
    line-height: 1.05;
}

.owner-manage-heading p {
    max-width: 680px;
    margin: 0;
    color: var(--text-secondary);
    overflow-wrap: anywhere;
}

.owner-manage-heading-actions,
.owner-form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.owner-manage-heading-actions .button-secondary,
.owner-form-actions .button-secondary,
.owner-form-actions .button-primary {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 9px 15px;
    border-radius: 11px;
    font: inherit;
    font-weight: 750;
    text-decoration: none;
    cursor: pointer;
}

.owner-manage-heading-actions .button-secondary,
.owner-form-actions .button-secondary {
    border: 1px solid rgba(168, 162, 158, .18);
    color: var(--text-primary);
    background: rgba(255, 255, 255, .035);
}

.owner-form-actions .button-primary {
    border: 1px solid transparent;
    color: #fff;
    background: linear-gradient(90deg, var(--rust-primary), var(--rust-secondary));
}

.owner-monitoring-card,
.owner-edit-card {
    margin: 0 0 22px;
}

.owner-card-heading .section-title {
    margin-bottom: 6px;
}

.owner-trust-badge,
.owner-content-badge {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    padding: 6px 9px;
    border: 1px solid rgba(96, 165, 250, .22);
    border-radius: 999px;
    color: #bfdbfe;
    background: rgba(59, 130, 246, .08);
    font-size: .72rem;
    font-weight: 850;
    letter-spacing: .02em;
}

.owner-trust-badge.is-owner,
.owner-content-badge {
    color: #a7f3d0;
    border-color: rgba(16, 185, 129, .24);
    background: rgba(16, 185, 129, .08);
}

.owner-monitoring-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 20px;
}

.owner-monitoring-grid > div {
    min-width: 0;
    padding: 13px 14px;
    border: 1px solid rgba(168, 162, 158, .10);
    border-radius: 12px;
    background: rgba(255, 255, 255, .02);
}

.owner-monitoring-grid span,
.owner-field-help {
    color: var(--text-secondary);
    font-size: .78rem;
}

.owner-monitoring-grid strong {
    display: block;
    margin-top: 5px;
    color: #fff;
    overflow-wrap: anywhere;
}

.owner-edit-card {
    display: grid;
    gap: 20px;
}

.owner-form-group {
    display: grid;
    gap: 7px;
}

.owner-form-group label {
    color: var(--text-primary);
    font-weight: 700;
}

.owner-form-group input,
.owner-form-group textarea,
.owner-form-group select {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid var(--rust-light-gray);
    border-radius: 11px;
    color: var(--text-primary);
    background: var(--rust-darker);
    font: inherit;
    line-height: 1.55;
    outline: none;
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.owner-form-group input,
.owner-form-group select {
    min-height: 48px;
}

.owner-form-group select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    padding-right: 42px;
    background-image: linear-gradient(45deg, transparent 50%, rgba(255,255,255,.72) 50%), linear-gradient(135deg, rgba(255,255,255,.72) 50%, transparent 50%);
    background-position: calc(100% - 19px) calc(50% - 1px), calc(100% - 13px) calc(50% - 1px);
    background-size: 6px 6px, 6px 6px;
    background-repeat: no-repeat;
    cursor: pointer;
}

.owner-form-group select option {
    color: var(--text-primary);
    background: #120e0c;
}

.owner-form-group textarea {
    min-height: 150px;
    resize: vertical;
}

.owner-form-group input:focus,
.owner-form-group textarea:focus,
.owner-form-group select:focus {
    border-color: var(--rust-primary);
    box-shadow: 0 0 0 3px rgba(212, 106, 61, .12);
    background-color: #171310;
}

.owner-links-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.owner-form-note {
    padding: 14px 16px;
    border: 1px solid rgba(96, 165, 250, .15);
    border-radius: 12px;
    color: var(--text-secondary);
    background: rgba(59, 130, 246, .045);
    line-height: 1.55;
}

.owner-form-note strong {
    color: #dbeafe;
}

.owner-public-heading {
    align-items: center;
}

.owner-public-heading .section-title {
    margin-bottom: 0;
}

.owner-public-content {
    margin-top: 15px;
    color: var(--text-primary);
    line-height: 1.7;
    overflow-wrap: anywhere;
}

.owner-rules-text {
    white-space: normal;
}

.server-owner-links-card {
    margin-top: 18px;
}

.owner-public-links {
    display: grid;
    gap: 9px;
    margin-top: 16px;
}

.owner-public-links a {
    min-height: 42px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 9px 12px;
    border: 1px solid rgba(168, 162, 158, .12);
    border-radius: 10px;
    color: var(--text-primary);
    background: rgba(255, 255, 255, .025);
    font-weight: 700;
    text-decoration: none;
}

.owner-public-links a::after {
    content: '↗';
    color: var(--text-secondary);
}

.owner-public-links a:hover {
    border-color: rgba(212, 106, 61, .35);
    background: rgba(212, 106, 61, .06);
}

.owned-server-name-link {
    color: inherit;
    text-decoration: none;
}

.owned-server-name-link:hover strong {
    color: var(--rust-primary);
}

.owned-server-row-actions {
    display: flex;
    align-items: center;
    gap: 9px;
    flex: 0 0 auto;
}

.owned-server-manage-link {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 5px 10px;
    border: 1px solid rgba(212, 106, 61, .24);
    border-radius: 9px;
    color: #ffd1c0;
    background: rgba(212, 106, 61, .07);
    font-size: .78rem;
    font-weight: 800;
    text-decoration: none;
}

.owned-server-manage-link:hover {
    border-color: rgba(212, 106, 61, .48);
    background: rgba(212, 106, 61, .13);
}

@media (max-width: 850px) {
    .owner-monitoring-grid,
    .owner-links-grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 640px) {
    .owner-manage-heading,
    .owner-card-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .owner-manage-heading-actions,
    .owner-manage-heading-actions > *,
    .owner-form-actions,
    .owner-form-actions > * {
        width: 100%;
    }

    .owner-monitoring-grid,
    .owner-links-grid {
        grid-template-columns: 1fr;
    }

    .owned-server-row-actions {
        width: 100%;
        justify-content: space-between;
    }
}

/* === Future wipe schedule (0.3.8) === */
.owner-wipe-card {
    margin: 0 0 22px;
}

.owner-wipe-heading {
    margin-bottom: 18px;
}

.global-wipe-reference,
.public-global-wipe-reference {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 15px 16px;
    border: 1px solid rgba(251, 146, 60, .20);
    border-radius: 13px;
    background: linear-gradient(135deg, rgba(194, 65, 12, .09), rgba(120, 53, 15, .045));
}

.global-wipe-reference > div,
.public-global-wipe-reference {
    min-width: 0;
}

.global-wipe-reference strong,
.public-global-wipe-reference strong {
    display: block;
    margin-top: 4px;
    color: #fff7ed;
    font-size: 1rem;
}

.global-wipe-reference small,
.public-global-wipe-reference small,
.global-wipe-kicker,
.public-global-wipe-reference > span {
    color: #c7b7aa;
    font-size: .76rem;
}

.global-wipe-kicker {
    display: block;
    color: #fdba74;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.global-wipe-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    padding: 5px 8px;
    border: 1px solid rgba(251, 146, 60, .30);
    border-radius: 999px;
    color: #fed7aa;
    background: rgba(234, 88, 12, .12);
    font-size: .68rem;
    font-weight: 850;
    letter-spacing: .02em;
}

.owner-wipe-form {
    display: grid;
    gap: 15px;
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid rgba(168, 162, 158, .10);
}

.owner-global-check {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    padding: 13px 14px;
    border: 1px solid rgba(251, 146, 60, .14);
    border-radius: 12px;
    background: rgba(251, 146, 60, .035);
    cursor: pointer;
}

.owner-global-check input {
    width: 18px;
    height: 18px;
    margin-top: 2px;
    accent-color: var(--rust-primary);
}

.owner-global-check span {
    display: grid;
    gap: 3px;
}

.owner-global-check strong {
    color: var(--text-primary);
    font-size: .92rem;
}

.owner-global-check small {
    color: var(--text-secondary);
    line-height: 1.45;
}

.owner-wipe-fields {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 14px;
    transition: opacity .18s ease;
}

.owner-wipe-fields.is-disabled {
    opacity: .38;
}

.owner-wipe-note-field input {
    min-height: 46px;
}

.owner-wipe-add-button {
    justify-self: start;
    min-height: 44px;
    padding: 9px 16px;
    border: 0;
    border-radius: 11px;
    color: #fff;
    background: linear-gradient(90deg, var(--rust-primary), var(--rust-secondary));
    font: inherit;
    font-weight: 800;
    cursor: pointer;
}

.owner-wipe-list {
    display: grid;
    gap: 10px;
    margin-top: 20px;
}

.owner-wipe-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 13px 14px;
    border: 1px solid rgba(168, 162, 158, .11);
    border-radius: 12px;
    background: rgba(255, 255, 255, .02);
}

.owner-wipe-item.is-global {
    border-color: rgba(251, 146, 60, .19);
    background: rgba(251, 146, 60, .035);
}

.owner-wipe-item-main {
    min-width: 0;
}

.owner-wipe-date-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.owner-wipe-item p {
    margin: 5px 0 0;
    color: var(--text-secondary);
    font-size: .82rem;
    overflow-wrap: anywhere;
}

.owner-wipe-delete {
    padding: 7px 10px;
    border: 1px solid rgba(248, 113, 113, .20);
    border-radius: 9px;
    color: #fecaca;
    background: rgba(239, 68, 68, .055);
    font: inherit;
    font-size: .76rem;
    font-weight: 750;
    cursor: pointer;
}

.owner-wipe-delete:hover {
    border-color: rgba(248, 113, 113, .40);
    background: rgba(239, 68, 68, .10);
}

.owner-wipe-empty {
    margin-top: 18px;
    padding: 13px 14px;
    border: 1px dashed rgba(168, 162, 158, .15);
    border-radius: 11px;
    color: var(--text-secondary);
    font-size: .84rem;
}

.server-wipe-schedule-card {
    margin-top: 18px;
}

.public-wipe-list {
    display: grid;
    gap: 9px;
    margin-top: 14px;
}

.public-wipe-item {
    position: relative;
    padding: 12px 13px;
    border: 1px solid rgba(168, 162, 158, .10);
    border-radius: 11px;
    background: rgba(255, 255, 255, .02);
}

.public-wipe-item.is-next {
    border-color: rgba(212, 106, 61, .26);
    background: rgba(212, 106, 61, .045);
}

.public-wipe-item.is-global {
    border-color: rgba(251, 146, 60, .24);
}

.public-wipe-date {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}

.public-wipe-kicker {
    display: block;
    width: 100%;
    margin-bottom: 2px;
    color: var(--rust-primary);
    font-size: .68rem;
    font-weight: 850;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.public-wipe-item p {
    margin: 7px 0 0;
    color: var(--text-secondary);
    font-size: .78rem;
    line-height: 1.45;
}

.public-wipe-empty {
    margin: 13px 0 0;
}

.public-global-wipe-reference {
    display: grid;
    gap: 2px;
    margin-top: 14px;
    padding: 12px 13px;
}

.public-global-wipe-reference strong {
    margin-top: 0;
    font-size: .92rem;
}

@media (max-width: 640px) {
    .global-wipe-reference {
        align-items: flex-start;
        flex-direction: column;
    }

    .owner-wipe-fields {
        grid-template-columns: 1fr;
    }

    .owner-wipe-add-button {
        width: 100%;
    }

    .owner-wipe-item {
        align-items: flex-start;
        flex-direction: column;
    }

    .owner-wipe-item form,
    .owner-wipe-delete {
        width: 100%;
    }
}


/* === Unified toast notifications (0.3.9) === */
.toast-region {
    position: fixed;
    top: 92px;
    right: max(18px, env(safe-area-inset-right));
    z-index: 5000;
    width: min(430px, calc(100vw - 36px));
    display: grid;
    gap: 11px;
    pointer-events: none;
}

.toast {
    --toast-accent: #a8a29e;
    --toast-glow: rgba(168, 162, 158, .12);
    position: relative;
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr) 28px;
    gap: 11px;
    align-items: start;
    padding: 14px 13px 14px 14px;
    border: 1px solid color-mix(in srgb, var(--toast-accent) 30%, rgba(168, 162, 158, .14));
    border-radius: 15px;
    background:
        radial-gradient(circle at 0 0, var(--toast-glow), transparent 48%),
        rgba(31, 27, 25, .97);
    box-shadow: 0 18px 50px rgba(0, 0, 0, .34);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    color: var(--text-primary);
    opacity: 0;
    transform: translate3d(18px, -4px, 0) scale(.985);
    transition: opacity .2s ease, transform .2s ease, border-color .2s ease;
    pointer-events: auto;
    overflow: hidden;
}

.toast::before {
    content: '';
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background: var(--toast-accent);
}

.toast.is-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
}

.toast.is-leaving {
    opacity: 0;
    transform: translate3d(20px, 0, 0) scale(.985);
}

.toast-success {
    --toast-accent: #22c55e;
    --toast-glow: rgba(34, 197, 94, .11);
}

.toast-error {
    --toast-accent: #ef4444;
    --toast-glow: rgba(239, 68, 68, .11);
}

.toast-warning {
    --toast-accent: #f59e0b;
    --toast-glow: rgba(245, 158, 11, .11);
}

.toast-info {
    --toast-accent: var(--rust-primary);
    --toast-glow: rgba(212, 106, 61, .11);
}

.toast-icon {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 11px;
    border: 1px solid color-mix(in srgb, var(--toast-accent) 35%, transparent);
    background: color-mix(in srgb, var(--toast-accent) 12%, transparent);
    color: var(--toast-accent);
    font-size: 1rem;
    font-weight: 900;
    line-height: 1;
}

.toast-content {
    min-width: 0;
    padding-top: 1px;
}

.toast-title {
    display: block;
    margin-bottom: 3px;
    color: #fff;
    font-size: .91rem;
    line-height: 1.25;
}

.toast-message {
    color: var(--text-secondary);
    font-size: .88rem;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.toast-action {
    display: inline-flex;
    margin-top: 8px;
    color: var(--toast-accent);
    font-size: .84rem;
    font-weight: 800;
    text-decoration: none;
}

.toast-action:hover,
.toast-action:focus-visible {
    text-decoration: underline;
    outline: none;
}

.toast-close {
    appearance: none;
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #8d8681;
    font: inherit;
    font-size: 1.25rem;
    line-height: 1;
    cursor: pointer;
    transition: background .18s ease, color .18s ease;
}

.toast-close:hover,
.toast-close:focus-visible {
    color: #fff;
    background: rgba(255, 255, 255, .07);
    outline: none;
}

@media (max-width: 680px) {
    .toast-region {
        top: 78px;
        left: max(10px, env(safe-area-inset-left));
        right: max(10px, env(safe-area-inset-right));
        width: auto;
        gap: 8px;
    }

    .toast {
        grid-template-columns: 32px minmax(0, 1fr) 26px;
        gap: 9px;
        padding: 12px 10px 12px 12px;
        border-radius: 13px;
    }

    .toast-icon {
        width: 31px;
        height: 31px;
        border-radius: 10px;
    }

    .toast-title {
        font-size: .88rem;
    }

    .toast-message {
        font-size: .84rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .toast {
        transition: none;
    }
}

/* === Profile dashboard polish (0.3.11) === */
.profile-dashboard {
    width: 100%;
    min-width: 0;
    padding: 24px 0 48px;
}

.profile-dashboard-hero {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 32px;
    padding: clamp(24px, 3vw, 34px);
    margin-bottom: 22px;
    border: 1px solid rgba(168, 162, 158, .12);
    border-radius: 20px;
    background:
        radial-gradient(circle at 88% 18%, rgba(212, 106, 61, .12), transparent 32%),
        linear-gradient(115deg, rgba(212, 106, 61, .055), transparent 42%),
        var(--rust-gray);
    box-shadow: var(--shadow);
}

.profile-dashboard-hero::before {
    content: '';
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: linear-gradient(180deg, var(--rust-primary), var(--rust-secondary));
}

.profile-dashboard-identity {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 20px;
}

.profile-dashboard-avatar {
    width: 84px;
    height: 84px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 24px;
    color: #fff;
    background: linear-gradient(135deg, var(--rust-primary), var(--rust-secondary));
    box-shadow: 0 10px 28px rgba(212, 106, 61, .22);
    font-size: 2rem;
    font-weight: 900;
    text-transform: uppercase;
}

.profile-dashboard-copy {
    min-width: 0;
}

.profile-dashboard-copy .auth-kicker {
    margin-bottom: 7px;
}

.profile-dashboard-copy h1 {
    margin: 0;
    color: var(--text-primary);
    font-size: clamp(2rem, 4vw, 2.85rem);
    line-height: 1.05;
    letter-spacing: -.025em;
    overflow-wrap: anywhere;
}

.profile-dashboard-email-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 9px 12px;
    margin-top: 10px;
    color: var(--text-secondary);
}

.profile-verified-pill {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 4px 9px;
    border: 1px solid rgba(16, 185, 129, .20);
    border-radius: 999px;
    color: #9ee8bf;
    background: rgba(16, 185, 129, .075);
    font-size: .74rem;
    font-weight: 800;
}

.profile-dashboard-shortcuts {
    display: grid;
    grid-template-columns: repeat(2, minmax(138px, 1fr));
    gap: 10px;
}

.profile-dashboard-shortcut {
    min-width: 0;
    display: grid;
    gap: 3px;
    padding: 15px 17px;
    border: 1px solid rgba(168, 162, 158, .12);
    border-radius: 14px;
    color: inherit;
    background: rgba(18, 16, 14, .58);
    text-decoration: none;
    transition: border-color .18s ease, background .18s ease, transform .18s ease;
}

.profile-dashboard-shortcut:hover {
    transform: translateY(-1px);
    border-color: rgba(212, 106, 61, .30);
    background: rgba(212, 106, 61, .055);
}

.profile-dashboard-shortcut span,
.profile-dashboard-shortcut small {
    color: var(--text-secondary);
}

.profile-dashboard-shortcut span {
    font-size: .82rem;
    font-weight: 700;
}

.profile-dashboard-shortcut strong {
    margin-top: 2px;
    color: var(--rust-primary);
    font-size: 1.65rem;
    line-height: 1;
}

.profile-dashboard-shortcut small {
    margin-top: 2px;
    font-size: .72rem;
}

.profile-dashboard-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 22px;
    margin-bottom: 22px;
}

.profile-dashboard-card {
    position: relative;
    min-width: 0;
    overflow: hidden;
    padding: clamp(22px, 2.6vw, 30px);
    border: 1px solid rgba(168, 162, 158, .12);
    border-radius: 18px;
    color: var(--text-primary);
    background:
        linear-gradient(120deg, rgba(212, 106, 61, .035), transparent 38%),
        var(--rust-gray);
    box-shadow: 0 7px 24px rgba(0, 0, 0, .22);
}

.profile-dashboard-card::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--rust-primary), var(--rust-secondary), transparent 76%);
}

.profile-dashboard-card-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
}

.profile-dashboard-card-heading h2 {
    margin: 2px 0 0;
    color: var(--text-primary);
    font-size: 1.28rem;
    line-height: 1.2;
}

.profile-card-eyebrow {
    color: var(--rust-primary);
    font-size: .72rem;
    font-weight: 850;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.profile-details-list {
    display: grid;
    margin-top: 18px;
}

.profile-detail-row {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(110px, .72fr) minmax(0, 1.28fr);
    align-items: center;
    gap: 18px;
    padding: 12px 0;
    border-bottom: 1px solid rgba(168, 162, 158, .09);
}

.profile-detail-row:last-child {
    border-bottom: 0;
}

.profile-detail-row > span {
    color: var(--text-secondary);
}

.profile-detail-row > strong {
    min-width: 0;
    color: var(--text-primary);
    text-align: right;
    overflow-wrap: anywhere;
}

.profile-dashboard-count {
    min-width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 15px;
    color: #fff;
    background: linear-gradient(135deg, var(--rust-primary), var(--rust-secondary));
    box-shadow: 0 7px 18px rgba(212, 106, 61, .18);
    font-size: 1.42rem;
    line-height: 1;
}

.profile-dashboard-description {
    max-width: 650px;
    margin: 14px 0 0;
    color: var(--text-secondary);
    line-height: 1.62;
}

.profile-favorites-panel {
    display: flex;
    flex-direction: column;
}

.profile-dashboard-action {
    min-height: 46px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-top: auto;
    padding: 12px 15px;
    border: 1px solid rgba(212, 106, 61, .20);
    border-radius: 12px;
    color: #ffd0be;
    background: rgba(212, 106, 61, .06);
    font-weight: 800;
    text-decoration: none;
    transition: border-color .18s ease, background .18s ease, transform .18s ease;
}

.profile-dashboard-action:hover {
    transform: translateY(-1px);
    border-color: rgba(212, 106, 61, .40);
    background: rgba(212, 106, 61, .11);
}

.profile-owned-servers {
    width: 100%;
    margin: 0;
}

.profile-owned-heading {
    align-items: center;
}

.profile-owned-heading .profile-dashboard-description {
    margin-top: 7px;
}

.profile-dashboard .owned-server-list {
    display: grid;
    gap: 10px;
    margin-top: 22px;
}

.profile-dashboard .owned-server-row {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px;
    padding: 14px 15px;
    border: 1px solid rgba(168, 162, 158, .095);
    border-radius: 12px;
    background: rgba(18, 16, 14, .44);
    transition: border-color .18s ease, background .18s ease;
}

.profile-dashboard .owned-server-row:hover {
    border-color: rgba(212, 106, 61, .20);
    background: rgba(212, 106, 61, .035);
}

.profile-dashboard .owned-server-row:last-child {
    border-bottom: 1px solid rgba(168, 162, 158, .095);
}

.profile-dashboard .owned-server-main {
    min-width: 0;
}

.profile-dashboard .owned-server-main strong {
    color: var(--text-primary);
    font-size: .98rem;
}

.profile-dashboard .owned-server-main > span {
    margin-top: 5px;
    color: var(--text-secondary);
    font-size: .78rem;
}

.profile-dashboard .owned-server-row-actions {
    justify-self: end;
}

.profile-dashboard-empty {
    display: grid;
    gap: 5px;
    margin-top: 20px;
    padding: 17px 18px;
    border: 1px dashed rgba(168, 162, 158, .16);
    border-radius: 12px;
    background: rgba(255, 255, 255, .018);
}

.profile-dashboard-empty strong {
    color: var(--text-primary);
}

.profile-dashboard-empty span {
    color: var(--text-secondary);
    font-size: .88rem;
}

.profile-dashboard .pending-ownership-block {
    margin-top: 22px;
    padding-top: 20px;
}

.pending-ownership-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 10px;
}

.pending-ownership-heading h3 {
    margin: 0;
}

.pending-ownership-heading span {
    min-width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    color: #fde68a;
    background: rgba(245, 158, 11, .10);
    font-size: .78rem;
    font-weight: 800;
}

@media (max-width: 900px) {
    .profile-dashboard-hero {
        grid-template-columns: 1fr;
    }

    .profile-dashboard-shortcuts {
        width: 100%;
    }
}

@media (max-width: 720px) {
    .profile-dashboard {
        padding-top: 14px;
    }

    .profile-dashboard-grid {
        grid-template-columns: 1fr;
    }

    .profile-dashboard-hero,
    .profile-dashboard-card {
        border-radius: 16px;
    }

    .profile-dashboard-identity {
        align-items: flex-start;
    }

    .profile-dashboard-avatar {
        width: 68px;
        height: 68px;
        border-radius: 20px;
        font-size: 1.65rem;
    }

    .profile-dashboard-shortcuts {
        grid-template-columns: 1fr 1fr;
    }

    .profile-dashboard .owned-server-row {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .profile-dashboard .owned-server-row-actions {
        width: 100%;
        justify-self: stretch;
        justify-content: space-between;
    }
}

@media (max-width: 480px) {
    .profile-dashboard-identity {
        gap: 14px;
    }

    .profile-dashboard-avatar {
        width: 58px;
        height: 58px;
        border-radius: 17px;
        font-size: 1.45rem;
    }

    .profile-dashboard-email-row {
        align-items: flex-start;
        flex-direction: column;
        gap: 7px;
    }

    .profile-dashboard-shortcuts {
        grid-template-columns: 1fr;
    }

    .profile-detail-row {
        grid-template-columns: 1fr;
        gap: 4px;
    }

    .profile-detail-row > strong {
        text-align: left;
    }

    .profile-dashboard-card-heading,
    .profile-owned-heading {
        align-items: flex-start;
    }
}

/* === Server owner branding + S3 (0.3.12) === */
.server-hero.has-owner-cover {
    background: #211e1b;
}

.server-hero::before {
    z-index: 4;
}

.server-hero-cover {
    position: absolute;
    z-index: 0;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
}

.server-hero-cover::after {
    content: '';
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(25, 21, 18, .96) 0%, rgba(25, 21, 18, .80) 46%, rgba(25, 21, 18, .62) 100%),
        linear-gradient(0deg, rgba(25, 21, 18, .72), rgba(25, 21, 18, .25));
}

.server-hero-cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 50%;
    filter: saturate(.88) contrast(1.04);
}

.server-hero-main,
.server-hero-actions {
    position: relative;
    z-index: 1;
}

.server-title-branding {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}

.server-title-copy {
    min-width: 0;
}

.server-owner-logo {
    width: 82px;
    height: 82px;
    flex: 0 0 82px;
    object-fit: cover;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 18px;
    background: rgba(18, 16, 14, .78);
    box-shadow: 0 10px 28px rgba(0, 0, 0, .28);
}

.server-owner-brand-note {
    display: inline-flex;
    margin-top: 8px;
    color: rgba(231, 226, 222, .62);
    font-size: .76rem;
    font-weight: 650;
}

.owner-branding-card {
    margin: 0 0 22px;
}

.owner-branding-preview-grid {
    display: grid;
    grid-template-columns: minmax(220px, .7fr) minmax(0, 1.6fr);
    gap: 16px;
    margin-top: 22px;
}

.owner-branding-preview-card {
    min-width: 0;
    padding: 16px;
    border: 1px solid rgba(168, 162, 158, .11);
    border-radius: 14px;
    background: rgba(255, 255, 255, .018);
}

.owner-branding-preview-label {
    margin-bottom: 12px;
    color: var(--text-primary);
    font-size: .82rem;
    font-weight: 800;
}

.owner-branding-preview-card > p {
    margin: 10px 0 0;
    color: var(--text-secondary);
    font-size: .77rem;
    line-height: 1.5;
}

.owner-logo-preview {
    width: 118px;
    height: 118px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border: 1px solid rgba(212, 106, 61, .22);
    border-radius: 22px;
    background: linear-gradient(145deg, rgba(212, 106, 61, .15), rgba(255, 255, 255, .025));
    color: var(--rust-primary);
    font-size: 2.2rem;
    font-weight: 900;
}

.owner-logo-preview img,
.owner-cover-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.owner-cover-preview {
    width: 100%;
    aspect-ratio: 8 / 3;
    overflow: hidden;
    border: 1px solid rgba(212, 106, 61, .20);
    border-radius: 15px;
    background: #171411;
}

.owner-cover-preview.is-empty {
    display: grid;
    place-items: center;
    min-height: 150px;
    color: var(--text-secondary);
    background:
        linear-gradient(120deg, rgba(212, 106, 61, .08), transparent 45%),
        rgba(255, 255, 255, .018);
}

.owner-branding-upload-form {
    display: grid;
    gap: 16px;
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid rgba(168, 162, 158, .10);
}

.owner-branding-inputs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.owner-branding-upload-form input[type="file"] {
    min-height: 52px;
    padding: 9px 10px;
    cursor: pointer;
}

.owner-branding-upload-form input[type="file"]::file-selector-button {
    margin-right: 10px;
    padding: 8px 12px;
    border: 0;
    border-radius: 8px;
    color: #fff;
    background: rgba(212, 106, 61, .85);
    font: inherit;
    font-size: .78rem;
    font-weight: 750;
    cursor: pointer;
}

.owner-branding-upload-form .button-primary:disabled {
    opacity: .45;
    cursor: not-allowed;
}

.owner-branding-delete-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 14px;
}

.owner-branding-delete-actions form {
    margin: 0;
}

.owner-branding-delete {
    min-height: 40px;
    padding: 8px 13px;
    border: 1px solid rgba(248, 113, 113, .24);
    border-radius: 10px;
    color: #fecaca;
    background: rgba(127, 29, 29, .10);
    font: inherit;
    font-size: .8rem;
    font-weight: 750;
    cursor: pointer;
}

.owner-branding-delete:hover {
    border-color: rgba(248, 113, 113, .42);
    background: rgba(127, 29, 29, .18);
}

.owner-form-note.is-warning {
    margin-top: 18px;
    border-color: rgba(245, 158, 11, .24);
    color: #fde68a;
    background: rgba(120, 53, 15, .12);
}

@media (max-width: 820px) {
    .server-title-branding {
        align-items: flex-start;
        gap: 13px;
    }

    .server-owner-logo {
        width: 64px;
        height: 64px;
        flex-basis: 64px;
        border-radius: 15px;
    }

    .owner-branding-preview-grid,
    .owner-branding-inputs {
        grid-template-columns: 1fr;
    }

    .owner-logo-preview {
        width: 104px;
        height: 104px;
    }
}

@media (max-width: 520px) {
    .server-title-branding {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
    }

    .server-owner-logo {
        width: 54px;
        height: 54px;
        flex-basis: 54px;
        border-radius: 13px;
    }

    .server-owner-brand-note {
        grid-column: 1 / -1;
    }

    .owner-branding-preview-card {
        padding: 14px;
    }

    .owner-cover-preview {
        min-height: 130px;
    }
}


/* === Branding preview + cover focal point (0.3.13) === */
.owner-branding-live-wrap {
    margin-top: 22px;
}

.owner-branding-live-preview {
    position: relative;
    min-height: 280px;
    overflow: hidden;
    border: 1px solid rgba(212, 106, 61, .24);
    border-radius: 18px;
    background:
        radial-gradient(circle at 18% 20%, rgba(212, 106, 61, .14), transparent 34%),
        #171411;
    user-select: none;
    touch-action: none;
    cursor: grab;
}

.owner-branding-live-preview.is-dragging {
    cursor: grabbing;
}

.owner-branding-live-preview.has-no-cover {
    cursor: default;
}

.owner-branding-live-cover {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    pointer-events: none;
}

.owner-branding-live-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
        linear-gradient(90deg, rgba(25, 21, 18, .96) 0%, rgba(25, 21, 18, .78) 48%, rgba(25, 21, 18, .52) 100%),
        linear-gradient(0deg, rgba(25, 21, 18, .70), rgba(25, 21, 18, .20));
    pointer-events: none;
}

.owner-branding-live-content {
    position: absolute;
    z-index: 2;
    left: 28px;
    right: 28px;
    top: 50%;
    display: flex;
    align-items: center;
    gap: 20px;
    transform: translateY(-50%);
    pointer-events: none;
}

.owner-branding-live-logo {
    width: 88px;
    height: 88px;
    flex: 0 0 88px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 19px;
    background: rgba(18, 16, 14, .80);
    box-shadow: 0 10px 30px rgba(0, 0, 0, .32);
    color: #fff;
    font-size: 2rem;
    font-weight: 900;
}

.owner-branding-live-logo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.owner-branding-live-copy {
    min-width: 0;
    display: grid;
    gap: 7px;
}

.owner-branding-live-copy strong {
    overflow: hidden;
    color: #fff;
    font-size: clamp(1.35rem, 2.8vw, 2.35rem);
    line-height: 1.08;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-shadow: 0 3px 20px rgba(0, 0, 0, .55);
}

.owner-branding-live-copy span {
    color: rgba(255, 255, 255, .66);
    font-size: .82rem;
    font-weight: 700;
}

.owner-branding-drag-hint {
    position: absolute;
    z-index: 3;
    right: 16px;
    bottom: 14px;
    padding: 7px 10px;
    border: 1px solid rgba(255, 255, 255, .11);
    border-radius: 999px;
    color: rgba(255, 255, 255, .70);
    background: rgba(10, 8, 7, .64);
    backdrop-filter: blur(8px);
    font-size: .72rem;
    font-weight: 700;
    pointer-events: none;
}

.owner-cover-position-editor {
    display: grid;
    gap: 14px;
    padding: 16px;
    border: 1px solid rgba(168, 162, 158, .11);
    border-radius: 14px;
    background: rgba(255, 255, 255, .018);
}

.owner-cover-position-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.owner-cover-position-heading > div {
    display: grid;
    gap: 4px;
}

.owner-cover-position-heading strong {
    color: var(--text-primary);
    font-size: .9rem;
}

.owner-cover-position-heading span {
    color: var(--text-secondary);
    font-size: .76rem;
    line-height: 1.45;
}

.owner-position-reset {
    min-height: 34px;
    padding: 6px 11px;
    border: 1px solid rgba(212, 106, 61, .24);
    border-radius: 9px;
    color: var(--rust-light);
    background: rgba(212, 106, 61, .08);
    font: inherit;
    font-size: .74rem;
    font-weight: 750;
    cursor: pointer;
}

.owner-position-control {
    display: grid;
    gap: 8px;
}

.owner-position-control > span {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    color: var(--text-secondary);
    font-size: .78rem;
    font-weight: 650;
}

.owner-position-control > span strong {
    color: var(--rust-light);
    font-variant-numeric: tabular-nums;
}

.owner-position-control input[type="range"] {
    width: 100%;
    accent-color: var(--rust-primary);
    cursor: pointer;
}

@media (max-width: 760px) {
    .owner-branding-live-preview {
        min-height: 220px;
    }

    .owner-branding-live-content {
        left: 18px;
        right: 18px;
        gap: 14px;
    }

    .owner-branding-live-logo {
        width: 66px;
        height: 66px;
        flex-basis: 66px;
        border-radius: 15px;
    }

    .owner-branding-live-copy strong {
        font-size: 1.35rem;
        white-space: normal;
    }

    .owner-branding-inputs {
        grid-template-columns: 1fr;
    }

    .owner-cover-position-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .owner-position-reset {
        align-self: flex-start;
    }

    .owner-branding-drag-hint {
        right: 10px;
        bottom: 10px;
        font-size: .66rem;
    }
}

/* === Game projects (0.4.0) === */
.profile-dashboard-shortcuts {
    grid-template-columns: repeat(3, minmax(128px, 1fr));
}

.profile-projects-panel {
    width: 100%;
    margin-bottom: 22px;
}

.profile-projects-heading-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.project-create-link {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 9px 14px;
    white-space: nowrap;
}

.profile-project-list {
    display: grid;
    gap: 10px;
    margin-top: 22px;
}

.profile-project-row {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px;
    padding: 15px 16px;
    border: 1px solid rgba(168, 162, 158, .10);
    border-radius: 13px;
    background: rgba(18, 16, 14, .44);
}

.profile-project-main {
    min-width: 0;
}

.profile-project-main a {
    color: var(--text-primary);
    text-decoration: none;
}

.profile-project-main a:hover {
    color: var(--rust-primary);
}

.profile-project-main strong {
    font-size: 1rem;
}

.profile-project-main span {
    display: block;
    margin-top: 5px;
    color: var(--text-secondary);
    font-size: .78rem;
}

.profile-project-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.profile-project-actions > a:not(.owned-server-manage-link) {
    color: var(--text-secondary);
    font-size: .84rem;
    font-weight: 700;
    text-decoration: none;
}

.profile-project-actions > a:hover {
    color: #fff;
}

.project-manage-shell {
    width: 100%;
    padding: 30px 0 54px;
}

.project-manage-heading {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 22px;
    margin-bottom: 22px;
}

.project-manage-heading h1 {
    margin: 6px 0 7px;
    font-size: clamp(2rem, 4vw, 3rem);
    line-height: 1.05;
}

.project-manage-heading p {
    margin: 0;
    color: var(--text-secondary);
}

.project-manage-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.project-edit-card {
    padding: clamp(22px, 3vw, 34px);
}

.project-edit-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(330px, .65fr);
    gap: 30px;
    align-items: start;
}

.project-links-grid {
    margin-top: 5px;
}

.project-server-picker {
    min-width: 0;
    padding: 20px;
    border: 1px solid rgba(168, 162, 158, .12);
    border-radius: 16px;
    background: rgba(18, 16, 14, .48);
}

.project-picker-heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
}

.project-picker-heading h2 {
    margin: 3px 0 0;
    font-size: 1.25rem;
}

.project-picker-heading > span {
    min-width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    color: #fff;
    background: rgba(212, 106, 61, .18);
    font-weight: 800;
}

.project-server-picker > p {
    margin: 10px 0 16px;
    color: var(--text-secondary);
    font-size: .84rem;
    line-height: 1.55;
}

.project-server-options {
    display: grid;
    gap: 9px;
    max-height: 520px;
    overflow: auto;
    padding-right: 3px;
}

.project-server-option {
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    align-items: start;
    gap: 11px;
    padding: 12px;
    border: 1px solid rgba(168, 162, 158, .10);
    border-radius: 12px;
    background: rgba(255,255,255,.018);
    cursor: pointer;
    transition: border-color .16s ease, background .16s ease;
}

.project-server-option:hover,
.project-server-option:has(input:checked) {
    border-color: rgba(212, 106, 61, .34);
    background: rgba(212, 106, 61, .055);
}

.project-server-option input {
    width: 18px;
    height: 18px;
    margin: 2px 0 0;
    accent-color: var(--rust-primary);
}

.project-server-option-copy {
    min-width: 0;
}

.project-server-option-copy strong,
.project-server-option-copy small {
    display: block;
}

.project-server-option-copy strong {
    color: var(--text-primary);
    line-height: 1.32;
    overflow-wrap: anywhere;
}

.project-server-option-copy small {
    margin-top: 5px;
    color: var(--text-secondary);
    font-size: .74rem;
}

.project-picker-empty {
    padding: 16px;
    border: 1px dashed rgba(168, 162, 158, .16);
    border-radius: 12px;
    color: var(--text-secondary);
    line-height: 1.55;
}

.project-picker-error {
    margin-top: 12px;
}

.project-form-actions {
    margin-top: 24px;
}

.project-danger-zone {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    margin-top: 22px;
    padding: 22px 26px;
}

.project-danger-zone h2 {
    margin: 0 0 4px;
}

.project-danger-zone p {
    margin: 0;
}

.project-danger-zone form {
    margin: 0;
}

.project-delete-button {
    appearance: none;
    min-height: 42px;
    padding: 9px 14px;
    border: 1px solid rgba(239, 68, 68, .28);
    border-radius: 11px;
    background: rgba(239, 68, 68, .06);
    font: inherit;
    font-weight: 750;
    cursor: pointer;
}

.project-public-page {
    width: 100%;
    padding-bottom: 56px;
}

.project-public-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 34px;
    align-items: end;
    margin: 24px 0 28px;
    padding: clamp(26px, 4vw, 44px);
    border: 1px solid rgba(168, 162, 158, .13);
    border-radius: 22px;
    background:
        radial-gradient(circle at 86% 18%, rgba(212, 106, 61, .14), transparent 34%),
        linear-gradient(120deg, rgba(212, 106, 61, .055), transparent 46%),
        var(--rust-gray);
    box-shadow: 0 16px 45px rgba(0, 0, 0, .18);
}

.project-public-kicker {
    color: var(--rust-primary);
    font-size: .78rem;
    font-weight: 850;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.project-public-copy h1 {
    margin: 7px 0 13px;
    font-size: clamp(2.3rem, 5vw, 4.1rem);
    line-height: 1.02;
    letter-spacing: -.035em;
}

.project-public-copy > p {
    max-width: 820px;
    margin: 0;
    color: var(--text-secondary);
    font-size: 1rem;
    line-height: 1.7;
}

.project-public-links {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 20px;
}

.project-public-links a,
.server-project-badge {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 7px 11px;
    border: 1px solid rgba(212, 106, 61, .22);
    border-radius: 999px;
    color: #ffd0be;
    background: rgba(212, 106, 61, .07);
    font-size: .8rem;
    font-weight: 750;
    text-decoration: none;
}

.project-public-links a:hover,
.server-project-badge:hover {
    border-color: rgba(212, 106, 61, .42);
    background: rgba(212, 106, 61, .12);
}

.project-public-stats {
    min-width: 220px;
    display: grid;
    grid-template-columns: repeat(2, minmax(95px, 1fr));
    gap: 10px;
}

.project-public-stats > div {
    padding: 15px;
    border: 1px solid rgba(168, 162, 158, .10);
    border-radius: 14px;
    background: rgba(18, 16, 14, .58);
}

.project-public-stats span,
.project-public-stats strong {
    display: block;
}

.project-public-stats span {
    color: var(--text-secondary);
    font-size: .72rem;
}

.project-public-stats strong {
    margin-top: 5px;
    color: var(--rust-primary);
    font-size: 1.55rem;
}

.project-manage-public-link {
    grid-column: 1 / -1;
    min-height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 9px 12px;
    border: 1px solid rgba(16,185,129,.25);
    border-radius: 12px;
    color: #a7f3d0;
    background: rgba(16,185,129,.06);
    font-weight: 750;
    text-decoration: none;
}

.project-public-servers {
    margin-top: 26px;
}

.project-public-section-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 16px;
}

.project-public-section-heading h2 {
    margin: 3px 0 0;
    font-size: 1.55rem;
}

.project-public-section-heading > span {
    min-width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    color: #fff;
    background: rgba(212, 106, 61, .18);
    font-weight: 850;
}

.project-server-row .server-name {
    margin: 0;
}

@media (max-width: 980px) {
    .project-edit-grid,
    .project-public-hero {
        grid-template-columns: 1fr;
    }

    .project-public-stats {
        width: 100%;
        min-width: 0;
        max-width: 500px;
    }
}

@media (max-width: 720px) {
    .profile-dashboard-shortcuts {
        grid-template-columns: 1fr 1fr;
    }

    .profile-project-row,
    .project-danger-zone {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .profile-project-row {
        display: grid;
    }

    .profile-project-actions {
        justify-content: space-between;
    }

    .project-manage-heading,
    .project-danger-zone {
        flex-direction: column;
        align-items: stretch;
    }

    .project-manage-actions > a,
    .project-danger-zone button {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .profile-dashboard-shortcuts,
    .project-public-stats {
        grid-template-columns: 1fr;
    }

    .profile-projects-heading-actions {
        width: 100%;
        justify-content: space-between;
    }

    .project-public-hero {
        padding: 22px 18px;
        border-radius: 17px;
    }
}

/* === Owner cover as full hero header (0.4.1) === */
.server-hero.has-owner-cover {
    isolation: isolate;
    background: #171412;
    border-color: rgba(255, 255, 255, .12);
    box-shadow: 0 16px 42px rgba(0, 0, 0, .34);
}

.server-hero.has-owner-cover .server-hero-cover {
    background: #171412;
}

.server-hero.has-owner-cover .server-hero-cover img {
    opacity: 1;
    filter: none;
    transform: translateZ(0);
}

.server-hero.has-owner-cover .server-hero-cover::after {
    background:
        linear-gradient(90deg,
            rgba(12, 10, 9, .72) 0%,
            rgba(12, 10, 9, .46) 30%,
            rgba(12, 10, 9, .18) 56%,
            rgba(12, 10, 9, .06) 76%,
            rgba(12, 10, 9, .12) 100%),
        linear-gradient(0deg,
            rgba(12, 10, 9, .76) 0%,
            rgba(12, 10, 9, .28) 34%,
            rgba(12, 10, 9, 0) 64%);
}

.server-hero.has-owner-cover .server-page-title,
.server-hero.has-owner-cover .server-owner-brand-note {
    text-shadow: 0 2px 5px rgba(0, 0, 0, .78), 0 8px 26px rgba(0, 0, 0, .42);
}

.server-hero.has-owner-cover .server-owner-logo {
    border-color: rgba(255, 255, 255, .30);
    background: rgba(10, 8, 7, .40);
    box-shadow: 0 12px 34px rgba(0, 0, 0, .48);
}

.server-hero.has-owner-cover .server-map-badge,
.server-hero.has-owner-cover .server-project-badge,
.server-hero.has-owner-cover .server-tag {
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
}

.server-hero.has-owner-cover .server-map-badge {
    border-color: rgba(255, 255, 255, .16);
    background: rgba(13, 11, 10, .62);
    color: rgba(255, 255, 255, .86);
}

.server-hero.has-owner-cover .server-metrics .metric {
    border-color: rgba(255, 255, 255, .13);
    background: rgba(13, 11, 10, .76);
    box-shadow: 0 8px 24px rgba(0, 0, 0, .16);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.server-hero.has-owner-cover .players-display,
.server-hero.has-owner-cover .hero-copy-command,
.server-hero.has-owner-cover .hero-favorite-button,
.server-hero.has-owner-cover .hero-owner-button {
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.server-hero.has-owner-cover .players-display {
    background: rgba(10, 32, 19, .78);
    border-color: rgba(34, 197, 94, .30);
    box-shadow: 0 10px 26px rgba(0, 0, 0, .22);
}

.server-hero.has-owner-cover .hero-copy-command {
    background: rgba(13, 11, 10, .76);
    border-color: rgba(255, 255, 255, .16);
}

.server-hero.has-owner-cover .btn-play-large {
    box-shadow: 0 10px 30px rgba(0, 0, 0, .28), 0 6px 18px rgba(212, 106, 61, .20);
}

@media (max-width: 760px) {
    .server-hero.has-owner-cover .server-hero-cover::after {
        background:
            linear-gradient(90deg, rgba(12, 10, 9, .56), rgba(12, 10, 9, .16)),
            linear-gradient(0deg, rgba(12, 10, 9, .82) 0%, rgba(12, 10, 9, .42) 45%, rgba(12, 10, 9, .10) 100%);
    }

    .server-hero.has-owner-cover .server-metrics .metric {
        background: rgba(13, 11, 10, .82);
    }
}


/* === Server subscriptions (0.4.2) === */
.hero-subscribe-button,
.btn-subscribe {
    appearance: none;
    border: 1px solid rgba(96, 165, 250, .30);
    color: #cbd5e1;
    background: rgba(59, 130, 246, .07);
    font: inherit;
    font-weight: 750;
    cursor: pointer;
    text-decoration: none;
    transition: border-color .18s ease, color .18s ease, background .18s ease, transform .18s ease;
}

.hero-subscribe-button {
    min-height: 46px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 14px;
    border-radius: 12px;
}

.hero-subscribe-button:hover,
.btn-subscribe:hover {
    border-color: rgba(96, 165, 250, .58);
    color: #fff;
    background: rgba(59, 130, 246, .14);
}

.hero-subscribe-button.is-subscribed,
.btn-subscribe.is-subscribed {
    color: #bfdbfe;
    border-color: rgba(96, 165, 250, .52);
    background: rgba(37, 99, 235, .18);
}

.hero-subscribe-button.is-loading,
.btn-subscribe.is-loading {
    opacity: .58;
    pointer-events: none;
}

.hero-subscribe-button.is-error,
.btn-subscribe.is-error {
    border-color: rgba(239, 68, 68, .72);
}

.server-hero.has-owner-cover .hero-subscribe-button {
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.server-row .btn-subscribe {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 0 12px;
    border-radius: 10px;
    white-space: nowrap;
}

.subscriptions-page {
    width: 100%;
    min-width: 0;
    padding-bottom: 24px;
}

.subscriptions-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 28px;
    margin: 28px 0 26px;
}

.subscriptions-heading h1 {
    margin: 0;
    font-size: clamp(2rem, 5vw, 3rem);
}

.subscriptions-heading p {
    max-width: 760px;
    margin: 8px 0 0;
    color: var(--text-secondary);
}

.subscriptions-total {
    display: flex;
    align-items: baseline;
    gap: 8px;
    flex: 0 0 auto;
    padding: 12px 16px;
    border: 1px solid rgba(96, 165, 250, .18);
    border-radius: 14px;
    background: rgba(59, 130, 246, .06);
}

.subscriptions-total strong {
    color: #93c5fd;
    font-size: 1.8rem;
    line-height: 1;
}

.subscriptions-total span {
    color: var(--text-secondary);
    font-size: .82rem;
}

.subscription-next-wipe span {
    color: #c4b5fd;
}

.profile-subscriptions-panel {
    grid-column: 1 / -1;
}

.profile-subscriptions-panel .profile-dashboard-action {
    border-color: rgba(96, 165, 250, .18);
}

.profile-subscriptions-panel .profile-dashboard-action:hover {
    border-color: rgba(96, 165, 250, .38);
    background: rgba(59, 130, 246, .055);
}

.subscriptions-empty {
    margin-top: 24px;
}

.server-row.is-removing {
    opacity: 0;
    transform: translateY(-5px);
    transition: opacity .18s ease, transform .18s ease;
}

@media (max-width: 720px) {
    .subscriptions-heading {
        align-items: stretch;
        flex-direction: column;
        gap: 16px;
    }

    .subscriptions-total {
        align-self: flex-start;
    }

    .server-row .btn-subscribe .subscription-label {
        display: none;
    }
}

/* === Wipe email notification preferences (0.4.3) === */
.subscription-notification-setting {
    display: flex;
    align-items: center;
    margin: 2px 0 12px;
}

.subscription-notification-toggle {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    user-select: none;
}

.subscription-notification-toggle input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.subscription-notification-switch {
    position: relative;
    width: 42px;
    height: 24px;
    flex: 0 0 42px;
    border: 1px solid rgba(148, 163, 184, .24);
    border-radius: 999px;
    background: rgba(15, 23, 42, .72);
    transition: background .18s ease, border-color .18s ease, opacity .18s ease;
}

.subscription-notification-switch::after {
    content: '';
    position: absolute;
    top: 3px;
    left: 3px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #94a3b8;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .28);
    transition: transform .18s ease, background .18s ease;
}

.subscription-notification-toggle input:checked + .subscription-notification-switch {
    border-color: rgba(96, 165, 250, .48);
    background: rgba(37, 99, 235, .28);
}

.subscription-notification-toggle input:checked + .subscription-notification-switch::after {
    transform: translateX(18px);
    background: #93c5fd;
}

.subscription-notification-toggle input:focus-visible + .subscription-notification-switch {
    outline: 2px solid rgba(96, 165, 250, .65);
    outline-offset: 3px;
}

.subscription-notification-toggle input:disabled + .subscription-notification-switch {
    opacity: .55;
}

.subscription-notification-copy {
    display: grid;
    gap: 1px;
}

.subscription-notification-copy strong {
    color: var(--text-primary);
    font-size: .84rem;
}

.subscription-notification-copy small {
    color: var(--text-secondary);
    font-size: .74rem;
}

/* === Owner server analytics (0.4.4) === */
.owner-analytics-shell {
    width: 100%;
    min-width: 0;
    padding-bottom: 28px;
}

.owner-analytics-heading {
    margin-bottom: 24px;
}

.owner-analytics-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 18px;
}

.owner-analytics-metric {
    min-width: 0;
    padding: 20px;
    border: 1px solid rgba(255, 255, 255, .07);
    border-top: 3px solid rgba(212, 106, 61, .88);
    border-radius: 16px;
    background: rgba(35, 31, 28, .94);
    box-shadow: 0 10px 28px rgba(0, 0, 0, .18);
}

.owner-analytics-metric > span,
.owner-analytics-week-stat span:first-child {
    color: var(--text-secondary);
    font-size: .88rem;
}

.owner-analytics-metric > strong {
    display: block;
    margin-top: 8px;
    color: var(--text-primary);
    font-size: clamp(1.8rem, 4vw, 2.5rem);
    line-height: 1;
}

.owner-analytics-metric > small {
    display: block;
    margin-top: 8px;
    color: var(--text-secondary);
    line-height: 1.35;
}

.owner-analytics-metric.is-today {
    border-top-color: rgba(96, 165, 250, .78);
}

.owner-analytics-grid {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(280px, .8fr);
    gap: 18px;
    align-items: stretch;
    margin-bottom: 18px;
}

.owner-analytics-chart-card,
.owner-analytics-week-card,
.owner-analytics-table-card {
    margin: 0;
}

.owner-analytics-chart-wrap {
    position: relative;
    height: 340px;
    margin-top: 16px;
}

.owner-analytics-week-card {
    display: flex;
    flex-direction: column;
}

.owner-analytics-week-stat {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 0;
    border-bottom: 1px solid rgba(255, 255, 255, .07);
}

.owner-analytics-week-stat:last-child {
    border-bottom: 0;
}

.owner-analytics-week-stat > div {
    display: grid;
    gap: 4px;
}

.owner-analytics-week-stat strong {
    color: var(--text-primary);
    font-size: 1.6rem;
}

.analytics-trend {
    flex: 0 0 auto;
    padding: 5px 8px;
    border-radius: 999px;
    font-size: .76rem;
    font-weight: 800;
}

.analytics-trend.is-up {
    color: #86efac;
    background: rgba(34, 197, 94, .12);
}

.analytics-trend.is-down {
    color: #fca5a5;
    background: rgba(239, 68, 68, .12);
}

.analytics-trend.is-flat {
    color: #cbd5e1;
    background: rgba(148, 163, 184, .10);
}

.owner-analytics-table-card {
    margin-bottom: 16px;
}

.owner-analytics-table-wrap {
    width: 100%;
    overflow-x: auto;
}

.owner-analytics-table {
    width: 100%;
    min-width: 720px;
    border-collapse: collapse;
}

.owner-analytics-table th,
.owner-analytics-table td {
    padding: 13px 14px;
    text-align: right;
    border-bottom: 1px solid rgba(255, 255, 255, .07);
}

.owner-analytics-table th:first-child,
.owner-analytics-table td:first-child {
    text-align: left;
}

.owner-analytics-table th {
    color: var(--text-secondary);
    font-size: .78rem;
    font-weight: 700;
}

.owner-analytics-table td {
    color: var(--text-primary);
}

.owner-analytics-note {
    padding: 14px 16px;
    border: 1px solid rgba(148, 163, 184, .12);
    border-radius: 12px;
    color: var(--text-secondary);
    background: rgba(255, 255, 255, .025);
    font-size: .84rem;
    line-height: 1.5;
}

.owner-analytics-note strong {
    color: var(--text-primary);
}

@media (max-width: 980px) {
    .owner-analytics-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .owner-analytics-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 620px) {
    .owner-analytics-summary {
        grid-template-columns: 1fr;
    }

    .owner-analytics-chart-wrap {
        height: 280px;
    }

    .owner-analytics-metric {
        padding: 17px;
    }
}

.owner-analytics-source-block {
    margin-top: 14px;
    padding-top: 16px;
    border-top: 1px solid rgba(255, 255, 255, .07);
}

.owner-analytics-source-block > strong {
    display: block;
    margin-bottom: 9px;
    color: var(--text-primary);
    font-size: .86rem;
}

.owner-analytics-source-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 7px 0;
    color: var(--text-secondary);
    font-size: .82rem;
}

.owner-analytics-source-row strong {
    color: var(--text-primary);
}


/* === Owner engagement analytics (0.4.5) === */
.owner-analytics-metric.is-engagement {
    border-top-color: rgba(139, 92, 246, .78);
}

.analytics-inline-net,
.analytics-table-net,
.owner-analytics-engagement-totals strong {
    font-weight: 800;
}

.analytics-inline-net.is-up,
.analytics-table-net.is-up,
.owner-analytics-engagement-totals strong.is-up { color: #86efac; }
.analytics-inline-net.is-down,
.analytics-table-net.is-down,
.owner-analytics-engagement-totals strong.is-down { color: #fca5a5; }
.analytics-inline-net.is-flat,
.analytics-table-net.is-flat,
.owner-analytics-engagement-totals strong.is-flat { color: #cbd5e1; }

.owner-analytics-week-stat small {
    color: var(--text-secondary);
    font-size: .76rem;
}

.owner-analytics-engagement-card {
    margin: 0 0 18px;
}

.owner-analytics-engagement-totals {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.owner-analytics-engagement-totals > span {
    padding: 7px 10px;
    border: 1px solid rgba(255, 255, 255, .07);
    border-radius: 999px;
    color: var(--text-secondary);
    background: rgba(255, 255, 255, .03);
    font-size: .78rem;
}

.owner-analytics-engagement-chart-wrap {
    position: relative;
    height: 270px;
    margin-top: 14px;
}

.owner-analytics-table {
    min-width: 980px;
}

.owner-analytics-table td small {
    margin-left: 5px;
    color: var(--text-secondary);
    white-space: nowrap;
}

@media (max-width: 980px) {
    .owner-analytics-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .owner-analytics-summary {
        grid-template-columns: 1fr;
    }

    .owner-analytics-engagement-totals {
        justify-content: flex-start;
    }

    .owner-analytics-engagement-chart-wrap {
        height: 240px;
    }
}

/* === Explainable similar-server recommendations (0.4.6) === */
.similar-server-card {
    min-height: 255px;
}

.similar-reasons {
    margin-top: 13px;
    padding: 10px 11px;
    border: 1px solid rgba(212, 106, 61, .14);
    border-radius: 11px;
    background: rgba(212, 106, 61, .055);
}

.similar-reasons-label {
    display: block;
    margin-bottom: 7px;
    color: var(--text-secondary);
    font-size: .69rem;
    font-weight: 800;
    letter-spacing: .055em;
    text-transform: uppercase;
}

.similar-reasons-list {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.similar-reasons-list span {
    padding: 4px 7px;
    border-radius: 999px;
    background: rgba(18, 16, 14, .48);
    color: var(--text-primary);
    font-size: .72rem;
    font-weight: 650;
    line-height: 1.15;
}

@media (max-width: 640px) {
    .similar-server-card {
        min-height: 0;
    }
}

/* === Wastor Tools / Rust Server Inspector (0.5.x) === */
.tools-page {
    width: 100%;
    min-width: 0;
    padding-bottom: 24px;
}

/* Tools pages use their own compact breadcrumb rhythm below the sticky header. */
.tools-page > .breadcrumbs {
    margin: 24px 0 18px;
    color: var(--text-secondary);
    font-size: .86rem;
}

.tools-page > .breadcrumbs ul {
    align-items: center;
    gap: 8px;
}

.tools-page > .breadcrumbs li {
    min-width: 0;
    color: #8f8883;
}

.tools-page > .breadcrumbs li + li::before {
    content: '/';
    margin-right: 8px;
    color: #5e5854;
}

.tools-page > .breadcrumbs a {
    color: var(--rust-primary);
    font-weight: 700;
    text-decoration: none;
    transition: color .16s ease;
}

.tools-page > .breadcrumbs a:hover {
    color: #f08a5d;
}

/* Unified buttons for Wastor Tools. In 0.5.0 these classes were only styled
   inside owner-specific blocks, leaving Inspector CTAs browser-native. */
.tools-page .button-primary,
.tools-page .button-secondary {
    appearance: none;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 16px;
    border-radius: 11px;
    font: inherit;
    font-weight: 800;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease, color .16s ease;
}

.tools-page .button-primary {
    border: 1px solid transparent;
    color: #fff;
    background: linear-gradient(90deg, var(--rust-primary), var(--rust-secondary));
    box-shadow: 0 8px 24px rgba(212, 106, 61, .10);
}

.tools-page .button-primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 28px rgba(212, 106, 61, .18);
    filter: brightness(1.06);
}

.tools-page .button-secondary {
    border: 1px solid rgba(212, 106, 61, .26);
    color: #f0ded4;
    background: rgba(212, 106, 61, .055);
}

.tools-page .button-secondary:hover {
    transform: translateY(-1px);
    border-color: rgba(212, 106, 61, .52);
    color: #fff;
    background: rgba(212, 106, 61, .11);
}

.tools-page .button-primary:focus-visible,
.tools-page .button-secondary:focus-visible,
.tools-page > .breadcrumbs a:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(212, 106, 61, .20);
}

.tools-hero {
    margin: 0 0 24px;
    padding: 28px 30px;
    border: 1px solid rgba(212, 106, 61, .18);
    border-radius: 18px;
    background:
        radial-gradient(circle at 86% 15%, rgba(212, 106, 61, .16), transparent 34%),
        linear-gradient(145deg, rgba(38, 30, 25, .96), rgba(24, 22, 20, .96));
}

.tools-kicker,
.inspector-card-kicker {
    display: block;
    margin-bottom: 8px;
    color: var(--accent, #d46a3d);
    font-size: .72rem;
    font-weight: 850;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.tools-hero h1 {
    margin: 0;
    max-width: 880px;
    color: var(--text-primary);
    font-size: clamp(1.8rem, 3vw, 3rem);
    line-height: 1.05;
}

.tools-hero p {
    max-width: 900px;
    margin: 13px 0 0;
    color: var(--text-secondary);
    font-size: 1rem;
    line-height: 1.65;
}

.tools-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.tool-card {
    position: relative;
    display: flex;
    min-height: 230px;
    flex-direction: column;
    gap: 16px;
    padding: 22px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 16px;
    background: rgba(38, 35, 32, .78);
    color: inherit;
    text-decoration: none;
}

.tool-card.is-ready {
    border-color: rgba(212, 106, 61, .30);
    background: linear-gradient(145deg, rgba(62, 38, 28, .82), rgba(33, 30, 28, .88));
    transition: transform .18s ease, border-color .18s ease, background .18s ease;
}

.tool-card.is-ready:hover {
    transform: translateY(-2px);
    border-color: rgba(212, 106, 61, .58);
    background: linear-gradient(145deg, rgba(70, 41, 29, .90), rgba(34, 31, 29, .94));
}

.tool-card.is-coming { opacity: .70; }
.tool-card-icon { color: #ef8a5e; font-size: 2rem; font-weight: 800; }
.tool-card-status { color: var(--text-secondary); font-size: .70rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.tool-card h2 { margin: 6px 0 8px; font-size: 1.15rem; }
.tool-card p { margin: 0; color: var(--text-secondary); line-height: 1.55; }
.tool-card-arrow { margin-top: auto; color: #f08a5d; font-weight: 800; }

.inspector-form-card { margin-bottom: 18px; }
.inspector-form label { display: block; margin-bottom: 9px; font-weight: 800; }
.inspector-input-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
.inspector-input-row input {
    width: 100%;
    min-width: 0;
    padding: 13px 14px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 11px;
    outline: none;
    background: rgba(10, 9, 8, .45);
    color: var(--text-primary);
    font: inherit;
}
.inspector-input-row input:focus { border-color: rgba(212,106,61,.72); box-shadow: 0 0 0 3px rgba(212,106,61,.12); }
.inspector-form-hint { margin: 10px 0 0; color: var(--text-secondary); font-size: .82rem; line-height: 1.5; }
.inspector-form-hint code { color: #d7c3b8; }

.inspector-status-strip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin: 0 0 18px;
    padding: 15px 18px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 14px;
    background: rgba(28, 26, 24, .88);
}
.inspector-status-strip.is-ok { border-color: rgba(34,197,94,.28); }
.inspector-status-strip.is-failed { border-color: rgba(239,68,68,.25); }
.inspector-status-main { display: flex; align-items: center; gap: 12px; min-width: 0; }
.inspector-status-main > div { min-width: 0; }
.inspector-status-main strong, .inspector-status-main span { display: block; }
.inspector-status-main span { margin-top: 2px; color: var(--text-secondary); overflow-wrap: anywhere; }
.inspector-status-dot { width: 11px; height: 11px; flex: 0 0 11px; border-radius: 999px; background: #ef4444; box-shadow: 0 0 0 5px rgba(239,68,68,.10); }
.is-ok .inspector-status-dot { background: #22c55e; box-shadow: 0 0 0 5px rgba(34,197,94,.10); }
.inspector-status-meta { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.inspector-status-meta span { padding: 7px 9px; border-radius: 999px; background: rgba(255,255,255,.04); color: var(--text-secondary); font-size: .78rem; }
.inspector-status-meta strong { color: var(--text-primary); }

.inspector-grid {
    display: grid;
    grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
    gap: 18px;
    margin-bottom: 18px;
}
.inspector-card { min-width: 0; }
.inspector-server-title { margin: 11px 0 15px; color: var(--text-primary); font-size: 1.22rem; font-weight: 850; line-height: 1.35; }
.inspector-data-list { display: grid; gap: 0; }
.inspector-data-list > div { display: grid; grid-template-columns: 130px minmax(0, 1fr); gap: 12px; padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,.055); }
.inspector-data-list > div:last-child { border-bottom: 0; }
.inspector-data-list span { color: var(--text-secondary); }
.inspector-data-list strong { min-width: 0; text-align: right; overflow-wrap: anywhere; }
.inspector-data-list.compact { margin-top: 12px; }
.inspector-metrics { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 9px; }
.inspector-metrics > div { padding: 12px; border: 1px solid rgba(255,255,255,.06); border-radius: 11px; background: rgba(255,255,255,.025); }
.inspector-metrics span, .inspector-metrics strong { display: block; }
.inspector-metrics span { margin-bottom: 5px; color: var(--text-secondary); font-size: .76rem; }
.inspector-metrics strong { overflow-wrap: anywhere; }
.inspector-attempts { display: grid; gap: 8px; margin-top: 13px; }
.inspector-attempt { display: flex; justify-content: space-between; gap: 12px; padding: 9px 11px; border: 1px solid rgba(255,255,255,.06); border-radius: 9px; color: var(--text-secondary); font-size: .78rem; }
.inspector-attempt strong { max-width: 68%; text-align: right; color: var(--text-secondary); font-weight: 650; overflow-wrap: anywhere; }
.inspector-attempt.is-ok { border-color: rgba(34,197,94,.18); color: #86efac; }
.inspector-attempt.is-ok strong { color: #86efac; }
.inspector-warning { margin-top: 13px; padding: 11px 13px; border: 1px solid rgba(245,158,11,.22); border-radius: 10px; background: rgba(245,158,11,.06); color: #fcd89a; font-size: .82rem; line-height: 1.5; }

.inspector-classification-card { margin-bottom: 18px; }
.inspector-classification-heading { align-items: flex-start; }
.inspector-explain-badge { padding: 6px 9px; border-radius: 999px; border: 1px solid rgba(34,197,94,.20); color: #9cf4b9; background: rgba(34,197,94,.06); font-size: .72rem; font-weight: 800; }
.inspector-classification-grid { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 10px; margin-top: 14px; }
.inspector-classification-item { min-width: 0; padding: 13px; border: 1px solid rgba(255,255,255,.07); border-radius: 11px; background: rgba(255,255,255,.025); }
.inspector-classification-item > span, .inspector-classification-item > strong, .inspector-classification-item > small { display: block; }
.inspector-classification-item > span { color: var(--text-secondary); font-size: .70rem; }
.inspector-classification-item > strong { margin: 5px 0 8px; font-size: .98rem; overflow-wrap: anywhere; }
.inspector-classification-item > small { color: var(--text-secondary); font-size: .70rem; line-height: 1.45; overflow-wrap: anywhere; }
.inspector-classification-item.is-detected { border-color: rgba(212,106,61,.18); background: rgba(212,106,61,.045); }
.inspector-classification-item.is-unknown strong { color: #a8a29e; }
.inspector-raw-tags { margin-top: 14px; padding-top: 12px; border-top: 1px solid rgba(255,255,255,.06); }
.inspector-raw-tags summary { cursor: pointer; color: #d7c3b8; font-size: .82rem; font-weight: 700; }
.inspector-raw-tags code { display: block; margin-top: 10px; padding: 12px; overflow-wrap: anywhere; white-space: normal; border-radius: 9px; background: rgba(8,8,8,.34); color: #c8beb8; font-size: .72rem; line-height: 1.55; }
.inspector-catalog-cta { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 18px; }
.inspector-catalog-cta .section-title { margin-bottom: 4px; }
.inspector-security-note { padding: 15px 18px; border: 1px dashed rgba(255,255,255,.10); border-radius: 13px; color: var(--text-secondary); font-size: .82rem; line-height: 1.55; }
.inspector-security-note strong { display: block; margin-bottom: 4px; color: var(--text-primary); }
.inspector-security-note p { margin: 0; }

@media (max-width: 1050px) {
    .tools-grid { grid-template-columns: 1fr; }
    .tool-card { min-height: 0; }
    .inspector-classification-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
}

@media (max-width: 780px) {
    .inspector-grid { grid-template-columns: 1fr; }
    .inspector-status-strip, .inspector-catalog-cta { align-items: stretch; flex-direction: column; }
    .inspector-status-meta { justify-content: flex-start; }
    .inspector-classification-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

@media (max-width: 560px) {
    .tools-page > .breadcrumbs { margin-top: 16px; }
    .tools-hero { padding: 22px 18px; }
    .inspector-input-row { grid-template-columns: 1fr; }
    .inspector-input-row .button-primary { width: 100%; }
    .inspector-data-list > div { grid-template-columns: 1fr; gap: 3px; }
    .inspector-data-list strong { text-align: left; }
    .inspector-metrics, .inspector-classification-grid { grid-template-columns: 1fr; }
    .inspector-attempt { align-items: flex-start; flex-direction: column; }
    .inspector-attempt strong { max-width: 100%; text-align: left; }
}

/* === Wastor Tools / RustDedicated Builder (0.5.2) === */
.builder-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 310px;
    gap: 18px;
    align-items: start;
    margin-bottom: 18px;
}

.builder-form-card,
.builder-summary-card,
.builder-output-card {
    min-width: 0;
}

.builder-summary-card {
    position: sticky;
    top: 98px;
}

.builder-reset {
    min-height: 38px !important;
    padding: 8px 12px !important;
    font-size: .78rem !important;
}

.builder-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 15px;
    margin-top: 16px;
}

.builder-form-grid-advanced {
    margin-top: 16px;
}

.builder-field,
.builder-switch {
    min-width: 0;
}

.builder-field-wide {
    grid-column: 1 / -1;
}

.builder-field > span {
    display: block;
    margin-bottom: 7px;
    color: var(--text-primary);
    font-size: .82rem;
    font-weight: 800;
}

.builder-field input,
.builder-field select {
    width: 100%;
    min-width: 0;
    height: 44px;
    padding: 10px 12px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 10px;
    outline: none;
    background: rgba(10, 9, 8, .46);
    color: var(--text-primary);
    font: inherit;
}

.builder-field select {
    cursor: pointer;
}

.builder-field input:focus,
.builder-field select:focus {
    border-color: rgba(212,106,61,.70);
    box-shadow: 0 0 0 3px rgba(212,106,61,.12);
}

.builder-field small,
.builder-switch small {
    display: block;
    margin-top: 6px;
    color: var(--text-secondary);
    font-size: .72rem;
    line-height: 1.45;
}

.builder-advanced {
    margin-top: 18px;
    padding-top: 15px;
    border-top: 1px solid rgba(255,255,255,.07);
}

.builder-advanced summary {
    cursor: pointer;
    color: #e3d7d0;
    font-size: .88rem;
    font-weight: 800;
    user-select: none;
}

.builder-advanced summary:hover {
    color: #fff;
}

.builder-switch {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    padding: 12px 13px;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 11px;
    background: rgba(255,255,255,.025);
    cursor: pointer;
}

.builder-switch input {
    width: 18px;
    height: 18px;
    margin: 2px 0 0;
    accent-color: var(--rust-primary);
}

.builder-switch > span {
    min-width: 0;
}

.builder-switch strong {
    display: block;
    color: var(--text-primary);
    font-size: .84rem;
}

.builder-validation {
    display: grid;
    gap: 6px;
    margin-top: 16px;
    padding: 12px 14px;
    border: 1px solid rgba(245,158,11,.24);
    border-radius: 11px;
    background: rgba(245,158,11,.055);
    color: #f3c98c;
    font-size: .78rem;
    line-height: 1.45;
}

.builder-port-list {
    display: grid;
    gap: 0;
    margin: 14px 0 16px;
}

.builder-port-list > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid rgba(255,255,255,.055);
}

.builder-port-list > div:last-child {
    border-bottom: 0;
}

.builder-port-list span {
    color: var(--text-secondary);
}

.builder-port-list strong,
.builder-port-list strong span {
    color: var(--text-primary);
}

.builder-summary-card .button-secondary {
    width: 100%;
    margin-top: 12px;
}

.builder-output-card {
    margin-bottom: 18px;
}

.builder-output-heading {
    align-items: flex-start;
}

.builder-copy {
    min-height: 38px !important;
    padding: 8px 12px !important;
    white-space: nowrap;
    font-size: .78rem !important;
}

.builder-output-note {
    margin: 8px 0 12px;
    font-size: .79rem;
    line-height: 1.55;
}

.builder-output-note code {
    color: #e6c7b7;
}

.builder-code {
    max-width: 100%;
    margin: 14px 0 0;
    padding: 16px 17px;
    overflow: auto;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 12px;
    background: rgba(7, 7, 7, .60);
    color: #ded5d0;
    font-size: .78rem;
    line-height: 1.65;
    tab-size: 4;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.builder-code code {
    font: inherit;
    color: inherit;
}

.builder-note {
    margin-top: 0;
}

@media (max-width: 1050px) {
    .builder-layout {
        grid-template-columns: 1fr;
    }

    .builder-summary-card {
        position: static;
    }
}

@media (max-width: 640px) {
    .builder-form-grid {
        grid-template-columns: 1fr;
    }

    .builder-field-wide {
        grid-column: auto;
    }

    .builder-output-heading {
        align-items: stretch;
        flex-direction: column;
        gap: 12px;
    }

    .builder-copy,
    .builder-reset {
        width: 100%;
    }

    .builder-code {
        padding: 13px;
        font-size: .72rem;
    }
}


/* RustDedicated Builder install guide — 0.5.3 */
.builder-output-actions { display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-end; }
.builder-install-guide { margin-top:18px; margin-bottom:20px; }
.builder-guide-heading { align-items:flex-start; gap:18px; }
.builder-guide-heading > div:first-child { max-width:760px; }
.builder-guide-heading .muted-text { margin:8px 0 0; line-height:1.65; }
.builder-guide-tabs { display:inline-flex; gap:6px; padding:4px; border:1px solid rgba(255,255,255,.07); border-radius:12px; background:rgba(0,0,0,.22); }
.builder-guide-tabs .button-secondary { min-height:36px; padding:7px 11px; border-color:transparent; background:transparent; white-space:nowrap; }
.builder-guide-tabs .button-secondary.is-active { border-color:rgba(212,106,61,.38); background:rgba(212,106,61,.15); color:#fff; }
.builder-guide-panel { margin-top:22px; }
.builder-steps { display:grid; gap:0; margin:0; padding:0; list-style:none; }
.builder-steps > li { display:grid; grid-template-columns:38px minmax(0,1fr); gap:14px; padding:20px 0; border-top:1px solid rgba(255,255,255,.065); }
.builder-steps > li:first-child { border-top:0; padding-top:4px; }
.builder-step-number { display:grid; width:32px; height:32px; place-items:center; border:1px solid rgba(212,106,61,.35); border-radius:50%; background:rgba(212,106,61,.10); color:#f0b08e; font-size:.76rem; font-weight:900; }
.builder-steps h3 { margin:2px 0 7px; color:var(--text-primary); font-size:.98rem; }
.builder-steps p { margin:0 0 10px; color:var(--text-secondary); line-height:1.65; }
.builder-steps .builder-code { margin:10px 0; }
.builder-step-hint { padding:10px 12px; border-left:2px solid rgba(212,106,61,.50); background:rgba(212,106,61,.05); border-radius:0 8px 8px 0; }
.builder-guide-footer { margin-top:4px; padding-top:15px; border-top:1px solid rgba(255,255,255,.065); color:var(--text-secondary); font-size:.78rem; }
.builder-guide-footer p { margin:0; }
.builder-guide-footer a { color:#e7b399; text-decoration:none; }
.builder-guide-footer a:hover { color:#fff; text-decoration:underline; }
@media (max-width:720px) {
    .builder-guide-heading { flex-direction:column; align-items:stretch; }
    .builder-guide-tabs { display:grid; grid-template-columns:1fr 1fr; width:100%; }
    .builder-output-actions { width:100%; display:grid; grid-template-columns:1fr; }
    .builder-steps > li { grid-template-columns:32px minmax(0,1fr); gap:10px; }
}

/* === Wastor Tools / server.cfg Generator (0.5.4) === */
.cfg-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 18px;
    align-items: start;
    margin-bottom: 18px;
}

.cfg-form-card,
.cfg-summary-card,
.cfg-output-card,
.cfg-help-card {
    min-width: 0;
}

.cfg-summary-card {
    position: sticky;
    top: 98px;
}

.cfg-reset {
    min-height: 38px !important;
    padding: 8px 12px !important;
    font-size: .78rem !important;
}

.cfg-section {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid rgba(255,255,255,.07);
}

.cfg-section:first-of-type {
    margin-top: 14px;
    padding-top: 0;
    border-top: 0;
}

.cfg-section-heading {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.cfg-section-heading > span {
    display: inline-grid;
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
    place-items: center;
    border: 1px solid rgba(212,106,61,.22);
    border-radius: 10px;
    background: rgba(212,106,61,.07);
    color: #e2a180;
    font-size: .72rem;
    font-weight: 900;
}

.cfg-section-heading h3 {
    margin: 0 0 4px;
    color: var(--text-primary);
    font-size: .98rem;
}

.cfg-section-heading p {
    margin: 0;
    color: var(--text-secondary);
    font-size: .76rem;
    line-height: 1.5;
}

.cfg-textarea {
    width: 100%;
    min-width: 0;
    padding: 11px 12px;
    resize: vertical;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 10px;
    outline: none;
    background: rgba(10, 9, 8, .46);
    color: var(--text-primary);
    font: inherit;
    line-height: 1.5;
}

.cfg-textarea:focus {
    border-color: rgba(212,106,61,.70);
    box-shadow: 0 0 0 3px rgba(212,106,61,.12);
}

.cfg-custom-lines {
    min-height: 132px;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
    font-size: .8rem;
}

.cfg-path-box {
    margin: 14px 0;
    padding: 13px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 11px;
    background: rgba(255,255,255,.025);
}

.cfg-path-box span,
.cfg-path-box code {
    display: block;
}

.cfg-path-box span {
    margin-bottom: 7px;
    color: var(--text-secondary);
    font-size: .7rem;
}

.cfg-path-box code {
    overflow-wrap: anywhere;
    color: #e7d8cf;
    font-size: .77rem;
    line-height: 1.5;
}

.cfg-note {
    margin: 15px 0;
    padding: 13px;
    border: 1px solid rgba(245,158,11,.16);
    border-radius: 11px;
    background: rgba(245,158,11,.04);
}

.cfg-note strong {
    display: block;
    margin-bottom: 4px;
    color: #f0c67b;
    font-size: .78rem;
}

.cfg-note p {
    margin: 0;
    color: var(--text-secondary);
    font-size: .72rem;
    line-height: 1.5;
}

.cfg-output-card,
.cfg-help-card {
    margin-bottom: 18px;
}

.cfg-output-heading {
    gap: 14px;
}

.cfg-code {
    min-height: 250px;
}

.cfg-steps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 15px;
}

.cfg-steps article {
    display: flex;
    gap: 10px;
    min-width: 0;
    padding: 14px;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 11px;
    background: rgba(255,255,255,.022);
}

.cfg-steps article > span {
    display: grid;
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    place-items: center;
    border-radius: 9px;
    background: rgba(212,106,61,.10);
    color: #e6a785;
    font-size: .72rem;
    font-weight: 900;
}

.cfg-steps strong {
    display: block;
    margin-bottom: 4px;
    color: var(--text-primary);
    font-size: .82rem;
}

.cfg-steps p {
    margin: 0;
    color: var(--text-secondary);
    font-size: .72rem;
    line-height: 1.5;
}

.cfg-help-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 15px;
}

.cfg-weather-note {
    margin: 15px 0 0;
    padding-top: 14px;
    border-top: 1px solid rgba(255,255,255,.06);
    color: var(--text-secondary);
    font-size: .76rem;
    line-height: 1.55;
}

.cfg-weather-note strong {
    color: var(--text-primary);
}

@media (max-width: 1000px) {
    .cfg-layout { grid-template-columns: 1fr; }
    .cfg-summary-card { position: static; }
}

@media (max-width: 760px) {
    .cfg-steps { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
    .cfg-section-heading { gap: 9px; }
    .cfg-section-heading > span { flex-basis: 30px; width: 30px; height: 30px; }
    .cfg-output-heading { align-items: stretch; flex-direction: column; }
    .cfg-output-heading .builder-output-actions { width: 100%; }
    .cfg-output-heading .button-primary,
    .cfg-output-heading .button-secondary { flex: 1 1 auto; }
}

/* === Wastor Tools / Rust commands reference (0.5.5) === */
.command-reference-hero code,
.command-find-tip code,
.command-source-note code {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
    color: #efd3c4;
}

.command-search-card {
    margin-bottom: 18px;
}

.command-search-main {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 16px;
    align-items: end;
}

.command-search-field {
    display: grid;
    gap: 7px;
}

.command-search-field > span {
    color: var(--text-secondary);
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.command-search-input-wrap {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 9px;
    align-items: center;
    min-height: 48px;
    padding: 0 12px;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 12px;
    background: rgba(10,9,8,.48);
    transition: border-color .18s ease, box-shadow .18s ease;
}

.command-search-input-wrap:focus-within {
    border-color: rgba(212,106,61,.72);
    box-shadow: 0 0 0 3px rgba(212,106,61,.11);
}

.command-search-input-wrap > span {
    color: #d99b7b;
    font-size: 1.25rem;
    line-height: 1;
}

.command-search-input-wrap input {
    width: 100%;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--text-primary);
    font: inherit;
}

.command-search-input-wrap input::placeholder {
    color: rgba(220,214,208,.42);
}

.command-search-input-wrap input::-webkit-search-cancel-button {
    display: none;
}

.command-clear {
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--text-secondary);
    cursor: pointer;
    font-size: 1.2rem;
}

.command-clear:hover {
    background: rgba(255,255,255,.06);
    color: #fff;
}

.command-result-count {
    min-width: 116px;
    padding-bottom: 5px;
    text-align: right;
    color: var(--text-secondary);
    font-size: .72rem;
}

.command-result-count strong {
    display: block;
    margin-bottom: 2px;
    color: #fff;
    font-size: 1.35rem;
    line-height: 1;
}

.command-filter-row,
.command-category-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.command-filter-row {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid rgba(255,255,255,.06);
}

.command-category-row {
    margin-top: 10px;
}

.command-filter,
.command-category {
    min-height: 34px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 999px;
    background: rgba(255,255,255,.025);
    color: var(--text-secondary);
    cursor: pointer;
    font: inherit;
    font-size: .7rem;
    font-weight: 700;
    transition: background .16s ease, border-color .16s ease, color .16s ease, transform .16s ease;
}

.command-filter:hover,
.command-category:hover {
    border-color: rgba(212,106,61,.28);
    color: #fff;
    transform: translateY(-1px);
}

.command-filter.is-active,
.command-category.is-active {
    border-color: rgba(212,106,61,.42);
    background: rgba(212,106,61,.13);
    color: #f4d2c0;
}

.command-category span {
    margin-left: 4px;
    color: rgba(255,255,255,.42);
    font-size: .64rem;
}

.command-reference-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 18px;
}

.command-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 18px;
    border: 1px solid rgba(255,255,255,.075);
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(255,255,255,.032), rgba(255,255,255,.015));
    box-shadow: 0 14px 32px rgba(0,0,0,.12);
}

.command-card[hidden] {
    display: none !important;
}

.command-card-top {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    justify-content: space-between;
}

.command-title-block {
    min-width: 0;
}

.command-category-label {
    display: block;
    margin-bottom: 5px;
    color: #cf8f70;
    font-size: .64rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.command-title-block h2 {
    margin: 0;
    color: var(--text-primary);
    font-size: .98rem;
    line-height: 1.3;
}

.command-copy-button {
    flex: 0 0 auto;
    min-height: 32px;
    padding: 6px 9px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 8px;
    background: rgba(255,255,255,.025);
    color: var(--text-secondary);
    cursor: pointer;
    font: inherit;
    font-size: .66rem;
    font-weight: 800;
}

.command-copy-button:hover {
    border-color: rgba(212,106,61,.32);
    background: rgba(212,106,61,.08);
    color: #fff;
}

.command-code-line {
    margin: 14px 0 11px;
    padding: 10px 11px;
    overflow: hidden;
    border: 1px solid rgba(212,106,61,.11);
    border-radius: 9px;
    background: rgba(0,0,0,.28);
}

.command-code-line code {
    display: block;
    overflow-wrap: anywhere;
    color: #f0c8b5;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
    font-size: .78rem;
    line-height: 1.45;
}

.command-description {
    margin: 0;
    color: var(--text-secondary);
    font-size: .77rem;
    line-height: 1.55;
}

.command-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 13px;
}

.command-badge {
    padding: 4px 7px;
    border: 1px solid rgba(255,255,255,.075);
    border-radius: 999px;
    background: rgba(255,255,255,.025);
    color: rgba(236,230,224,.68);
    font-size: .58rem;
    font-weight: 900;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.command-badge.is-convar { color: #9fc5ff; border-color: rgba(96,165,250,.19); background: rgba(59,130,246,.06); }
.command-badge.is-command { color: #e5b7ff; border-color: rgba(192,132,252,.18); background: rgba(168,85,247,.05); }
.command-badge.is-config { color: #9ee0bb; border-color: rgba(74,222,128,.18); background: rgba(34,197,94,.05); }
.command-badge.is-runtime { color: #f0c67b; border-color: rgba(245,158,11,.18); background: rgba(245,158,11,.05); }
.command-badge.is-admin { color: #efaaa4; border-color: rgba(248,113,113,.18); background: rgba(239,68,68,.05); }

.command-example {
    display: grid;
    gap: 5px;
    margin-top: 13px;
    padding-top: 12px;
    border-top: 1px solid rgba(255,255,255,.055);
}

.command-example span {
    color: var(--text-secondary);
    font-size: .63rem;
    font-weight: 800;
    text-transform: uppercase;
}

.command-example code {
    overflow-wrap: anywhere;
    color: #ded8d2;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
    font-size: .72rem;
    line-height: 1.45;
}

.command-meta-row {
    display: flex;
    gap: 12px;
    justify-content: space-between;
    margin-top: 10px;
    color: var(--text-secondary);
    font-size: .68rem;
}

.command-meta-row strong {
    color: #e7ddd7;
    font-weight: 700;
    text-align: right;
}

.command-note {
    margin: 11px 0 0;
    padding: 9px 10px;
    border-left: 2px solid rgba(212,106,61,.42);
    border-radius: 0 8px 8px 0;
    background: rgba(212,106,61,.045);
    color: var(--text-secondary);
    font-size: .68rem;
    line-height: 1.5;
}

.command-empty {
    margin-bottom: 18px;
    text-align: center;
}

.command-empty strong {
    display: block;
    margin-bottom: 5px;
    color: #fff;
}

.command-empty p {
    max-width: 640px;
    margin: 0 auto 13px;
    color: var(--text-secondary);
    font-size: .76rem;
    line-height: 1.55;
}

.command-find-tip {
    display: flex;
    gap: 20px;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
}

.command-find-tip > div {
    max-width: 800px;
}

.command-find-tip p {
    margin: 7px 0 0;
    color: var(--text-secondary);
    font-size: .76rem;
    line-height: 1.6;
}

.command-source-note {
    margin-top: 0;
}

@media (max-width: 900px) {
    .command-reference-grid { grid-template-columns: 1fr; }
}

@media (max-width: 680px) {
    .command-search-main { grid-template-columns: 1fr; }
    .command-result-count { padding: 0; text-align: left; }
    .command-result-count strong { display: inline; margin-right: 4px; font-size: 1rem; }
    .command-filter-row,
    .command-category-row { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; scrollbar-width: thin; }
    .command-filter,
    .command-category { flex: 0 0 auto; white-space: nowrap; }
    .command-card { padding: 15px; }
    .command-card-top { align-items: stretch; flex-direction: column; }
    .command-copy-button { align-self: flex-start; }
    .command-find-tip { align-items: stretch; flex-direction: column; }
    .command-find-tip .button-secondary { width: 100%; }
}


/* === About page / project & tools refresh (0.5.6) === */
.about-page {
    width: 100%;
    min-width: 0;
}

.about-services-card {
    margin-top: 24px;
}

.about-section-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 8px;
}

.about-section-heading .section-title {
    margin-bottom: 0;
}

.about-all-tools-link {
    flex: 0 0 auto;
    color: var(--rust-primary);
    font-weight: 800;
    text-decoration: none;
}

.about-all-tools-link:hover {
    color: #f08a5d;
}

.about-services-intro {
    max-width: 920px;
    margin-bottom: 18px;
}

.about-tools-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.about-tool-card {
    min-height: 210px;
}

.about-tool-card h3 {
    margin: 6px 0 8px;
    color: var(--text-primary);
    font-size: 1.08rem;
}

.about-tool-card p {
    margin: 0;
    color: var(--text-secondary);
    line-height: 1.55;
}

@media (max-width: 760px) {
    .about-section-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
    }

    .about-tools-grid {
        grid-template-columns: 1fr;
    }

    .about-tool-card {
        min-height: 0;
    }
}

/* === Owner onboarding checklist (0.5.7) === */
.owner-onboarding-card {
    overflow: hidden;
}

.owner-onboarding-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
}

.owner-onboarding-heading .section-title {
    margin: 4px 0 8px;
}

.owner-onboarding-score {
    display: grid;
    flex: 0 0 auto;
    min-width: 92px;
    padding: 12px 14px;
    border: 1px solid rgba(212, 106, 61, .22);
    border-radius: 14px;
    background: rgba(212, 106, 61, .07);
    text-align: center;
}

.owner-onboarding-score strong {
    color: #f0b08d;
    font-size: 1.35rem;
    line-height: 1;
}

.owner-onboarding-score span {
    margin-top: 5px;
    color: var(--text-secondary);
    font-size: .67rem;
    font-weight: 800;
}

.owner-onboarding-score.is-complete {
    border-color: rgba(74, 222, 128, .2);
    background: rgba(34, 197, 94, .06);
}

.owner-onboarding-score.is-complete strong {
    color: #9ee0bb;
}

.owner-onboarding-progress,
.owned-server-onboarding-progress {
    overflow: hidden;
    height: 7px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .07);
}

.owner-onboarding-progress {
    margin: 18px 0 20px;
}

.owner-onboarding-progress > span,
.owned-server-onboarding-progress > span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #a84f2d, #e78a58);
}

.owner-onboarding-complete {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    margin-bottom: 16px;
    padding: 13px 14px;
    border: 1px solid rgba(74, 222, 128, .14);
    border-radius: 12px;
    background: rgba(34, 197, 94, .045);
}

.owner-onboarding-complete > span {
    display: grid;
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    place-items: center;
    border-radius: 50%;
    background: rgba(74, 222, 128, .12);
    color: #9ee0bb;
    font-weight: 900;
}

.owner-onboarding-complete strong {
    color: var(--text-primary);
}

.owner-onboarding-complete p {
    margin: 4px 0 0;
    color: var(--text-secondary);
    font-size: .74rem;
    line-height: 1.55;
}

.owner-onboarding-list {
    display: grid;
    gap: 9px;
}

.owner-onboarding-item {
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 13px 14px;
    border: 1px solid rgba(255, 255, 255, .07);
    border-radius: 12px;
    background: rgba(255, 255, 255, .018);
    color: inherit;
    text-decoration: none;
    transition: border-color .18s ease, background .18s ease, transform .18s ease;
}

.owner-onboarding-item:hover {
    border-color: rgba(212, 106, 61, .24);
    background: rgba(212, 106, 61, .035);
    transform: translateY(-1px);
}

.owner-onboarding-item.is-done {
    border-color: rgba(74, 222, 128, .1);
    background: rgba(34, 197, 94, .025);
}

.owner-onboarding-check {
    display: grid;
    width: 28px;
    height: 28px;
    place-items: center;
    border: 1px solid rgba(212, 106, 61, .28);
    border-radius: 50%;
    color: #d98962;
    font-size: .92rem;
    font-weight: 900;
}

.owner-onboarding-item.is-done .owner-onboarding-check {
    border-color: rgba(74, 222, 128, .2);
    background: rgba(34, 197, 94, .08);
    color: #9ee0bb;
}

.owner-onboarding-item-copy {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.owner-onboarding-item-copy strong {
    color: var(--text-primary);
    font-size: .84rem;
}

.owner-onboarding-item-copy small {
    color: var(--text-secondary);
    font-size: .7rem;
    line-height: 1.5;
}

.owner-onboarding-item-action {
    color: #dc8a61;
    font-size: .68rem;
    font-weight: 900;
    white-space: nowrap;
}

.owner-onboarding-recommendations {
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid rgba(255, 255, 255, .065);
}

.owner-onboarding-recommendations-title {
    display: block;
    margin-bottom: 10px;
    color: var(--text-secondary);
    font-size: .65rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.owner-onboarding-recommendation-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.owner-onboarding-recommendation {
    display: grid;
    gap: 6px;
    padding: 13px 14px;
    border: 1px solid rgba(255, 255, 255, .07);
    border-radius: 12px;
    background: rgba(255, 255, 255, .018);
    color: inherit;
    text-decoration: none;
}

.owner-onboarding-recommendation:hover {
    border-color: rgba(212, 106, 61, .22);
    background: rgba(212, 106, 61, .03);
}

.owner-onboarding-recommendation strong {
    color: var(--text-primary);
    font-size: .8rem;
}

.owner-onboarding-recommendation span {
    color: var(--text-secondary);
    font-size: .69rem;
    line-height: 1.5;
}

.owner-onboarding-recommendation small {
    color: #dc8a61;
    font-size: .67rem;
    font-weight: 900;
}

.owned-server-onboarding {
    display: grid;
    gap: 6px;
    width: min(520px, 100%);
    margin-top: 10px;
}

.owned-server-onboarding-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    color: var(--text-secondary);
    font-size: .64rem;
    font-weight: 800;
}

.owned-server-onboarding-head strong {
    color: #e6a27d !important;
    font-size: .7rem !important;
}

.owned-server-onboarding-progress {
    height: 5px;
}

.owned-server-onboarding > a,
.owned-server-onboarding-complete {
    width: fit-content;
    color: #d9845c;
    font-size: .65rem;
    font-weight: 800;
    text-decoration: none;
}

.owned-server-onboarding > a:hover {
    color: #f0a178;
}

.owned-server-onboarding-complete {
    color: #8ed6aa;
}

@media (max-width: 760px) {
    .owner-onboarding-heading {
        align-items: stretch;
        flex-direction: column;
        gap: 12px;
    }

    .owner-onboarding-score {
        display: flex;
        align-items: center;
        justify-content: space-between;
        min-width: 0;
        text-align: left;
    }

    .owner-onboarding-score span {
        margin-top: 0;
    }

    .owner-onboarding-item {
        grid-template-columns: 30px minmax(0, 1fr);
    }

    .owner-onboarding-item-action {
        grid-column: 2;
        white-space: normal;
    }

    .owner-onboarding-recommendation-grid {
        grid-template-columns: 1fr;
    }
}

/* Wastor AI owner center */
.owner-ai-heading-link {
    border-color: rgba(173, 109, 255, .24);
    background: rgba(128, 77, 190, .08);
}

.owner-ai-heading-link:hover {
    border-color: rgba(190, 133, 255, .38);
    background: rgba(128, 77, 190, .14);
}

.owner-ai-page {
    min-width: 0;
}

.owner-ai-page > .stats-card {
    margin: 0;
}

.owner-ai-page .stats-card:hover {
    transform: none;
    box-shadow: var(--shadow);
}

.owner-ai-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    overflow: hidden;
    position: relative;
    border-color: rgba(167, 112, 230, .12);
    background: linear-gradient(145deg, rgba(255,255,255,.028), rgba(255,255,255,.012));
}

.owner-ai-hero-copy {
    display: block;
    max-width: 760px;
    min-width: 0;
}

.owner-ai-hero h2 {
    margin: 4px 0 7px;
    color: var(--text-primary);
    font-size: clamp(1.35rem, 2.4vw, 2rem);
}

.owner-ai-hero p {
    margin: 0;
    color: var(--text-secondary);
    font-size: .78rem;
    line-height: 1.65;
}

.owner-ai-provider-status {
    display: flex;
    flex: 0 0 auto;
    gap: 10px;
    align-items: center;
    min-width: 205px;
    padding: 12px 14px;
    border: 1px solid rgba(255,255,255,.075);
    border-radius: 12px;
    background: rgba(0,0,0,.14);
}

.owner-ai-status-dot {
    flex: 0 0 9px;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #c27c61;
    box-shadow: 0 0 0 4px rgba(194,124,97,.09);
}

.owner-ai-hero.is-ready .owner-ai-status-dot {
    background: #6ac08a;
    box-shadow: 0 0 0 4px rgba(106,192,138,.09);
}

.owner-ai-provider-status strong,
.owner-ai-provider-status small {
    display: block;
}

.owner-ai-provider-status strong {
    color: var(--text-primary);
    font-size: .77rem;
}

.owner-ai-provider-status small {
    margin-top: 3px;
    color: var(--text-secondary);
    font-size: .64rem;
}

.owner-ai-tools-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 18px;
}

.owner-ai-tool-card {
    min-width: 0;
    padding: 14px;
    border: 1px solid rgba(255,255,255,.065);
    border-radius: 12px;
    background: rgba(255,255,255,.018);
}

.owner-ai-tool-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.owner-ai-tool-heading strong {
    color: var(--text-primary);
    font-size: .82rem;
}

.owner-ai-tool-heading span {
    flex: 0 0 auto;
    color: #d6b5ff;
    font-size: .7rem;
    font-weight: 900;
}

.owner-ai-tool-card p {
    min-height: 2.7em;
    margin: 7px 0 11px;
    color: var(--text-secondary);
    font-size: .69rem;
    line-height: 1.5;
}

.owner-ai-tool-card small {
    display: block;
    margin-top: 7px;
    color: var(--text-muted, var(--text-secondary));
    font-size: .62rem;
}

.owner-ai-quota-bar {
    overflow: hidden;
    height: 5px;
    border-radius: 999px;
    background: rgba(255,255,255,.065);
}

.owner-ai-quota-bar > span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #8e62bd, #d09bec);
}

.owner-ai-principles {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 18px;
}

.owner-ai-principles > div {
    display: grid;
    gap: 5px;
    padding: 13px 14px;
    border: 1px solid rgba(255,255,255,.06);
    border-radius: 12px;
    background: rgba(255,255,255,.016);
}

.owner-ai-principles strong {
    color: var(--text-primary);
    font-size: .76rem;
}

.owner-ai-principles span {
    color: var(--text-secondary);
    font-size: .67rem;
    line-height: 1.5;
}

@media (max-width: 760px) {
    .owner-ai-hero {
        align-items: stretch;
        flex-direction: column;
    }

    .owner-ai-provider-status {
        width: 100%;
        min-width: 0;
    }

    .owner-ai-tools-grid,
    .owner-ai-principles {
        grid-template-columns: 1fr;
    }

    .owner-ai-tool-card p {
        min-height: 0;
    }
}

/* Wastor AI description generator */
.owner-ai-generator {
    min-width: 0;
}

.owner-ai-facts {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 16px 0 18px;
}

.owner-ai-facts > span {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    padding: 7px 9px;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 9px;
    background: rgba(255,255,255,.02);
    color: var(--text-primary);
    font-size: .69rem;
    line-height: 1.3;
}

.owner-ai-facts small {
    color: var(--text-secondary);
    font-size: .58rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .035em;
}

.owner-ai-description-form textarea,
.owner-ai-rules-form textarea,
.owner-ai-config-form textarea,
.owner-ai-result textarea {
    width: 100%;
    resize: vertical;
}

.owner-ai-description-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.owner-ai-writing-rules {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin: 2px 0 16px;
}

.owner-ai-writing-rules span {
    padding: 5px 8px;
    border: 1px solid rgba(167,112,230,.12);
    border-radius: 999px;
    background: rgba(128,77,190,.055);
    color: var(--text-secondary);
    font-size: .62rem;
}

.owner-ai-inline-error {
    margin-top: 10px;
}

.owner-ai-result {
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid rgba(255,255,255,.06);
}

.owner-ai-result-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 10px;
}

.owner-ai-result-heading strong {
    display: block;
    margin-top: 4px;
    color: var(--text-primary);
    font-size: .82rem;
}

.owner-ai-result-heading small {
    color: var(--text-secondary);
    font-size: .61rem;
}

.owner-ai-result textarea {
    min-height: 210px;
    line-height: 1.65;
}

.owner-ai-tool-card.is-active {
    border-color: rgba(174,117,237,.15);
    background: rgba(128,77,190,.035);
}

@media (max-width: 760px) {
    .owner-ai-description-options {
        grid-template-columns: 1fr;
    }

    .owner-ai-result-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 5px;
    }
}

.owner-ai-rules-options {
    grid-template-columns: minmax(240px, 420px);
}

/* Wastor AI wipe announcement */
.owner-ai-wipe-form {
    display: grid;
    gap: 16px;
    margin-top: 18px;
}

.owner-ai-check {
    display: inline-flex;
    align-items: flex-start;
    gap: 10px;
    width: fit-content;
    color: var(--text-secondary);
    font-size: .72rem;
    line-height: 1.45;
    cursor: pointer;
}

.owner-ai-check input[type="checkbox"] {
    width: 16px;
    height: 16px;
    margin: 2px 0 0;
    accent-color: var(--rust-primary);
    cursor: pointer;
}

.owner-ai-wipe-form + .owner-ai-result textarea {
    width: 100%;
    min-height: 190px;
    resize: vertical;
    padding: 12px 14px;
    border: 1px solid var(--rust-light-gray);
    border-radius: 11px;
    color: var(--text-primary);
    background: var(--rust-darker);
    font: inherit;
    line-height: 1.65;
    outline: none;
}

.owner-ai-wipe-form + .owner-ai-result textarea:focus {
    border-color: var(--rust-primary);
    box-shadow: 0 0 0 3px rgba(212, 106, 61, .12);
}


/* Wastor AI profile audit */
.owner-ai-audit-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 9px;
    margin: 18px 0 16px;
}

.owner-ai-audit-fact {
    min-width: 0;
    padding: 11px 12px;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 11px;
    background: rgba(255,255,255,.018);
}

.owner-ai-audit-fact small,
.owner-ai-audit-fact strong {
    display: block;
}

.owner-ai-audit-fact small {
    color: var(--text-secondary);
    font-size: .58rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .035em;
}

.owner-ai-audit-fact strong {
    margin-top: 5px;
    color: var(--text-primary);
    font-size: .75rem;
    overflow-wrap: anywhere;
}

.owner-ai-audit-fact.is-ok {
    border-color: rgba(74, 222, 128, .12);
    background: rgba(74, 222, 128, .025);
}

.owner-ai-audit-fact.is-warn {
    border-color: rgba(249, 115, 22, .14);
    background: rgba(249, 115, 22, .028);
}

.owner-ai-audit-list {
    display: grid;
    gap: 10px;
    margin: 0 0 16px;
    padding-left: 24px;
    color: var(--text-primary);
}

.owner-ai-audit-list li {
    padding-left: 4px;
    color: var(--text-primary);
    line-height: 1.55;
}

.owner-ai-audit-list li::marker {
    color: var(--rust-primary);
    font-weight: 800;
}

@media (max-width: 980px) {
    .owner-ai-audit-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 560px) {
    .owner-ai-audit-summary {
        grid-template-columns: 1fr;
    }
}

.owner-ai-config-form { display: grid; gap: 16px; }
.owner-ai-config-form textarea { min-height: 300px; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; line-height: 1.5; }