:root {
    color-scheme: dark;
    --bg: #060a10;
    --panel: #0b1119;
    --panel-2: #0e1620;
    --line: #22303d;
    --text: #eef3f8;
    --muted: #778596;
    --violet: #a65af5;
    --cyan: #36bce8;
    --green: #35d888;
    --amber: #e4bb48;
    --blue: #7098e8;
}

/* Games catalog */
.games-body,
.game-detail-body {
    min-height: 100vh;
    background:
        radial-gradient(circle at 50% 0, rgba(112, 55, 165, .12), transparent 34rem),
        #050a11;
}

.games-shell,
.game-detail-shell {
    width: min(1680px, calc(100% - 48px));
    margin: 0 auto;
    padding: 48px 0 64px;
}

.games-heading {
    max-width: 760px;
    margin-bottom: 36px;
}

.games-heading h1 {
    margin: 5px 0 10px;
    font-size: clamp(34px, 4vw, 62px);
    line-height: 1;
}

.games-heading > p:last-child {
    color: #8d9bab;
    font-size: 15px;
}

.catalog-summary {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 18px;
}

.catalog-summary span,
.game-card-kind {
    border: 1px solid #293644;
    background: rgba(8, 14, 22, .82);
    color: #93a1af;
    font-size: 10px;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.catalog-summary span { padding: 8px 11px; }
.catalog-summary b { color: #fff; }

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

.catalog-group + .catalog-group { margin-top: 42px; }
.catalog-group-heading {
    min-height: 72px;
    margin-bottom: 14px;
    padding: 0 2px 14px;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    border-bottom: 1px solid #263543;
}
.catalog-group-heading > div { display: grid; grid-template-columns: 35px 1fr; align-items: end; column-gap: 12px; }
.catalog-group-heading span { grid-row: 1 / 3; color: #596979; font-size: 28px; font-weight: 800; line-height: 1; }
.catalog-group-heading p { margin: 0 0 3px; color: var(--violet); font-size: 9px; font-weight: 800; letter-spacing: .13em; }
.catalog-group-heading h2 { margin: 0; font-size: 22px; }
.catalog-group-heading > small { color: #718192; font-size: 10px; text-transform: uppercase; }
.games-grid-voice { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.game-card {
    position: relative;
    isolation: isolate;
    min-height: 250px;
    overflow: hidden;
    border: 1px solid #24313f;
    border-radius: 4px;
    color: #fff;
    box-shadow: 0 18px 42px rgba(0, 0, 0, .22);
    transition: border-color .25s ease, transform .25s ease, box-shadow .25s ease;
}

.game-card::before {
    content: '';
    position: absolute;
    z-index: 2;
    inset: 10px;
    pointer-events: none;
    border: 1px solid rgba(255, 255, 255, .05);
    clip-path: polygon(0 0, 34px 0, 34px 1px, 1px 1px, 1px 34px, 0 34px, 0 0, 100% 0, 100% 34px, calc(100% - 1px) 34px, calc(100% - 1px) 1px, calc(100% - 34px) 1px, calc(100% - 34px) 0, 100% 0, 100% 100%, calc(100% - 34px) 100%, calc(100% - 34px) calc(100% - 1px), calc(100% - 1px) calc(100% - 1px), calc(100% - 1px) calc(100% - 34px), 100% calc(100% - 34px), 100% 100%, 0 100%, 0 calc(100% - 34px), 1px calc(100% - 34px), 1px calc(100% - 1px), 34px calc(100% - 1px), 34px 100%, 0 100%);
}

.game-card:hover {
    transform: translateY(-4px);
    border-color: color-mix(in srgb, var(--game-accent) 72%, #fff 10%);
    box-shadow: 0 22px 52px rgba(0, 0, 0, .34), 0 0 24px color-mix(in srgb, var(--game-accent) 18%, transparent);
}

.game-card-art,
.game-hero-art {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.game-card-art {
    z-index: -3;
    transition: transform .6s ease;
}

.game-card-generated,
.game-hero-generated {
    position: absolute;
    inset: 0;
    z-index: -3;
    display: grid;
    place-items: center;
    overflow: hidden;
    background:
        linear-gradient(115deg, color-mix(in srgb, var(--game-accent) 26%, #050a11), #07111c 52%, color-mix(in srgb, var(--game-accent) 12%, #02060b)),
        #07101a;
}

.game-card-generated::before,
.game-hero-generated::before {
    content: '';
    position: absolute;
    width: 62%;
    aspect-ratio: 1;
    border: 1px solid color-mix(in srgb, var(--game-accent) 38%, transparent);
    transform: rotate(32deg);
    box-shadow: 0 0 80px color-mix(in srgb, var(--game-accent) 22%, transparent);
}

.game-card-generated b {
    color: color-mix(in srgb, var(--game-accent) 36%, transparent);
    font-size: clamp(68px, 8vw, 128px);
    letter-spacing: .08em;
}

.game-card-icon b,
.game-hero-fallback,
.game-empty-fallback {
    color: var(--game-accent);
    font-size: 13px;
    font-weight: 900;
    letter-spacing: .04em;
}

.game-card:hover .game-card-art { transform: scale(1.035); }

.game-card-shade {
    position: absolute;
    inset: 0;
    z-index: -2;
    background: linear-gradient(90deg, rgba(2, 7, 13, .96) 0%, rgba(2, 7, 13, .72) 45%, rgba(2, 7, 13, .2) 100%), linear-gradient(0deg, rgba(2, 7, 13, .9), transparent 65%);
}

.game-card::after {
    content: '';
    position: absolute;
    inset: auto 0 0;
    height: 2px;
    background: var(--game-accent);
    box-shadow: 0 0 14px var(--game-accent);
}

.game-card-icon {
    position: absolute;
    top: 24px;
    left: 24px;
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    background: rgba(4, 9, 15, .82);
    border: 1px solid color-mix(in srgb, var(--game-accent) 58%, #273443);
    border-radius: 5px;
}

.game-card-icon img { width: 42px; height: 42px; object-fit: contain; }

.game-card-kind {
    position: absolute;
    top: 91px;
    left: 24px;
    padding: 5px 7px;
    color: color-mix(in srgb, var(--game-accent) 75%, #dce7f2);
}

.game-card-copy {
    position: absolute;
    left: 24px;
    bottom: 61px;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.game-card-copy strong { font-size: 22px; }
.game-card-copy small { color: #b5c0cb; text-transform: uppercase; }

.game-card-stats {
    position: absolute;
    top: 25px;
    right: 24px;
    display: grid;
    grid-template-columns: auto auto;
    gap: 2px 9px;
    padding: 10px 12px;
    background: rgba(3, 8, 14, .78);
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 4px;
    backdrop-filter: blur(7px);
}

.game-card-stats b { text-align: right; color: #fff; }
.game-card-stats small { color: #8d9bab; }

.game-card-state {
    position: absolute;
    left: 24px;
    bottom: 22px;
    color: var(--game-accent);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.game-card-state::before { content: ''; display: inline-block; width: 6px; height: 6px; margin-right: 7px; border-radius: 50%; background: currentColor; box-shadow: 0 0 8px currentColor; }
.game-card-state.waiting { color: #7d8997; }
.game-card-voice { min-height: 210px; }
.game-card-voice .game-card-generated b { font-size: clamp(52px, 7vw, 96px); }
.game-card-voice .game-card-copy { bottom: 59px; }

.games-empty,
.game-empty-state {
    border: 1px dashed #2c3947;
    background: #081019;
    color: #8d9bab;
    text-align: center;
}

.games-empty { margin-top: 20px; padding: 40px; }

.catalog-cta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
    margin-top: 22px;
    padding: 24px 28px;
    border: 1px solid #24313f;
    border-left: 3px solid #9d48ff;
    background: linear-gradient(100deg, #09111a, #0b1019);
}

.catalog-cta div { display: grid; gap: 5px; }
.catalog-cta small { color: #a85cff; }
.catalog-cta strong { font-size: 19px; }
.catalog-cta p { color: #8492a2; }
.catalog-cta a,
.game-realms > header a,
.game-empty-state a { padding: 12px 18px; border: 1px solid #8a42d6; background: #251038; color: #f3eaff; font-weight: 800; text-transform: uppercase; }

/* Individual game */
.game-detail-shell { display: grid; gap: 24px; }
.game-not-found { padding: 12px 16px; border: 1px solid #d59a35; color: #f3bd5d; background: #1c1408; }

.game-hero {
    position: relative;
    isolation: isolate;
    min-height: 370px;
    overflow: hidden;
    border: 1px solid #283645;
    border-radius: 7px;
}

.game-hero-art { z-index: -3; }
.game-hero-overlay { position: absolute; inset: 0; z-index: -2; background: linear-gradient(90deg, rgba(2,7,13,.97) 0%, rgba(2,7,13,.68) 50%, rgba(2,7,13,.18)), linear-gradient(0deg, rgba(2,7,13,.88), transparent 65%); }

.game-hero-title {
    position: absolute;
    left: 46px;
    top: 50%;
    display: flex;
    align-items: center;
    gap: 22px;
    transform: translateY(-62%);
}

.game-hero-title > img { width: 90px; height: 90px; object-fit: contain; padding: 10px; border: 1px solid var(--game-accent); border-radius: 6px; background: rgba(3,8,14,.82); }
.game-hero-fallback { display: grid; place-items: center; width: 90px; height: 90px; border: 1px solid var(--game-accent); background: rgba(3,8,14,.82); font-size: 18px; }
.game-hero-title a { color: var(--game-accent); font-size: 12px; text-transform: uppercase; }
.game-hero-title h1 { margin: 5px 0; font-size: clamp(34px, 5vw, 68px); line-height: 1; }
.game-hero-title p { color: #c1cad4; font-size: 15px; text-transform: uppercase; }

.game-hero-metrics {
    position: absolute;
    right: 28px;
    bottom: 28px;
    left: 28px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    margin: 0;
    padding: 16px 20px;
    background: rgba(3,8,14,.84);
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 5px;
    backdrop-filter: blur(8px);
}

.game-hero-metrics div { padding: 0 20px; border-right: 1px solid #283542; }
.game-hero-metrics div:last-child { border: 0; }
.game-hero-metrics dt { color: #8090a0; font-size: 10px; text-transform: uppercase; }
.game-hero-metrics dd { margin: 4px 0 0; font-size: 22px; font-weight: 800; }

.game-realms { padding: 25px; border: 1px solid #263441; border-radius: 7px; background: #071019; }
.game-realms > header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; }
.game-realms h2 { margin: 3px 0 0; }
.game-realm-list { display: grid; gap: 8px; }

.game-realm-row {
    display: grid;
    grid-template-columns: 54px minmax(250px, 2fr) repeat(3, minmax(110px, .7fr)) 100px 20px;
    align-items: center;
    gap: 16px;
    min-height: 80px;
    padding: 10px 16px;
    border: 1px solid #293745;
    border-radius: 5px;
    background: #0a131c;
    color: #eaf0f6;
}

.game-realm-row:hover { border-color: var(--game-accent); background: #0c1721; }
.game-realm-icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 4px; background: rgba(0,0,0,.35); }
.game-realm-icon img { width: 38px; height: 38px; object-fit: contain; }
.game-realm-name, .game-realm-row > span { display: grid; gap: 3px; }
.game-realm-row small { color: #758595; }
.game-realm-arrow { display: block !important; font-size: 24px; }

.game-empty-state { display: grid; justify-items: center; gap: 10px; padding: 55px 24px; }
.game-empty-state img { width: 64px; height: 64px; object-fit: contain; opacity: .7; }
.game-empty-fallback { display: grid; place-items: center; width: 64px; height: 64px; margin: 0 auto; border: 1px solid var(--game-accent); background: rgba(3,8,14,.82); }
.game-empty-state h3 { margin: 0; color: #e9eff5; font-size: 21px; }
.game-empty-state p { max-width: 660px; line-height: 1.6; }
.game-empty-state a { margin-top: 8px; }

@media (max-width: 1100px) {
    .games-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .game-realm-row { grid-template-columns: 50px 1fr 110px 110px; }
    .game-realm-row > span:nth-child(3), .game-realm-row > span:nth-child(5), .game-realm-arrow { display: none; }
}

@media (max-width: 700px) {
    .games-shell, .game-detail-shell { width: min(100% - 24px, 1680px); padding-top: 26px; }
    .games-grid { grid-template-columns: 1fr; }
    .catalog-group-heading { align-items: flex-start; flex-direction: column; gap: 10px; }
    .game-card { min-height: 230px; }
    .game-card-stats { top: 18px; right: 18px; }
    .game-card-icon, .game-card-copy, .game-card-state { left: 18px; }
    .catalog-cta, .game-realms > header { align-items: flex-start; flex-direction: column; }
    .game-hero { min-height: 470px; }
    .game-hero-title { top: 40px; left: 24px; right: 24px; transform: none; align-items: flex-start; }
    .game-hero-title > img { width: 64px; height: 64px; }
    .game-hero-title h1 { font-size: 32px; }
    .game-hero-metrics { grid-template-columns: repeat(2, 1fr); }
    .game-hero-metrics div { padding: 10px; border-right: 0; border-bottom: 1px solid #283542; }
    .game-hero-metrics div:nth-last-child(-n+2) { border-bottom: 0; }
    .game-realms { padding: 16px; }
    .game-realm-row { grid-template-columns: 46px 1fr auto; gap: 10px; }
    .game-realm-row > span:nth-child(n+3):not(.status) { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .game-card, .game-card-art { transition: none; }
    .game-card:hover { transform: none; }
}
* { box-sizing: border-box; }
html { background: var(--bg); scroll-behavior: smooth; }
body {
    margin: 0;
    min-width: 320px;
    color: var(--text);
    background:
        radial-gradient(circle at 50% 15%, rgba(81,42,139,.16), transparent 34rem),
        #060a10;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
a { color: inherit; text-decoration: none; }
button, input, select { font: inherit; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }
.topbar {
    height: 70px;
    padding: 0 clamp(18px, 2.2vw, 40px);
    display: grid;
    grid-template-columns: 270px auto minmax(280px, 440px) auto;
    align-items: center;
    gap: 30px;
    border-bottom: 1px solid #1d2934;
    background: rgba(5,9,14,.96);
    position: sticky;
    top: 0;
    z-index: 20;
}
.brand { display: flex; align-items: center; gap: 10px; }
.pulse-glyph { color: var(--violet); font-size: 32px; font-weight: 900; transform: rotate(-8deg); }
.brand strong { display: block; letter-spacing: 3px; font-size: 17px; }
.brand strong b { color: #bd75ff; }
.brand small { display: block; color: var(--muted); font-size: 8px; margin-top: 2px; }
.topbar nav { height: 100%; display: flex; align-items: stretch; gap: 28px; }
.topbar nav a { display: grid; place-items: center; color: #aab4c0; font-size: 12px; position: relative; }
.topbar nav a:hover, .topbar nav a.active { color: white; }
.topbar nav a.active::after { content: ""; position: absolute; inset: auto 0 0; height: 2px; background: var(--violet); box-shadow: 0 0 12px var(--violet); }
.header-search {
    height: 38px;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 9px;
    padding: 0 11px;
    border: 1px solid #263340;
    background: #0c131b;
    border-radius: 5px;
}
.header-search input { min-width: 0; color: white; border: 0; outline: 0; background: transparent; font-size: 11px; }
.header-search kbd { padding: 2px 6px; color: var(--muted); border: 1px solid #2e3b49; border-radius: 3px; font-size: 9px; }
.preview-badge { justify-self: end; padding: 6px 8px; color: #c692f5; border: 1px solid #51306a; font-size: 8px; letter-spacing: 1px; }
.dashboard { width: 100%; max-width: none; margin: 0; padding: 0 14px 28px; }
.stat-strip {
    min-height: 78px;
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    align-items: center;
    border-bottom: 1px solid var(--line);
    background: linear-gradient(180deg, rgba(16,25,36,.9), rgba(10,16,24,.9));
}
.stat-strip article { min-width: 0; min-height: 50px; display: flex; align-items: center; gap: 13px; padding: 8px 20px; border-right: 1px solid #273440; }
.stat-strip article:last-child { border-right: 0; }
.stat-icon { width: 30px; text-align: center; font-size: 25px; }
.violet { color: var(--violet); }.green { color: var(--green); }.amber { color: var(--amber); }.cyan { color: var(--cyan); }.blue { color: var(--blue); }
.stat-strip small, .stat-strip em { display: block; color: var(--muted); font-size: 8px; font-style: normal; text-transform: uppercase; }
.stat-strip strong { display: block; overflow: hidden; margin: 2px 0; font-size: clamp(13px, 1.25vw, 20px); text-overflow: ellipsis; white-space: nowrap; }
.world-panel {
    height: clamp(330px, 38vh, 430px);
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid var(--line);
    background: #07101a url("pulse-world-map.png") center / cover no-repeat;
    box-shadow: inset 0 0 65px rgba(1,5,10,.7);
}
.world-panel::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, rgba(5,10,16,.35), transparent 22%, transparent 78%, rgba(5,10,16,.35)); }
.map-tools { position: absolute; z-index: 2; left: 14px; top: 20px; display: grid; }
.map-tools button { width: 30px; height: 30px; color: #aab5c1; border: 1px solid #2a3948; background: rgba(7,13,20,.9); }
.map-live { position: absolute; z-index: 3; right: 18px; top: 18px; padding: 8px 12px; color: var(--green); border: 1px solid #243745; background: rgba(5,11,17,.86); font-size: 9px; }
.map-live i { display: inline-block; width: 6px; height: 6px; margin-right: 5px; border-radius: 50%; background: var(--green); box-shadow: 0 0 10px var(--green); }
.map-live time { color: var(--muted); margin-left: 7px; }
.map-marker { position: absolute; z-index: 3; width: 12px; aspect-ratio: 1; display: grid; place-items: center; border: 1px solid rgba(207,157,255,.95); border-radius: 50%; background: #a855f7; box-shadow: 0 0 0 3px rgba(142,70,220,.1), 0 0 8px rgba(178,89,255,.95); }
.map-marker span { position: absolute; inset: 3px; border-radius: 50%; background: #ead2ff; }
.map-marker strong { display: none; }
.marker-eu { top: 17%; left: 51.5%; }
.map-cities { position: absolute; z-index: 2; inset: 0; pointer-events: none; }
.city {
    position: absolute;
    padding-left: 9px;
    color: rgba(189,202,216,.62);
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    text-shadow: 0 1px 4px #000;
}
.city::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #718196;
    box-shadow: 0 0 6px rgba(142,164,189,.8);
}
.city-new-york { left: 25.5%; top: 35%; }
.city-los-angeles { left: 13.5%; top: 40%; }
.city-sao-paulo { left: 34%; top: 73%; }
.city-london { left: 47.2%; top: 24%; }
.city-frankfurt { left: 51.2%; top: 30%; }
.city-warsaw { left: 55%; top: 25%; }
.city-johannesburg { left: 54.3%; top: 77%; }
.city-singapore { left: 75%; top: 64%; }
.city-tokyo { left: 87.2%; top: 34%; }
.city-sydney { left: 88%; top: 79%; }
.map-legend { position: absolute; z-index: 3; left: 18px; bottom: 15px; width: 145px; padding: 11px; color: #9ba8b6; background: rgba(6,12,19,.86); border: 1px solid #21303e; font-size: 9px; }
.map-legend small { color: white; }
.map-legend p { margin: 7px 0 0; }
.map-legend i, .map-legend b { display: inline-block; width: 7px; height: 7px; margin-right: 6px; border-radius: 50%; background: var(--violet); box-shadow: 0 0 8px var(--violet); }
.map-legend b { background: #354352; box-shadow: none; }
.insight-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-top: -1px; }
.insight-card, .directory { border: 1px solid var(--line); background: linear-gradient(150deg, rgba(13,21,31,.97), rgba(8,14,21,.98)); }
.insight-card { min-height: 180px; padding: 12px; }
.insight-card header, .directory > header { display: flex; align-items: center; justify-content: space-between; padding-bottom: 9px; border-bottom: 1px solid #24313d; }
.insight-card h2, .directory h2 { margin: 0; font-size: 11px; letter-spacing: .5px; text-transform: uppercase; }
.insight-card header span { color: #ad70e6; font-size: 8px; }
.rank-row { min-height: 53px; display: grid; grid-template-columns: 16px 31px 1fr auto; align-items: center; gap: 8px; border-bottom: 1px solid #1d2935; font-size: 10px; }
.rank-row > b { color: var(--muted); }
.rank-row div strong, .rank-row div small { display: block; }
.rank-row div strong { overflow: hidden; max-width: 155px; text-overflow: ellipsis; white-space: nowrap; }
.rank-row div small, .rank-row em { color: var(--muted); font-size: 8px; font-style: normal; }
.mini-game, .game-tile { display: inline-grid; place-items: center; font-style: normal; font-weight: 900; }
.mini-game { width: 29px; height: 29px; }
.game-icon { overflow: hidden; flex: 0 0 auto; border: 1px solid var(--game-accent); background: #0b1119; }
.game-icon img { display: block; width: 100%; height: 100%; object-fit: contain; }
.game-icon-fallback { color: var(--game-accent); font-size: 9px; }
.rust { color: #1b1010; background: #cf442d; }
.panel-note { color: #6d7a89; font-size: 9px; line-height: 1.5; }
.game-browser { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; padding-top: 13px; }
.game-browser a, .game-browser > div { display: grid; justify-items: center; gap: 4px; text-align: center; }
.game-browser strong { font-size: 10px; }.game-browser small { color: var(--muted); font-size: 8px; }
.game-tile { width: 43px; height: 43px; font-size: 18px; }.game-tile.muted { color: #778596; background: #15202b; }
.directory { margin-top: 10px; }
.directory > header { padding: 11px 14px; }
.directory-controls { display: flex; gap: 8px; }
.directory-controls select, .directory-controls input { height: 30px; padding: 0 10px; color: #a7b2bf; border: 1px solid #273542; background: #0d151f; font-size: 9px; }
.directory-head, .server-row { display: grid; grid-template-columns: minmax(260px, 2fr) .8fr .65fr .75fr .6fr .7fr .9fr .6fr .65fr 20px; align-items: center; gap: 12px; }
.directory-head { min-height: 31px; padding: 0 14px; color: #6f7e8d; border-bottom: 1px solid #26333f; font-size: 8px; text-transform: uppercase; }
.server-row { min-height: 54px; padding: 6px 14px; border-bottom: 1px solid #1c2833; font-size: 10px; }
.server-row:hover { background: #101a25; }
.server-row > span:not(.server-name) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.server-name { display: flex; align-items: center; gap: 10px; min-width: 0; }
.server-name > b { color: var(--amber); }
.server-name > span { min-width: 0; }
.server-name strong, .server-name small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.server-name small { color: var(--muted); font-size: 8px; margin-top: 2px; }
.sparkline { color: var(--violet); letter-spacing: -1px; }.sparkline.unavailable { color: #445263; }
.status { width: max-content; padding: 4px 6px; font-size: 8px; font-weight: 800; text-transform: uppercase; border: 1px solid currentColor; }
.status-live { color: var(--green); }.status-stale { color: var(--amber); }.status-offline, .status-error { color: #ff6371; }.status-loading { color: var(--cyan); }

/* Discover */
.discover-body {
    background:
        radial-gradient(circle at 72% 15%, rgba(38, 89, 114, .15), transparent 38rem),
        radial-gradient(circle at 30% 80%, rgba(107, 44, 154, .12), transparent 34rem),
        #060a10;
}
.discover-topbar { grid-template-columns: 280px auto minmax(300px, 440px) auto; }
.discover-shell {
    width: 100%;
    min-height: calc(100vh - 132px);
    padding: 16px clamp(16px, 1.8vw, 32px) 28px;
    display: grid;
    grid-template-columns: minmax(210px, 250px) minmax(720px, 1fr) minmax(245px, 290px);
    gap: 18px;
}
.discover-filters, .discover-rail > section, .realm-table {
    border: 1px solid #223140;
    background: linear-gradient(155deg, rgba(13, 22, 32, .98), rgba(6, 12, 19, .99));
    box-shadow: 0 18px 48px rgba(0, 0, 0, .24);
}
.discover-filters {
    align-self: start;
    padding: 18px;
    display: grid;
    gap: 17px;
    position: sticky;
    top: 86px;
}
.discover-filters::before {
    content: 'DIRECTORY CONTROL';
    margin: -18px -18px 0;
    padding: 9px 18px;
    color: #bd76ff;
    border-bottom: 1px solid #223140;
    background: linear-gradient(90deg, rgba(117, 49, 169, .18), transparent);
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .12em;
}
.discover-filters header, .discover-rail header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 11px;
    border-bottom: 1px solid #22313f;
}
.discover-filters h2, .discover-rail h2 { margin: 0; font-size: 11px; text-transform: uppercase; }
.discover-filters header button, .discover-rail header button {
    padding: 0;
    color: #7c8a99;
    border: 0;
    background: transparent;
    font-size: 9px;
    cursor: pointer;
}
.discover-filters label { display: grid; gap: 7px; color: #8391a0; font-size: 9px; font-weight: 800; text-transform: uppercase; }
.discover-filters select {
    width: 100%;
    height: 39px;
    padding: 0 10px;
    color: #b9c4cf;
    border: 1px solid #273746;
    background: #0b141e;
}
.discover-filters .filter-check { grid-template-columns: 17px 1fr; align-items: center; text-transform: none; }
.filter-check input { width: 15px; height: 15px; accent-color: var(--violet); }
.discover-add-server, .compare-action {
    min-height: 42px;
    display: grid;
    place-items: center;
    color: white;
    border: 1px solid #8d4bce;
    background: linear-gradient(90deg, #54227c, #7d35b5);
    font-size: 10px;
    font-weight: 900;
    text-transform: uppercase;
}
.tracked-summary { padding: 16px; display: grid; gap: 5px; border: 1px solid #233242; background: #09121c; }
.tracked-summary small, .tracked-summary span { color: #718194; font-size: 9px; text-transform: uppercase; }
.tracked-summary strong { color: white; font-size: 27px; }
.discover-results { min-width: 0; }
.discover-heading {
    min-height: 148px;
    padding: 10px 10px 18px;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    border: 1px solid #1c2a36;
    border-bottom: 0;
    background:
        linear-gradient(90deg, rgba(6, 10, 16, .94), rgba(20, 42, 57, .76), rgba(19, 10, 29, .72)),
        radial-gradient(circle at 72% 20%, rgba(166, 90, 245, .2), transparent 24rem);
}
.discover-heading h1 { margin: 3px 0 17px; font-size: clamp(30px, 3.2vw, 48px); text-transform: uppercase; }
.discover-totals { display: flex; gap: 0; }
.discover-totals span { min-width: 130px; padding-right: 20px; margin-right: 20px; border-right: 1px solid #263541; }
.discover-totals span:last-child { border: 0; }
.discover-totals small, .discover-totals strong { display: block; }
.discover-totals small { color: #748494; font-size: 8px; text-transform: uppercase; }
.discover-totals strong { margin-top: 5px; color: var(--green); font-size: 18px; }
.discover-totals span:nth-child(1) strong, .discover-totals span:nth-child(3) strong { color: var(--violet); }
.compare-trigger {
    min-width: 175px;
    min-height: 38px;
    margin-bottom: 5px;
    color: #c892ff;
    border: 1px solid #7641a6;
    background: rgba(43, 18, 64, .55);
    font-size: 9px;
    font-weight: 900;
    text-transform: uppercase;
}
.compare-trigger:disabled, .compare-action:disabled { color: #53616f; border-color: #293642; background: #101821; }
.realm-table { overflow: hidden; }
.realm-tabs { min-height: 48px; padding: 0 13px; display: flex; align-items: center; gap: 25px; border-bottom: 1px solid #273643; }
.realm-tabs button { height: 48px; padding: 0; color: #748291; border: 0; border-bottom: 2px solid transparent; background: transparent; font-size: 9px; font-weight: 900; text-transform: uppercase; cursor: pointer; }
.realm-tabs button.active { color: #bd76ff; border-color: var(--violet); }
.realm-tabs > span { margin-left: auto; color: #667687; font-size: 9px; }
.realm-table-head, .realm-entry {
    display: grid;
    grid-template-columns: 28px minmax(230px, 2fr) minmax(100px, .75fr) minmax(105px, .8fr) 72px 70px minmax(105px, .8fr) 72px 20px;
    align-items: center;
    gap: 10px;
}
.realm-table-head { min-height: 35px; padding: 0 13px; color: #687889; border-bottom: 1px solid #22313e; font-size: 7px; text-transform: uppercase; }
.realm-entry { min-height: 68px; padding: 7px 13px; border-bottom: 1px solid #1d2a36; font-size: 9px; transition: background-color .2s ease; }
.realm-entry:hover { background: linear-gradient(90deg, rgba(34, 21, 50, .72), #101a25 38%, #101a25); }
.trend-awaiting { display: block; color: #68798a; font-size: 8px; }
.realm-select { display: grid; place-items: center; }
.realm-select input { width: 14px; height: 14px; accent-color: var(--violet); }
.realm-identity { min-width: 0; display: flex; align-items: center; gap: 11px; }
.realm-thumb { width: 50px; height: 38px; flex: 0 0 auto; display: grid; place-items: center; font-size: 17px; font-weight: 900; }
.realm-identity > span:last-child, .realm-game { min-width: 0; }
.realm-identity strong, .realm-identity small, .realm-game strong, .realm-game small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.realm-identity strong { font-size: 10px; }
.realm-identity small, .realm-game small, .realm-trend small { margin-top: 4px; color: #788797; font-size: 8px; }
.realm-meter strong { display: block; }
.realm-meter i { width: 75px; height: 3px; margin-top: 6px; display: block; overflow: hidden; background: #25313d; }
.realm-meter i b { height: 100%; display: block; background: linear-gradient(90deg, #7c42ca, #b968ff); }
.realm-ping { color: var(--green); }
.realm-trend svg { width: 86px; height: 25px; display: block; }
.realm-trend polyline { fill: none; stroke: #ae63ef; stroke-width: 1.4; vector-effect: non-scaling-stroke; }
.realm-open { color: white; font-size: 24px; }
.discover-empty { padding: 54px 20px; text-align: center; }
.discover-empty strong { font-size: 16px; }.discover-empty p { color: var(--muted); font-size: 10px; }
.discover-rail { display: grid; align-content: start; gap: 12px; }
.discover-rail > section { position: relative; overflow: hidden; padding: 17px; }
.discover-rail > section::after { content: ''; position: absolute; inset: 0 0 auto; height: 1px; background: linear-gradient(90deg, transparent, rgba(166, 90, 245, .7), transparent); }
.discover-rail header span { color: var(--violet); font-size: 8px; text-transform: uppercase; }
.discover-rail p { color: #7b8998; font-size: 9px; line-height: 1.6; }
[data-compare-list] { display: grid; gap: 7px; margin: 14px 0; }
.compare-slot { min-height: 36px; padding: 0 11px; display: flex; align-items: center; overflow: hidden; color: #586879; border: 1px solid #243443; background: #0b141e; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.compare-slot.selected { color: #d4b1f4; border-color: #5d3979; }
.comparison-ready { animation: comparisonPulse .9s ease; }
@keyframes comparisonPulse { 50% { filter: drop-shadow(0 0 9px rgba(166, 90, 245, .7)); } }
.compare-action { width: 100%; }
.network-panel dl { display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px; }
.network-panel dl div { min-width: 0; }
.network-panel dt { color: #718194; font-size: 7px; text-transform: uppercase; }
.network-panel dd { margin: 5px 0 0; overflow: hidden; color: var(--green); font-size: 10px; text-overflow: ellipsis; }
.network-chart { height: 85px; margin: 15px 0 8px; border: 1px solid #21303e; background: linear-gradient(rgba(36, 53, 68, .25) 1px, transparent 1px), linear-gradient(90deg, rgba(36, 53, 68, .25) 1px, transparent 1px), #08111a; background-size: 100% 25%, 20% 100%; }
.network-panel > small { color: #677789; font-size: 8px; }

@media (max-width: 1320px) {
    .discover-shell { grid-template-columns: 210px minmax(680px, 1fr); }
    .discover-rail { grid-column: 1 / -1; grid-template-columns: repeat(3, 1fr); }
    .discover-filters { position: static; }
}
@media (max-width: 980px) {
    .discover-shell { grid-template-columns: 1fr; }
    .discover-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .discover-filters header, .discover-add-server, .tracked-summary { grid-column: 1 / -1; }
    .discover-rail { grid-template-columns: 1fr; }
    .realm-table-head { display: none; }
    .realm-entry { grid-template-columns: 25px minmax(220px, 1fr) 100px 80px 75px 20px; }
    .realm-entry > :nth-child(3), .realm-entry > :nth-child(6), .realm-entry > :nth-child(7) { display: none; }
}
@media (max-width: 680px) {
    .discover-shell { padding: 10px; }
    .discover-filters { grid-template-columns: 1fr; }
    .discover-filters header, .discover-add-server, .tracked-summary { grid-column: auto; }
    .discover-heading { min-height: 0; padding: 20px 5px; align-items: flex-start; flex-direction: column; }
    .discover-totals { width: 100%; display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; background: #263541; }
    .discover-totals span { min-width: 0; margin: 0; padding: 12px; border: 0; background: #09121b; }
    .compare-trigger { width: 100%; }
    .realm-tabs { gap: 15px; overflow-x: auto; }
    .realm-tabs > span { display: none; }
    .realm-entry { grid-template-columns: 23px minmax(0, 1fr) 70px 18px; min-height: 76px; }
    .realm-entry > :not(.realm-select):not(.realm-identity):not(.status):not(.realm-open) { display: none; }
    .realm-thumb { width: 42px; height: 38px; }
}
.site-footer { width: 100%; max-width: none; min-height: 62px; margin: 0; padding: 18px 28px; display: flex; justify-content: space-between; align-items: center; color: var(--muted); border-top: 1px solid #1e2a35; font-size: 9px; }
.site-footer strong { color: white; letter-spacing: 2px; }.site-footer span { margin-left: 12px; }
.topbar.compact { grid-template-columns: 1fr auto; }
.back-link { color: #aab5c1; font-size: 11px; }
.back-link:hover { color: white; }
.compare-page { width: min(1600px, calc(100% - 40px)); min-height: calc(100vh - 70px); margin: 0 auto; padding: 48px 0 72px; }
.compare-heading { max-width: 760px; margin-bottom: 28px; }.compare-heading h1 { margin: 6px 0 10px; font-size: clamp(34px,5vw,62px); line-height: 1; }.compare-heading > p:last-child { color: var(--muted); line-height: 1.6; }
.compare-grid { display: grid; grid-template-columns: repeat(var(--compare-count),minmax(0,1fr)); gap: 12px; }
.compare-card { min-width: 0; overflow: hidden; border: 1px solid #273746; background: linear-gradient(155deg,rgba(14,23,34,.98),rgba(6,12,19,.99)); box-shadow: 0 24px 60px rgba(0,0,0,.22); }
.compare-card > header { min-height: 126px; padding: 20px; display: grid; grid-template-columns: 54px minmax(0,1fr); align-items: center; gap: 13px; border-bottom: 1px solid var(--line); background: linear-gradient(110deg,rgba(166,90,245,.12),transparent 55%); }.compare-card > header .status { grid-column: 1 / -1; justify-self: start; }.compare-game-mark { width: 54px; height: 54px; display: grid; place-items: center; color: #1d1010; background: #cf442d; font-size: 12px; font-weight: 900; }.compare-card header small { color: var(--muted); font-size: 8px; text-transform: uppercase; }.compare-card h2 { overflow: hidden; margin: 4px 0 0; font-size: 16px; line-height: 1.2; text-overflow: ellipsis; }
.compare-card dl { margin: 0; }.compare-card dl div { min-height: 68px; padding: 14px 18px; display: grid; gap: 6px; align-content: center; border-bottom: 1px solid var(--line); }.compare-card dt { color: var(--muted); font-size: 8px; letter-spacing: .08em; text-transform: uppercase; }.compare-card dd { margin: 0; overflow-wrap: anywhere; color: #edf3f8; font-size: 12px; font-weight: 750; }
.compare-card footer a { min-height: 52px; padding: 0 18px; display: flex; align-items: center; justify-content: space-between; color: #c993ff; font-size: 9px; font-weight: 900; letter-spacing: .07em; }.compare-card footer a:hover { color: white; background: rgba(166,90,245,.1); }.compare-card footer b { font-size: 18px; }
.compare-empty { padding: 56px 30px; border: 1px solid var(--line); background: var(--panel); text-align: center; }.compare-empty strong { font-size: 22px; }.compare-empty p { color: var(--muted); }.compare-empty a { min-height: 42px; margin-top: 12px; padding: 0 20px; display: inline-grid; place-items: center; color: white; border: 1px solid #7546a0; background: #301646; font-size: 10px; font-weight: 800; }
.server-page { width: 100%; min-height: calc(100vh - 70px); margin: 0; padding: 32px clamp(16px, 1.5vw, 28px) 60px; }
.server-hero {
    min-height: 220px; display: flex; align-items: flex-end; justify-content: space-between; gap: 30px;
    padding: clamp(28px, 5vw, 64px); overflow: hidden; position: relative;
    border: 1px solid #2b3a48;
    background:
        linear-gradient(90deg, rgba(6,10,16,.97) 0%, rgba(8,13,20,.82) 52%, rgba(8,13,20,.44) 100%),
        radial-gradient(circle at 80% 25%, rgba(207,68,45,.28), transparent 28rem),
        linear-gradient(135deg, #15100f, #08111a);
}
.server-hero-game {
    isolation: isolate;
    background:
        linear-gradient(90deg, rgba(5,8,13,.98) 0%, rgba(6,10,16,.88) 42%, rgba(7,10,15,.46) 100%),
        var(--server-hero-image) center 43% / cover no-repeat,
        #0a1017;
}
.server-hero-game::before { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: linear-gradient(180deg, transparent 55%, rgba(0,0,0,.58)); }
.server-hero-signal { position: absolute; right: clamp(30px, 8vw, 130px); top: 50%; width: 170px; aspect-ratio: 1; translate: 0 -50%; opacity: .55; pointer-events: none; }
.server-hero-signal i { position: absolute; inset: 0; border: 1px solid rgba(194,93,255,.28); border-radius: 50%; animation: server-signal 4.8s ease-out infinite; }
.server-hero-signal i:nth-child(2) { animation-delay: 1.6s; }.server-hero-signal i:nth-child(3) { animation-delay: 3.2s; }
@keyframes server-signal { 0% { scale: .18; opacity: 0; } 18% { opacity: .72; } 100% { scale: 1; opacity: 0; } }
.server-hero::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(105deg, transparent 56%, rgba(166,90,245,.08)); }
.server-identity { min-width: 0; display: flex; align-items: center; gap: 22px; position: relative; z-index: 1; }
.server-game-mark { width: 72px; height: 72px; flex: 0 0 auto; display: grid; place-items: center; color: #071018; border: 1px solid var(--server-accent); background: var(--server-accent); font-size: 31px; font-weight: 900; }
.server-game-mark img { display: block; width: 100%; height: 100%; padding: 7px; object-fit: contain; }
.server-hero h1 { max-width: 900px; margin: 7px 0 12px; font-size: clamp(28px, 4vw, 54px); line-height: 1.02; letter-spacing: 0; }
.server-hero code { color: #91a1b1; font-size: 12px; }
.server-tags { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 14px; }
.server-tags span { padding: 6px 9px; color: #aebdca; border: 1px solid #263543; border-radius: 3px; background: rgba(7,14,21,.72); font-size: 8px; letter-spacing: .03em; }
.server-actions { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: 10px; position: relative; z-index: 1; }
.owner-badge { padding: 8px 10px; color: var(--amber); border: 1px solid #66562c; background: rgba(47,39,18,.72); font-size: 9px; font-weight: 900; }
.connect-action { min-height: 40px; padding: 0 20px; display: inline-grid; place-items: center; color: white; border: 1px solid #70439a; background: linear-gradient(90deg, #522179, #792fa9); font-size: 10px; font-weight: 900; }
.connect-action:hover { border-color: #bd75ff; box-shadow: 0 0 22px rgba(166,90,245,.22); }
.signal-ribbon { min-height: 72px; display: grid; grid-template-columns: minmax(280px,1.4fr) repeat(2,minmax(150px,.65fr)) auto; align-items: stretch; border: 1px solid var(--line); border-top: 0; background: rgba(7,13,20,.98); }
.signal-ribbon > div, .signal-ribbon > a { min-width: 0; padding: 14px 20px; display: flex; align-items: center; gap: 11px; border-right: 1px solid var(--line); }
.signal-ribbon > div:not(:first-child) { display: grid; gap: 5px; align-content: center; }.signal-ribbon span { color: var(--muted); font-size: 8px; letter-spacing: .1em; text-transform: uppercase; }.signal-ribbon strong { overflow: hidden; color: #e9eef5; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.signal-ribbon p { margin: 0; display: grid; gap: 3px; }.signal-ribbon p b { color: #eaf3fb; font-size: 10px; letter-spacing: .08em; }.signal-ribbon p small { color: var(--muted); font-size: 9px; }.signal-ribbon > a { justify-content: center; border-right: 0; color: #c58bff; font-size: 9px; font-weight: 900; letter-spacing: .08em; }.signal-ribbon > a b { font-size: 17px; }
.signal-beacon { width: 9px; height: 9px; flex: 0 0 auto; border-radius: 50%; background: #788493; box-shadow: 0 0 12px currentColor; }.signal-beacon-live, .signal-beacon-online { color: #35e696; background: currentColor; }.signal-beacon-stale, .signal-beacon-loading { color: #eeb83f; background: currentColor; }.signal-beacon-offline { color: #f05252; background: currentColor; }
.performance-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid var(--line); border-top: 0; background: linear-gradient(110deg, rgba(11,19,29,.99), rgba(7,13,20,.99)); }
.performance-strip-expanded { grid-template-columns: repeat(5, minmax(0, 1fr)); margin-top: 12px; border-top: 1px solid var(--line); }
.performance-strip-expanded article:nth-child(5n) { border-right: 0; }
.performance-strip-expanded article:nth-child(-n+5) { border-bottom: 1px solid var(--line); }
.performance-strip article { min-width: 0; min-height: 126px; padding: 20px; position: relative; overflow: hidden; border-right: 1px solid var(--line); }
.performance-strip article:last-child { border-right: 0; }
.performance-strip article::after { content: ""; position: absolute; left: 20px; right: 20px; bottom: 0; height: 1px; opacity: .5; background: linear-gradient(90deg, #a65af5, transparent); }
.performance-strip span { display: flex; align-items: center; gap: 9px; color: #8998aa; font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.metric-icon { width: 22px; height: 22px; flex: 0 0 auto; fill: none; stroke: #b75cff; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 0 5px rgba(183,92,255,.28)); }
.metric-icon-players { stroke: #27bfff; }.metric-icon-peak, .metric-icon-uptime { stroke: #2cdb78; }.metric-icon-average { stroke: #ffd731; }.metric-icon-minimum { stroke: #ffb92f; }.metric-icon-wipe { stroke: #ff5a43; }.metric-icon-clock { stroke: #ff962f; }
.performance-strip strong { display: block; margin: 11px 0 8px; overflow: hidden; color: #f3f6fa; font-size: clamp(20px, 2vw, 30px); line-height: 1; text-overflow: ellipsis; white-space: nowrap; }
.performance-strip small { display: block; color: #7f8d9d; font-size: 9px; line-height: 1.45; }
.performance-rank strong { color: #c47aff; text-shadow: 0 0 18px rgba(166,90,245,.3); }
.occupancy-track { width: 100%; height: 4px; margin: 12px 0 8px; overflow: hidden; background: #172331; }
.occupancy-track i { display: block; height: 100%; min-width: 2px; background: linear-gradient(90deg, #35e696, #70f0c0); box-shadow: 0 0 10px rgba(53,230,150,.55); transition: width .5s ease; }
.detail-grid { display: grid; grid-template-columns: repeat(6, 1fr); border: 1px solid var(--line); border-top: 0; background: #09111a; }
.detail-grid-core { grid-template-columns: repeat(5, 1fr); margin-top: 12px; border-top: 1px solid var(--line); }
.detail-grid-core article { min-height: 104px; }
.detail-grid-core span { display: flex; align-items: center; gap: 9px; }
.detail-grid-core small { display: block; margin-top: 7px; color: var(--muted); font-size: 8px; }
.detail-grid-core .metric-icon-map, .detail-grid-core .metric-icon-signal { stroke: #28dd78; }.detail-grid-core .metric-icon-ping { stroke: #28c7ff; }.detail-grid-core .metric-icon-region { stroke: #bb58ff; }.detail-grid-core .metric-icon-connected { stroke: #438dff; }
.technical-panel { margin-top: 12px; border: 1px solid var(--line); background: linear-gradient(150deg, rgba(13,21,31,.98), rgba(7,12,19,.99)); }
.technical-panel > header { min-height: 70px; padding: 16px 20px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--line); }
.technical-panel > header h2 { margin: 4px 0 0; font-size: 18px; }
.technical-panel > header > span { color: var(--muted); font-size: 9px; text-transform: uppercase; letter-spacing: .08em; }
.detail-grid-technical { border: 0; grid-template-columns: repeat(6, 1fr); background: transparent; }
.detail-grid-technical article { min-height: 82px; padding: 16px 20px; }
.detail-grid-technical strong { font-size: 14px; }
.detail-grid-technical code { color: #d6e0e9; font-size: 11px; }
.detail-grid article { min-width: 0; min-height: 96px; padding: 20px; border-right: 1px solid var(--line); }
.detail-grid article:last-child { border-right: 0; }
.detail-grid span, .server-facts span { display: block; color: var(--muted); font-size: 9px; text-transform: uppercase; }
.detail-grid strong { display: block; overflow: hidden; margin-top: 9px; font-size: clamp(14px, 1.4vw, 21px); text-overflow: ellipsis; white-space: nowrap; }
.server-content-grid { display: grid; grid-template-columns: minmax(0, 2.25fr) minmax(290px, .75fr); gap: 12px; margin-top: 12px; }
.history-panel, .server-facts, .embed-panel, .empty-state { border: 1px solid var(--line); background: linear-gradient(150deg, rgba(13,21,31,.98), rgba(7,12,19,.99)); }
.history-panel { min-height: 340px; padding: 22px; }
.history-panel header { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; }
.history-panel h2, .embed-panel h2 { margin: 3px 0 0; font-size: 21px; }
.history-panel header > span { color: var(--muted); font-size: 9px; }
.history-chart, .chart-placeholder { height: 235px; margin-top: 22px; border: 1px solid #1d2b37; background: linear-gradient(rgba(25,39,52,.25) 1px, transparent 1px), linear-gradient(90deg, rgba(25,39,52,.25) 1px, transparent 1px), #071019; background-size: 100% 33.333%, 10% 100%; }
.history-chart svg { width: 100%; height: 100%; overflow: visible; }
.history-chart polyline { fill: none; stroke: #b968ff; stroke-width: 1.2; vector-effect: non-scaling-stroke; filter: drop-shadow(0 0 4px rgba(185,104,255,.8)); }
.history-chart .chart-grid { fill: none; stroke: rgba(92,111,128,.28); stroke-width: .4; vector-effect: non-scaling-stroke; }
.chart-placeholder { display: grid; place-items: center; padding: 30px; color: var(--muted); text-align: center; font-size: 11px; }
.server-facts { display: grid; align-content: start; }
.server-facts header { padding: 20px; border-bottom: 1px solid var(--line); background: linear-gradient(90deg, rgba(163,75,237,.1), transparent); }.server-facts header h2 { margin: 4px 0 0; font-size: 18px; }
.server-facts div { min-width: 0; padding: 20px; border-bottom: 1px solid var(--line); }
.server-facts div:last-child { border-bottom: 0; }
.server-facts strong, .server-facts code { display: block; overflow-wrap: anywhere; margin-top: 8px; color: white; font-size: 11px; }
.server-sidebar { display: grid; align-content: start; gap: 12px; }
.trust-card { border: 1px solid var(--line); background: linear-gradient(150deg, rgba(10,24,28,.98), rgba(7,12,19,.99)); }
.trust-card header { padding: 20px; border-bottom: 1px solid var(--line); background: linear-gradient(90deg, rgba(35,230,137,.08), transparent); }
.trust-card h2 { margin: 5px 0 0; font-size: 18px; }
.trust-card ul { margin: 0; padding: 12px 20px; list-style: none; }
.trust-card li { display: flex; justify-content: space-between; gap: 14px; padding: 8px 0; color: #aebbc7; font-size: 10px; border-bottom: 1px solid rgba(35,49,61,.55); }
.trust-card li:last-child { border-bottom: 0; }
.trust-card li strong { color: #38df91; text-align: right; }
.moderation-card { border: 1px solid var(--line); background: linear-gradient(150deg, rgba(20,13,31,.98), rgba(7,12,19,.99)); }
.moderation-card header { padding: 18px 20px; border-bottom: 1px solid var(--line); background: linear-gradient(90deg, rgba(168,75,237,.1), transparent); }
.moderation-card h2 { margin: 5px 0 0; font-size: 18px; }
.moderation-stats { display: grid; grid-template-columns: repeat(3, 1fr); }
.moderation-stats span { min-width: 0; padding: 17px 14px; border-right: 1px solid var(--line); }
.moderation-stats span:last-child { border-right: 0; }
.moderation-stats strong, .moderation-stats small { display: block; }
.moderation-stats strong { color: #cc78ff; font-size: 20px; }.moderation-stats small { margin-top: 6px; color: var(--muted); font-size: 8px; line-height: 1.35; }
.moderation-card button { width: calc(100% - 28px); margin: 0 14px 14px; padding: 10px; color: #997eaa; border: 1px solid #4b2a5e; background: #201027; font-size: 9px; font-weight: 800; cursor: not-allowed; }
.server-profile-card { border: 1px solid var(--line); background: linear-gradient(150deg, rgba(17,24,35,.98), rgba(7,11,18,.99)); }
.server-profile-card header, .server-profile-card > div { padding: 20px; border-bottom: 1px solid var(--line); }
.server-profile-card h2 { margin: 5px 0 0; font-size: 18px; overflow-wrap: anywhere; }
.server-profile-card span { color: var(--muted); font-size: 9px; letter-spacing: .08em; }
.server-profile-card p { margin: 9px 0 0; color: #cbd5df; font-size: 12px; line-height: 1.65; overflow-wrap: anywhere; }
.server-profile-card nav { display: flex; gap: 8px; padding: 14px 20px; }
.server-profile-card nav a { border: 1px solid #7430a0; padding: 9px 12px; color: #d88bff; font-size: 10px; font-weight: 800; }
.owner-page { width: min(1460px, calc(100% - 48px)); margin: 42px auto 80px; }
.owner-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--line); padding: 28px 0; }
.owner-heading h1 { margin: 5px 0 8px; font-size: clamp(30px, 4vw, 58px); }
.owner-heading code { color: #9fb4c8; }
.owner-notice { padding: 14px 18px; border: 1px solid; }
.owner-notice.success { color: #55ed9b; border-color: #1f8050; background: #092118; }
.owner-notice.error { color: #ff8c9a; border-color: #963747; background: #2a0d14; }
.owner-status-grid { display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid var(--line); margin: 18px 0; background: #09111a; }
.owner-status-grid article { padding: 18px; border-right: 1px solid var(--line); }
.owner-status-grid article:last-child { border-right: 0; }
.owner-status-grid span, .owner-form label { display: block; color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .08em; }
.owner-status-grid strong { display: block; margin-top: 8px; color: white; }
.owner-proof { border: 1px solid #7430a0; padding: 22px; margin-bottom: 18px; background: linear-gradient(120deg, rgba(120,40,170,.15), #09111a 55%); }
.owner-proof h2 { margin: 6px 0 15px; }.owner-proof code { display: inline-block; padding: 14px 18px; border: 1px solid #9d4bd3; color: white; font-size: 22px; }
.owner-layout { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(340px, .8fr); gap: 18px; }
.owner-stack { display: grid; align-content: start; gap: 18px; }
.owner-form, .owner-danger { border: 1px solid var(--line); padding: 24px; background: #09111a; }
.owner-form header { margin-bottom: 20px; }.owner-form h2, .owner-danger h2 { margin: 5px 0 8px; }.owner-form header p:last-child { color: var(--muted); line-height: 1.5; }
.owner-form label { margin-top: 15px; }.owner-form input, .owner-form textarea { box-sizing: border-box; width: 100%; margin-top: 7px; border: 1px solid #29394a; background: #060c13; color: white; padding: 12px; font: inherit; resize: vertical; }
.owner-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }.owner-form button, .owner-danger button { width: 100%; margin-top: 18px; border: 1px solid #8d3ec2; background: #64258c; color: white; padding: 13px; font-weight: 900; cursor: pointer; }
.owner-danger a { display: block; color: #d58cff; margin: 12px 0; }.owner-danger button { border-color: #9b3445; background: #351019; }.owner-danger button.secondary { border-color: #364656; background: #111a23; }
@media (max-width: 850px) { .owner-page { width: min(100% - 24px, 720px); }.owner-layout, .owner-status-grid { grid-template-columns: 1fr; }.owner-status-grid article { border-right: 0; border-bottom: 1px solid var(--line); }.owner-form-row { grid-template-columns: 1fr; }.owner-heading { align-items: start; flex-direction: column; } }
.embed-panel { margin-top: 12px; padding: 22px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.embed-panel p { margin-bottom: 0; color: var(--muted); font-size: 10px; }
.embed-panel button { min-height: 40px; padding: 0 18px; color: #7d8996; border: 1px solid #2b3946; background: #101821; }
.banner-generator { display: grid; grid-template-columns: minmax(440px, .9fr) minmax(420px, 1.1fr); align-items: stretch; gap: 16px 24px; }
.banner-generator-copy { grid-column: 1 / -1; padding-bottom: 2px; }
.banner-generator-copy h2 { margin: 4px 0 6px; }
.banner-generator-copy p:last-child { margin: 0; max-width: 760px; }
.banner-preview-frame {
    min-height: 170px; padding: 16px; display: grid; place-items: center; overflow: hidden;
    border: 1px solid #243548;
    background: linear-gradient(rgba(21,31,44,.34) 1px, transparent 1px), linear-gradient(90deg, rgba(21,31,44,.34) 1px, transparent 1px), #050a11;
    background-size: 20px 20px;
}
.banner-preview-frame img { display: block; width: min(100%, 728px); height: auto; filter: drop-shadow(0 12px 32px rgba(0,0,0,.55)); }
.banner-generator-controls { display: grid; grid-template-columns: 1fr; align-content: center; gap: 12px; }
.banner-format, .banner-code-field { display: grid; gap: 7px; color: #718198; font-size: 10px; letter-spacing: .12em; }
.banner-format { align-content: start; }
.banner-format select, .banner-code-row input { min-width: 0; height: 42px; border: 1px solid #26394d; border-radius: 3px; background: #070d15; color: #d8e0eb; }
.banner-format select { padding: 0 12px; }
.banner-code-row { display: grid; grid-template-columns: minmax(0,1fr) 82px; }
.banner-code-row input { padding: 0 12px; border-right: 0; border-radius: 3px 0 0 3px; font: 11px Consolas, monospace; }
.banner-code-row button { border: 1px solid #7d46d8; border-radius: 0 3px 3px 0; background: #211038; color: #cdaaff; font-size: 10px; font-weight: 800; letter-spacing: .08em; cursor: pointer; }
.banner-code-row button:hover, .banner-code-row button.is-copied { border-color: #3ce89a; color: #3ce89a; }
.empty-state { margin-top: 80px; padding: 50px; text-align: center; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; } }
@media (prefers-reduced-motion: reduce) { .server-hero-signal i { animation: none; opacity: .18; } }
@media (max-width: 1050px) {
    .banner-generator { grid-template-columns: 1fr; }.banner-generator-copy { grid-column: auto; }.banner-preview-frame { min-height: 140px; }
    .compare-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .topbar { grid-template-columns: 1fr auto; }.topbar nav, .preview-badge { display: none; }.header-search { justify-self: end; }
    .stat-strip { grid-template-columns: repeat(3, 1fr); }.stat-strip article:nth-child(3) { border-right: 0; }
    .insight-grid { grid-template-columns: repeat(2, 1fr); }
    .directory-head, .server-row { grid-template-columns: minmax(240px, 2fr) .8fr .75fr .6fr .65fr 20px; }
    .directory-head span:nth-child(3), .directory-head span:nth-child(6), .directory-head span:nth-child(7), .directory-head span:nth-child(8), .server-row > span:nth-child(3), .server-row > span:nth-child(6), .server-row > span:nth-child(7), .server-row > span:nth-child(8) { display: none; }
    .detail-grid { grid-template-columns: repeat(3, 1fr); }.detail-grid article:nth-child(3) { border-right: 0; }.detail-grid article:nth-child(-n+3) { border-bottom: 1px solid var(--line); }
    .performance-strip { grid-template-columns: repeat(2, 1fr); }.performance-strip article:nth-child(2) { border-right: 0; }.performance-strip article:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
    .performance-strip-expanded { grid-template-columns: repeat(2, 1fr); }.performance-strip-expanded article { border-bottom: 1px solid var(--line); }.performance-strip-expanded article:nth-child(even) { border-right: 0; }
    .detail-grid-core { grid-template-columns: repeat(2, 1fr); }.detail-grid-core article:nth-child(2) { border-right: 0; }
    .detail-grid-technical { grid-template-columns: repeat(3, 1fr); }.detail-grid-technical article:nth-child(3) { border-right: 0; }.detail-grid-technical article:nth-child(-n+3) { border-bottom: 1px solid var(--line); }
    .server-content-grid { grid-template-columns: 1fr; }
    .signal-ribbon { grid-template-columns: repeat(3,1fr); }.signal-ribbon > div:first-child { grid-column: 1 / -1; border-bottom: 1px solid var(--line); }.signal-ribbon > a { border-left: 1px solid var(--line); }
}
@media (max-width: 680px) {
    .compare-page { width: calc(100% - 20px); padding-top: 24px; }.compare-grid { grid-template-columns: 1fr; }
    .topbar { height: auto; min-height: 66px; padding: 10px 14px; gap: 10px; }.brand strong { font-size: 14px; }.header-search { width: 44px; grid-template-columns: 1fr; }.header-search input, .header-search kbd { display: none; }
    .dashboard { padding: 0 10px 20px; }.stat-strip { grid-template-columns: repeat(2, 1fr); }.stat-strip article { padding: 8px 10px; }.stat-strip article:nth-child(3) { border-right: 1px solid #273440; }.stat-strip article:nth-child(even) { border-right: 0; }
    .world-panel { height: 230px; background-size: auto 100%; }.map-marker { width: 10px; }.marker-eu { left: 51%; top: 16%; }.map-legend { display: none; }
    .city { font-size: 6px; letter-spacing: .6px; }.city-los-angeles, .city-warsaw, .city-johannesburg, .city-sydney { display: none; }
    .insight-grid { grid-template-columns: 1fr; }.directory > header { align-items: flex-start; gap: 10px; flex-direction: column; }.directory-controls { width: 100%; }.directory-controls select { display: none; }.directory-controls input { width: 100%; }
    .directory-head { display: none; }.server-row { grid-template-columns: 1fr auto; padding: 10px; }.server-row > span:not(.server-name):not(.status) { display: none; }.server-row .status { display: block; }
    .site-footer { align-items: flex-start; gap: 8px; flex-direction: column; }
    .server-page { width: 100%; padding: 16px 10px 36px; }.server-hero { min-height: 0; align-items: flex-start; flex-direction: column; padding: 22px; }
    .server-game-mark { width: 52px; height: 52px; font-size: 23px; }.server-hero h1 { font-size: 27px; }.server-actions { justify-content: flex-start; }
    .server-hero-signal { display: none; }.signal-ribbon { grid-template-columns: 1fr 1fr; }.signal-ribbon > div:first-child { grid-column: 1 / -1; }.signal-ribbon > a { grid-column: 1 / -1; border-top: 1px solid var(--line); border-left: 0; }.signal-ribbon > div:nth-child(3) { border-right: 0; }
    .detail-grid { grid-template-columns: repeat(2, 1fr); }.detail-grid article { min-height: 82px; padding: 15px; border-bottom: 1px solid var(--line); }.detail-grid article:nth-child(odd) { border-right: 1px solid var(--line); }.detail-grid article:nth-child(even) { border-right: 0; }
    .technical-panel > header { align-items: flex-start; flex-direction: column; gap: 5px; }.detail-grid-technical { grid-template-columns: repeat(2, 1fr); }.detail-grid-technical article:nth-child(3) { border-right: 1px solid var(--line); }.detail-grid-technical article:nth-child(-n+3) { border-bottom: 1px solid var(--line); }
    .performance-strip { grid-template-columns: 1fr 1fr; }.performance-strip article { min-height: 112px; padding: 15px; }.performance-strip strong { font-size: 19px; }
    .history-panel { min-height: 300px; padding: 16px; }.history-chart, .chart-placeholder { height: 190px; }.embed-panel { align-items: flex-start; flex-direction: column; }
    .banner-generator-controls { grid-template-columns: 1fr; }.banner-format { grid-row: auto; }.banner-preview-frame { min-height: 120px; padding: 12px; }
}

.form-shell, .status-shell {
    width: min(1220px, calc(100% - 32px));
    margin: 44px auto 72px;
    display: grid;
    grid-template-columns: minmax(0, 1.65fr) minmax(300px, .7fr);
    gap: 16px;
}
.status-shell { grid-template-columns: minmax(0, 760px); justify-content: center; }
.form-card, .process-card, .admin-claims {
    position: relative;
    overflow: hidden;
    border: 1px solid #263746;
    border-radius: 6px;
    background: linear-gradient(145deg, rgba(13,22,32,.98), rgba(6,12,19,.99));
    box-shadow: 0 24px 70px rgba(0,0,0,.32);
    padding: clamp(24px, 4vw, 46px);
}
.form-card::before, .process-card::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(120deg, rgba(166,90,245,.08), transparent 24%, transparent 78%, rgba(36,198,244,.04)); }
.form-card > *, .process-card > * { position: relative; z-index: 1; }
.form-card h1, .admin-claims h1 { margin: 6px 0 10px; font-size: clamp(28px, 4vw, 46px); letter-spacing: 0; }
.form-card > p { max-width: 690px; color: #92a0ae; line-height: 1.7; }
.eyebrow { color: var(--violet); font-size: 10px; font-weight: 800; letter-spacing: 1.6px; }
.catalog-summary { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.catalog-summary span { min-height: 32px; padding: 0 11px; display: inline-flex; align-items: center; gap: 6px; color: #8090a0; border: 1px solid #263746; background: rgba(7,14,22,.8); font-size: 9px; text-transform: uppercase; }
.catalog-summary b { color: #d4a4ff; font-size: 12px; }
.claim-form { display: grid; gap: 16px; margin-top: 28px; }
.claim-form label { display: grid; gap: 7px; color: #aeb9c4; font-size: 10px; font-weight: 700; text-transform: uppercase; }
.claim-form label > small { color: #607184; font-size: 8px; font-weight: 500; letter-spacing: .2px; text-transform: none; }
.claim-form input, .claim-form select {
    width: 100%; height: 48px; padding: 0 13px; color: #edf4fb;
    border: 1px solid #2b3c4c; border-radius: 3px; background: #09121b; outline: 0;
}
.claim-form input:focus, .claim-form select:focus { border-color: var(--violet); box-shadow: 0 0 0 3px rgba(169,85,247,.1); }
.platform-context { min-height: 58px; padding: 10px 12px; display: grid; grid-template-columns: auto auto 1fr; align-items: center; gap: 9px; color: #9ba9b7; border: 1px solid #213140; border-top: 0; background: rgba(7,14,22,.82); text-transform: none; }
.platform-context b { color: white; font-size: 10px; }
.platform-context i { padding: 4px 7px; color: #d5aeff; border: 1px solid #5d3b76; background: #1d1029; font-size: 8px; font-style: normal; }
.platform-context small { color: #728293; font-size: 9px; font-weight: 500; text-align: right; }
.form-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.primary-action, .admin-actions button {
    min-height: 46px; padding: 0 18px; color: white; border: 1px solid #9c58da;
    border-radius: 3px; background: linear-gradient(90deg, #55217e, #7d35af); font-weight: 800; cursor: pointer;
}
.primary-action { display: flex; align-items: center; justify-content: space-between; transition: border-color .2s ease, filter .2s ease; }
.primary-action:hover { border-color: #d09dff; filter: brightness(1.1); }
.primary-action b { font-size: 18px; }
.form-alert { margin-top: 18px; padding: 13px; color: #ff9ca5; border: 1px solid #75313b; background: rgba(95,24,34,.28); }
.honeypot { position: absolute !important; left: -10000px !important; }
.process-card { align-self: start; position: sticky; top: 92px; }
.process-card h2 { margin: 8px 0 8px; font-size: 25px; }
.process-card > p { margin: 0 0 24px; color: #738394; font-size: 10px; line-height: 1.6; }
.process-card ol { display: grid; gap: 18px; padding: 0; list-style: none; }
.process-card li { display: grid; grid-template-columns: 35px 1fr; align-items: center; gap: 12px; color: #a3afbb; line-height: 1.5; }
.process-card li > b { width: 35px; height: 35px; display: grid; place-items: center; color: #dbb5ff; border: 1px solid #61427b; background: #241333; }
.process-card li span { display: grid; gap: 2px; }
.process-card li strong { color: #d9e2eb; font-size: 10px; }
.process-card li small { color: #728191; font-size: 9px; }
.trust-note { margin-top: 28px; padding: 14px; display: grid; gap: 5px; color: #8292a2; border: 1px solid #294052; background: #08121b; font-size: 9px; line-height: 1.5; }
.trust-note b { color: var(--green); font-size: 8px; letter-spacing: 1px; }
.claim-state { width: max-content; margin: 24px 0; padding: 8px 12px; border: 1px solid currentColor; font-size: 11px; font-weight: 900; }
.state-pending_proof { color: var(--amber); }.state-verified { color: var(--cyan); }.state-approved { color: var(--green); }.state-rejected { color: #ff6371; }
.proof-token { display: block; width: max-content; max-width: 100%; margin: 18px 0; padding: 16px 20px; overflow-wrap: anywhere; color: white; border: 1px solid #8249b0; background: #160d20; font-size: clamp(18px, 3vw, 28px); }
.claim-details { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: 28px; background: #263441; }
.claim-details div { padding: 14px; background: #0a131c; }.claim-details dt { color: #6f7f8e; font-size: 9px; text-transform: uppercase; }.claim-details dd { margin: 5px 0 0; font-size: 11px; }
.admin-claims { width: min(1000px, 100%); }
.admin-claim { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 17px 0; border-bottom: 1px solid #273541; }
.admin-claim div:first-child { display: grid; gap: 5px; }.admin-claim small { color: #788795; }.admin-claim span { width: max-content; color: var(--cyan); font-size: 9px; }
.admin-actions form { display: flex; gap: 8px; }.admin-actions button:last-child { border-color: #71343b; background: #421c22; }
[data-endpoint-fields][hidden] { display: none !important; }
.owner-page { min-height: calc(100vh - 68px); padding: 1px 0 64px; background: radial-gradient(circle at 72% 4%, rgba(138,67,199,.1), transparent 34%); }
.owner-shell { width: min(1500px, calc(100% - 48px)); margin: 40px auto 0; display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 20px; }
.owner-portfolio, .owner-workspace { border: 1px solid #263746; border-radius: 5px; background: linear-gradient(145deg, rgba(12,21,30,.98), rgba(5,11,17,.99)); box-shadow: 0 24px 70px rgba(0,0,0,.28); }
.owner-portfolio { position: sticky; top: 20px; align-self: start; padding: 22px; }
.owner-portfolio h2 { margin: 5px 0 2px; font-size: 25px; }
.owner-account-summary { margin: 0 0 20px; color: #728293; font-size: 10px; text-transform: uppercase; }
.owner-signed-in { margin: 14px 0 8px; padding: 10px 11px; display: grid; gap: 5px; color: #607488; border: 1px solid #253746; background: #07111a; font-size: 8px; letter-spacing: .7px; }
.owner-signed-in strong { overflow: hidden; color: #d9b4ff; font-size: 10px; letter-spacing: 0; text-overflow: ellipsis; white-space: nowrap; }
.owner-service-list { display: grid; gap: 8px; }
.owner-service-item { min-width: 0; padding: 10px; display: grid; grid-template-columns: 42px minmax(0,1fr); align-items: center; gap: 10px; color: #aeb9c4; border: 1px solid #20303e; background: #08111a; text-decoration: none; transition: border-color .2s ease, background .2s ease, transform .2s ease; }
.owner-service-item:hover { border-color: #62427e; background: #0d1721; transform: translateX(2px); }
.owner-service-item.active { color: white; border-color: #9c58da; background: linear-gradient(90deg, rgba(108,42,151,.28), rgba(9,18,27,.96)); }
.owner-service-item > span { width: 42px; height: 42px; display: grid; place-items: center; color: #d9b4ff; border: 1px solid #64427e; background: #21132c; font-size: 11px; font-weight: 900; }
.owner-service-item b { min-width: 0; overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.owner-service-item small { margin-top: 4px; display: block; color: #718191; font-size: 8px; font-weight: 600; text-transform: uppercase; }
.owner-add-service { min-height: 42px; margin: 16px 0 10px; display: grid; place-items: center; color: #d8b4ff; border: 1px solid #684286; text-decoration: none; font-size: 9px; font-weight: 800; }
.owner-portfolio .secondary { width: 100%; min-height: 38px; color: #798997; border: 1px solid #283744; background: transparent; cursor: pointer; font-size: 8px; }
.owner-workspace { min-width: 0; overflow: hidden; }
.owner-heading { min-height: 148px; padding: 28px 32px; display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; border-bottom: 1px solid #263746; background: linear-gradient(110deg, rgba(33,19,44,.76), rgba(7,15,23,.96) 44%, rgba(20,38,48,.62)); }
.owner-heading h1 { margin: 6px 0 8px; font-size: clamp(27px, 3vw, 43px); }
.owner-heading code { color: #8fa0b0; font-size: 11px; }
.owner-heading .status { flex: none; }
.owner-notice { margin: 18px 24px 0; padding: 12px 14px; border: 1px solid; font-size: 10px; }
.owner-notice.success { color: #73e7aa; border-color: #256446; background: rgba(25,88,58,.2); }
.owner-notice.error { color: #ff9ca5; border-color: #75313b; background: rgba(95,24,34,.28); }
.owner-status-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); border-bottom: 1px solid #263746; }
.owner-status-grid article { min-width: 0; min-height: 94px; padding: 19px 22px; display: grid; align-content: center; gap: 7px; border-right: 1px solid #263746; }
.owner-status-grid article:last-child { border-right: 0; }
.owner-status-grid span { color: #64788b; font-size: 8px; letter-spacing: .8px; }
.owner-status-grid strong { overflow: hidden; color: #eef5fb; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.owner-proof { margin: 24px; padding: 22px; border: 1px solid #6d4d23; background: rgba(63,42,13,.2); }
.owner-proof h2 { margin: 5px 0 14px; font-size: 19px; }.owner-proof code { padding: 10px 13px; display: inline-block; color: #ffd783; border: 1px solid #7d5b24; background: #171108; }.owner-proof p:last-child { color: #8392a0; font-size: 10px; }
.owner-layout { padding: 24px; display: grid; grid-template-columns: minmax(0,1.12fr) minmax(310px,.88fr); gap: 18px; }
.owner-stack { display: grid; align-content: start; gap: 18px; }
.owner-form, .owner-danger { padding: 22px; display: grid; gap: 14px; border: 1px solid #263746; background: rgba(7,14,21,.88); }
.owner-form header h2, .owner-danger h2 { margin: 5px 0; font-size: 20px; }.owner-form header p:last-child { color: #738394; font-size: 9px; line-height: 1.55; }
.owner-form label { display: grid; gap: 7px; color: #8595a4; font-size: 8px; font-weight: 700; }
.owner-form input, .owner-form textarea { width: 100%; padding: 11px 12px; color: #edf4fb; border: 1px solid #2b3c4c; border-radius: 2px; background: #09121b; outline: 0; resize: vertical; }
.owner-form input:focus, .owner-form textarea:focus { border-color: var(--violet); box-shadow: 0 0 0 3px rgba(169,85,247,.1); }
.owner-form button { min-height: 44px; color: white; border: 1px solid #9c58da; background: linear-gradient(90deg,#55217e,#7d35af); font-weight: 800; cursor: pointer; }
.owner-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.owner-identity-card { background: radial-gradient(circle at 85% 15%, rgba(163,80,235,.18), transparent 40%), #09121b; }.owner-identity-card h2 { color: #d6a8ff; overflow-wrap: anywhere; }
.owner-danger { border-color: #533039; }.owner-danger a { color: #c99aff; font-size: 9px; }.owner-danger button { min-height: 38px; color: #ff9ca5; border: 1px solid #71343b; background: #421c22; cursor: pointer; }
.delete-service-form { margin-top: 8px; padding-top: 14px; border-top: 1px solid #533039; }
.delete-service-form p { margin: 0 0 10px; color: #8e747a; font-size: 9px; line-height: 1.5; }
.delete-service-form button { width: 100%; }
.topbar nav .owner-nav-link { color: #e3c2ff; border-bottom-color: #a855f7; }
.login-shell { min-height: calc(100vh - 70px); padding: 54px 20px; display: grid; place-items: start center; background: radial-gradient(circle at 50% 10%, rgba(153,70,220,.14), transparent 36%); }
.login-card { width: min(520px, 100%); padding: 34px; border: 1px solid #304153; background: linear-gradient(145deg, rgba(13,23,33,.99), rgba(6,11,18,.99)); box-shadow: 0 30px 90px rgba(0,0,0,.4); }
.login-card h1 { margin: 7px 0 10px; font-size: clamp(28px,4vw,44px); }.login-card > p:not(.eyebrow) { color: #7f8f9f; font-size: 11px; line-height: 1.65; }
.steam-login { min-height: 48px; margin-top: 24px; display: grid; place-items: center; color: white; border: 1px solid #557a9e; background: linear-gradient(90deg,#18344d,#24577b); font-size: 10px; font-weight: 900; letter-spacing: .08em; }
.login-divider { margin: 22px 0 4px; display: flex; align-items: center; gap: 12px; color: #617282; font-size: 8px; }.login-divider::before,.login-divider::after { content: ""; height: 1px; flex: 1; background: #273746; }
.auth-links { margin-top: 18px; display: flex; justify-content: space-between; gap: 14px; }.auth-links a,.auth-switch a { color: #d2a5fa; font-size: 10px; }.auth-switch { margin: 20px 0 0; color: #718293; font-size: 10px; text-align: center; }
.panel-connector { border: 1px solid #294253; background: linear-gradient(145deg, rgba(9,22,31,.98), rgba(8,13,21,.99)); }
.panel-connector > header { padding: 18px 20px; display: flex; align-items: start; justify-content: space-between; gap: 14px; border-bottom: 1px solid #294253; background: linear-gradient(90deg, rgba(42,126,170,.1), transparent); }
.panel-connector h2 { margin: 5px 0 0; font-size: 19px; }.panel-state { padding: 6px 8px; color: #80909d; border: 1px solid #344653; font-size: 8px; font-weight: 900; }.panel-state.connected { color: #4de69a; border-color: #267a51; }
.panel-connector form { padding: 18px 20px; display: grid; gap: 12px; }.panel-connector form p, .panel-connector form small { margin: 0; color: #718393; font-size: 9px; line-height: 1.55; }
.panel-connector label { display: grid; gap: 7px; color: #8595a4; font-size: 8px; font-weight: 700; }.panel-connector input, .panel-connector select { width: 100%; padding: 11px 12px; color: #edf4fb; border: 1px solid #2b3c4c; background: #09121b; outline: 0; }
.panel-connector form > button { min-height: 42px; color: white; border: 1px solid #3989bd; background: linear-gradient(90deg,#16496b,#236f99); font-size: 9px; font-weight: 900; cursor: pointer; }
.panel-connected-summary { display: grid; grid-template-columns: .6fr 1.4fr; border-bottom: 1px solid #294253; }.panel-connected-summary span { min-width: 0; padding: 14px 20px; color: #667b8d; border-right: 1px solid #294253; font-size: 8px; }.panel-connected-summary span:last-child { border-right: 0; }.panel-connected-summary strong { display: block; overflow: hidden; margin-top: 6px; color: #dfeaf2; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.panel-connector .panel-disconnect { padding-top: 0; }.panel-connector .panel-disconnect button { border-color: #71343b; background: #421c22; color: #ff9ca5; }
.empty-state { width: min(680px, calc(100% - 32px)); margin: 80px auto; padding: 40px; text-align: center; border: 1px solid #263746; background: #09121b; }.empty-state h1 { margin-top: 0; }.empty-state p { color: #8392a0; }.empty-state .connect-action { margin-top: 16px; display: inline-flex; }
@media (max-width: 760px) {
    .form-shell, .status-shell { grid-template-columns: 1fr; margin: 24px auto; }
    .form-pair, .claim-details { grid-template-columns: 1fr; }
    .form-card, .process-card, .admin-claims { padding: 22px; }
    .process-card { position: static; }
    .platform-context { grid-template-columns: auto auto; }
    .platform-context small { grid-column: 1 / -1; text-align: left; }
    .owner-shell { width: min(100% - 20px, 720px); margin-top: 18px; grid-template-columns: 1fr; }
    .owner-portfolio { position: static; }.owner-service-list { grid-template-columns: 1fr 1fr; }.owner-heading { padding: 22px; }.owner-status-grid { grid-template-columns: 1fr 1fr; }.owner-status-grid article:nth-child(2) { border-right: 0; }.owner-status-grid article:nth-child(-n+2) { border-bottom: 1px solid #263746; }
    .owner-layout { padding: 14px; grid-template-columns: 1fr; }.owner-form-row { grid-template-columns: 1fr; }
}
@media (max-width: 480px) { .owner-service-list, .owner-status-grid { grid-template-columns: 1fr; }.owner-status-grid article { border-right: 0; border-bottom: 1px solid #263746; }.owner-status-grid article:last-child { border-bottom: 0; }.owner-heading { flex-direction: column; } }