:root {
    color-scheme: dark;
    --bg: #050812;
    --surface: #0b1220;
    --surface-2: #101827;
    --surface-3: #142033;
    --border: rgba(148, 163, 184, .18);
    --line: var(--border);
    --border-strong: rgba(56, 189, 248, .42);
    --text: #f8fafc;
    --muted: #9aa8bc;
    --brand: #0ea5e9;
    --brand-strong: #2563eb;
    --success: #22c55e;
    --cyan: #38bdf8;
    --warning: #f7b955;
    --danger: #ff7272;
    --violet: #b39cff;
    --shadow: 0 18px 50px rgba(0, 0, 0, .28);
}

.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }

html[data-theme="light"] {
    color-scheme: light;
    --bg: #dce8f1;
    --surface: #edf4f8;
    --surface-2: #dbe8f1;
    --surface-3: #cedee9;
    --border: rgba(30,64,95,.22);
    --line: var(--border);
    --border-strong: rgba(2,132,199,.48);
    --text: #0b1f33;
    --muted: #496176;
    --brand: #075985;
    --brand-strong: #2563eb;
    --cyan: #0369a1;
    --shadow: 0 16px 42px rgba(25,62,94,.14);
}

html, body {
    min-height: 100%;
    margin: 0;
    background: var(--bg);
    color: var(--text);
    font-family: Inter, "Segoe UI", system-ui, -apple-system, sans-serif;
}

body {
    background-image:
        radial-gradient(circle at 88% -10%,rgba(14,165,233,.11),transparent 34rem),
        linear-gradient(90deg,rgba(56,189,248,.035) 1px,transparent 1px),
        linear-gradient(rgba(56,189,248,.03) 1px,transparent 1px);
    background-size: auto,64px 64px,64px 64px;
}
a { color: var(--brand); text-decoration: none; }
a:hover { color: #7dd3fc; }
button, input, select { font: inherit; }
h1, h2, p { margin-top: 0; }
h1 { font-size: clamp(1.8rem, 4vw, 2.55rem); letter-spacing: -.04em; margin-bottom: .4rem; }
h1:focus { outline: none; }
h2 { font-size: 1.05rem; letter-spacing: -.01em; }
code { color: #7dd3fc; background: rgba(14, 165, 233, .09); padding: .2rem .4rem; border-radius: .35rem; }

.app-shell { position: relative; z-index: 1; min-height: 100vh; display: grid; grid-template-columns: 270px minmax(0, 1fr); }
.network-packet-field { --packet-tail: rgba(56,189,248,.16); --packet-mid: rgba(125,211,252,.82); --packet-head: rgba(240,249,255,.98); --packet-glow: rgba(56,189,248,.48); position: fixed; z-index: 0; inset: 0; overflow: hidden; pointer-events: none; contain: strict; }
.network-packet,.network-packet-corner { position: absolute; top: 0; left: 0; width: 0; height: 0; opacity: 0; will-change: transform; }
.network-packet-tail,.network-packet-head,.network-packet-corner-tail { position: absolute; display: block; pointer-events: none; }
.network-packet-tail,.network-packet-corner-tail { right: 0; top: -1px; width: 30px; height: 2px; transform-origin: 100% 50%; background: linear-gradient(90deg,transparent,var(--packet-tail) 30%,var(--packet-mid)); box-shadow: 0 0 6px var(--packet-glow),0 0 13px rgba(56,189,248,.18); }
.network-packet-head { left: -2px; top: -2px; width: 4px; height: 4px; border-radius: 50%; background: var(--packet-head); box-shadow: 0 0 7px var(--packet-glow),0 0 15px var(--packet-glow); }
.sidebar { position: sticky; top: 0; height: 100vh; background: rgba(4, 8, 16, .97); border-right: 1px solid var(--border); overflow-y: scroll; scrollbar-gutter: stable; scrollbar-width: thin; scrollbar-color: rgba(14,165,233,.48) rgba(4,8,16,.88); }
.sidebar::-webkit-scrollbar { width: 8px; }
.sidebar::-webkit-scrollbar-track { background: rgba(4,8,16,.88); }
.sidebar::-webkit-scrollbar-thumb { border: 2px solid rgba(4,8,16,.88); border-radius: 999px; background: linear-gradient(#0ea5e9, #2563eb); }
.sidebar::-webkit-scrollbar-thumb:hover { background: #38bdf8; }
.main-panel { min-width: 0; position: relative; isolation: isolate; }
.app-header { min-height: 74px; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 0 2rem; border-bottom: 1px solid var(--border); background: rgba(5, 8, 18, .84); backdrop-filter: blur(18px); position: sticky; top: 0; z-index: 20; }
.content-area { max-width: 1720px; margin: 0 auto; padding: 2.2rem; }

.brand-block, .login-brand { display: flex; align-items: center; gap: .8rem; }
.brand-block { height: 88px; padding: 0 1.4rem; border-bottom: 1px solid var(--border); overflow: hidden; flex-wrap: nowrap; }
.brand-block img, .login-brand img { width: 48px; height: 48px; object-fit: contain; filter: drop-shadow(0 6px 18px rgba(14, 165, 233, .28)); }
.brand-block img { flex: 0 0 48px; }
.brand-block div, .login-brand div { display: flex; flex-direction: column; }
.brand-block > div { flex: 0 0 178px; min-width: 178px; white-space: nowrap; }
.brand-block span, .login-brand span { color: var(--brand); font-size: .7rem; font-weight: 800; letter-spacing: .16em; }
.brand-block strong, .login-brand strong { font-size: 1rem; letter-spacing: .01em; }

.nav-scrollable { padding: 1.25rem .9rem; }
.nav-section { display: block; width: 238px; min-width: 238px; box-sizing: border-box; overflow: hidden; color: #607087; font-size: .64rem; font-weight: 800; letter-spacing: .14em; padding: 1.2rem .8rem .55rem; white-space: nowrap; }
.nav-section:first-child { padding-top: 0; }
.nav-spacer { margin-top: 1rem; }
.nav-link { width: 100%; min-height: 42px; display: flex; align-items: center; gap: .7rem; color: #aab7ca; padding: .58rem .8rem; border: 0; border-radius: .55rem; background: transparent; text-align: left; transition: color .24s ease, background .24s ease, transform .24s cubic-bezier(.2,.8,.2,1), box-shadow .24s ease; }
.nav-link:hover { color: var(--text); background: rgba(255,255,255,.04); transform: translateX(3px); }
.nav-link.active { color: #eef9ff; background: linear-gradient(90deg, rgba(14,165,233,.2), rgba(37,99,235,.06)); box-shadow: inset 3px 0 var(--brand); }
.nav-icon { width: 1.35rem; flex: 0 0 1.35rem; color: var(--brand); font-size: 1.1rem; text-align: center; }
.nav-icon-svg { display: inline-grid; place-items: center; }
.nav-icon-svg svg { width: 1.08rem; height: 1.08rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.nav-label { width: 198px; min-width: 198px; flex: 0 0 198px; overflow: hidden; white-space: nowrap; }
.nav-button { cursor: pointer; }
.navbar-toggler { display: none; }

.environment-pill { display: inline-flex; align-items: center; gap: .55rem; color: var(--muted); font-size: .82rem; }
.header-actions { display: flex; align-items: center; justify-content: flex-end; gap: 1rem; min-width: 0; }
.theme-toggle { position: relative; width: 2.45rem; height: 2.2rem; display: grid; place-items: center; overflow: hidden; border: 1px solid var(--border); border-radius: .65rem; color: #fde68a; background: var(--surface-2); cursor: pointer; }
.theme-toggle:hover { border-color: var(--border-strong); transform: translateY(-1px); }
.theme-icon { position: absolute; transition: opacity .18s ease, transform .22s ease; }
.theme-icon-sun { opacity: 1; transform: rotate(0) scale(1); }
.theme-icon-moon { opacity: 0; transform: rotate(-30deg) scale(.65); }
html[data-theme="light"] .theme-icon-sun { opacity: 0; transform: rotate(35deg) scale(.65); }
html[data-theme="light"] .theme-icon-moon { opacity: 1; transform: rotate(0) scale(1); color: #1d4ed8; }
.language-selector { display: inline-flex; align-items: center; padding: .2rem; gap: .15rem; border: 1px solid var(--border); border-radius: .55rem; background: rgba(15, 23, 42, .72); }
.language-option { min-width: 2.2rem; display: grid; place-items: center; padding: .28rem .36rem; border-radius: .35rem; color: var(--muted); line-height: 1; text-align: center; }
.language-option:hover { color: var(--text); background: rgba(255,255,255,.05); }
.language-option.active { color: #fff; background: linear-gradient(145deg, #0ea5e9, #2563eb); }
.language-flag { width: 24px; height: 16px; display: block; overflow: hidden; border-radius: 2px; box-shadow: 0 0 0 1px rgba(255,255,255,.24), 0 2px 6px rgba(0,0,0,.42); }
.language-flag svg { width: 100%; height: 100%; display: block; }
.status-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #60736c; box-shadow: 0 0 0 4px rgba(96,115,108,.1); }
.status-dot.online, .state-badge.online { background-color: rgba(34,197,94,.12); color: #6ee7a0; }
.status-dot.online { background: var(--success); box-shadow: 0 0 0 4px rgba(34,197,94,.13); }
.status-dot.warning, .status-dot.pending { background: var(--warning); box-shadow: 0 0 0 4px rgba(247,185,85,.12); }
.status-dot.offline { background: #70817b; }
.signed-user { display: flex; align-items: center; gap: .65rem; }
.signed-user .avatar { width: 35px; height: 35px; display: grid; place-items: center; border-radius: .65rem; color: white; background: linear-gradient(145deg, #38bdf8, #2563eb); font-weight: 900; }
.signed-user div { display: flex; flex-direction: column; }
.signed-user strong { font-size: .86rem; }
.signed-user small { color: var(--muted); font-size: .7rem; }
.profile-menu { position: relative; }
.profile-menu > summary { cursor: pointer; list-style: none; padding: .35rem .45rem; border-radius: .65rem; transition: background-color .18s ease; }
.profile-menu > summary::-webkit-details-marker { display: none; }
.profile-menu > summary:hover,.profile-menu[open] > summary { background: rgba(56,189,248,.08); }
.profile-chevron { color: var(--muted); transition: transform .18s ease; }
.profile-menu[open] .profile-chevron { transform: rotate(180deg); }
.profile-menu-panel { position: absolute; right: 0; top: calc(100% + .65rem); z-index: 80; width: min(320px,calc(100vw - 2rem)); display: grid; gap: .75rem; padding: .85rem; border: 1px solid rgba(56,189,248,.28); border-radius: .75rem; background: #08111f; box-shadow: 0 24px 70px rgba(0,0,0,.55); }
.profile-menu-panel form,.impersonation-form { display: grid; gap: .55rem; }
.impersonation-state { display: grid; gap: .2rem; padding: .65rem; border-radius: .55rem; color: #fde68a; background: rgba(245,158,11,.08); }
.impersonation-state small { color: #d8c99d; }

.page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 1.5rem; margin-bottom: 1.7rem; }
.page-heading p { color: var(--muted); margin-bottom: 0; max-width: 720px; }
.eyebrow { color: var(--brand); font-size: .68rem; font-weight: 800; letter-spacing: .16em; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; border-radius: .6rem; border: 1px solid transparent; padding: .68rem 1rem; font-weight: 700; font-size: .84rem; cursor: pointer; transition: color .22s ease, background .22s ease, border-color .22s ease, box-shadow .22s ease, filter .22s ease, transform .22s cubic-bezier(.2,.8,.2,1); }
.btn:not(:disabled):hover { transform: translateY(-1px); }
.btn:not(:disabled):active { transform: translateY(0) scale(.98); transition-duration: .08s; }
.btn-primary { color: white; background: linear-gradient(145deg, #0ea5e9, #2563eb); border-color: #38bdf8; box-shadow: 0 8px 28px rgba(14,165,233,.2); }
.btn-primary:hover { color: white; filter: brightness(1.08); }
.btn-primary:disabled { filter: grayscale(.5); opacity: .5; }
.btn-secondary { color: var(--text); background: var(--surface-2); border-color: var(--border); }
.btn-secondary:hover { color: #effbff; border-color: rgba(56,189,248,.34); background: #142238; box-shadow: 0 9px 24px rgba(0,0,0,.2); }
.btn-editor { color: #c8f3ff; border-color: rgba(34,211,238,.3); background: linear-gradient(145deg, rgba(8,47,73,.84), rgba(15,23,42,.94)); box-shadow: inset 0 1px 0 rgba(255,255,255,.04); }
.btn-editor:hover { color: white; border-color: rgba(103,232,249,.62); background: linear-gradient(145deg, rgba(8,72,98,.94), rgba(18,38,64,.98)); box-shadow: 0 9px 24px rgba(6,182,212,.13); }
.button-count { min-width: 1.35rem; height: 1.35rem; display: inline-grid; place-items: center; padding: 0 .32rem; border-radius: 999px; background: rgba(255,255,255,.14); font-size: .64rem; }
.btn-warning { color: #fff7dc; background: linear-gradient(145deg, #9a5a08, #c7780b); border-color: rgba(247,185,85,.58); box-shadow: 0 8px 26px rgba(194,112,9,.16); }
.btn-warning:hover { color: #fff; filter: brightness(1.08); }

.metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin-bottom: 1rem; }
.metric-card, .panel, .node-card, .template-card { border: 1px solid var(--border); background: linear-gradient(145deg, rgba(16,24,39,.96), rgba(8,14,26,.96)); box-shadow: var(--shadow); }
.metric-card { min-height: 145px; padding: 1.25rem; border-radius: .9rem; display: flex; flex-direction: column; position: relative; overflow: hidden; }
.metric-card::after { content: ""; position: absolute; right: -20px; bottom: -45px; width: 100px; height: 100px; border: 20px solid currentColor; border-radius: 50%; opacity: .035; }
.metric-card > span { color: var(--muted); font-size: .78rem; }
.metric-card strong { font-size: 2.25rem; letter-spacing: -.05em; margin: .5rem 0 .25rem; }
.metric-card small { color: var(--muted); }
.accent-cyan { color: var(--cyan); }.accent-green { color: var(--success); }.accent-orange { color: var(--warning); }.accent-violet { color: var(--violet); }

.dashboard-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 1rem; }
.dashboard-main { align-items: start; }
.dashboard-node-stack { display: grid; gap: 1rem; }
.dashboard-heading-actions, .dashboard-layout-actions { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: .55rem; }
.dashboard-nodes-section { margin-top: 1rem; }
.dashboard-layout-header { margin-bottom: .75rem; }
.dashboard-layout-header small { color: var(--muted); }
.dashboard-node-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(520px, 100%), 1fr)); gap: 1rem; align-items: start; }
.dashboard-draggable-card { cursor: default; transition: opacity .15s ease, transform .15s ease, border-color .15s ease; }
.dashboard-draggable-card.dashboard-card-full { grid-column: 1 / -1; }
.dashboard-draggable-card.is-dragging { opacity: .55; transform: scale(.985); border-color: var(--brand); }
.dashboard-drag-handle { display: inline-flex; align-items: center; gap: .25rem; padding: .35rem .5rem; color: var(--muted); border: 1px dashed var(--border-strong); border-radius: .45rem; cursor: grab; user-select: none; font-size: .68rem; }
.dashboard-drag-handle:active { cursor: grabbing; }
.dashboard-size-toggle { min-height: 29px; display: inline-flex; align-items: center; gap: .28rem; padding: .32rem .5rem; color: #a7dff5; border: 1px solid rgba(56,189,248,.28); border-radius: .45rem; background: rgba(14,165,233,.07); font: inherit; font-size: .68rem; font-weight: 800; cursor: pointer; transition: color .16s ease, border-color .16s ease, background .16s ease; }
.dashboard-size-toggle:hover { color: #e4f8ff; border-color: rgba(56,189,248,.58); background: rgba(14,165,233,.14); }
.dashboard-size-toggle[aria-pressed="true"] { color: #d8b4fe; border-color: rgba(168,85,247,.42); background: rgba(126,34,206,.13); }
.dashboard-size-toggle [data-dashboard-size-value]::after { content: "1/2"; }
.dashboard-size-toggle[aria-pressed="true"] [data-dashboard-size-value]::after { content: "1/1"; }
.node-telemetry-note { margin: .8rem 0 0; }
.dashboard-service-list { display: grid; }
.dashboard-service-list a { display: grid; grid-template-columns: auto 1fr auto; gap: .7rem; align-items: center; padding: .7rem .2rem; color: var(--text); border-bottom: 1px solid var(--border); }
.dashboard-service-list a:last-child { border-bottom: 0; }
.dashboard-service-list a > div { display: flex; flex-direction: column; }
.dashboard-service-list small, .node-os { color: var(--muted); }
.node-resource-widget .progress-track { margin-top: .35rem; }
.pilot-games-panel { margin-top: 1rem; }
.panel { border-radius: .9rem; padding: 1.35rem; }
.panel-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 1rem; }
.panel-header h2 { margin: .25rem 0 0; }
.panel-header a { font-size: .78rem; }
.pilot-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; }
.pilot-list span { padding: .75rem; border: 1px solid var(--border); border-radius: .55rem; background: rgba(255,255,255,.018); color: #c2d3cd; font-size: .84rem; }
.node-summary p { color: var(--muted); line-height: 1.6; margin: 1rem 0; }
.inline-status { display: flex; align-items: center; gap: .55rem; color: #d5b46f; font-size: .82rem; }
.inline-status.online-text { color: #6ee7a0; }
.generated-at { color: #52675f; text-align: right; font-size: .7rem; margin-top: .75rem; }

.table-shell { overflow-x: auto; border: 1px solid var(--border); border-radius: .85rem; background: rgba(11,18,32,.94); box-shadow: var(--shadow); }
.data-table { width: 100%; border-collapse: collapse; min-width: 850px; }
.data-table th { padding: .85rem 1rem; color: #637b72; font-size: .67rem; text-transform: uppercase; letter-spacing: .12em; text-align: left; background: rgba(255,255,255,.015); }
.data-table td { padding: 1rem; border-top: 1px solid var(--border); color: #b9cbc4; font-size: .82rem; vertical-align: middle; }
.data-table td > strong, .data-table td > small { display: block; }
.data-table td > strong { color: var(--text); }
.data-table td > small { color: #5e756d; font-size: .66rem; margin-top: .25rem; }
.state-badge { display: inline-flex; padding: .28rem .52rem; border-radius: 1rem; font-size: .68rem; font-weight: 800; background: rgba(125,145,138,.1); color: #93a69f; }
.state-badge.pending { color: #efc779; background: rgba(247,185,85,.11); }
.state-badge.error { color: #ff9a9a; background: rgba(255,114,114,.1); }
.state-badge.complete { color: #7dd3fc; background: rgba(14,165,233,.13); }
.state-badge.backup-full { color: #c4b5fd; background: rgba(139,92,246,.14); }
.state-badge.backup-map { color: #67e8f9; background: rgba(6,182,212,.13); }
.state-badge.backup-players { color: #fcd34d; background: rgba(245,158,11,.13); }
.brand-checkbox { position: relative; width: 1.25rem; height: 1.25rem; display: inline-grid; place-items: center; vertical-align: middle; cursor: pointer; }
.brand-checkbox input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.brand-checkbox > span { width: 1.08rem; height: 1.08rem; display: grid; place-items: center; border: 1px solid rgba(125,211,252,.5); border-radius: .32rem; background: rgba(2,8,23,.72); box-shadow: inset 0 1px rgba(255,255,255,.04); transition: border-color .16s ease,background .16s ease,box-shadow .16s ease,transform .16s ease; }
.brand-checkbox > span::after { content: ""; width: .52rem; height: .27rem; border-left: 2px solid white; border-bottom: 2px solid white; opacity: 0; transform: translateY(-1px) rotate(-45deg) scale(.55); transition: opacity .14s ease,transform .14s ease; }
.brand-checkbox input:checked + span { border-color: #38bdf8; background: linear-gradient(145deg,#0ea5e9,#2563eb); box-shadow: 0 0 0 3px rgba(14,165,233,.13); }
.brand-checkbox input:checked + span::after { opacity: 1; transform: translateY(-1px) rotate(-45deg) scale(1); }
.brand-checkbox input:focus-visible + span { outline: 2px solid rgba(56,189,248,.65); outline-offset: 2px; }
.brand-checkbox input:disabled + span { cursor: not-allowed; filter: grayscale(.75); opacity: .42; }
.selection-column { width: 2.4rem; text-align: center; }
.table-cell-detail { display: block; margin-top: .16rem; color: var(--muted); font-size: .65rem; }
.endpoint-code { white-space: nowrap; }
.actions { display: flex; align-items: center; flex-wrap: wrap; gap: .45rem; white-space: nowrap; }
.icon-button { width: 31px; height: 31px; margin-right: .3rem; border-radius: .45rem; border: 1px solid var(--border); background: var(--surface-2); color: #b8cbc4; cursor: pointer; }
.icon-button:hover { border-color: var(--border-strong); color: var(--brand); }
.icon-button.positive { color: var(--success); }.icon-button.danger { color: var(--danger); }
.icon-button:disabled { opacity: .4; cursor: wait; }
.error-cell { max-width: 300px; color: #f09a9a !important; }
.success-cell { max-width: 300px; color: #8edcab !important; }
.warning-cell { max-width: 300px; color: #f6c453 !important; }

.notice, .loading-panel { border: 1px solid rgba(14,165,233,.22); background: rgba(14,165,233,.07); color: #bae6fd; border-radius: .7rem; padding: .9rem 1rem; margin-bottom: 1rem; }
.loading-panel { color: var(--muted); }
.empty-state { display: grid; place-items: center; text-align: center; min-height: 330px; border: 1px dashed rgba(151,199,182,.2); border-radius: .9rem; background: rgba(13,25,22,.5); padding: 2rem; }
.empty-state > * { margin: .2rem; }.empty-state p { color: var(--muted); max-width: 520px; }.empty-icon { font-size: 2rem; color: var(--brand); }

.card-list { display: grid; gap: 1rem; }
.node-card { border-radius: .85rem; padding: 1.25rem; }
.node-card-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1rem; }
.node-card-head > div { display: flex; align-items: center; gap: .7rem; }
.node-card dl, .template-card dl { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .75rem; margin: 0; }
.node-card dl div, .template-card dl div { min-width: 0; }
dt { color: #60786f; font-size: .65rem; text-transform: uppercase; letter-spacing: .09em; }
dd { margin: .35rem 0 0; color: #bfd0ca; font-size: .8rem; overflow-wrap: anywhere; }

.template-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.template-card { border-radius: .85rem; padding: 1.15rem; display: grid; grid-template-columns: auto 1fr; gap: .9rem; }
.template-mark { width: 42px; height: 42px; display: grid; place-items: center; border-radius: .65rem; color: white; background: linear-gradient(145deg, #38bdf8, #2563eb); font-weight: 900; }
.template-card h2 { margin: 0 0 .25rem; }.template-card dl { grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); padding-top: .75rem; border-top: 1px solid var(--border); }
.template-card > .state-badge { grid-column: 1 / -1; justify-self: start; }
.template-list-shell { overflow-x: auto; }
.template-list-table { min-width: 1180px; }
.template-list-name { display: flex; align-items: center; gap: .7rem; color: var(--text); }
.template-list-name > span:last-child, .template-list-table td:nth-child(2), .template-list-table td:nth-child(3), .template-list-table td:nth-child(5), .template-list-table td:nth-child(6) { display: flex; flex-direction: column; gap: .28rem; }
.template-list-table small { color: var(--muted); }
.template-catalog-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .8rem; margin-bottom: 1rem; }
.template-catalog-summary article { display: grid; gap: .22rem; min-height: 98px; padding: .9rem 1rem; border: 1px solid var(--border); border-radius: .8rem; background: var(--panel); box-shadow: var(--shadow); }
.template-catalog-summary span { color: var(--muted); font-size: .66rem; font-weight: 800; letter-spacing: .09em; }
.template-catalog-summary strong { color: var(--text); font-size: 1.45rem; }
.template-catalog-summary small { color: var(--muted); }
.template-game-art { position: relative; flex: none; width: 52px; height: 52px; display: grid; place-items: center; overflow: hidden; border: 1px solid rgba(56,189,248,.3); border-radius: .72rem; color: #fff; background: linear-gradient(145deg, #0ea5e9, #4338ca); font-weight: 900; }
.template-game-art img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.template-import-warning { color: #f6c667 !important; }
@media (max-width: 920px) { .template-catalog-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .template-catalog-summary { grid-template-columns: 1fr; } }

.migration-panel { display: grid; grid-template-columns: auto 1fr; gap: 1rem; align-items: start; }
.migration-panel .notice { grid-column: 1 / -1; margin: .5rem 0 0; }
.step-number { width: 42px; height: 42px; display: grid; place-items: center; color: var(--brand); border: 1px solid rgba(14,165,233,.28); border-radius: 50%; font-size: .72rem; font-weight: 800; }
.migration-panel p { color: var(--muted); }

.configuration-layout { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(300px, .7fr); gap: 1rem; align-items: start; }
.service-settings-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; margin-bottom: 1rem; }
.service-settings-links > a { display: flex; align-items: center; gap: .8rem; min-height: 64px; padding: .78rem .9rem; color: #d9edf7; border: 1px solid rgba(56,189,248,.18); border-radius: .8rem; background: linear-gradient(140deg, rgba(9,24,42,.94), rgba(5,13,25,.9)); text-decoration: none; transition: border-color .18s ease, transform .18s ease, background .18s ease; }
.service-settings-links > a:hover { border-color: rgba(56,189,248,.46); background: rgba(14,165,233,.1); transform: translateY(-1px); }
.service-settings-links > a > span { display: grid; flex: 0 0 auto; width: 2.1rem; height: 2.1rem; place-items: center; color: #38bdf8; border-radius: .6rem; background: rgba(14,165,233,.12); font-weight: 900; }
.service-settings-links > a > div { display: grid; gap: .14rem; min-width: 0; }
.service-settings-links small { color: #788fa4; }
.service-admin-section { margin-bottom: 1rem; }
.service-admin-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.service-path-grid { display: grid; gap: .46rem; margin-top: 1rem; padding-top: .9rem; border-top: 1px solid rgba(148,163,184,.13); }
.service-path-grid > div { display: grid; grid-template-columns: minmax(135px, .25fr) minmax(0, 1fr); align-items: baseline; gap: .75rem; }
.service-path-grid span { color: #71879b; font-size: .66rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.service-path-grid code { overflow-wrap: anywhere; color: #b9d5e6; }
.cpu-affinity-fieldset { margin: 1rem 0 0; padding: 1rem; border: 1px solid rgba(56,189,248,.14); border-radius: .8rem; background: rgba(3,10,20,.5); }
.cpu-affinity-fieldset:disabled { opacity: .72; }
.cpu-affinity-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: .8rem; margin-bottom: .75rem; }
.cpu-affinity-heading legend { padding: 0; color: #e8f5fc; font-size: .82rem; font-weight: 800; }
.cpu-affinity-heading small { display: block; max-width: 760px; margin-top: .2rem; color: #71879a; }
.cpu-affinity-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(88px, 1fr)); gap: .42rem; }
.cpu-affinity-option { display: flex; align-items: center; gap: .45rem; min-height: 36px; padding: .42rem .55rem; color: #9eb1c2; border: 1px solid #203247; border-radius: .5rem; background: rgba(7,16,29,.82); font-size: .68rem; font-weight: 750; cursor: pointer; }
.cpu-affinity-option:has(input:checked) { color: #dff5ff; border-color: rgba(56,189,248,.38); background: rgba(14,165,233,.1); }
.service-port-list { display: grid; gap: .55rem; }
.service-port-row { display: grid; grid-template-columns: minmax(150px, .65fr) minmax(180px, 1fr) minmax(130px, .45fr); align-items: end; gap: .75rem; padding: .7rem; border: 1px solid rgba(148,163,184,.12); border-radius: .7rem; background: rgba(4,11,22,.58); }
.service-port-row > div { display: grid; gap: .2rem; align-self: center; }
.service-port-row > div span, .service-port-row label > span { color: #74899d; font-size: .63rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.service-port-row > div strong { color: #38bdf8; font-size: .7rem; }
.service-port-row label { display: grid; gap: .32rem; }
.service-notes { min-height: 108px; resize: vertical; }
.configuration-sidebar { display: grid; gap: 1rem; }
.variable-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.variable-field { display: grid; gap: .42rem; min-width: 0; }
.variable-field > span { color: #adc0b9; font-size: .78rem; font-weight: 650; }
.variable-field small { color: var(--muted); font-size: .67rem; overflow-wrap: anywhere; }
.configuration-actions { display: flex; justify-content: flex-end; gap: .7rem; margin-top: 1.3rem; padding-top: 1rem; border-top: 1px solid var(--border); }
.configuration-actions.align-end { align-self: end; margin-top: 0; padding-top: 0; border-top: 0; }
.service-infrastructure-operations { border-color: rgba(245,158,11,.3); background: linear-gradient(145deg,rgba(30,20,6,.3),rgba(7,15,28,.9)); }
.infrastructure-node-context { display: grid; grid-template-columns: auto minmax(180px,.35fr) minmax(0,1fr) auto; gap: 1rem; align-items: center; margin: 1rem 0; padding: .85rem 1rem; border: 1px solid rgba(56,189,248,.24); border-radius: .75rem; background: rgba(8,47,73,.18); }
.infrastructure-node-context span, .infrastructure-node-context strong { display: block; }
.infrastructure-node-context span { color: var(--muted); font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; }
.infrastructure-node-context strong { margin-top: .18rem; color: #e0f2fe; }
.infrastructure-node-context p { margin: 0; color: #bae6fd; }
.service-delete-zone { display: grid; grid-template-columns: minmax(0,1fr) minmax(260px,.75fr) auto; align-items: end; gap: .85rem; margin-top: 1.1rem; padding: 1rem; border: 1px solid rgba(244,63,94,.32); border-radius: .75rem; background: rgba(76,5,25,.13); }
.service-delete-zone > div > strong, .service-delete-zone > div > small { display: block; }
.service-delete-zone > div > small { margin-top: .3rem; }
.service-delete-zone h4 { margin: 0 0 .3rem; color: #fecdd3; }
.service-delete-zone p { margin: 0; }
.configuration-hint { color: var(--muted); font-size: .72rem; line-height: 1.5; margin: .8rem 0 0; }
.license-notice { margin-bottom: 1rem; padding: .85rem 1rem; border: 1px solid rgba(247,185,85,.34); border-radius: .65rem; background: rgba(247,185,85,.07); color: #e8d5aa; font-size: .84rem; }
.license-notice a { color: #ffd47a; }
.template-lines { display: grid; gap: .55rem; margin: .8rem 0 0; padding-left: 1.25rem; color: var(--muted); }
.template-lines code { overflow-wrap: anywhere; }

.login-layout {
    min-height: 100vh;
    min-height: 100svh;
}

.login-shell {
    position: relative;
    isolation: isolate;
    min-height: 100vh;
    min-height: 100svh;
    display: grid;
    place-items: center;
    overflow: hidden;
    padding: clamp(1rem, 3vw, 2.5rem);
    background:
        linear-gradient(120deg, rgba(2, 6, 23, .88), rgba(2, 6, 23, .52)),
        radial-gradient(circle at 72% 12%, rgba(14, 165, 233, .20), transparent 34rem),
        url("/brand/datacenter.jpg") center / cover no-repeat;
}

.login-shell::before,
.login-shell::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}

.login-shell::before {
    inset: -6%;
    background:
        radial-gradient(circle at 68% 18%, rgba(56, 189, 248, .25), transparent 24rem),
        radial-gradient(circle at 14% 76%, rgba(37, 99, 235, .16), transparent 28rem),
        linear-gradient(90deg, rgba(255, 255, 255, .025) 1px, transparent 1px),
        linear-gradient(180deg, rgba(255, 255, 255, .018) 1px, transparent 1px);
    background-size: auto, auto, 54px 54px, 54px 54px;
    animation: login-ambient-drift 14s ease-in-out infinite alternate;
}

.login-shell::after {
    background: linear-gradient(180deg, rgba(3, 7, 18, .03), rgba(3, 7, 18, .42));
}

@property --login-panel-orbit-angle {
    syntax: "<angle>";
    inherits: false;
    initial-value: 0deg;
}

.login-card {
    position: relative;
    z-index: 1;
    isolation: isolate;
    width: min(100%, 440px);
    padding: clamp(1.5rem, 4vw, 2.25rem);
    border: 1px solid rgba(56, 189, 248, .28);
    border-radius: 1rem;
    background: linear-gradient(145deg, rgba(8, 14, 26, .93), rgba(4, 10, 20, .86));
    box-shadow: 0 35px 100px rgba(0, 0, 0, .58), 0 0 48px rgba(14, 165, 233, .08);
    backdrop-filter: blur(14px) saturate(1.08);
}

.login-card::before,
.login-card::after {
    content: "";
    position: absolute;
    z-index: 0;
    pointer-events: none;
    border-radius: inherit;
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
    mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
    animation: login-panel-orbit-angle 8.2s linear infinite;
}

.login-card::before {
    inset: -2px;
    padding: 2px;
    background: conic-gradient(from var(--login-panel-orbit-angle),
        transparent 0deg 10deg,
        rgba(56, 189, 248, .03) 20deg,
        rgba(56, 189, 248, .10) 34deg,
        rgba(56, 189, 248, .25) 50deg,
        rgba(125, 211, 252, .66) 66deg,
        rgba(255, 255, 255, .92) 82deg,
        rgba(125, 211, 252, .74) 98deg,
        rgba(56, 189, 248, .30) 116deg,
        rgba(56, 189, 248, .12) 132deg,
        rgba(56, 189, 248, .03) 146deg,
        transparent 162deg 360deg);
    filter: drop-shadow(0 0 6px rgba(125, 211, 252, .22));
}

.login-card::after {
    inset: -1px;
    padding: 1px;
    opacity: .82;
    background: conic-gradient(from var(--login-panel-orbit-angle),
        transparent 0deg 14deg,
        rgba(56, 189, 248, .03) 22deg,
        rgba(56, 189, 248, .12) 38deg,
        rgba(56, 189, 248, .28) 56deg,
        rgba(125, 211, 252, .68) 80deg,
        rgba(255, 255, 255, .96) 98deg,
        rgba(125, 211, 252, .72) 116deg,
        rgba(56, 189, 248, .28) 136deg,
        rgba(56, 189, 248, .10) 154deg,
        rgba(56, 189, 248, .03) 168deg,
        transparent 186deg 360deg);
    filter: drop-shadow(0 0 6px rgba(125, 211, 252, .18));
}

.login-card > * {
    position: relative;
    z-index: 1;
}

.login-brand { margin-bottom: 2rem; }
.login-card h1 { font-size: 1.65rem; }
.password-reset-card form { display: grid; }
.password-reset-back { margin-top: .65rem; }
.password-reset-success-icon { width: 3rem; height: 3rem; display: grid; place-items: center; margin-bottom: 1rem; border-radius: 999px; color: #bbf7d0; background: rgba(34,197,94,.16); border: 1px solid rgba(34,197,94,.42); font-size: 1.35rem; font-weight: 900; }
.muted { color: var(--muted); }

@keyframes login-ambient-drift {
    from { transform: translate3d(-1.2%, -.8%, 0) scale(1.01); opacity: .74; }
    to { transform: translate3d(1.2%, .8%, 0) scale(1.035); opacity: 1; }
}

@keyframes login-panel-orbit-angle {
    from { --login-panel-orbit-angle: 0deg; }
    to { --login-panel-orbit-angle: 360deg; }
}

@media (max-width: 640px) {
    .login-shell {
        align-items: center;
        background-position: center, center, 38% center;
    }

    .login-card {
        backdrop-filter: blur(10px) saturate(1.05);
    }
}

@media (prefers-reduced-motion: reduce) {
    .login-shell::before {
        animation: none;
    }

    .login-card::before,
    .login-card::after {
        animation: none;
    }
}
.field-group { display: grid; gap: .42rem; margin: 1rem 0; }.field-group label { color: #adc0b9; font-size: .78rem; font-weight: 650; }
.form-control { width: 100%; box-sizing: border-box; color: var(--text); background: #08111f; border: 1px solid var(--border); border-radius: .6rem; padding: .75rem .8rem; }
.form-control:focus { outline: 2px solid rgba(14,165,233,.22); border-color: var(--brand); }
.form-control:disabled { opacity: 1; color: #d8e7f7; background: #060d18; border-color: rgba(148,163,184,.24); -webkit-text-fill-color: #d8e7f7; }
.styled-select, select.form-control { appearance: none; padding-right: 2.35rem; color-scheme: dark; background-color: #08111f; background-image: linear-gradient(45deg, transparent 50%, #7dd3fc 50%), linear-gradient(135deg, #7dd3fc 50%, transparent 50%); background-position: calc(100% - 16px) calc(50% - 2px), calc(100% - 11px) calc(50% - 2px); background-size: 5px 5px, 5px 5px; background-repeat: no-repeat; }
.styled-select option, select.form-control option { color: var(--text); background: #08111f; }
.brand-select { position: relative; min-width: 0; }
.brand-select-trigger { display: flex; align-items: center; justify-content: space-between; gap: .75rem; width: 100%; text-align: left; cursor: pointer; background-image: none; }
.brand-select-trigger:hover:not(:disabled), .brand-select.open .brand-select-trigger { border-color: rgba(56,189,248,.52); box-shadow: 0 0 0 3px rgba(14,165,233,.09); }
.brand-select-trigger:focus-visible { outline: 2px solid rgba(56,189,248,.72); outline-offset: 2px; }
.brand-select-value { min-width: 0; overflow: hidden; color: var(--text); text-overflow: ellipsis; white-space: nowrap; }
.brand-select-chevron { flex: 0 0 auto; width: .58rem; height: .58rem; border-right: 2px solid #7dd3fc; border-bottom: 2px solid #7dd3fc; transform: translateY(-2px) rotate(45deg); transition: transform .18s ease; }
.brand-select.open .brand-select-chevron { transform: translateY(2px) rotate(225deg); }
.brand-select-dismiss { position: fixed; inset: 0; z-index: 2360; padding: 0; border: 0; background: transparent; cursor: default; }
.brand-select-menu { position: fixed; z-index: 2370; display: grid; gap: .22rem; max-height: min(340px, 48vh); overflow: auto; padding: .38rem; border: 1px solid rgba(56,189,248,.3); border-radius: .72rem; background: linear-gradient(155deg, #0a1628, #050c18); box-shadow: 0 24px 70px rgba(0,0,0,.66), inset 0 1px 0 rgba(255,255,255,.04); animation: brand-select-in .14s ease-out; }
.brand-select-option { display: flex; align-items: center; justify-content: space-between; gap: .7rem; min-height: 42px; padding: .58rem .68rem; color: #b7c7d8; border: 1px solid transparent; border-radius: .52rem; background: transparent; font: inherit; text-align: left; cursor: pointer; }
.brand-select-option > span:first-child { display: grid; gap: .14rem; min-width: 0; }
.brand-select-option strong { overflow: hidden; font-size: .76rem; text-overflow: ellipsis; white-space: nowrap; }
.brand-select-option small { color: #71869b; font-size: .65rem; font-weight: 500; }
.brand-select-option:hover:not(:disabled), .brand-select-option:focus-visible { color: #f0f9ff; border-color: rgba(56,189,248,.2); outline: 0; background: rgba(14,165,233,.09); }
.brand-select-option.selected { color: #e0f2fe; border-color: rgba(56,189,248,.34); background: linear-gradient(135deg, rgba(2,132,199,.22), rgba(14,165,233,.1)); }
.brand-select-option:disabled { opacity: .42; cursor: not-allowed; }
.brand-select-check { display: inline-grid; flex: 0 0 auto; width: 1.45rem; height: 1.45rem; place-items: center; color: #07111e; border-radius: 50%; background: #38bdf8; font-size: .72rem; font-weight: 900; box-shadow: 0 0 16px rgba(56,189,248,.28); }
.brand-select.disabled { opacity: .62; }
@keyframes brand-select-in { from { opacity: 0; transform: translateY(-5px) scale(.985); } to { opacity: 1; transform: none; } }
.brand-date-time-picker { position: relative; min-width: 0; }
.brand-date-time-picker.disabled { opacity: .62; }
.brand-date-time-trigger { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: .65rem; text-align: left; cursor: pointer; }
.brand-date-time-trigger:hover:not(:disabled),.brand-date-time-trigger:focus-visible { border-color: rgba(56,189,248,.52); box-shadow: 0 0 0 3px rgba(14,165,233,.09); }
.brand-date-time-trigger strong { overflow: hidden; color: var(--text); font-size: .78rem; text-overflow: ellipsis; white-space: nowrap; }
.brand-date-time-icon { width: 25px; height: 25px; display: grid; place-items: center; color: #67e8f9; border-radius: .42rem; background: rgba(6,182,212,.12); font-weight: 900; }
.brand-date-time-chevron { width: .54rem; height: .54rem; border-right: 2px solid #7dd3fc; border-bottom: 2px solid #7dd3fc; transform: translateY(-2px) rotate(45deg); }
.brand-date-time-dismiss { position: fixed; z-index: 2380; inset: 0; padding: 0; border: 0; background: rgba(0,3,10,.45); backdrop-filter: blur(2px); }
.brand-date-time-popover { position: fixed; z-index: 2390; top: 50%; left: 50%; width: min(390px,calc(100vw - 1.5rem)); padding: .85rem; color: var(--text); border: 1px solid rgba(56,189,248,.34); border-radius: .9rem; background: linear-gradient(155deg,#0a1628,#050c18); box-shadow: 0 28px 90px rgba(0,0,0,.72),inset 0 1px 0 rgba(255,255,255,.05); transform: translate(-50%,-50%); animation: brand-date-popover-in .16s ease-out; }
.brand-date-time-popover.time-only { width: min(350px,calc(100vw - 1.5rem)); }
.brand-calendar-heading { display: grid; grid-template-columns: 36px minmax(0,1fr) 36px; align-items: center; gap: .5rem; margin-bottom: .65rem; }
.brand-calendar-heading strong { text-align: center; font-size: .86rem; }
.brand-calendar-heading button,.brand-time-editor button { width: 36px; height: 36px; display: grid; place-items: center; color: #bfe9ff; border: 1px solid rgba(56,189,248,.2); border-radius: .5rem; background: rgba(14,165,233,.07); font: inherit; font-size: 1.1rem; cursor: pointer; }
.brand-calendar-heading button:hover,.brand-time-editor button:hover { color: #fff; border-color: rgba(56,189,248,.48); background: rgba(14,165,233,.15); }
.brand-calendar-weekdays,.brand-calendar-grid { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: .22rem; }
.brand-calendar-weekdays { margin-bottom: .25rem; }
.brand-calendar-weekdays span { padding: .2rem 0; color: #668198; font-size: .62rem; font-weight: 850; text-align: center; text-transform: uppercase; }
.brand-calendar-grid button { aspect-ratio: 1; min-width: 0; color: #bac8d8; border: 1px solid transparent; border-radius: .48rem; background: transparent; font: inherit; font-size: .72rem; cursor: pointer; }
.brand-calendar-grid button:hover { color: #fff; border-color: rgba(56,189,248,.24); background: rgba(14,165,233,.09); }
.brand-calendar-grid button.outside { color: #40546b; }
.brand-calendar-grid button.today { border-color: rgba(56,189,248,.36); color: #7dd3fc; }
.brand-calendar-grid button.selected { color: #04111e; border-color: #38bdf8; background: linear-gradient(135deg,#22d3ee,#3b82f6); box-shadow: 0 5px 16px rgba(14,165,233,.28); font-weight: 900; }
.brand-time-editor { display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); align-items: end; gap: .5rem; padding-top: .75rem; margin-top: .75rem; border-top: 1px solid rgba(148,163,184,.15); }
.brand-time-editor > div { min-width: 0; display: grid; gap: .32rem; }
.brand-time-editor > div > span { color: #7890a5; font-size: .62rem; font-weight: 800; text-align: center; text-transform: uppercase; letter-spacing: .08em; }
.brand-time-editor > div > div { display: grid; grid-template-columns: 36px minmax(0,1fr) 36px; align-items: center; gap: .35rem; }
.brand-time-editor strong { color: #f0f9ff; font-size: 1.05rem; text-align: center; font-variant-numeric: tabular-nums; }
.brand-time-separator { align-self: end; padding-bottom: .42rem; color: #38bdf8; font-size: 1.15rem; font-weight: 900; }
.brand-minute-shortcuts { display: grid; grid-template-columns: repeat(4,1fr); gap: .35rem; margin-top: .55rem; }
.brand-minute-shortcuts button { padding: .38rem; color: #8ba1b7; border: 1px solid rgba(148,163,184,.15); border-radius: .45rem; background: rgba(255,255,255,.02); font: inherit; font-size: .68rem; cursor: pointer; }
.brand-minute-shortcuts button:hover,.brand-minute-shortcuts button.selected { color: #dff7ff; border-color: rgba(56,189,248,.38); background: rgba(14,165,233,.11); }
.brand-date-time-popover footer { display: flex; justify-content: flex-end; gap: .5rem; padding-top: .8rem; margin-top: .8rem; border-top: 1px solid rgba(148,163,184,.15); }
@keyframes brand-date-popover-in { from { opacity: 0; transform: translate(-50%,-48%) scale(.98); } to { opacity: 1; transform: translate(-50%,-50%) scale(1); } }

.header-context { display: flex; flex-direction: column; min-width: 0; }
.header-context strong { font-size: .95rem; }
.header-kicker { color: var(--brand); font-size: .62rem; font-weight: 900; letter-spacing: .16em; }

.compact-heading { margin-bottom: 1rem; }
.table-action { display: inline-flex; align-items: center; min-height: 30px; padding: .25rem .65rem; border: 1px solid var(--border); border-radius: .45rem; font-size: .74rem; }
.inline-button { display: inline-grid; place-items: center; vertical-align: middle; }
.form-panel { max-width: 980px; }
.support-new-form-panel { width: min(980px, 100%); margin-inline: auto; }
.service-create-panel { max-width: 1180px; }
.service-kind-picker { width: min(1180px, 100%); margin: 0 0 1rem; }
.service-kind-picker > h2 { margin: 0 0 .65rem; color: #cbd5e1; font-size: .76rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.service-kind-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
.service-kind-card { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: .85rem; min-height: 96px; padding: .9rem 2.55rem .9rem .9rem; color: var(--text); border: 1px solid var(--border); border-radius: .8rem; background: rgba(6,15,29,.72); transition: border-color .18s ease, background .18s ease, transform .18s ease, box-shadow .18s ease; }
.service-kind-card:hover { color: var(--text); border-color: rgba(56,189,248,.5); background: rgba(9,27,47,.86); transform: translateY(-1px); }
.service-kind-card.active { border-color: rgba(14,165,233,.78); background: linear-gradient(135deg,rgba(14,165,233,.14),rgba(37,99,235,.08)); box-shadow: inset 3px 0 0 #20b9f2,0 8px 24px rgba(2,8,23,.18); }
.service-kind-card strong,.service-kind-card small { display: block; }
.service-kind-card strong { font-size: .86rem; }
.service-kind-card small { margin-top: .28rem; color: var(--muted); font-size: .7rem; line-height: 1.35; }
.service-kind-icon { width: 44px; height: 44px; display: grid; place-items: center; border-radius: .72rem; font-size: 1.32rem; background: rgba(56,189,248,.11); }
.service-kind-icon.voice { background: rgba(192,132,252,.13); }
.service-kind-icon.bot { background: rgba(74,222,128,.11); }
.service-kind-icon.voice,
.service-list-game-icon.voice {
    color: #fff;
    border-color: rgba(216,180,254,.66);
    background: linear-gradient(145deg,#7c3aed 0%,#db2777 52%,#0ea5e9 100%);
    box-shadow: 0 10px 26px rgba(168,85,247,.3), inset 0 1px rgba(255,255,255,.24);
}
.service-kind-icon.voice { text-shadow: 0 2px 8px rgba(0,0,0,.35); }

.subuser-group-row > td { padding-top: 0 !important; background: rgba(15,23,42,.28); }
.admin-subuser-disclosure { padding: .35rem .7rem .7rem; }
.admin-subuser-disclosure > summary { cursor: pointer; color: var(--cyan); font-weight: 750; }
.admin-subuser-list { display: grid; gap: .45rem; margin-top: .65rem; }
.admin-subuser-item { display: grid; grid-template-columns: minmax(12rem,1fr) auto auto; gap: .7rem; align-items: center; padding: .7rem .8rem; border: 1px solid var(--line); border-radius: .72rem; background: rgba(5,10,20,.42); }
.admin-subuser-item small { display: block; color: var(--muted); margin-top: .15rem; }
@media (max-width: 760px) { .admin-subuser-item { grid-template-columns: 1fr; } }
.bulk-create-box { display: grid; gap: .85rem; margin-top: 1rem; padding: 1rem; border: 1px solid rgba(56,189,248,.28); border-radius: .9rem; background: rgba(14,165,233,.06); }
.bulk-create-count { max-width: 22rem; }

html[data-theme="light"] body { background-color: var(--bg); background-image: radial-gradient(circle at 88% -10%,rgba(14,165,233,.12),transparent 34rem); }
html[data-theme="light"] .sidebar { background: rgba(245,250,255,.97); scrollbar-color: rgba(2,132,199,.45) rgba(226,238,249,.9); }
html[data-theme="light"] .app-header { background: rgba(255,255,255,.88); }
html[data-theme="light"] .nav-link { color: #415970; }
html[data-theme="light"] .nav-link:hover { color: #09233c; background: rgba(2,132,199,.07); }
html[data-theme="light"] .nav-link.active { color: #075985; background: linear-gradient(90deg,rgba(14,165,233,.16),rgba(37,99,235,.04)); }
html[data-theme="light"] .metric-card,
html[data-theme="light"] .panel,
html[data-theme="light"] .node-card,
html[data-theme="light"] .template-card,
html[data-theme="light"] .table-shell,
html[data-theme="light"] .service-kind-card { background: linear-gradient(145deg,rgba(255,255,255,.98),rgba(241,247,253,.98)); }
html[data-theme="light"] .form-control,
html[data-theme="light"] .styled-select,
html[data-theme="light"] select.form-control,
html[data-theme="light"] .brand-select-trigger { color: var(--text); background-color: #fff; }
html[data-theme="light"] .styled-select option,
html[data-theme="light"] select.form-control option { color: var(--text); background: #fff; }
html[data-theme="light"] .btn-secondary { color: var(--text); background: #eef5fb; }
html[data-theme="light"] .btn-secondary:hover { color: #075985; background: #e0effb; }
html[data-theme="light"] .profile-menu-panel,
html[data-theme="light"] .brand-select-menu { color: var(--text); background: #fff; box-shadow: 0 22px 60px rgba(31,78,121,.2); }
html[data-theme="light"] .admin-subuser-item { background: rgba(255,255,255,.72); }
html[data-theme="light"] .subuser-group-row > td { background: rgba(226,238,249,.48); }
.service-kind-check { position: absolute; top: 50%; right: 1rem; display: none; width: 20px; height: 20px; place-items: center; color: #04101c; border-radius: 50%; background: #38bdf8; font-size: .72rem; font-weight: 900; transform: translateY(-50%); }
.service-kind-card.active .service-kind-check { display: grid; }
.service-instance-limit-notice { display: grid; gap: .28rem; margin: .85rem 0 0; }
.service-instance-limit-notice p,.service-instance-limit-notice small { margin: 0; }
.service-instance-limit-notice small { color: inherit; opacity: .86; }
.service-create-start-switch { margin-top: 1rem; padding: .9rem 1rem; border: 1px solid rgba(56,189,248,.16); border-radius: .75rem; background: rgba(3,10,20,.48); }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .2rem 1rem; }
.notice-error { color: #fecaca; border-color: rgba(248,113,113,.3); background: rgba(248,113,113,.08); }
.settings-grid { display: grid; gap: 1rem; }
.settings-grid.two-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
.check-list { display: grid; gap: .65rem; margin-top: 1rem; }
.check-list label { display: grid; grid-template-columns: auto 1fr; gap: .2rem .65rem; align-items: center; padding: .8rem; border: 1px solid var(--border); border-radius: .65rem; background: rgba(255,255,255,.018); }
.check-list label input { grid-row: 1 / 3; accent-color: var(--brand); }
.check-list label small { color: var(--muted); }
.detail-list { display: grid; gap: .7rem; margin: 1rem 0; }
.detail-list > div { display: grid; grid-template-columns: minmax(105px, .4fr) 1fr; gap: 1rem; padding-bottom: .65rem; border-bottom: 1px solid var(--border); }
.detail-list dt { align-self: center; }
.detail-list dd { text-align: right; }
.role-list { display: grid; gap: .7rem; margin-top: 1rem; }
.role-list > div { display: flex; align-items: center; gap: .75rem; padding: .75rem; border: 1px solid var(--border); border-radius: .65rem; }
.role-list > div > div { display: flex; flex-direction: column; }
.role-list small { color: var(--muted); }
.role-mark { width: 34px; height: 34px; display: grid; place-items: center; border-radius: .55rem; color: white; background: linear-gradient(145deg, #0ea5e9, #2563eb); font-weight: 900; }
hr { border: 0; border-top: 1px solid var(--border); margin: 1.2rem 0; }

.service-breadcrumbs { display: flex; flex-wrap: wrap; align-items: center; gap: .55rem; color: var(--muted); font-size: .73rem; margin-bottom: .75rem; }
.service-skin { position: relative; min-height: calc(100vh - 100px); }
.service-skin.has-game-background::before { content: ""; position: fixed; z-index: -1; inset: 74px 0 0 270px; background-image: linear-gradient(90deg, rgba(2,7,15,.88) 0%, rgba(2,7,15,.74) 48%, rgba(2,7,15,.66) 100%), linear-gradient(180deg, rgba(2,7,15,.12), rgba(2,7,15,.78)), var(--service-background-image); background-position: center; background-size: cover; background-repeat: no-repeat; opacity: .94; filter: saturate(.9); pointer-events: none; }
.service-breadcrumbs strong { color: var(--text); }
.service-titlebar { min-height: 52px; display: flex; align-items: center; justify-content: space-between; padding: .55rem .85rem; margin-bottom: 1rem; border: 1px solid rgba(56,189,248,.42); border-radius: .65rem; background: linear-gradient(90deg, rgba(14,165,233,.18), rgba(37,99,235,.08)); }
.service-titlebar > div { display: flex; align-items: center; gap: .65rem; }
.service-titlebar > div > div { display: flex; flex-direction: column; }
.service-titlebar small { color: #7dd3fc; font-size: .65rem; text-transform: uppercase; letter-spacing: .1em; }
.service-titlebar .service-title-state { display: grid; justify-items: end; gap: .22rem; }
.service-titlebar .service-title-runtime { color: #91a8bc; font-size: .61rem; font-weight: 650; letter-spacing: 0; text-transform: none; white-space: nowrap; }
.service-game-icon { width: 38px; height: 38px; display: grid; place-items: center; overflow: hidden; border-radius: .58rem; background: rgba(14,165,233,.13); border: 1px solid rgba(56,189,248,.18); }
.service-game-icon > img { width: 100%; height: 100%; object-fit: cover; }
.service-workspace { display: grid; grid-template-columns: 225px minmax(0, 1fr); gap: 1rem; align-items: start; }
.service-navigation { position: sticky; top: 90px; display: grid; padding: .55rem; border: 1px solid var(--border); border-radius: .75rem; background: rgba(8,14,26,.96); box-shadow: var(--shadow); }
.service-nav-link { position: relative; display: flex; align-items: center; gap: .65rem; min-height: 40px; padding: .55rem .65rem; border-radius: .5rem; color: #aab7ca; font-size: .76rem; overflow: hidden; transition: color .24s ease, background .24s ease, transform .24s cubic-bezier(.2,.8,.2,1), box-shadow .24s ease; }
.service-nav-link::before { content: ""; position: absolute; inset: 7px auto 7px 0; width: 2px; border-radius: 999px; background: linear-gradient(#38bdf8, #2563eb); box-shadow: 0 0 12px rgba(56,189,248,.7); transform: scaleY(0); opacity: 0; transition: transform .24s ease, opacity .24s ease; }
.service-nav-link span { width: 1.25rem; color: #64748b; text-align: center; font-weight: 800; }
.service-nav-link .service-nav-icon { text-shadow: 0 0 12px currentColor; transition: color .18s ease, transform .18s ease; }
.service-nav-link:hover .service-nav-icon { transform: scale(1.08); }
.service-nav-link .service-nav-icon-overview { color: #38bdf8; }
.service-nav-link .service-nav-icon-settings { color: #94a3b8; }
.service-nav-link .service-nav-icon-watchdog { color: #fb7185; }
.service-nav-link .service-nav-icon-configs { color: #a78bfa; }
.service-nav-link .service-nav-icon-commandline { color: #67e8f9; }
.service-nav-link .service-nav-icon-mods { color: #c084fc; }
.service-nav-link .service-nav-icon-steam-workshop { color: #60a5fa; }
.service-nav-link .service-nav-icon-curseforge-workshop { color: #f97316; }
.service-nav-link .service-nav-icon-files { color: #fbbf24; }
.service-nav-link .service-nav-icon-sftp { color: #34d399; }
.service-nav-link .service-nav-icon-logs { color: #60a5fa; }
.service-nav-link .service-nav-icon-steam { color: #7dd3fc; }
.service-nav-link .service-nav-icon-console { color: #4ade80; }
.service-nav-link .service-nav-icon-scripts { color: #fb923c; }
.service-nav-link .service-nav-icon-tasks { color: #facc15; }
.service-nav-link .service-nav-icon-activity { color: #2dd4bf; }
.service-nav-link .service-nav-icon-backups { color: #818cf8; }
.service-nav-link:hover { color: white; background: rgba(255,255,255,.04); transform: translateX(3px); }
.service-nav-link.active { color: white; background: linear-gradient(90deg, rgba(14,165,233,.22), rgba(37,99,235,.06)); box-shadow: 0 8px 24px rgba(0,0,0,.12); }
.service-nav-link.active::before { transform: scaleY(1); opacity: 1; }
.service-nav-link.active .service-nav-icon { filter: brightness(1.18); }
.service-nav-link .service-nav-badge { width: auto; min-width: 1.35rem; height: 1.35rem; margin-left: auto; padding: 0 .32rem; display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; color: #07111e; background: #facc15; box-shadow: 0 0 14px rgba(250,204,21,.28); font-size: .62rem; line-height: 1; }
.service-nav-link .service-nav-badge.has-update { animation: service-update-badge-pulse 1.5s ease-out infinite; }
@keyframes service-update-badge-pulse { 0% { box-shadow: 0 0 0 0 rgba(250,204,21,.55), 0 0 14px rgba(250,204,21,.3); } 70%,100% { box-shadow: 0 0 0 8px rgba(250,204,21,0), 0 0 14px rgba(250,204,21,.18); } }

.server-identity-heading { display: flex; align-items: center; gap: .75rem; min-width: 0; }
.server-game-logo { width: 52px; height: 52px; flex: 0 0 52px; display: grid; place-items: center; overflow: hidden; border-radius: .75rem; border: 1px solid rgba(56,189,248,.25); background: rgba(14,165,233,.12); box-shadow: 0 0 22px rgba(14,165,233,.1); }
.server-game-logo img { width: 100%; height: 100%; object-fit: cover; }
.game-logo-editor-row { display: grid; grid-template-columns: 84px minmax(0,1fr); gap: 1rem; align-items: center; }
.game-logo-preview { width: 84px; height: 84px; display: grid; place-items: center; overflow: hidden; border-radius: .85rem; border: 1px solid rgba(56,189,248,.28); background: #050c17; font-size: 2rem; }
.game-logo-preview img { width: 100%; height: 100%; object-fit: cover; }
.resource-limit-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
.service-workspace-content { min-width: 0; }
.service-route-loader { min-height: calc(100vh - 9rem); display: grid; place-content: center; justify-items: center; gap: .8rem; color: #7dd3fc; }
.service-route-loader small { color: var(--muted); font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; }
.service-route-spinner { position: relative; width: 52px; height: 52px; display: block; border: 2px solid rgba(56,189,248,.14); border-top-color: #38bdf8; border-radius: 50%; box-shadow: 0 0 32px rgba(14,165,233,.18); animation: service-loader-spin .82s linear infinite; }
.service-route-spinner::before, .service-route-spinner::after, .service-route-spinner i { content: ""; position: absolute; border-radius: 50%; }
.service-route-spinner::before { inset: 8px; border: 2px solid rgba(37,99,235,.18); border-right-color: #2563eb; animation: service-loader-spin 1.2s linear infinite reverse; }
.service-route-spinner::after { inset: 19px; background: #38bdf8; box-shadow: 0 0 14px rgba(56,189,248,.9); }
.service-route-spinner i { width: 5px; height: 5px; top: 5px; left: 50%; background: #7dd3fc; transform: translateX(-50%); }
.service-page-transition { min-width: 0; animation: service-page-enter .28s cubic-bezier(.2,.78,.2,1) both; }
.service-page-transition > :first-child { animation: service-page-child-enter .32s .03s cubic-bezier(.2,.78,.2,1) both; }
.action-spacer { flex: 1 1 auto; }

.switch-row { position: relative; display: flex; align-items: center; gap: .8rem; min-width: 0; cursor: pointer; }
.switch-row > input[type="checkbox"] { appearance: none; -webkit-appearance: none; width: 42px; height: 24px; flex: 0 0 42px; margin: 0; border: 1px solid rgba(148,163,184,.35); border-radius: 999px; background: #111a29; box-shadow: inset 0 2px 6px rgba(0,0,0,.35); cursor: pointer; transition: background .22s ease, border-color .22s ease, box-shadow .22s ease; }
.switch-row > input[type="checkbox"]::before { content: ""; display: block; width: 18px; height: 18px; margin: 2px; border-radius: 50%; background: #94a3b8; box-shadow: 0 3px 8px rgba(0,0,0,.42); transform: translateX(0); transition: transform .22s cubic-bezier(.2,.8,.2,1), background .22s ease; }
.switch-row > input[type="checkbox"]:checked { border-color: rgba(56,189,248,.72); background: linear-gradient(135deg, #0284c7, #2563eb); box-shadow: 0 0 0 3px rgba(14,165,233,.1), inset 0 1px 2px rgba(255,255,255,.15); }
.switch-row > input[type="checkbox"]:checked::before { background: white; transform: translateX(18px); }
.switch-row > input[type="checkbox"]:focus-visible { outline: 2px solid #7dd3fc; outline-offset: 3px; }
.switch-row > input[type="checkbox"]:disabled { opacity: .45; cursor: not-allowed; }
.switch-row > span { min-width: 0; display: grid; gap: .16rem; }
.switch-row > span small { color: var(--muted); }

.external-api-settings-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 1rem; margin: 1rem 0; }
.api-secret-card header, .template-api-credential-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.api-secret-card header > div, .template-api-credential-heading > div { display: grid; gap: .18rem; }
.api-secret-card header small, .template-api-credential-heading small { color: var(--muted); }
.api-secret-card .field-group { margin-top: 1rem; }
.api-clear-switch { margin-top: .8rem; padding: .7rem; border: 1px solid var(--border); border-radius: .65rem; background: rgba(255,255,255,.018); }
.template-api-credential { display: grid; gap: .75rem; margin-top: .85rem; padding: .9rem; border: 1px solid rgba(56,189,248,.2); border-radius: .72rem; background: rgba(2,8,18,.48); }
.api-secret-save-row, .template-api-save-row { display: flex; align-items: center; justify-content: flex-end; gap: .8rem; margin-top: .9rem; }
.api-secret-save-row .muted, .template-api-save-row .muted { margin-right: auto; }
.compact-notice { margin: 0; padding: .7rem .8rem; }

@keyframes service-page-enter { from { opacity: 0; } to { opacity: 1; } }
@keyframes service-page-child-enter { from { opacity: .55; } to { opacity: 1; } }
@keyframes service-loader-spin { to { transform: rotate(360deg); } }

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
.service-overview-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: .75rem; }
.service-overview-heading h1 { margin-bottom: .2rem; font-size: clamp(1.45rem, 2vw, 2rem); }
.service-overview-heading p { color: var(--muted); margin: 0; }
.service-primary-actions { display: flex; gap: .6rem; }
.service-overview-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; align-items: stretch; }
.service-overview-grid > .panel { min-width: 0; padding: 1rem; }
.connection-card-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.connection-card-header .state-badge { flex: none; margin-top: .15rem; }
.connection-card h2 { color: #7dd3fc; font-size: 1.15rem; margin: .25rem 0 .6rem; }
.windrose-invite-card { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin: 0 0 .7rem; padding: .85rem .9rem; border: 1px solid rgba(14,165,233,.5); border-radius: .7rem; background: linear-gradient(135deg,rgba(3,105,161,.18),rgba(20,184,166,.08)); box-shadow: inset 0 0 0 1px rgba(125,211,252,.04); }
.windrose-invite-card > div { min-width: 0; display: grid; gap: .25rem; }
.windrose-invite-card small { color: var(--muted); line-height: 1.45; }
.windrose-invite-code { color: #7dd3fc; font-family: var(--font-mono); font-size: clamp(1.15rem,2.1vw,1.7rem); letter-spacing: .16em; overflow-wrap: anywhere; }
.connection-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .45rem; margin: 0; }
.connection-facts > div { min-width: 0; padding: .5rem .55rem; border: 1px solid var(--border); border-radius: .5rem; background: rgba(255,255,255,.018); }
.connection-facts dt, .query-summary-grid span, .query-server-name span { color: #789088; font-size: .6rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.connection-facts dd { margin: .16rem 0 0; color: var(--text); font-size: .79rem; font-weight: 750; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.connection-facts .connection-root { grid-column: 1 / -1; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: .75rem; }
.connection-facts .connection-root dd { margin: 0; text-align: right; }
.path-value { font-family: Consolas, monospace; font-size: .68rem !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.server-info-state { display: flex; align-items: center; gap: .45rem; }
.server-query-block { padding-top: .6rem; margin-top: .65rem; border-top: 1px solid var(--border); }
.query-neutral { min-height: 58px; display: flex; align-items: center; gap: .75rem; padding: .65rem .75rem; color: #a8b5c7; border: 1px solid var(--border); border-radius: .55rem; background: rgba(255,255,255,.018); }
.query-neutral > span:first-child { width: 28px; height: 28px; flex: none; display: grid; place-items: center; color: #94a3b8; border-radius: 50%; background: rgba(148,163,184,.1); }
.query-neutral > div { min-width: 0; display: grid; gap: .12rem; }
.query-neutral strong { color: var(--text); font-size: .8rem; }
.query-neutral small { color: var(--muted); font-size: .68rem; line-height: 1.4; }
.query-neutral.pending > span:first-child { color: #f7b955; background: rgba(247,185,85,.1); }
.query-summary-grid { display: grid; grid-template-columns: 1.45fr 1fr .65fr; gap: .45rem; }
.query-summary-grid article { min-width: 0; display: flex; flex-direction: column; justify-content: center; padding: .45rem .55rem; border: 1px solid var(--border); border-radius: .5rem; background: rgba(255,255,255,.018); }
.query-summary-grid article > div, .query-server-name { display: flex; align-items: baseline; justify-content: space-between; gap: .6rem; }
.query-summary-grid strong { margin-top: .16rem; overflow: hidden; color: var(--text); font-size: .78rem; text-overflow: ellipsis; white-space: nowrap; }
.query-player-summary .progress-track { height: 5px; margin: .35rem 0 0; }
.query-server-name { min-width: 0; padding: .42rem .55rem; margin-top: .45rem; border-bottom: 1px solid var(--border); }
.query-server-name strong { min-width: 0; overflow: hidden; font-size: .77rem; text-overflow: ellipsis; white-space: nowrap; }
.live-status-card .panel-header { margin-bottom: .45rem; }
.live-status-card .panel-header h2 { margin-bottom: 0; }
.stat-row { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .55rem 0; color: var(--muted); border-bottom: 1px solid var(--border); }
.stat-row strong { color: var(--text); text-align: right; }
.progress-track { height: 8px; margin: .45rem 0 .7rem; border-radius: 1rem; background: #182235; overflow: hidden; }
.progress-track span { display: block; height: 100%; background: linear-gradient(90deg, #0ea5e9, #2563eb); transition: width .2s linear, background .18s ease; }
.progress-track.usage-warning span { background: linear-gradient(90deg, #f59e0b, #fb923c); }
.progress-track.usage-danger span { background: linear-gradient(90deg, #ef4444, #e11d48); }
.quick-tool-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; margin-top: 1rem; }
.quick-tool-grid a { display: grid; grid-template-columns: auto 1fr; gap: .18rem .7rem; padding: .9rem; color: var(--text); border: 1px solid var(--border); border-radius: .7rem; background: linear-gradient(145deg, rgba(16,24,39,.92), rgba(8,14,26,.92)); }
.quick-tool-grid a:hover { border-color: var(--border-strong); transform: translateY(-1px); }
.quick-tool-grid a > span { grid-row: 1 / 3; width: 34px; height: 34px; display: grid; place-items: center; color: #7dd3fc; border-radius: .5rem; background: rgba(14,165,233,.1); }
.quick-tool-grid small { color: var(--muted); }
.query-error { display: block; margin-top: .65rem; color: #fda4af; overflow-wrap: anywhere; }
.mod-provider-summary { margin-bottom: 1rem; }
.action-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .85rem; margin-bottom: 1rem; }
.action-grid article { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 1rem; }
.action-grid article h2 { margin-bottom: .25rem; }
.action-grid article p { color: var(--muted); margin-bottom: 0; }
.modal-card.pz-discord-settings-modal { width: min(920px,100%); }
.pz-discord-settings-modal > header p { margin: .4rem 0 0; color: var(--muted); }
.pz-discord-channel-grid { display: grid; gap: .75rem; margin-bottom: .9rem; }
.pz-discord-channel-grid > article { display: grid; grid-template-columns: minmax(240px,.8fr) minmax(300px,1.2fr); gap: .85rem; align-items: center; padding: .85rem; border: 1px solid var(--border); border-radius: .8rem; background: color-mix(in srgb,var(--panel) 78%,transparent); }
.pz-discord-channel-grid .check-row,.pz-discord-channel-grid .field-group { margin: 0; }
@media (max-width: 760px) {
    .pz-discord-channel-grid > article { grid-template-columns: 1fr; }
}
.action-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: .65rem; color: #7dd3fc; background: rgba(14,165,233,.1); font-size: 1.15rem; }
.update-action .action-icon { color: #c4b5fd; background: rgba(139,92,246,.13); }
.backup-action .action-icon { color: #6ee7a0; background: rgba(34,197,94,.12); }
.save-action .action-icon { color: #5eead4; background: rgba(20,184,166,.12); }
.btn-action-glyph { width: 20px; height: 20px; display: inline-grid; place-items: center; margin-right: .24rem; border-radius: .38rem; font-size: .72rem; font-weight: 950; line-height: 1; vertical-align: middle; }
.btn-action-glyph.restart { color: #fde68a; background: rgba(120,53,15,.35); }
.btn-action-glyph.stop { color: #fecaca; background: rgba(127,29,29,.34); }
.btn-action-glyph.configure,.btn-action-glyph.refresh { color: #a5f3fc; background: rgba(8,145,178,.28); }
.btn-action-glyph.update,.btn-action-glyph.language { color: #ddd6fe; background: rgba(109,40,217,.28); }
.btn-action-glyph.reinstall,.btn-action-glyph.restore { color: #fde68a; background: rgba(146,64,14,.3); }
.btn-action-glyph.clean { color: #fecdd3; background: rgba(159,18,57,.3); }
.btn-action-glyph.backup,.btn-action-glyph.snapshot { color: #bbf7d0; background: rgba(21,128,61,.28); }
.btn-action-glyph.save { color: #99f6e4; background: rgba(13,148,136,.28); }
.btn-small { padding: .42rem .65rem; border-radius: .45rem; font-size: .7rem; }
.btn-danger { color: #fee2e2; background: rgba(239,68,68,.12); border-color: rgba(248,113,113,.28); }
.btn-danger:hover { color: white; background: rgba(239,68,68,.2); }
.editor-panel { margin-top: 1rem; }
.editor-panel small { color: var(--muted); }
.code-editor { width: 100%; min-height: 390px; box-sizing: border-box; resize: vertical; padding: 1rem; color: #d8f3ff; background: #030711; border: 1px solid var(--border); border-radius: .6rem; font: .78rem/1.55 Consolas, "Cascadia Code", monospace; tab-size: 4; }
.code-editor:focus { outline: 2px solid rgba(14,165,233,.2); border-color: var(--brand); }
.commandline-editor { min-height: 330px; }
.command-preview { display: grid; gap: .4rem; margin-top: .8rem; }
.command-preview span { color: var(--muted); font-size: .7rem; text-transform: uppercase; letter-spacing: .1em; }
.command-preview code { display: block; max-height: 120px; overflow: auto; line-height: 1.5; }
.token-list { display: grid; gap: .45rem; max-height: 440px; overflow: auto; margin-top: .8rem; }
.token-list div { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: .4rem; align-items: center; }
.token-list code { overflow-wrap: anywhere; }
.token-list span { color: var(--muted); }

.file-toolbar { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: .7rem; }
.file-toolbar-icon { width: 1.45rem; height: 1.45rem; display: inline-grid; place-items: center; flex: 0 0 1.45rem; border-radius: .4rem; font-weight: 900; line-height: 1; }
.file-toolbar-icon.refresh { color: #67e8f9; background: rgba(6,182,212,.12); }
.file-toolbar-icon.folder { color: #fbbf24; background: rgba(245,158,11,.12); }
.file-toolbar-icon.file { color: #c4b5fd; background: rgba(139,92,246,.13); }
.file-toolbar-icon.upload { color: #6ee7a0; background: rgba(34,197,94,.12); }
.file-toolbar-icon.drive { color: #fff; background: linear-gradient(135deg,#4285f4 0 34%,#34a853 34% 67%,#fbbc04 67%); box-shadow: 0 0 0 1px rgba(255,255,255,.14); }
.file-toolbar-icon.download { color: #7dd3fc; background: rgba(14,165,233,.12); }
.file-toolbar-icon.restore { color: #f0abfc; background: rgba(192,38,211,.12); }
.google-drive-button { border-color: rgba(66,133,244,.42); }
.google-drive-row-button { color: #8ab4f8; border-color: rgba(66,133,244,.35); }
.google-drive-status { display:flex; align-items:center; flex-wrap:wrap; gap:.55rem; margin:-.15rem 0 .75rem; padding:.55rem .7rem; border:1px solid rgba(66,133,244,.2); border-radius:.65rem; background:rgba(66,133,244,.06); }
.google-drive-status small { color:var(--muted); margin-left:auto; }
.drive-job-panel { display:grid; grid-template-columns:1fr auto; gap:.45rem .8rem; margin:0 0 .8rem; padding:.8rem .9rem; border:1px solid rgba(66,133,244,.35); border-radius:.8rem; background:linear-gradient(120deg,rgba(66,133,244,.1),rgba(52,168,83,.055)); }
.drive-job-panel > div:first-child { display:flex; flex-direction:column; gap:.12rem; }
.drive-job-panel .upload-progress-track { grid-column:1/-1; }
.google-drive-confirm { border-color:rgba(66,133,244,.45); }
.settings-divider { border:0; border-top:1px solid var(--border); margin:1.4rem 0; }
.upload-button { position: relative; cursor: pointer; }
.upload-button input { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; }
.file-upload-backdrop { z-index: 380; }
.modal-card.file-upload-modal { width: min(900px, 100%); overflow: hidden; }
.upload-drop-zone { position: relative; min-height: 230px; display: grid; place-items: center; overflow: hidden; border: 1px dashed rgba(56,189,248,.62); border-radius: .85rem; background: radial-gradient(circle at 50% 0, rgba(14,165,233,.13), transparent 65%), rgba(2,8,18,.7); transition: border-color .18s ease, background .18s ease, transform .18s ease; }
.upload-drop-zone:hover, .upload-drop-zone:focus-within { border-color: #7dd3fc; background-color: rgba(14,165,233,.08); transform: translateY(-1px); }
.upload-drop-zone.busy { opacity: .62; transform: none; }
.upload-drop-content { display: grid; place-items: center; gap: .4rem; padding: 2rem; text-align: center; pointer-events: none; }
.upload-drop-content > span { width: 54px; height: 54px; display: grid; place-items: center; color: #7dd3fc; border: 1px solid rgba(56,189,248,.34); border-radius: 50%; background: rgba(14,165,233,.11); font-size: 1.65rem; }
.upload-drop-content strong { margin-top: .35rem; font-size: 1.05rem; }
.upload-drop-content small { color: var(--muted); }
.upload-drop-input { position: absolute; inset: 0; z-index: 2; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.upload-overall { display: grid; gap: .55rem; padding: .8rem .9rem; margin-top: .8rem; border: 1px solid var(--border-strong); border-radius: .7rem; background: rgba(14,165,233,.055); }
.upload-overall > small { color: var(--muted); text-align: right; }
.upload-overall-heading, .upload-overall-heading > div, .upload-overall-heading > div > div { display: flex; align-items: center; gap: .65rem; }
.upload-overall-heading { justify-content: space-between; }
.upload-overall-heading > div > div { align-items: flex-start; flex-direction: column; gap: .05rem; }
.upload-overall-heading small { color: var(--muted); }
.upload-progress-track { height: 7px; overflow: hidden; border-radius: 999px; background: #17243a; box-shadow: inset 0 0 0 1px rgba(148,163,184,.06); }
.upload-progress-track > span { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #0ea5e9, #3b82f6); transition: width .12s linear; }
.upload-result-list { display: grid; gap: .45rem; max-height: min(38vh, 360px); overflow: auto; margin-top: .8rem; padding-right: .2rem; scrollbar-color: #24658d #07101d; scrollbar-width: thin; }
.upload-file-row { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: .7rem; align-items: start; padding: .65rem .7rem; border: 1px solid var(--border); border-radius: .6rem; background: rgba(5,12,24,.52); }
.upload-state-icon { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; color: #94a3b8; background: rgba(148,163,184,.1); font-weight: 900; }
.upload-file-detail { min-width: 0; display: grid; gap: .38rem; }
.upload-file-heading, .upload-file-meta { min-width: 0; display: flex; justify-content: space-between; gap: .7rem; align-items: center; }
.upload-file-heading strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.upload-file-heading span { flex: 0 0 auto; color: var(--muted); font-size: .68rem; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; }
.upload-file-meta small { color: var(--muted); }
.upload-file-message { min-width: 0; overflow-wrap: anywhere; text-align: right; }
.upload-file-row.uploading { border-color: rgba(56,189,248,.38); }
.upload-file-row.uploading .upload-state-icon { color: #7dd3fc; background: rgba(14,165,233,.13); animation: upload-pulse 1s ease-in-out infinite; }
.upload-file-row.succeeded .upload-state-icon { color: #6ee7a0; background: rgba(34,197,94,.12); }
.upload-file-row.succeeded .upload-progress-track > span { background: #22c55e; }
.upload-file-row.failed { border-color: rgba(248,113,113,.25); }
.upload-file-row.failed .upload-state-icon { color: #fca5a5; background: rgba(239,68,68,.12); }
.upload-file-row.failed .upload-progress-track > span { background: #ef4444; }
.upload-file-row.failed .upload-file-message { color: #fca5a5; }
.upload-file-row.cancelled .upload-state-icon { color: #fbbf24; background: rgba(245,158,11,.12); }
.upload-file-row.cancelled .upload-progress-track > span { background: #f59e0b; }
.file-upload-modal > footer { gap: .55rem; }
@keyframes upload-pulse { 50% { transform: translateY(-2px); box-shadow: 0 0 18px rgba(56,189,248,.28); } }
.inline-create { display: grid; grid-template-columns: minmax(180px, 1fr) auto auto; gap: .5rem; padding: .7rem; margin-bottom: .7rem; border: 1px solid var(--border-strong); border-radius: .65rem; background: rgba(14,165,233,.06); }
.path-bar { display: flex; align-items: center; flex-wrap: wrap; gap: .3rem; min-height: 42px; padding: .4rem .55rem; border: 1px solid var(--border); border-radius: .65rem .65rem 0 0; background: var(--surface-2); color: var(--muted); font-size: .72rem; }
.path-bar button { color: #bae6fd; background: transparent; border: 0; cursor: pointer; }
.path-bar button:disabled { color: #4b5563; cursor: default; }
.file-clipboard-bar { display: flex; align-items: center; gap: .68rem; min-height: 56px; padding: .52rem .7rem; color: #cfe7f5; border: 1px solid var(--border); border-top: 0; background: linear-gradient(90deg, rgba(14,165,233,.1), rgba(8,18,31,.82) 48%, rgba(139,92,246,.07)); }
.file-clipboard-icon { width: 2rem; height: 2rem; display: inline-grid; place-items: center; flex: 0 0 2rem; color: #67e8f9; border: 1px solid rgba(34,211,238,.2); border-radius: .55rem; background: rgba(6,182,212,.12); font-size: 1rem; font-weight: 900; }
.file-clipboard-icon.cut { color: #c4b5fd; border-color: rgba(167,139,250,.22); background: rgba(139,92,246,.13); }
.file-clipboard-bar > div:not(.file-clipboard-actions) { min-width: 0; display: grid; gap: .08rem; }
.file-clipboard-bar small { color: #70cce9; font-size: .61rem; font-weight: 900; letter-spacing: .1em; }
.file-clipboard-bar strong { max-width: min(46vw, 34rem); overflow: hidden; color: #f1f8fc; text-overflow: ellipsis; white-space: nowrap; }
.file-clipboard-actions { display: flex; gap: .42rem; margin-left: auto; }
.file-context-hint { margin-left: auto; padding: 0 .35rem; color: #71849a; white-space: nowrap; }
.file-manager-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; }
.file-manager-grid .table-shell { border-radius: 0 0 .85rem .85rem; }
.file-link { display: inline-flex; align-items: center; gap: .5rem; color: var(--text); border: 0; background: transparent; padding: 0; cursor: pointer; text-align: left; }
.file-link span { color: #fbbf24; }
.file-table { min-width: 760px; }
.file-action-column, .file-overflow-cell { width: 58px; text-align: right !important; }
.file-entry-row { transition: background .14s ease, box-shadow .14s ease; }
.file-entry-row:hover, .file-entry-row.context-selected { background: rgba(14,165,233,.065); }
.file-entry-row.context-selected { box-shadow: inset 3px 0 #38bdf8; }
.file-entry-row.clipboard-source { background: rgba(139,92,246,.065); box-shadow: inset 3px 0 #8b5cf6; }
.file-entry-row.clipboard-cut { opacity: .58; }
.file-overflow-button { width: 34px; height: 30px; display: inline-grid; place-items: center; padding: 0 0 6px; color: #8fb2c8; border: 1px solid transparent; border-radius: .5rem; background: transparent; font: 900 1rem/1 system-ui, sans-serif; letter-spacing: 1px; cursor: pointer; }
.file-overflow-button:hover, .file-overflow-button:focus-visible { color: #e0f6ff; border-color: rgba(56,189,248,.35); background: rgba(14,165,233,.12); outline: 0; }
.file-context-dismiss { position: fixed; inset: 0; z-index: 250; padding: 0; border: 0; background: transparent; cursor: default; }
.file-context-menu { position: fixed; z-index: 260; width: min(15rem, calc(100vw - 1.5rem)); max-height: calc(100vh - 1.5rem); overflow-x: hidden; overflow-y: auto; padding: .38rem; color: #d9edf7; border: 1px solid rgba(56,189,248,.27); border-radius: .72rem; background: linear-gradient(155deg, rgba(10,22,37,.985), rgba(3,10,20,.99)); box-shadow: 0 22px 65px rgba(0,0,0,.56), inset 0 1px rgba(255,255,255,.035); }
.file-context-menu-heading { min-width: 0; display: flex; align-items: center; gap: .55rem; margin: -.05rem 0 .28rem; padding: .62rem .68rem .55rem; color: #f8fafc; border-bottom: 1px solid rgba(148,163,184,.13); }
.file-context-menu-heading span { color: #fbbf24; }
.file-context-menu-heading strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.file-context-menu > button { width: 100%; display: grid; grid-template-columns: 1.55rem minmax(0, 1fr); align-items: center; gap: .48rem; min-height: 38px; padding: .48rem .62rem; color: #bcd0dd; border: 0; border-radius: .48rem; background: transparent; text-align: left; font: inherit; font-size: .76rem; font-weight: 700; cursor: pointer; }
.file-context-menu > button span { display: inline-grid; place-items: center; color: #5ed5ff; font-size: .9rem; }
.file-context-menu > button:hover, .file-context-menu > button:focus-visible { color: #f2fbff; background: rgba(14,165,233,.13); outline: 0; }
.file-context-menu > button:disabled { opacity: .45; cursor: wait; }
.file-context-menu > button.danger { color: #fda4af; }
.file-context-menu > button.danger span { color: #fb7185; }
.file-context-menu > button.danger:hover, .file-context-menu > button.danger:focus-visible { background: rgba(225,29,72,.14); }
.file-context-menu-separator { height: 1px; margin: .3rem .45rem; background: rgba(148,163,184,.14); }
.file-rename-modal { width: min(520px, 100%); }
.file-rename-modal .form-field { display: grid; gap: .42rem; margin: 1rem 0; }
.file-rename-modal .form-field > span { color: var(--muted); font-size: .72rem; font-weight: 800; }
.file-editor { position: relative; }
.confirm-strip { position: fixed; left: 50%; bottom: 1.2rem; z-index: 100; transform: translateX(-50%); width: min(760px, calc(100% - 2rem)); display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: .7rem; padding: .85rem 1rem; border: 1px solid rgba(248,113,113,.4); border-radius: .75rem; background: #201018; box-shadow: 0 24px 80px rgba(0,0,0,.55); }
.confirm-strip > div { display: flex; flex-direction: column; }
.confirm-strip small { color: #fca5a5; }

.log-layout { display: grid; gap: 1rem; }
.log-table { min-width: 760px; }
.log-viewer-tabs { display: inline-flex; align-items: center; gap: .32rem; margin: .1rem 0 1rem; padding: .34rem; border: 1px solid rgba(56,189,248,.18); border-radius: .9rem; background: linear-gradient(145deg, rgba(8,17,31,.96), rgba(3,9,19,.9)); box-shadow: inset 0 1px 0 rgba(255,255,255,.035), 0 12px 30px rgba(0,0,0,.18); }
.log-viewer-tabs button { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: .58rem; min-height: 42px; padding: .62rem 1rem; color: #8fa5b8; border: 1px solid transparent; border-radius: .64rem; background: transparent; font: inherit; font-size: .78rem; font-weight: 700; letter-spacing: .015em; cursor: pointer; transition: color .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease; }
.log-viewer-tabs button:hover { color: #d8f3ff; border-color: rgba(56,189,248,.16); background: rgba(56,189,248,.065); transform: translateY(-1px); }
.log-viewer-tabs button:focus-visible { outline: 2px solid rgba(56,189,248,.72); outline-offset: 2px; }
.log-viewer-tabs button.active { color: #f0f9ff; border-color: rgba(56,189,248,.34); background: linear-gradient(135deg, rgba(2,132,199,.23), rgba(14,165,233,.12)); box-shadow: inset 0 0 0 1px rgba(125,211,252,.055), 0 7px 18px rgba(2,132,199,.12); }
.log-viewer-tabs button.active::after { content: ""; position: absolute; right: 20%; bottom: -1px; left: 20%; height: 2px; border-radius: 2px; background: linear-gradient(90deg, transparent, #38bdf8, transparent); box-shadow: 0 0 12px rgba(56,189,248,.72); }
.log-tab-glyph { display: inline-grid; width: 1.75rem; height: 1.75rem; place-items: center; border: 1px solid currentColor; border-radius: .5rem; background: rgba(255,255,255,.025); font-size: .83rem; line-height: 1; opacity: .9; }
.log-tab-glyph-server { color: #60a5fa; }
.log-tab-glyph-administration { color: #a78bfa; }
.log-tab-glyph-service { color: #2dd4bf; }
.log-viewer-tabs button.active .log-tab-glyph { color: #7dd3fc; background: rgba(14,165,233,.14); box-shadow: 0 0 16px rgba(14,165,233,.16); }
.log-filter-panel { display: grid; grid-template-columns: auto minmax(240px, 1fr) minmax(190px, 250px) auto; align-items: center; gap: .7rem; margin: 0 0 1rem; padding: .7rem; border: 1px solid rgba(56,189,248,.16); border-radius: .85rem; background: rgba(5,13,25,.86); box-shadow: inset 0 1px 0 rgba(255,255,255,.025); }
.date-filter-chips { display: flex; align-items: center; gap: .28rem; padding: .25rem; border: 1px solid rgba(148,163,184,.13); border-radius: .65rem; background: rgba(2,8,17,.7); }
.date-filter-chips button { min-height: 34px; padding: .42rem .66rem; color: #8297aa; border: 1px solid transparent; border-radius: .45rem; background: transparent; font: inherit; font-size: .7rem; font-weight: 750; cursor: pointer; white-space: nowrap; }
.date-filter-chips button:hover { color: #e0f2fe; background: rgba(56,189,248,.07); }
.date-filter-chips button.active { color: #e8f8ff; border-color: rgba(56,189,248,.3); background: linear-gradient(135deg, rgba(2,132,199,.25), rgba(14,165,233,.1)); box-shadow: 0 0 16px rgba(14,165,233,.09); }
.log-search-field { display: flex; align-items: center; gap: .55rem; min-width: 0; height: 42px; padding: 0 .72rem; border: 1px solid #24364a; border-radius: .65rem; background: rgba(3,9,18,.92); color: #38bdf8; }
.log-search-field:focus-within { border-color: rgba(56,189,248,.58); box-shadow: 0 0 0 3px rgba(14,165,233,.09); }
.log-search-field input { width: 100%; min-width: 0; color: var(--text); border: 0; outline: 0; background: transparent; font: inherit; }
.log-search-field input::placeholder { color: #5f7489; }
.log-actor-filter { min-width: 0; }
.log-filter-count { color: #7890a6; font-size: .67rem; font-weight: 700; white-space: nowrap; }
.audit-identity-hint { margin: -.2rem 0 .75rem; color: #7f95aa; font-size: .69rem; }
.selected-row { background: rgba(14,165,233,.06); }
.log-stream { min-width: 0; }
.log-stream pre { max-height: 560px; overflow: auto; padding: 1rem; color: #c7e9f7; background: #02050c; border: 1px solid var(--border); border-radius: .6rem; font: .75rem/1.5 Consolas, monospace; white-space: pre-wrap; overflow-wrap: anywhere; }
.log-stream > small { color: var(--muted); }

.console-panel { overflow: hidden; border: 1px solid var(--border); border-radius: .8rem; background: #02050b; box-shadow: var(--shadow); }
.console-output { min-height: 490px; max-height: 650px; overflow: auto; padding: 1rem; font-family: Consolas, "Cascadia Code", monospace; }
.console-muted { color: #52657d; }
.console-entry { display: grid; grid-template-columns: 60px 1fr; gap: .25rem .7rem; margin-bottom: .8rem; }
.console-entry small { color: #52657d; }
.console-entry code { color: #7dd3fc; background: transparent; padding: 0; }
.console-entry pre { grid-column: 2; margin: 0; color: #cbd5e1; white-space: pre-wrap; overflow-wrap: anywhere; }
.console-input { display: grid; grid-template-columns: auto 1fr auto; align-items: center; border-top: 1px solid var(--border); background: #08101e; }
.console-input span { padding-left: .85rem; color: var(--brand); font-family: monospace; font-weight: 900; }
.console-input input { min-width: 0; padding: .85rem .6rem; color: white; border: 0; outline: 0; background: transparent; font-family: Consolas, monospace; }
.console-input button { align-self: stretch; padding: 0 1rem; color: white; border: 0; border-left: 1px solid var(--border); background: #0b6fbd; }
.console-input button:disabled { color: #64748b; background: #101827; }
.stack-actions { display: grid; gap: .55rem; margin-top: 1rem; }
.steam-operation-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.steam-version-settings-collapsible { display: grid; gap: .75rem; margin-top: .8rem; padding: .8rem; border: 1px solid var(--border-strong); border-radius: .75rem; background: color-mix(in srgb, var(--panel-strong) 82%, transparent); }
.compact-panel-header { align-items: center; margin: 0; }
.steam-version-settings-collapsible .compact-panel-header > div { display: grid; gap: .15rem; }
.steam-version-settings-collapsible .compact-panel-header > .compact-header-actions { display: flex; align-items: center; gap: .45rem; }
.steam-protection-inline { position: relative; display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: .65rem; margin-top: .65rem; padding: .55rem .65rem; border: 1px solid var(--border); border-radius: .65rem; background: rgba(14,165,233,.045); cursor: pointer; }
.steam-protection-inline > input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.steam-protection-switch { position: relative; width: 2.15rem; height: 1.2rem; border: 1px solid var(--border-strong); border-radius: 999px; background: rgba(100,116,139,.34); transition: background .18s ease,border-color .18s ease; }
.steam-protection-switch i { position: absolute; top: .14rem; left: .15rem; width: .78rem; height: .78rem; border-radius: 50%; background: #cbd5e1; transition: transform .18s ease,background .18s ease; }
.steam-protection-inline > input:checked + .steam-protection-switch { border-color: rgba(52,211,153,.62); background: rgba(16,185,129,.32); }
.steam-protection-inline > input:checked + .steam-protection-switch i { transform: translateX(.9rem); background: #6ee7b7; }
.steam-protection-inline > input:focus-visible + .steam-protection-switch { outline: 2px solid #38bdf8; outline-offset: 2px; }
.steam-protection-inline > input:disabled ~ * { opacity: .58; cursor: not-allowed; }
.steam-protection-copy { display: grid; gap: .1rem; min-width: 0; }
.steam-protection-copy small { color: var(--muted); font-size: .68rem; line-height: 1.35; }
.compact-actions { margin-top: 0; }
.steam-version-check-button.checking:disabled { opacity: .92; color: #dff7ff; border-color: rgba(56,189,248,.42); background: linear-gradient(135deg,rgba(14,165,233,.13),rgba(15,23,42,.94)); cursor: wait; }
.steam-version-check-button.checking .spinner { border-color: rgba(125,211,252,.24); border-top-color: #7dd3fc; }
.steam-check-hint { display: block; margin-top: .65rem; color: #718399; font-size: .66rem; line-height: 1.45; }
.provision-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .7rem; margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--border); }
.provision-summary div { display: flex; flex-direction: column; gap: .25rem; padding: .75rem; border: 1px solid var(--border); border-radius: .6rem; }
.provision-summary span { color: var(--muted); font-size: .68rem; text-transform: uppercase; letter-spacing: .08em; }
.provision-summary strong { font-size: .75rem; overflow-wrap: anywhere; }

.view-tabs { display: flex; gap: .35rem; margin: -1rem 0 1rem; border-bottom: 1px solid var(--border); }
.view-tabs a { padding: .7rem .9rem; color: var(--muted); border-bottom: 2px solid transparent; font-size: .78rem; }
.view-tabs a.active { color: white; border-color: var(--brand); }
.priority { display: inline-flex; padding: .28rem .52rem; border-radius: 1rem; font-size: .68rem; font-weight: 800; color: #cbd5e1; background: rgba(148,163,184,.1); }
.priority.high { color: #fdba74; background: rgba(249,115,22,.1); }
.priority.urgent { color: #fca5a5; background: rgba(239,68,68,.12); }
.priority.low { color: #93c5fd; background: rgba(59,130,246,.1); }
.ticket-editor { min-height: 180px; resize: vertical; }
.ticket-layout { display: grid; grid-template-columns: minmax(0, 1fr) 290px; gap: 1rem; align-items: start; }
.ticket-thread { display: grid; gap: .8rem; }
.ticket-message { overflow: hidden; border: 1px solid var(--border); border-radius: .75rem; background: rgba(11,18,32,.94); }
.ticket-message.internal { border-color: rgba(168,85,247,.35); background: rgba(88,28,135,.09); }
.ticket-message header { display: flex; align-items: center; gap: .7rem; padding: .65rem .85rem; border-bottom: 1px solid var(--border); background: rgba(255,255,255,.02); }
.ticket-message header span { margin-left: auto; color: var(--muted); font-size: .7rem; }
.ticket-message header em { color: #d8b4fe; font-size: .67rem; font-style: normal; }
.ticket-message > div { padding: 1rem; color: #d7e0ec; line-height: 1.6; white-space: pre-wrap; overflow-wrap: anywhere; }
.reply-panel { margin-top: .2rem; }
.ticket-sidebar { position: sticky; top: 90px; }

.settings-section { margin-bottom: 1.4rem; }
.settings-section > h2 { padding-bottom: .45rem; margin-bottom: .7rem; color: #dbeafe; border-bottom: 1px dotted rgba(148,163,184,.3); font-size: .82rem; text-transform: uppercase; letter-spacing: .08em; }
.settings-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: .7rem; }
.settings-tiles > a, .settings-tiles > button { display: flex; flex-direction: column; align-items: center; gap: .3rem; min-height: 125px; padding: .9rem .65rem; color: var(--text); text-align: center; border: 1px solid transparent; border-radius: .7rem; background: transparent; cursor: pointer; }
.settings-tiles > a:hover, .settings-tiles > button:hover { border-color: var(--border); background: rgba(255,255,255,.025); }
.settings-tiles strong { font-size: .76rem; }
.settings-tiles small { color: var(--muted); font-size: .66rem; }
.tile-icon { width: 48px; height: 48px; display: grid; place-items: center; margin-bottom: .25rem; border-radius: .7rem; font-size: 1.5rem; background: rgba(14,165,233,.12); }
.tile-icon.blue { color: #38bdf8; }.tile-icon.cyan { color: #22d3ee; }.tile-icon.orange { color: #fb923c; }.tile-icon.violet { color: #c084fc; }.tile-icon.red { color: #fb7185; }.tile-icon.green { color: #4ade80; }.tile-icon.slate { color: #94a3b8; }
.settings-editor { margin-top: 1.2rem; scroll-margin-top: 90px; }
.settings-editor .form-grid { grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); }
.section-card-tabs { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 190px), 1fr)); gap: .65rem; margin: 0 0 1rem; }
.section-card-tab { position: relative; display: grid; grid-template-columns: 2.45rem minmax(0, 1fr) auto; align-items: center; gap: .7rem; min-width: 0; min-height: 78px; padding: .72rem .78rem; color: var(--text); text-align: left; border: 1px solid var(--border); border-radius: .78rem; background: linear-gradient(145deg, rgba(12, 22, 38, .94), rgba(6, 13, 25, .9)); box-shadow: inset 0 1px 0 rgba(255,255,255,.025); cursor: pointer; font: inherit; transition: border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease; }
.section-card-tab:hover { border-color: rgba(56,189,248,.38); background: linear-gradient(145deg, rgba(13, 34, 54, .96), rgba(7, 18, 33, .94)); transform: translateY(-1px); }
.section-card-tab:focus-visible { outline: 2px solid rgba(56,189,248,.78); outline-offset: 2px; }
.section-card-tab.active { border-color: rgba(56,189,248,.6); background: linear-gradient(135deg, rgba(3,105,161,.34), rgba(30,64,175,.17)); box-shadow: inset 3px 0 0 #28c3ff, 0 10px 24px rgba(2,132,199,.12); }
.section-card-tab-glyph { display: grid; width: 2.35rem; height: 2.35rem; place-items: center; color: #7dd3fc; border: 1px solid currentColor; border-radius: .65rem; background: rgba(14,165,233,.1); font-size: 1rem; font-weight: 850; line-height: 1; }
.section-card-tab-glyph.green { color: #6ee7b7; background: rgba(16,185,129,.1); }
.section-card-tab-glyph.violet { color: #c4b5fd; background: rgba(139,92,246,.11); }
.section-card-tab-glyph.orange { color: #fdba74; background: rgba(249,115,22,.11); }
.section-card-tab-glyph.red { color: #fda4af; background: rgba(244,63,94,.1); }
.section-card-tab-copy { display: grid; min-width: 0; gap: .18rem; }
.section-card-tab-copy strong { overflow: hidden; font-size: .76rem; text-overflow: ellipsis; white-space: nowrap; }
.section-card-tab-copy small { display: -webkit-box; overflow: hidden; color: var(--muted); font-size: .65rem; line-height: 1.35; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.section-card-tab-state { align-self: start; min-width: .45rem; color: #67e8f9; font-size: .58rem; filter: drop-shadow(0 0 5px rgba(34,211,238,.7)); }
.section-tab-panel { min-width: 0; animation: service-page-child-enter .2s cubic-bezier(.2,.78,.2,1) both; }
.settings-master-switch { margin: .9rem 0 1rem; padding: .82rem .9rem; border: 1px solid rgba(56,189,248,.18); border-radius: .75rem; background: rgba(8,31,49,.52); }
.mail-template-heading .btn { flex: none; }
.mail-master-switch { display: flex; align-items: center; justify-content: space-between; gap: 1.25rem; margin-bottom: 1rem; border-color: rgba(244,63,94,.24); transition: border-color .2s ease,background .2s ease,box-shadow .2s ease; }
.mail-master-switch.enabled { border-color: rgba(45,212,191,.34); background: linear-gradient(120deg,rgba(8,47,46,.3),rgba(8,17,31,.94)); box-shadow: inset 3px 0 0 rgba(45,212,191,.78); }
.mail-master-switch h2 { margin: .25rem 0 .3rem; }.mail-master-switch p { max-width: 760px; margin: 0; color: var(--muted); }
.mail-global-toggle { flex: 0 0 auto; min-width: 230px; padding: .72rem .8rem; border: 1px solid rgba(148,163,184,.16); border-radius: .7rem; background: rgba(2,8,18,.46); }
.mail-template-browser { display: grid; gap: 1rem; }
.mail-template-toolbar { display: flex; align-items: center; gap: .75rem; }
.mail-template-search { position: relative; display: flex; align-items: center; flex: 1 1 520px; min-width: 0; height: 44px; color: #38bdf8; border: 1px solid rgba(56,189,248,.24); border-radius: .7rem; background: rgba(3,9,18,.9); transition: border-color .18s ease,box-shadow .18s ease,background .18s ease; }
.mail-template-search:focus-within { border-color: rgba(56,189,248,.62); background: rgba(4,13,25,.98); box-shadow: 0 0 0 3px rgba(14,165,233,.1); }
.mail-template-search > span { position: absolute; z-index: 1; left: .8rem; color: #38bdf8; font-size: 1rem; pointer-events: none; }
.mail-template-search input { width: 100%; min-width: 0; height: 100%; padding: 0 .85rem 0 2.35rem; color: var(--text); border: 0; outline: 0; background: transparent; font: inherit; }
.mail-template-search input::placeholder { color: #667b90; }
.mail-template-search input::-webkit-search-cancel-button { filter: invert(1); opacity: .55; }
.mail-template-list { display: grid; gap: .7rem; }
.mail-template-card { overflow: hidden; border: 1px solid rgba(96,126,157,.2); border-radius: .85rem; background: linear-gradient(140deg,rgba(7,18,33,.94),rgba(5,12,24,.9)); transition: border-color .18s ease,opacity .18s ease,box-shadow .18s ease; }
.mail-template-card.expanded { border-color: rgba(56,189,248,.48); box-shadow: 0 14px 32px rgba(0,0,0,.22),inset 3px 0 0 #21b7ef; }.mail-template-card.disabled:not(.expanded) { opacity: .68; }
.mail-template-card>header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .9rem 1rem; }
.mail-template-card-title { display: grid; min-width: 0; gap: .18rem; }.mail-template-card-title h2 { margin: 0; font-size: .92rem; }.mail-template-card-title small { overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; }
.mail-template-card-actions { display: flex; align-items: center; justify-content: flex-end; gap: .7rem; flex: 0 0 auto; }
.mail-template-edit-button { display: inline-flex; align-items: center; gap: .45rem; min-height: 40px; padding: .45rem .7rem; color: #bcd0e3; border: 1px solid rgba(56,189,248,.2); border-radius: .58rem; background: rgba(5,17,31,.82); font: inherit; font-size: .72rem; font-weight: 850; cursor: pointer; transition: color .18s ease,border-color .18s ease,background .18s ease,transform .18s ease; }
.mail-template-edit-button:hover:not(:disabled),.mail-template-edit-button.active { color: white; border-color: rgba(56,189,248,.58); background: rgba(14,116,184,.18); transform: translateY(-1px); }.mail-template-edit-button:disabled { opacity: .45; cursor: wait; }
.mail-template-editor { display: grid; gap: .9rem; padding: 1rem; border-top: 1px solid rgba(56,189,248,.2); background: rgba(2,8,18,.46); animation: service-page-child-enter .24s cubic-bezier(.2,.78,.2,1) both; }
.mail-template-tabs { display: inline-flex; justify-self: start; gap: .28rem; padding: .25rem; border: 1px solid rgba(56,189,248,.18); border-radius: .68rem; background: rgba(2,8,18,.72); }
.mail-template-tabs > button { display: inline-flex; align-items: center; gap: .42rem; min-height: 36px; padding: .42rem .68rem; color: #8297ac; border: 0; border-radius: .48rem; background: transparent; font: inherit; font-size: .69rem; font-weight: 850; cursor: pointer; transition: color .18s ease,background .18s ease,box-shadow .18s ease,transform .18s ease; }
.mail-template-tabs > button:hover { color: #e8f7ff; transform: translateY(-1px); }
.mail-template-tabs > button.active { color: #effbff; background: linear-gradient(135deg,rgba(14,165,233,.22),rgba(79,70,229,.16)); box-shadow: inset 0 0 0 1px rgba(56,189,248,.34),0 6px 16px rgba(0,0,0,.18); }
.mail-template-subject { margin: 0; }.mail-template-editor-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .9rem; }.mail-template-editor-grid .field-group { margin: 0; min-width: 0; }
.mail-template-source { width: 100%; height: clamp(360px,48vh,620px); min-height: 360px; resize: none; overflow: auto; scrollbar-color: #6b7d8f #111b28; scrollbar-width: thin; font-family: var(--font-mono,Consolas,monospace); font-size: .69rem; line-height: 1.48; tab-size: 2; }
.mail-template-source::-webkit-scrollbar { width: 10px; height: 10px; }.mail-template-source::-webkit-scrollbar-track { background: #111b28; }.mail-template-source::-webkit-scrollbar-thumb { border: 2px solid #111b28; border-radius: 999px; background: #6b7d8f; }
.mail-template-editor-footer { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }.mail-template-editor-footer .muted { max-width: 760px; }
.mail-template-preview-layout { display: grid; grid-template-columns: minmax(0,1fr) minmax(285px,340px); gap: .9rem; min-width: 0; }
.mail-template-preview-shell,.mail-template-test-panel { min-width: 0; overflow: hidden; border: 1px solid rgba(96,126,157,.24); border-radius: .82rem; background: rgba(5,13,26,.92); }
.mail-template-preview-shell > header { display: flex; align-items: center; justify-content: space-between; gap: .8rem; padding: .75rem .85rem; border-bottom: 1px solid rgba(96,126,157,.18); }.mail-template-preview-shell h3,.mail-template-test-panel h3 { margin: .12rem 0 0; font-size: .88rem; }
.mail-template-preview-subject { display: grid; gap: .2rem; padding: .7rem .85rem; border-bottom: 1px solid rgba(96,126,157,.18); }.mail-template-preview-subject span { color: #6f8498; font-size: .59rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }.mail-template-preview-subject strong { overflow-wrap: anywhere; color: #eaf6ff; font-size: .76rem; }
.mail-template-preview-frame { display: block; width: 100%; height: clamp(560px,66vh,850px); border: 0; background: #f4f7fb; }
.mail-template-test-panel { align-self: start; display: grid; gap: .8rem; padding: .95rem; }.mail-template-test-panel > p { margin: 0; color: var(--muted); font-size: .71rem; line-height: 1.5; }.mail-template-test-panel .field-group { margin: 0; }.mail-template-test-panel .notice { margin: 0; }.mail-template-test-button { width: 100%; justify-content: center; }.smtp-clear-switch { margin: .9rem 0; }
.smtp-settings-actions { display: flex; align-items: center; flex-wrap: wrap; gap: .65rem; margin-top: .75rem; }
.smtp-test-button { min-width: 210px; justify-content: center; }.smtp-test-button[aria-busy="true"] { cursor: wait; }
.smtp-save-result { margin: .75rem 0 0; }
.smtp-connection-note { margin: .55rem 0 0; }
.smtp-test-result { display: grid; gap: .42rem; margin-top: .85rem; padding: .85rem .95rem; border: 1px solid var(--line); border-radius: .75rem; background: rgba(4,13,26,.72); }
.smtp-test-result.success { border-color: rgba(45,220,142,.38); background: rgba(12,86,58,.16); box-shadow: inset 3px 0 rgba(45,220,142,.72); }
.smtp-test-result.failure { border-color: rgba(255,93,116,.42); background: rgba(106,20,35,.2); box-shadow: inset 3px 0 rgba(255,93,116,.72); }
.smtp-test-result-heading { display: flex; align-items: center; gap: .55rem; }.smtp-test-result > span { color: #b8c8d9; font-size: .76rem; }
.smtp-test-facts { display: flex; align-items: center; flex-wrap: wrap; gap: .45rem; }.smtp-test-facts small { padding: .25rem .48rem; color: #a9bdcf; border: 1px solid rgba(148,163,184,.15); border-radius: 999px; background: rgba(2,8,18,.42); }
@media(max-width:1100px){.mail-template-preview-layout{grid-template-columns:1fr}.mail-template-test-panel{grid-template-columns:repeat(2,minmax(0,1fr));align-items:end}.mail-template-test-panel>.eyebrow,.mail-template-test-panel>h3,.mail-template-test-panel>p,.mail-template-test-panel>.notice{grid-column:1/-1}}
@media(max-width:900px){.mail-master-switch,.mail-template-card>header,.mail-template-editor-footer{align-items:stretch;flex-direction:column}.mail-global-toggle{min-width:0}.mail-template-card-actions{justify-content:flex-start;flex-wrap:wrap}.mail-template-editor-grid{grid-template-columns:1fr}.mail-template-toolbar{align-items:stretch;flex-direction:column}.mail-template-search{flex-basis:auto;width:100%}}
@media(max-width:640px){.mail-template-test-panel{grid-template-columns:1fr}.mail-template-test-panel>*{grid-column:auto}.mail-template-tabs{display:grid;grid-template-columns:1fr 1fr;width:100%}.mail-template-tabs>button{justify-content:center}}
@media(max-width:640px){.smtp-settings-actions{align-items:stretch;flex-direction:column}.smtp-settings-actions>.btn{width:100%;justify-content:center}}
.schedule-create { margin-bottom: 1rem; border-color: var(--border-strong); }
.schedule-editor-modal { width: min(880px, calc(100vw - 2rem)); max-height: calc(100vh - 2rem); overflow: auto; }
.schedule-action-field { grid-column: 1 / -1; }
.schedule-action-picker { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .55rem; }
.schedule-action-picker > button { position: relative; min-width: 0; display: grid; grid-template-columns: 32px minmax(0,1fr) auto; align-items: start; gap: .55rem; min-height: 76px; padding: .65rem .62rem; color: #b7c7d8; border: 1px solid var(--border); border-radius: .65rem; background: rgba(4,11,22,.72); font: inherit; text-align: left; cursor: pointer; transition: border-color .18s ease, background .18s ease, transform .18s ease, box-shadow .18s ease; }
.schedule-action-picker > button:hover { color: #effbff; border-color: rgba(56,189,248,.35); transform: translateY(-1px); }
.schedule-action-picker > button.selected { color: #effbff; border-color: rgba(56,189,248,.55); background: linear-gradient(145deg,rgba(14,165,233,.14),rgba(37,99,235,.08)); box-shadow: inset 3px 0 #38bdf8,0 9px 24px rgba(0,0,0,.18); }
.schedule-action-picker > button > span:nth-child(2) { min-width: 0; display: grid; gap: .12rem; }
.schedule-action-picker strong { font-size: .7rem; line-height: 1.3; overflow-wrap: anywhere; }
.schedule-action-picker small { color: var(--muted); font-size: .59rem; line-height: 1.38; overflow-wrap: anywhere; }
.schedule-action-picker i { opacity: 0; color: #07111e; width: 18px; height: 18px; display: grid; place-items: center; border-radius: 50%; background: #38bdf8; font-size: .58rem; font-style: normal; font-weight: 950; transform: scale(.7); transition: opacity .18s ease,transform .18s ease; }
.schedule-action-picker > button.selected i { opacity: 1; transform: scale(1); }
.schedule-action-icon { width: 32px; height: 32px; display: grid; place-items: center; border-radius: .52rem; color: #7dd3fc; background: rgba(14,165,233,.12); font-weight: 900; }
.schedule-action-icon.warning { color: #fbbf24; background: rgba(245,158,11,.12); }.schedule-action-icon.danger { color: #fb7185; background: rgba(244,63,94,.12); }.schedule-action-icon.success { color: #6ee7a0; background: rgba(34,197,94,.12); }.schedule-action-icon.violet { color: #c4b5fd; background: rgba(139,92,246,.13); }
.schedule-days { margin: 1rem 0; padding: 1rem; border: 1px solid var(--border); border-radius: .75rem; }
.schedule-days legend { padding: 0 .4rem; color: #7dd3fc; font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.schedule-days label { display: inline-flex; align-items: center; gap: .4rem; margin: .25rem .7rem .25rem 0; padding: .45rem .65rem; border: 1px solid rgba(148,163,184,.18); border-radius: .55rem; background: rgba(8,17,31,.72); }
.schedule-table td { vertical-align: top; }
.schedule-table .countdown-value { color: #7dd3fc; }
.catalog-search-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: .7rem; margin: 1rem 0; }
.workshop-browser { padding: 0; overflow: hidden; border-color: rgba(56,189,248,.24); background: rgba(5,13,26,.9); }
.workshop-browser-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding: 1rem 1.1rem .85rem; border-bottom: 1px solid var(--border); }
.workshop-browser-heading h2 { margin: .12rem 0; }
.workshop-browser-heading small { color: var(--muted); }
.workshop-catalog-stats { display: flex; align-items: center; gap: .65rem; flex-wrap: wrap; justify-content: flex-end; }
.workshop-stat-link { display: inline-flex; align-items: center; gap: .38rem; padding: .38rem .55rem; color: var(--muted); border: 1px solid rgba(148,163,184,.15); border-radius: .45rem; background: rgba(255,255,255,.025); font-size: .7rem; text-decoration: none; transition: color .18s ease, border-color .18s ease, background .18s ease, transform .18s ease; }
.workshop-stat-link:hover, .workshop-stat-link:focus-visible { color: #e2e8f0; border-color: rgba(56,189,248,.4); background: rgba(56,189,248,.08); transform: translateY(-1px); outline: none; }
.workshop-stat-link.has-update { color: #fde68a; border-color: rgba(245,158,11,.45); background: rgba(245,158,11,.1); }
.workshop-catalog-stats strong { color: #e2e8f0; }
.workshop-catalog-stats .has-update strong { color: #fde68a; animation: workshop-update-count-pulse 1.5s ease-out infinite; }
@keyframes workshop-update-count-pulse { 0%,100% { text-shadow: 0 0 0 rgba(250,204,21,0); transform: scale(1); } 45% { text-shadow: 0 0 12px rgba(250,204,21,.85); transform: scale(1.12); } }
.workshop-kind-switch { display: inline-flex; gap: .25rem; margin: .72rem 1.1rem 0; padding: .22rem; border: 1px solid rgba(56,189,248,.2); border-radius: .58rem; background: rgba(2,8,18,.72); }
.workshop-kind-switch button { min-height: 34px; padding: .4rem .85rem; color: #8fa3ba; border: 0; border-radius: .42rem; background: transparent; font: inherit; font-size: .7rem; font-weight: 850; cursor: pointer; }
.workshop-kind-switch button:hover:not(:disabled) { color: #dff7ff; background: rgba(56,189,248,.08); }
.workshop-kind-switch button.active { color: #f4fcff; background: linear-gradient(135deg,rgba(14,165,233,.28),rgba(37,99,235,.24)); box-shadow: inset 0 0 0 1px rgba(56,189,248,.38); }
.workshop-kind-switch button:disabled { cursor: not-allowed; opacity: .6; }
.workshop-toolbar { display: grid; grid-template-columns: minmax(150px,.55fr) minmax(170px,.65fr) minmax(280px,1.8fr); gap: .65rem; align-items: end; padding: .8rem 1.1rem; background: rgba(255,255,255,.022); border-bottom: 1px solid var(--border); }
.workshop-toolbar.collections { grid-template-columns: minmax(170px,.55fr) minmax(280px,2.1fr); }
.workshop-toolbar label { display: grid; gap: .3rem; min-width: 0; }
.workshop-toolbar label > span { color: #8797ad; font-size: .63rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.workshop-toolbar .form-control { min-height: 38px; }
.workshop-search { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: .5rem; }
.workshop-catalog-loading { min-height: 340px; display: grid; place-content: center; justify-items: center; gap: .75rem; color: var(--muted); }
.workshop-catalog-loading .spinner { width: 28px; height: 28px; border-width: 3px; }
.mod-catalog-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(205px,1fr)); gap: .55rem; padding: .7rem; background: rgba(3,10,20,.78); }
.mod-catalog-card { min-width: 0; min-height: 350px; display: grid; grid-template-rows: 150px minmax(0,1fr) auto; overflow: hidden; border: 1px solid rgba(56,189,248,.14); border-radius: .65rem; background: linear-gradient(180deg,rgba(14,24,39,.98),rgba(3,9,18,.98)); transition: transform .2s ease, box-shadow .2s ease, background .2s ease; }
.mod-catalog-card:hover { z-index: 1; transform: translateY(-2px); background: linear-gradient(180deg,rgba(18,34,54,.99),rgba(4,12,23,.99)); box-shadow: 0 12px 28px rgba(0,0,0,.38), inset 0 0 0 1px rgba(56,189,248,.32); }
.mod-catalog-card.is-installed { box-shadow: inset 0 2px 0 rgba(34,197,94,.55); }
.mod-catalog-card.collection-card { border-color: rgba(167,139,250,.28); box-shadow: inset 0 2px 0 rgba(139,92,246,.5); }
.mod-catalog-card.collection-card .mod-catalog-media { color: #c4b5fd; background: radial-gradient(circle at 50% 35%,rgba(139,92,246,.26),rgba(2,6,12,.9) 68%); }
.mod-catalog-media { position: relative; min-width: 0; display: grid; place-items: center; overflow: hidden; background: radial-gradient(circle at 50% 35%,rgba(14,165,233,.22),rgba(2,6,12,.9) 68%); color: #38bdf8; font-size: 2rem; }
.mod-catalog-media img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform .35s ease; }
.mod-catalog-card:hover .mod-catalog-media img { transform: scale(1.025); }
.catalog-installed-badge { position: absolute; top: .55rem; right: .55rem; padding: .27rem .45rem; color: #bbf7d0; border: 1px solid rgba(34,197,94,.35); border-radius: 999px; background: rgba(3,33,26,.9); box-shadow: 0 4px 14px rgba(0,0,0,.3); font-size: .59rem; font-weight: 900; text-transform: uppercase; }
.mod-catalog-body { min-width: 0; padding: .78rem .82rem .55rem; }
.mod-catalog-card h3 { min-height: 2.35em; margin: 0 0 .35rem; overflow: hidden; color: #f8fafc; font-size: .88rem; line-height: 1.18; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.mod-catalog-meta { display: flex; justify-content: space-between; gap: .5rem; min-width: 0; margin-bottom: .55rem; color: #7dd3fc; font-size: .62rem; }
.mod-catalog-meta span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mod-catalog-meta span:last-child { flex: none; color: #94a3b8; }
.mod-catalog-card p { margin: 0; overflow: hidden; color: #a8b6c9; font-size: .7rem; line-height: 1.42; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; }
.mod-catalog-card footer { display: flex; align-items: center; gap: .4rem; padding: .65rem .82rem .78rem; }
.mod-catalog-card footer .btn { min-height: 32px; flex: 1 1 0; padding: .4rem .5rem; white-space: nowrap; }
.btn-ghost { color: #7dd3fc; border-color: transparent; background: transparent; box-shadow: none; }
.btn-ghost:hover { color: white; border-color: rgba(56,189,248,.26); background: rgba(56,189,248,.08); }
.workshop-result-footer { display: flex; justify-content: space-between; gap: 1rem; padding: .7rem 1.1rem; color: #7dd3fc; border-top: 1px solid var(--border); font-size: .68rem; }
.workshop-result-footer small { color: var(--muted); text-align: right; }
.workshop-installed-panel { margin-top: 1rem; scroll-margin-top: 1rem; }
.workshop-installed-panel:focus { outline: none; }
.mod-update-row { background: linear-gradient(90deg,rgba(245,158,11,.075),rgba(245,158,11,.015) 44%,transparent); box-shadow: inset 3px 0 0 rgba(245,158,11,.72); }
.mod-update-badge { align-items: center; gap: .38rem; color: #fde68a; border: 1px solid rgba(245,158,11,.35); background: rgba(245,158,11,.12); }
.mod-update-action { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; }
.mod-update-action .update-pulse-dot, .mod-update-badge .update-pulse-dot, .workshop-stat-link .update-pulse-dot { background: #fde68a; }
.workshop-installed-empty { margin-top: 1rem; padding: .8rem 1rem; color: var(--muted); border: 1px dashed rgba(148,163,184,.2); border-radius: .65rem; background: rgba(2,8,18,.38); font-size: .75rem; }
.mod-row-actions { display: flex; align-items: center; gap: .42rem; }
.mod-enable-switch { min-width: 116px; }
.mod-enable-switch.switch-row.compact { padding: .2rem 0; }
.schedule-enable-switch { min-width: 96px; }
.schedule-enable-switch.switch-row.compact { padding: .2rem 0; }
.schedule-row-actions { min-width: 176px; flex-wrap: nowrap; align-items: center; gap: .4rem; }
.schedule-row-action { width: 34px; height: 34px; display: inline-grid; flex: 0 0 34px; place-items: center; padding: 0; color: #a9bdd2; border: 1px solid rgba(148,163,184,.2); border-radius: .52rem; background: rgba(10,20,35,.9); font: inherit; cursor: pointer; transition: color .18s ease,border-color .18s ease,background .18s ease,transform .18s ease,box-shadow .18s ease; }
.schedule-row-action span { width: 21px; height: 21px; display: grid; place-items: center; border-radius: .38rem; font-size: .78rem; font-weight: 950; line-height: 1; }
.schedule-row-action.edit { color: #7dd3fc; border-color: rgba(56,189,248,.24); }.schedule-row-action.edit span { background: rgba(14,165,233,.14); }
.schedule-row-action.delete { color: #fda4af; border-color: rgba(244,63,94,.28); }.schedule-row-action.delete span { background: rgba(190,18,60,.2); }
.schedule-row-action:hover { transform: translateY(-1px); border-color: currentColor; background: rgba(255,255,255,.045); box-shadow: 0 8px 18px rgba(0,0,0,.2); }
.countdown-settings-row { display: flex; flex-wrap: wrap; gap: .8rem; align-items: end; margin: .9rem 0; }
.countdown-settings-row > .field-group { flex: 0 1 220px; margin: 0; }
.countdown-settings-row > .countdown-language-field { flex-basis: 292px; }
.countdown-language-control { display: grid; grid-template-columns: minmax(180px, 240px) 42px; gap: .5rem; align-items: center; }
.countdown-language-save { width: 42px; height: 42px; display: inline-grid; place-items: center; padding: 0; color: #ddd6fe; border: 1px solid rgba(139,92,246,.3); border-radius: .58rem; background: rgba(109,40,217,.14); cursor: pointer; transition: color .18s ease,border-color .18s ease,background .18s ease,transform .18s ease,box-shadow .18s ease; }
.countdown-language-save .btn-action-glyph { margin: 0; }
.countdown-language-save:hover:not(:disabled) { transform: translateY(-1px); color: white; border-color: #a78bfa; background: rgba(109,40,217,.24); box-shadow: 0 8px 20px rgba(76,29,149,.18); }
.countdown-language-save:disabled { opacity: .45; cursor: wait; }
@media (max-width: 800px) { .countdown-settings-row { align-items: stretch; } .countdown-settings-row > .field-group { flex: 1 1 100%; } .countdown-language-control { grid-template-columns: minmax(0, 1fr) 42px; } }
.stop-players-modal { width: min(700px, calc(100vw - 2rem)); }
.stop-countdown-options { margin-top: .9rem; }
.cluster-data-panel { margin-top: 1rem; }
.cluster-data-panel .panel-header p { max-width: 760px; margin: .25rem 0 0; color: var(--muted); }
.cluster-controls { display: grid; grid-template-columns: minmax(280px, 640px); gap: .75rem; justify-content: start; margin: 1rem 0; }
.cluster-controls > .field-group { margin: 0; }
.cluster-action-buttons { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; }
.cluster-action-buttons .btn { min-height: 42px; white-space: nowrap; }
.cluster-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .65rem; margin: .9rem 0; }
.cluster-summary span { display: grid; gap: .2rem; padding: .7rem .8rem; border: 1px solid var(--border); border-radius: .65rem; background: rgba(3,10,22,.46); }
.cluster-summary strong { color: #eaf5ff; }
.cluster-summary small { color: var(--muted); }
.cluster-file-table { max-height: 360px; overflow: auto; }
.cluster-confirm-modal { width: min(680px, calc(100vw - 2rem)); }
@media (max-width: 700px) { .cluster-controls { grid-template-columns: minmax(0,1fr); } .cluster-action-buttons .btn { flex: 1 1 210px; } }
@media (max-width: 680px) { .cluster-controls, .cluster-summary { grid-template-columns: 1fr; } }
.mod-job-cell { min-width: 250px; }
.mod-job-summary { display: grid; grid-template-columns: 22px minmax(0,1fr) auto; align-items: center; gap: .42rem; }
.mod-job-summary > div { min-width: 0; display: grid; }
.mod-job-summary strong { font-size: .7rem; }
.mod-job-summary small { overflow: hidden; color: var(--muted); font-size: .61rem; text-overflow: ellipsis; white-space: nowrap; }
.mod-job-summary > span:last-child { color: #7dd3fc; font-size: .64rem; font-weight: 800; }
.mod-job-icon { width: 21px; height: 21px; display: grid; place-items: center; color: #7dd3fc; border: 1px solid rgba(56,189,248,.25); border-radius: 50%; background: rgba(14,165,233,.08); }
.mod-job-active .mod-job-icon { animation: ccgc-spin 1.15s linear infinite; }
.mod-job-succeeded .mod-job-icon { color: #4ade80; border-color: rgba(34,197,94,.32); background: rgba(34,197,94,.1); }
.mod-job-failed .mod-job-icon { color: #fb7185; border-color: rgba(244,63,94,.38); background: rgba(244,63,94,.1); }
.mod-progress-track, .job-progress-track { height: 6px; margin-top: .4rem; overflow: hidden; border-radius: 999px; background: rgba(51,65,85,.65); }
.mod-progress-track > span, .job-progress-track > span { position: relative; height: 100%; display: block; border-radius: inherit; background: linear-gradient(90deg,#0ea5e9,#2563eb); transition: width .35s ease; }
.mod-progress-track.active > span::after, .job-progress-track.active > span::after { content: ""; position: absolute; inset: 0; background: linear-gradient(100deg,transparent 20%,rgba(255,255,255,.45) 48%,transparent 76%); animation: job-progress-shimmer 1.15s linear infinite; }
.mod-job-succeeded .mod-progress-track > span { background: linear-gradient(90deg,#16a34a,#4ade80); }
.mod-job-failed .mod-progress-track > span { background: linear-gradient(90deg,#be123c,#fb7185); }
.mod-queue-toast { position: fixed; z-index: 2400; right: 1.15rem; bottom: 1.15rem; width: min(430px,calc(100vw - 2rem)); display: flex; align-items: center; gap: .8rem; padding: .85rem 1rem; color: #dcfce7; border: 1px solid rgba(34,197,94,.46); border-radius: .78rem; background: rgba(3,32,24,.97); box-shadow: 0 18px 50px rgba(0,0,0,.55), 0 0 0 1px rgba(34,197,94,.08) inset; animation: toast-enter .28s cubic-bezier(.2,.8,.2,1); }
.mod-queue-toast > div { min-width: 0; display: grid; gap: .12rem; }
.mod-queue-toast small { color: #bbf7d0; }
.mod-queue-check { width: 34px; height: 34px; flex: 0 0 34px; display: grid; place-items: center; color: #052e1c; border-radius: 50%; background: #4ade80; box-shadow: 0 0 0 0 rgba(74,222,128,.35); animation: queue-check-pulse 1.25s ease-out 2; font-size: 1.05rem; font-weight: 950; }
.backup-job-panel { margin-bottom: 1rem; padding: 1rem; overflow: hidden; border-color: rgba(56,189,248,.28); }
.backup-job-panel.succeeded { border-color: rgba(34,197,94,.34); }
.backup-job-panel.failed { border-color: rgba(244,63,94,.42); }
.backup-job-heading { display: grid; grid-template-columns: 40px minmax(0,1fr) auto auto; align-items: center; gap: .8rem; }
.backup-job-heading h2 { margin: .08rem 0; font-size: 1rem; }
.backup-job-heading p { margin: 0; color: var(--muted); font-size: .72rem; }
.backup-job-heading > strong { color: #7dd3fc; }
.backup-job-state-icon { width: 38px; height: 38px; display: grid; place-items: center; color: #7dd3fc; border: 1px solid rgba(56,189,248,.32); border-radius: 50%; background: rgba(14,165,233,.1); font-weight: 900; }
.backup-job-panel.running .backup-job-state-icon { animation: ccgc-spin 1.15s linear infinite; }
.backup-job-panel.succeeded .backup-job-state-icon { color: #4ade80; border-color: rgba(34,197,94,.35); background: rgba(34,197,94,.1); }
.backup-job-panel.failed .backup-job-state-icon { color: #fb7185; border-color: rgba(244,63,94,.4); background: rgba(244,63,94,.1); }
.backup-job-panel > small { display: block; margin-top: .48rem; color: var(--muted); }
.backup-usage-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .75rem; margin-bottom: 1rem; }
.backup-usage-card,.backup-format-card { min-width: 0; padding: .9rem 1rem; border: 1px solid var(--border); border-radius: .72rem; background: linear-gradient(135deg,rgba(12,25,43,.94),rgba(5,12,24,.9)); }
.backup-usage-card > div:first-child,.backup-format-card { display: flex; align-items: center; gap: .72rem; }
.backup-usage-card > div:first-child > span:last-child,.backup-format-card > span:last-child { min-width: 0; display: grid; gap: .14rem; }
.backup-usage-card small,.backup-format-card small { color: var(--muted); font-size: .67rem; line-height: 1.42; }
.backup-usage-card strong { color: #f8fbff; font-size: .98rem; }
.backup-usage-card p { margin: .5rem 0 0; color: #8293a8; font-size: .64rem; }
.backup-usage-icon { width: 36px; height: 36px; flex: 0 0 36px; display: grid; place-items: center; border-radius: .58rem; font-size: 1rem; font-weight: 900; }
.backup-usage-icon.count { color: #7dd3fc; background: rgba(14,165,233,.12); }
.backup-usage-icon.storage { color: #c4b5fd; background: rgba(139,92,246,.13); }
.backup-usage-icon.verified { color: #6ee7a0; background: rgba(34,197,94,.12); }
.backup-usage-meter { height: 6px; margin-top: .7rem; overflow: hidden; border-radius: 999px; background: rgba(51,65,85,.62); }
.backup-usage-meter > span { height: 100%; display: block; border-radius: inherit; background: linear-gradient(90deg,#0ea5e9,#2563eb); transition: width .35s ease; }
.backup-usage-meter.storage > span { background: linear-gradient(90deg,#8b5cf6,#38bdf8); }
.backup-scope-picker { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .65rem; margin: 0 0 1rem; padding: 0; border: 0; }
.backup-scope-picker legend { grid-column: 1 / -1; padding: 0; margin-bottom: .12rem; color: #b9c9dc; font-size: .76rem; font-weight: 750; }
.backup-scope-picker > button { min-width: 0; display: grid; grid-template-columns: 40px minmax(0,1fr) 22px; align-items: center; gap: .7rem; padding: .78rem; color: #b7c7d8; border: 1px solid var(--border); border-radius: .68rem; background: rgba(4,11,22,.75); font: inherit; text-align: left; cursor: pointer; transition: border-color .2s ease,background .2s ease,box-shadow .2s ease,transform .2s ease; }
.backup-scope-picker > button:hover { border-color: rgba(56,189,248,.36); transform: translateY(-1px); }.backup-scope-picker > button.selected { color: #effbff; border-color: rgba(56,189,248,.52); background: rgba(14,165,233,.09); box-shadow: inset 3px 0 #38bdf8; }
.backup-scope-picker > button > span:nth-child(2) { min-width: 0; display: grid; gap: .18rem; }.backup-scope-picker small { color: var(--muted); font-size: .66rem; line-height: 1.4; }.backup-scope-picker i { opacity: 0; width: 20px; height: 20px; display: grid; place-items: center; color: #07111e; border-radius: 50%; background: #38bdf8; font-size: .64rem; font-style: normal; font-weight: 950; }.backup-scope-picker > button.selected i { opacity: 1; }
.backup-scope-icon { width: 40px; height: 40px; display: grid; place-items: center; border-radius: .58rem; font-size: 1.1rem; font-weight: 900; }.backup-scope-icon.game-data { color: #6ee7a0; background: rgba(34,197,94,.12); }.backup-scope-icon.full { color: #c4b5fd; background: rgba(139,92,246,.13); }.backup-scope-icon.players { color: #fbbf24; background: rgba(245,158,11,.12); }
@keyframes job-progress-shimmer { from { transform: translateX(-100%); } to { transform: translateX(100%); } }
@keyframes ccgc-spin { to { transform: rotate(360deg); } }
@keyframes toast-enter { from { opacity: 0; transform: translateY(14px) scale(.97); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes queue-check-pulse { 0% { box-shadow: 0 0 0 0 rgba(74,222,128,.4); } 100% { box-shadow: 0 0 0 12px rgba(74,222,128,0); } }
.reinstall-action { border-color: rgba(245,158,11,.22); }
.reinstall-action .action-icon { color: #fbbf24; background: rgba(245,158,11,.1); }
.clean-reinstall-action { border-color: rgba(244,63,94,.28); }
.clean-reinstall-action .action-icon { color: #fb7185; background: rgba(244,63,94,.11); }
.reinstall-service-modal { width: min(660px,calc(100vw - 2rem)); }
.clean-reinstall-modal { width: min(700px,calc(100vw - 2rem)); }
.reinstall-safety-summary { display: grid; grid-template-columns: auto minmax(0,1fr); gap: .85rem; align-items: start; padding: 1rem; margin: .9rem 0; border: 1px solid rgba(56,189,248,.22); border-radius: .72rem; background: linear-gradient(110deg,rgba(14,165,233,.08),rgba(2,8,18,.6)); }
.reinstall-safety-summary > span { width: 42px; height: 42px; display: grid; place-items: center; color: #7dd3fc; border-radius: .65rem; background: rgba(14,165,233,.12); font-size: 1.4rem; }
.reinstall-safety-summary p { margin: .28rem 0 0; color: var(--muted); line-height: 1.5; }
.schedule-update-policy { display: grid; gap: .85rem; margin-top: 1rem; padding: 1rem; border: 1px solid rgba(56,189,248,.2); border-radius: .72rem; background: rgba(14,165,233,.055); }
.schedule-update-policy .field-group { max-width: 320px; }
.section-divider { display: flex; align-items: center; gap: .75rem; margin: 1rem 0; color: #718096; font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; }
.section-divider::before,.section-divider::after { content: ""; height: 1px; flex: 1; background: var(--border); }
.mod-name-cell { display: flex; align-items: center; gap: .65rem; }
.mod-name-cell img { width: 40px; height: 40px; object-fit: cover; border-radius: .45rem; }
.mod-name-copy { display: grid; gap: .18rem; min-width: 0; }
.mod-name-copy strong,.mod-name-copy small { display: block; }
.mod-delete-confirm .check-row { margin-top: .45rem; color: #f8fafc; }
.admin-technical-details { margin-top: 1rem; padding: .8rem 1rem; border: 1px solid var(--border); border-radius: .65rem; background: rgba(2,6,23,.32); }
.admin-technical-details summary { cursor: pointer; color: #7dd3fc; font-weight: 700; }
.backup-warning { display: flex; align-items: center; gap: .8rem; padding: .8rem 1rem; margin-bottom: 1rem; color: #fde68a; border: 1px solid rgba(245,158,11,.3); border-radius: .7rem; background: rgba(245,158,11,.07); }
.backup-warning span { color: #d8c99d; font-size: .76rem; }
.watchdog-status-grid { display: grid; grid-template-columns: minmax(290px, .72fr) minmax(0, 1.55fr); gap: 1rem; align-items: start; margin-bottom: 1rem; }
.watchdog-status-grid .panel { min-width: 0; }
.info-list { display: grid; gap: 0; margin: 1rem 0 0; }
.info-list > div { display: grid; grid-template-columns: minmax(130px, 1fr) minmax(0, 1fr); gap: .8rem; align-items: center; padding: .62rem 0; border-bottom: 1px solid var(--border); }
.info-list dd { margin: 0; text-align: right; }
.form-section-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.form-section-card { min-width: 0; padding: 1rem; border: 1px solid var(--border); border-radius: .75rem; background: rgba(2,8,18,.42); }
.form-section-card > header { display: grid; gap: .25rem; margin-bottom: .5rem; padding-bottom: .75rem; border-bottom: 1px solid var(--border); }
.form-section-card > header small { color: var(--muted); line-height: 1.45; }
.backup-path-rules { margin-top: 1rem; box-shadow: none; }
.backup-profile-editor > .panel-header small { display: block; max-width: 760px; margin-top: .3rem; color: var(--muted); line-height: 1.45; }
.operational-profile-editor > .panel-header small { display: block; max-width: 820px; margin-top: .3rem; color: var(--muted); line-height: 1.45; }
.operational-top-grid { margin-bottom: 1rem; }
.credential-profile-list { display: grid; gap: .45rem; margin: .8rem 0; }
.credential-profile-row { display: flex; align-items: center; justify-content: space-between; gap: .8rem; padding: .65rem .75rem; border: 1px solid var(--border); border-radius: .6rem; background: rgba(255,255,255,.018); }
.credential-profile-row > div:first-child { display: grid; gap: .22rem; min-width: 0; }
.credential-profile-row small { color: var(--muted); overflow-wrap: anywhere; }
.credential-profile-row .actions { display: flex; gap: .35rem; flex: 0 0 auto; }
.credential-editor-modal { width: min(760px, calc(100vw - 2rem)); }
.prominent-check { align-items: flex-start; padding: .8rem; margin: .6rem 0 1rem; border: 1px solid var(--border-strong); border-radius: .65rem; background: rgba(14,165,233,.06); }
.prominent-check > span { display: grid; gap: .25rem; }
.prominent-check small { color: var(--muted); line-height: 1.45; }
.watchdog-template-editor { margin-top: 1rem; box-shadow: none; }
.watchdog-template-editor .form-section-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.danger-text { color: #ff9797 !important; }
.success-text { color: #6ee7b7 !important; }
.warning-text { color: #fbbf24 !important; }
.remember-row { display: flex; gap: .55rem; color: var(--muted); font-size: .78rem; margin: 1rem 0; }
.login-button { width: 100%; margin-top: .5rem; }
.text-danger, .validation-message { color: #ff9797 !important; font-size: .74rem; }

#blazor-error-ui { display: none; position: fixed; inset: auto 1rem 1rem 1rem; z-index: 1000; padding: .8rem 1rem; color: #ffe4e4; background: #782f38; border-radius: .6rem; box-shadow: var(--shadow); }
#blazor-error-ui .dismiss { float: right; cursor: pointer; }

@media (min-width: 1200px) and (hover: hover) {
    .app-shell { grid-template-columns: 76px minmax(0, 1fr); }
    .sidebar { z-index: 40; width: 76px; overflow-x: hidden; transition: width .22s ease, box-shadow .22s ease; }
    .sidebar:hover, .sidebar:focus-within { width: 270px; box-shadow: 22px 0 55px rgba(0,0,0,.48); }
    .sidebar:not(:hover):not(:focus-within) { scrollbar-color: transparent transparent; }
    .brand-block { padding: 0 14px; }
    .sidebar .brand-block > div, .sidebar .nav-label { opacity: 1; visibility: visible; transition: opacity .12s ease .18s, visibility 0s linear .18s; }
    .sidebar:not(:hover):not(:focus-within) .brand-block > div,
    .sidebar:not(:hover):not(:focus-within) .nav-label { opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .06s ease, visibility 0s linear .06s; }
    .sidebar:not(:hover):not(:focus-within) .nav-section { position: relative; color: transparent; overflow: hidden; white-space: nowrap; }
    .sidebar:not(:hover):not(:focus-within) .nav-section::after { content: ""; position: absolute; left: .8rem; right: .8rem; bottom: .3rem; border-top: 1px solid var(--border); }
    .service-skin.has-game-background::before { left: 76px; }
    .content-area { padding: 1.35rem 1.75rem 2rem; }
}

@media (max-width: 1600px) {
    .service-overview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 1100px) {
    .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .template-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .node-card dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .service-workspace { grid-template-columns: 190px minmax(0, 1fr); }
    .quick-tool-grid, .action-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .settings-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .service-overview-grid { grid-template-columns: 1fr; }
    .service-overview-grid .overview-console { grid-column: auto; }
    .watchdog-status-grid, .form-section-grid { grid-template-columns: 1fr; }
    .watchdog-template-editor .form-section-grid { grid-template-columns: 1fr; }
    .commandline-layout { grid-template-columns: 1fr; }
    .commandline-profile-panel { position: static; }
    .commandline-profile-list { grid-template-columns: repeat(2, minmax(0, 1fr)); max-height: none; }
}

@media (max-width: 760px) {
    .app-shell { display: block; }
    .sidebar { position: relative; height: auto; }
    .brand-block { height: 68px; }
    .service-skin.has-game-background::before { inset: 68px 0 0; }
    .navbar-toggler { display: block; appearance: none; position: absolute; right: 1rem; top: 1rem; width: 38px; height: 36px; border: 1px solid var(--border); border-radius: .5rem; background: linear-gradient(#9cb2aa 0 0) center 10px/18px 2px no-repeat, linear-gradient(#9cb2aa 0 0) center 16px/18px 2px no-repeat, linear-gradient(#9cb2aa 0 0) center 22px/18px 2px no-repeat; }
    .nav-scrollable { display: none; }.navbar-toggler:checked ~ .nav-scrollable { display: block; }
    .app-header { padding: 0 1rem; }.content-area { padding: 1.2rem; }
    .signed-user > div { display: none; }
    .page-heading { align-items: flex-start; flex-direction: column; }
    .log-viewer-tabs { display: flex; flex-wrap: wrap; width: 100%; box-sizing: border-box; }
    .log-viewer-tabs button { flex: 1; min-width: 0; }
    .log-filter-panel { grid-template-columns: 1fr; }
    .date-filter-chips { overflow-x: auto; }
    .log-filter-count { justify-self: end; }
    .metric-grid, .dashboard-grid, .template-grid { grid-template-columns: 1fr; }
    .pilot-list { grid-template-columns: 1fr; }
    .configuration-layout, .variable-grid, .form-grid, .settings-grid.two-columns, .service-overview-grid, .watchdog-status-grid, .form-section-grid, .template-feature-access-list, .commandline-variable-grid, .commandline-profile-meta, .commandline-profile-list, .service-settings-links, .service-admin-grid, .service-port-row, .service-delete-zone, .infrastructure-node-context { grid-template-columns: 1fr; }
    .service-path-grid > div { grid-template-columns: 1fr; gap: .25rem; }
    .service-overview-grid .overview-console { grid-column: auto; }
    .connection-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .query-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .query-player-summary { grid-column: 1 / -1; }
    .configuration-actions { align-items: stretch; flex-direction: column; }
    .service-workspace { grid-template-columns: 1fr; }
    .service-navigation { position: static; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .service-overview-heading { align-items: flex-start; flex-direction: column; }
    .quick-tool-grid, .action-grid { grid-template-columns: 1fr; }
    .action-grid article { grid-template-columns: auto 1fr; }
    .action-grid article .btn { grid-column: 1 / -1; }
    .inline-create, .confirm-strip { grid-template-columns: 1fr; }
    .ticket-layout, .provision-summary { grid-template-columns: 1fr; }
    .ticket-sidebar { position: static; }
    .settings-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .provisioning-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .countdown-list article { grid-template-columns: minmax(0, 1fr) auto; }
    .countdown-list article .btn { grid-column: 1 / -1; }
}

/* Interactive TCAdmin-style editors and telemetry */
.modal-backdrop { position: fixed; inset: 0; z-index: 300; display: grid; place-items: center; padding: 1.5rem; overflow: auto; background: rgba(0, 3, 10, .82); backdrop-filter: blur(6px); opacity: 1; }
.modal-card { width: min(1100px, 100%); max-height: calc(100vh - 3rem); overflow: auto; padding: 1.25rem; border: 1px solid var(--border-strong); border-radius: .9rem; background: #09111e; box-shadow: 0 35px 120px rgba(0,0,0,.7); }
.modal-card > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding-bottom: .9rem; margin-bottom: 1rem; border-bottom: 1px solid var(--border); }
.modal-card > header h2 { margin: .25rem 0 0; }
.modal-card > footer { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: .65rem; padding-top: 1rem; border-top: 1px solid var(--border); }
.mod-stop-backdrop { z-index: 360; }
.mod-stop-modal { width: min(620px, 100%); }
.modal-close { width: 34px; height: 34px; flex: none; color: #cbd5e1; border: 1px solid var(--border); border-radius: .45rem; background: var(--surface-2); cursor: pointer; font-size: 1.25rem; }
.file-editor-modal, .log-stream-modal, .config-editor-modal { width: min(1240px, 100%); }
.file-editor-modal .code-editor, .raw-template-editor .code-editor { min-height: min(62vh, 650px); }
.structured-validation-error { display: grid; gap: .2rem; margin: .65rem 0; }
.structured-validation-error span { color: #fecdd3; }
.code-editor.has-validation-error { border-color: rgba(244,63,94,.7); box-shadow: 0 0 0 3px rgba(244,63,94,.1); }
.editor-modal-shell { display: flex; flex-direction: column; overflow: hidden; height: min(900px, calc(100vh - 3rem)); }
.editor-modal-shell > .panel-header { margin: 0; padding-bottom: .9rem; border-bottom: 1px solid var(--border); }
.editor-modal-shell > .notice { margin: .75rem 0 0; }
.editor-modal-shell > .code-editor { flex: 1 1 auto; min-height: 0; height: 100%; margin-top: .8rem; resize: none; }
.editor-modal-shell > .dynamic-config-grid { flex: 1 1 auto; min-height: 0; overflow: auto; align-content: start; padding: .15rem .25rem .75rem 0; }
.editor-modal-shell > .config-editor-toolbar { margin: .8rem 0; }
.editor-modal-actions { align-items: center; flex: none; margin: 0; padding: .85rem 0 0; background: #09111e; }
.editor-modal-actions > .muted { margin-right: auto; max-width: 70%; }
.editor-modal-message { max-height: 100px; overflow: auto; }
.modal-head-actions, .console-toolbar, .node-header-actions { display: flex; align-items: center; gap: .55rem; }
.config-row-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .55rem; }
.config-action-button { width: 10.5rem; min-height: 2.15rem; }

.file-browser-shell { display: grid; grid-template-columns: 270px minmax(0, 1fr); min-height: 560px; border: 1px solid var(--border); border-radius: 0 0 .85rem .85rem; overflow: hidden; background: rgba(5,9,17,.7); }
.file-tree-panel { padding: .55rem; overflow: auto; border-right: 1px solid var(--border); background: #070d18; }
.file-tree-row { width: 100%; min-height: 34px; display: flex; align-items: center; gap: .4rem; padding: .35rem .5rem; color: #aebdce; border: 0; border-radius: .4rem; background: transparent; text-align: left; cursor: pointer; font-size: .74rem; white-space: nowrap; }
.file-tree-row:hover { color: white; background: rgba(255,255,255,.04); }
.file-tree-row.selected { color: white; background: rgba(14,165,233,.15); box-shadow: inset 2px 0 var(--brand); }
.file-tree-row.root { margin-bottom: .3rem; color: #dff5ff; }
.folder-icon { color: #fbbf24; }
.file-list-panel { border: 0; border-radius: 0 !important; box-shadow: none; }
.file-page-navigation { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .8rem 1rem; border-top: 1px solid var(--border); background: rgba(5,9,17,.42); }
.file-page-navigation > div { display: flex; gap: .5rem; }
.file-page-navigation > span { color: var(--muted); font-size: .8rem; }
.live-log-output, .overview-console-output { min-height: 420px; max-height: 65vh; overflow: auto; margin: 0; padding: 1rem; color: #d1f1ff; border: 1px solid var(--border); border-radius: .6rem; background: #01040a; font: .75rem/1.55 Consolas, "Cascadia Code", monospace; white-space: pre-wrap; overflow-wrap: anywhere; }
.live-dot { display: inline-block; width: 7px; height: 7px; margin-right: .35rem; border-radius: 50%; background: #22c55e; box-shadow: 0 0 0 4px rgba(34,197,94,.12); animation: live-pulse 1.5s infinite; }
@keyframes live-pulse { 50% { opacity: .35; } }

.telemetry-chart-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-top: 1rem; }
.activity-range-tabs { display: inline-flex; gap: .25rem; padding: .25rem; border: 1px solid var(--border); border-radius: .65rem; background: rgba(2,8,18,.72); }
.activity-range-tabs button { padding: .48rem .75rem; color: var(--muted); border: 0; border-radius: .45rem; background: transparent; font: inherit; font-size: .75rem; cursor: pointer; }
.activity-range-tabs button:hover { color: var(--text); background: rgba(255,255,255,.035); }
.activity-range-tabs button.active { color: #e0f2fe; background: rgba(14,165,233,.18); box-shadow: inset 0 0 0 1px rgba(56,189,248,.24); }
.telemetry-chart-card > div > span, .node-live-metric > span { color: var(--muted); font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; }
.telemetry-chart-card > small { color: var(--muted); }
.live-runtime-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .45rem; padding-top: .5rem; margin-top: .5rem; border-top: 1px solid var(--border); }
.live-storage-metric { grid-column: 1 / -1; }
.storage-loading { display: flex; align-items: center; gap: .45rem; min-height: 20px; color: var(--muted); }
.storage-segment-track { height: 9px; overflow: hidden; border-radius: 999px; background: rgba(100,116,139,.2); box-shadow: inset 0 0 0 1px rgba(148,163,184,.12); }
.storage-segment-used { display: flex; height: 100%; min-width: 2px; overflow: hidden; border-radius: inherit; }
.storage-segment { min-width: 3px; height: 100%; }.storage-worlds,.storage-legend.storage-worlds{background:#22c55e}.storage-extensions,.storage-legend.storage-extensions{background:#a855f7}.storage-backups,.storage-legend.storage-backups{background:#f97316}.storage-runtime,.storage-legend.storage-runtime{background:#0ea5e9}.storage-configuration,.storage-legend.storage-configuration{background:#facc15}.storage-logs,.storage-legend.storage-logs{background:#64748b}.storage-other,.storage-legend.storage-other{background:#14b8a6}
.live-storage-metric.warning .storage-segment-track { box-shadow: 0 0 0 1px rgba(245,158,11,.62),0 0 14px rgba(245,158,11,.12); }.live-storage-metric.danger .storage-segment-track { box-shadow: 0 0 0 1px rgba(244,63,94,.72),0 0 16px rgba(244,63,94,.16); }
.storage-metric-footer { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }.storage-metric-footer b { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; color: #111827; background: #fbbf24; font-size: .72rem; }
.live-storage-metric.danger .storage-metric-footer b { color: white; background: #e11d48; }
.storage-breakdown { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,170px),1fr)); gap: .45rem; width: 100%; padding-top: .55rem; border-top: 1px solid var(--border); }
.storage-breakdown-item { min-width: 0; display: grid; grid-template-columns: minmax(0,1fr) auto; grid-template-areas: "label value" "count count"; gap: .18rem .55rem; align-items: center; padding: .55rem .6rem; border: 1px solid rgba(148,163,184,.1); border-radius: .48rem; background: var(--surface-subtle); }
.storage-breakdown-label { grid-area: label; display: flex; align-items: center; gap: .4rem; min-width: 0; overflow: hidden; line-height: 1.25; }
.live-storage-metric .storage-breakdown-item > strong { grid-area: value; justify-self: end; font-size: .82rem; }
.live-storage-metric .storage-breakdown-item > small { grid-area: count; color: var(--muted); font-size: .6rem; line-height: 1.25; overflow: visible; text-overflow: clip; white-space: normal; }
.storage-legend { width: 9px; height: 9px; flex: none; border-radius: 50%; }
.storage-error { color: #fb7185!important; }
.live-runtime-metric { min-width: 0; padding: .45rem .55rem; border: 1px solid var(--border); border-radius: .55rem; background: rgba(255,255,255,.018); }
.live-runtime-metric-heading { display: flex; align-items: baseline; justify-content: space-between; gap: .5rem; }
.live-runtime-metric span { color: var(--muted); font-size: .65rem; text-transform: uppercase; letter-spacing: .06em; }
.live-runtime-metric strong { font-size: .95rem; white-space: nowrap; }
.live-runtime-metric small { display: block; color: var(--muted); font-size: .6rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.live-status-card .live-runtime-metric small { display: none; }
.live-runtime-metric .progress-track { height: 5px; margin: .3rem 0 .3rem; }
.overview-console { display: flex; min-height: 0; height: 100%; flex-direction: column; align-self: stretch; margin-top: 0; }
.overview-console .panel-header { margin-bottom: .55rem; }
.overview-console-output { display: flex; flex: 1 1 auto; flex-direction: column; justify-content: flex-start; min-height: clamp(420px, 50vh, 560px); height: clamp(420px, 50vh, 560px); max-height: clamp(420px, 50vh, 560px); overflow: hidden; padding: .8rem .9rem 1.15rem; scroll-padding-bottom: 1rem; white-space: normal; overflow-wrap: anywhere; }
.overview-console-output .console-line { flex: 0 0 auto; min-width: 0; overflow: visible; color: #75e69a; line-height: 1.45; white-space: pre-wrap; overflow-wrap: anywhere; text-overflow: clip; }
.overview-console-output .console-line.warning { color: #ffb454; }
.overview-console-output .console-line.error { color: #ff6b7a; font-weight: 650; }
.console-offline { flex: 1; display: grid; place-content: center; justify-items: center; gap: .35rem; color: #64748b; text-align: center; }
.console-offline > span { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid rgba(100,116,139,.35); border-radius: 50%; background: rgba(100,116,139,.08); }
.console-offline strong { color: #94a3b8; font-size: 1.05rem; }
.console-offline small { color: #64748b; }
.force-stop-modal { width: min(620px, 100%); }
.force-stop-backdrop { z-index: 420; }
.force-stop-warning { align-items: flex-start; margin: .5rem 0 0; }
.force-stop-warning-icon { width: 32px; height: 32px; flex: none; display: grid; place-items: center; color: #ffd166 !important; border: 1px solid rgba(247,185,85,.35); border-radius: 50%; background: rgba(247,185,85,.1); font-size: 1rem !important; }
.force-stop-warning > div { min-width: 0; display: grid; gap: .28rem; }
.force-stop-warning strong { white-space: nowrap; }
.force-stop-warning > div span { display: block; line-height: 1.5; }

.commandline-layout { display: grid; grid-template-columns: minmax(230px, .34fr) minmax(0, 1fr); gap: .85rem; align-items: start; }
.commandline-profile-panel { position: sticky; top: 90px; padding: .85rem !important; }
.commandline-profile-list { display: grid; gap: .38rem; max-height: min(58vh, 620px); overflow: auto; padding-right: .2rem; }
.commandline-profile-list > button { display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; align-items: center; gap: .55rem; width: 100%; padding: .65rem; color: var(--text); border: 1px solid transparent; border-radius: .6rem; background: rgba(255,255,255,.012); text-align: left; cursor: pointer; }
.commandline-profile-list > button:hover { border-color: rgba(56,189,248,.22); background: rgba(14,165,233,.055); }
.commandline-profile-list > button.active { border-color: rgba(56,189,248,.38); background: rgba(14,165,233,.11); box-shadow: inset 2px 0 #0ea5e9; }
.commandline-profile-list > button > span:nth-child(2) { min-width: 0; display: grid; gap: .15rem; }
.commandline-profile-list strong, .commandline-profile-list small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.commandline-profile-list small { color: var(--muted); font-size: .65rem; }
.commandline-profile-icon { color: #38bdf8; text-align: center; }
.commandline-new-profile { width: 100%; margin-top: .65rem; }
.commandline-editor-panel { min-width: 0; }
.commandline-executable .form-control { color: #dbeafe; background: rgba(2,8,18,.82); border-color: rgba(56,189,248,.22); opacity: 1; }
.commandline-profile-meta { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, .55fr); gap: .75rem; align-items: end; margin-bottom: .8rem; }
.commandline-template-editor { min-height: 135px; max-height: 260px; }
.commandline-fixed-summary { padding: .85rem 1rem; margin-bottom: .9rem; border: 1px solid rgba(148,163,184,.18); border-radius: .7rem; background: rgba(2,8,18,.62); }
.commandline-fixed-summary strong { display: block; margin: .25rem 0; }.commandline-fixed-summary p { margin: 0; color: var(--muted); }
.commandline-managed-runtime { display: flex; align-items: center; justify-content: space-between; gap: .8rem; margin-bottom: .85rem; padding: .78rem .9rem; border: 1px solid rgba(56,189,248,.3); border-radius: .7rem; background: linear-gradient(135deg,rgba(14,165,233,.1),rgba(37,99,235,.055)); }
.commandline-managed-runtime > div { min-width: 0; display: flex; align-items: center; gap: .65rem; }.commandline-managed-runtime > div > span:last-child { display: grid; gap: .18rem; }.commandline-managed-runtime small { color: var(--muted); line-height: 1.4; }.commandline-managed-icon { width: 34px; height: 34px; flex: none; display: grid; place-items: center; color: #7dd3fc; border-radius: 50%; background: rgba(14,165,233,.14); }
.commandline-variable-section { margin-top: 1rem; padding-top: .85rem; border-top: 1px solid var(--border); }
.commandline-variable-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; }
.commandline-variable-card { min-width: 0; display: grid; align-content: start; gap: .45rem; padding: .75rem; border: 1px solid var(--border); border-radius: .65rem; background: rgba(2,8,18,.48); }
.commandline-variable-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: .65rem; }
.commandline-variable-heading > div { min-width: 0; display: grid; gap: .18rem; }.commandline-variable-heading code { color: #7dd3fc; font-size: .66rem; }
.commandline-variable-card > small, .commandline-variable-card > p { margin: 0; color: var(--muted); font-size: .68rem; overflow-wrap: anywhere; }
.commandline-variable-card .switch-row.compact { min-height: 42px; padding: .42rem .55rem; }
.commandline-variable-textarea { min-height: 76px; resize: vertical; }
.commandline-preview { margin-top: .85rem; }.commandline-preview code { max-height: 145px; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; }
.commandline-actions { margin-top: .85rem; }.commandline-actions .action-spacer { flex: 1; }
.commandline-runtime-note { margin: .6rem 0 0; color: var(--muted); font-size: .7rem; }

.field-with-action { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .45rem; }
.port-check { display: flex; align-items: flex-start; gap: .7rem; padding: .75rem .9rem; margin-top: 1rem; border: 1px solid var(--border); border-radius: .65rem; background: rgba(255,255,255,.018); }
.port-check > span:first-child { width: 24px; height: 24px; flex: none; display: grid; place-items: center; border-radius: 50%; font-weight: 900; }
.port-check > div { display: grid; gap: .2rem; }
.port-check small { display: block; color: var(--muted); }
.port-check.available { border-color: rgba(34,197,94,.3); }.port-check.available > span { color: #6ee7a0; background: rgba(34,197,94,.12); }
.port-check.conflict { border-color: rgba(248,113,113,.35); }.port-check.conflict > span { color: #fda4af; background: rgba(239,68,68,.12); }
.port-check.pending > span { color: #7dd3fc; }

.steam-progress-panel { margin-top: 1rem; }
.steam-update-alert { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: .9rem; margin-top: 1rem; padding: .9rem 1rem; color: #fff7dc; border: 1px solid rgba(245,158,11,.48); border-radius: .78rem; background: linear-gradient(105deg,rgba(120,66,4,.36),rgba(34,21,5,.72)); box-shadow: 0 14px 36px rgba(0,0,0,.22), inset 3px 0 #f59e0b; }
.steam-update-alert strong { display: block; font-size: .9rem; }.steam-update-alert p { margin: .2rem 0 0; color: #dfc99d; font-size: .72rem; }.steam-update-alert-icon { position: relative; width: 42px; height: 42px; display: grid; place-items: center; color: #fbbf24; border-radius: .62rem; background: rgba(245,158,11,.14); font-size: 1.2rem; font-weight: 900; }.steam-update-alert-icon i { position: absolute; top: 4px; right: 4px; width: 7px; height: 7px; border-radius: 50%; background: #fbbf24; animation: update-dot-pulse 1.35s ease-out infinite; }
.steam-update-button { position: relative; }.update-pulse-dot { width: 8px; height: 8px; flex: 0 0 8px; border-radius: 50%; background: #fde68a; box-shadow: 0 0 0 0 rgba(253,230,138,.55); animation: update-dot-pulse 1.35s ease-out infinite; }
@keyframes update-dot-pulse { 0% { box-shadow: 0 0 0 0 rgba(253,230,138,.55); } 70%,100% { box-shadow: 0 0 0 9px rgba(253,230,138,0); } }
@media (prefers-reduced-motion: reduce) { .service-nav-link .service-nav-badge.has-update, .workshop-catalog-stats .has-update, .steam-update-alert-icon i, .update-pulse-dot { animation: none; } }
.job-progress-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin-bottom: .35rem; }
.job-progress-heading strong { min-width: 0; font-size: .82rem; }
.job-progress-heading span { flex: none; color: #7dd3fc; font-weight: 850; }
.steam-live-output { position: relative; min-height: 220px; height: clamp(220px, 38vh, 360px); max-height: 360px; overflow: auto; padding: .8rem; margin-top: .8rem; border: 1px solid var(--border); border-radius: .6rem; background: #01040a; font: .72rem/1.45 Consolas, "Cascadia Code", monospace; }
.steam-live-output .console-line { color: #75e69a; white-space: pre-wrap; overflow-wrap: anywhere; }
.steam-live-output .console-line.warning { color: #ffb454; }.steam-live-output .console-line.error { color: #ff6b7a; font-weight: 650; }
.steam-console-activity { position: sticky; bottom: -.8rem; display: flex; align-items: center; gap: .55rem; min-height: 38px; margin: .6rem -.8rem -.8rem; padding: .55rem .8rem; color: #bae6fd; border-top: 1px solid rgba(56,189,248,.25); background: rgba(3,10,20,.96); box-shadow: 0 -8px 18px rgba(1,4,10,.7); }
.steam-console-activity .spinner { width: 15px; height: 15px; }
.activity-dots { display: inline-flex; align-items: center; gap: 3px; }
.activity-dots i { width: 4px; height: 4px; border-radius: 50%; background: #38bdf8; animation: steam-dot 1.2s infinite ease-in-out; }
.activity-dots i:nth-child(2) { animation-delay: .16s; }.activity-dots i:nth-child(3) { animation-delay: .32s; }
@keyframes steam-dot { 0%, 70%, 100% { opacity: .2; transform: translateY(0); } 35% { opacity: 1; transform: translateY(-3px); } }

.provisioning-modal { width: min(850px, 100%); }
.provisioning-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .55rem; margin: .85rem 0; }
.provisioning-steps article { min-width: 0; display: flex; gap: .55rem; padding: .65rem; border: 1px solid var(--border); border-radius: .55rem; background: rgba(255,255,255,.018); }
.provisioning-steps article > span { width: 24px; height: 24px; flex: none; display: grid; place-items: center; color: #64748b; border: 1px solid var(--border); border-radius: 50%; }
.provisioning-steps article > div { min-width: 0; display: grid; gap: .15rem; }
.provisioning-steps article strong { font-size: .72rem; }.provisioning-steps article small { color: var(--muted); font-size: .61rem; line-height: 1.35; }
.provisioning-steps article.complete { border-color: rgba(34,197,94,.25); }.provisioning-steps article.complete > span { color: #6ee7a0; background: rgba(34,197,94,.12); }
.provisioning-steps article.active { border-color: var(--border-strong); }.provisioning-steps article.active > span { color: #7dd3fc; animation: spin-indicator 1.1s linear infinite; }
.provisioning-steps article.failed { border-color: rgba(248,113,113,.35); }.provisioning-steps article.failed > span { color: #fda4af; background: rgba(239,68,68,.12); }
.provisioning-log { min-height: 150px; max-height: 230px; }
.eula-modal { width: min(620px, 100%); }.eula-confirm { padding: .8rem; border: 1px solid var(--border); border-radius: .6rem; background: rgba(255,255,255,.018); }

.delayed-actions-panel { margin-top: 1rem; }
.delayed-action-buttons { display: flex; flex-wrap: wrap; gap: .55rem; margin-bottom: .85rem; }
.countdown-list { display: grid; gap: .5rem; }
.countdown-list article { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: .75rem; padding: .65rem .75rem; border: 1px solid var(--border); border-radius: .55rem; background: rgba(255,255,255,.018); }
.countdown-list article > div { display: grid; gap: .12rem; }.countdown-list small { color: var(--muted); }
.countdown-value { min-width: 64px; color: #7dd3fc; font: 850 1.1rem/1 Consolas, monospace; text-align: center; }
.countdown-value.compact { display: inline-block; min-width: 72px; font-size: .84rem; }

.lifecycle-inline { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: .75rem; padding: .75rem 1rem; border-left: 3px solid var(--brand); }
.lifecycle-inline-main, .lifecycle-inline-actions { display: flex; align-items: center; gap: .75rem; min-width: 0; }
.lifecycle-inline-main > div { display: grid; gap: .16rem; min-width: 0; }
.lifecycle-inline-main strong, .lifecycle-inline-main small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lifecycle-inline-main small { color: var(--muted); }
.lifecycle-inline .step-indicator { flex: 0 0 auto; }
.lifecycle-inline.active .step-indicator { border-color: var(--brand); color: #7dd3fc; animation: spin-indicator 1.1s linear infinite; }
.lifecycle-inline.complete { border-left-color: #22c55e; }
.lifecycle-inline.complete .step-indicator { border-color: rgba(34,197,94,.5); color: #6ee7a0; background: rgba(34,197,94,.12); }
.lifecycle-inline.failed { border-left-color: #ef4444; }
.lifecycle-inline.failed .step-indicator { border-color: rgba(248,113,113,.55); color: #fca5a5; background: rgba(239,68,68,.12); }
.lifecycle-inline-actions > span { color: var(--muted); font-size: .72rem; white-space: nowrap; }
.console-toolbar small { color: var(--muted); }
.metric-sparkline-shell { position: relative; width: 100%; margin: .55rem 0; cursor: crosshair; touch-action: pan-y; }
.metric-sparkline { width: 100%; height: 110px; display: block; margin: 0; overflow: visible; }
.spark-grid { stroke: rgba(148,163,184,.12); stroke-width: 1; vector-effect: non-scaling-stroke; }
.spark-crosshair { opacity: 0; stroke: rgba(226,232,240,.82); stroke-width: 1; stroke-dasharray: 4 4; vector-effect: non-scaling-stroke; pointer-events: none; transition: opacity .1s ease; }
.spark-hover-point { opacity: 0; fill: #f8fafc; stroke: #07111f; stroke-width: 2; vector-effect: non-scaling-stroke; pointer-events: none; transition: opacity .1s ease; }
.metric-sparkline-tooltip { position: absolute; z-index: 4; top: 0; left: 0; display: grid; gap: .1rem; min-width: 92px; padding: .42rem .55rem; color: #f8fafc; border: 1px solid rgba(125,211,252,.38); border-radius: .45rem; background: rgba(3,9,18,.96); box-shadow: 0 10px 28px rgba(0,0,0,.35); opacity: 0; transform: translate(-50%, calc(-100% - 8px)); pointer-events: none; transition: opacity .1s ease; }
.metric-sparkline-tooltip strong { font-size: .76rem; line-height: 1.2; }
.metric-sparkline-tooltip span { color: #94a3b8; font-size: .63rem; white-space: nowrap; }
.metric-sparkline-shell.spark-hover .spark-crosshair, .metric-sparkline-shell.spark-hover .spark-hover-point, .metric-sparkline-shell.spark-hover .metric-sparkline-tooltip { opacity: 1; }
.telemetry-chart-card > div { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; }
.telemetry-chart-card > div strong { font-size: 1.35rem; }
.process-detail-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .7rem; margin-top: 1rem; }
.process-detail-strip > div { display: flex; flex-direction: column; gap: .25rem; padding: .65rem; border: 1px solid var(--border); border-radius: .55rem; }
.process-detail-strip span { color: var(--muted); font-size: .68rem; text-transform: uppercase; }
.backup-create-modal { width: min(640px, 100%); }
.backup-create-modal .field-group { margin-top: .8rem; }
.player-restore-modal { width: min(680px,100%); }
.player-restore-modal .field-group { margin: 1rem 0; }
.player-restore-summary { display: flex; align-items: center; gap: .75rem; padding: .8rem; border: 1px solid rgba(56,189,248,.2); border-radius: .68rem; background: rgba(14,165,233,.06); }
.player-restore-summary > span { width: 38px; height: 38px; flex: 0 0 38px; display: grid; place-items: center; color: #fbbf24; border-radius: .55rem; background: rgba(245,158,11,.12); font-size: 1.1rem; }
.player-restore-summary > div { min-width: 0; display: grid; gap: .14rem; }
.player-restore-summary small { color: var(--muted); }
.backup-note { max-width: 360px; color: var(--muted); white-space: normal; }
.section-heading { margin: 1.5rem 0 .75rem; }
.section-heading h2 { margin: .2rem 0 0; }

.lifecycle-modal { width: min(620px, 100%); }
.lifecycle-steps { display: grid; margin: .3rem 0 1rem; }
.lifecycle-step { position: relative; display: grid; grid-template-columns: 36px 1fr; gap: .75rem; min-height: 54px; color: #66778d; }
.lifecycle-step:not(:last-child)::after { content: ""; position: absolute; left: 17px; top: 34px; bottom: 0; width: 2px; background: var(--border); }
.step-indicator { position: relative; z-index: 1; width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid var(--border); border-radius: 50%; background: #0b1423; font-weight: 900; }
.lifecycle-step > div { display: flex; flex-direction: column; gap: .15rem; padding-top: .35rem; }
.lifecycle-step small { color: var(--muted); line-height: 1.4; }
.lifecycle-step.active { color: #7dd3fc; }
.lifecycle-step.active .step-indicator { border-color: var(--brand); animation: spin-indicator 1.1s linear infinite; }
.lifecycle-step.complete { color: #6ee7a0; }
.lifecycle-step.complete .step-indicator { border-color: rgba(34,197,94,.5); background: rgba(34,197,94,.12); }
.lifecycle-step.failed { color: #fca5a5; }
.lifecycle-step.failed .step-indicator { border-color: rgba(248,113,113,.55); background: rgba(239,68,68,.12); }
@keyframes spin-indicator { to { transform: rotate(360deg); } }
.lifecycle-wait { display: flex; align-items: center; gap: .65rem; color: var(--muted); font-size: .76rem; }
.spinner { width: 16px; height: 16px; display: inline-block; flex: none; border: 2px solid rgba(56,189,248,.22); border-top-color: var(--brand); border-radius: 50%; animation: spin-indicator .8s linear infinite; }

.detailed-node-widget { overflow: hidden; }
.node-live-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .65rem; }
.node-live-metric { padding: .7rem; border: 1px solid var(--border); border-radius: .6rem; background: rgba(255,255,255,.015); }
.node-live-metric strong { display: block; margin: .3rem 0; font-size: .86rem; overflow-wrap: anywhere; }
.node-live-metric .progress-track { margin-bottom: 0; }
.node-cpu-chart { margin-top: .8rem; }
.node-cpu-chart .metric-sparkline-shell { margin-bottom: .25rem; }
.node-cpu-chart .metric-sparkline { height: 90px; }
.node-cpu-chart > small, .node-meta-row, .gpu-adapter-list small { color: var(--muted); font-size: .67rem; }
.node-core-details { margin-top: .8rem; border: 1px solid var(--border); border-radius: .6rem; background: rgba(0,0,0,.12); }
.node-core-details summary { padding: .7rem .8rem; color: #cbd5e1; cursor: pointer; font-size: .75rem; }
.core-usage-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .45rem; padding: 0 .7rem .7rem; }
.core-usage-grid > div { padding: .45rem; border: 1px solid var(--border); border-radius: .4rem; }
.core-usage-grid span, .core-usage-grid strong { display: block; font-size: .65rem; }
.core-usage-grid strong { margin-top: .15rem; }
.core-usage-grid .progress-track { height: 5px; margin: .3rem 0 0; }
.gpu-adapter-list { display: grid; gap: .35rem; margin-top: .6rem; }
.gpu-adapter-list > span { display: flex; justify-content: space-between; gap: .7rem; padding: .45rem .55rem; border: 1px solid var(--border); border-radius: .4rem; }
.gpu-adapter-list strong { font-size: .68rem; overflow-wrap: anywhere; }
.node-meta-row { display: flex; justify-content: space-between; gap: .7rem; margin-top: .7rem; }
.node-component-summary { align-items: center; justify-content: flex-start; flex-wrap: wrap; }
.node-component-summary > span:last-child { margin-left: auto; }
.check-card { display: grid; grid-template-columns: auto 1fr; gap: .7rem; align-items: start; padding: .85rem; margin-top: 1rem; border: 1px solid var(--border); border-radius: .65rem; background: rgba(255,255,255,.018); }
.check-card input { margin-top: .2rem; accent-color: var(--brand); }
.check-card span { display: flex; flex-direction: column; gap: .25rem; }
.check-card small { color: var(--muted); }

.role-management-layout { display: grid; grid-template-columns: 290px minmax(0, 1fr); gap: 1rem; align-items: start; }
.role-sidebar { position: sticky; top: 90px; }
.role-selector-list { display: grid; gap: .45rem; }
.role-selector-list > button { display: grid; grid-template-columns: auto 1fr; gap: .65rem; align-items: center; width: 100%; padding: .55rem; color: var(--text); border: 1px solid transparent; border-radius: .6rem; background: transparent; text-align: left; cursor: pointer; }
.role-selector-list > button:hover, .role-selector-list > button.active { border-color: var(--border); background: rgba(14,165,233,.08); }
.role-selector-list > button.active { box-shadow: inset 2px 0 var(--brand); }
.role-selector-list > button > span:last-child { display: flex; flex-direction: column; min-width: 0; }
.role-selector-list small { color: var(--muted); }
.role-editor-tabs { display: flex; gap: .3rem; margin-bottom: 1rem; border-bottom: 1px solid var(--border); }
.role-editor-tabs button { padding: .7rem .9rem; color: var(--muted); border: 0; border-bottom: 2px solid transparent; background: transparent; cursor: pointer; }
.role-editor-tabs button.active { color: white; border-color: var(--brand); }
.permission-tree { display: grid; gap: .8rem; }
.permission-group { overflow: hidden; border: 1px solid var(--border); border-radius: .7rem; }
.permission-group > header { display: grid; grid-template-columns: auto 1fr auto; gap: .7rem; align-items: center; padding: .7rem .85rem; background: rgba(255,255,255,.025); }
.permission-group > header > span { font-size: 1.2rem; }
.permission-group > header > div { display: flex; flex-direction: column; }
.permission-group > header small { color: var(--muted); }
.permission-group > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.permission-row { display: grid; grid-template-columns: auto 1fr; gap: .65rem; align-items: start; padding: .8rem; border-top: 1px solid var(--border); cursor: pointer; }
.permission-row:nth-child(even) { border-left: 1px solid var(--border); }
.permission-row:hover { background: rgba(14,165,233,.035); }
.permission-row input { margin-top: .2rem; accent-color: var(--brand); }
.permission-row > span { display: flex; flex-direction: column; gap: .2rem; }
.permission-row small { color: var(--muted); line-height: 1.4; }
.permission-row code { align-self: flex-start; margin-top: .15rem; color: #5e748a; font-size: .6rem; }
.role-member-list { display: grid; gap: .55rem; }
.role-member-list a { display: grid; grid-template-columns: auto 1fr auto; gap: .7rem; align-items: center; padding: .7rem; color: var(--text); border: 1px solid var(--border); border-radius: .6rem; }
.role-member-list a > span:nth-child(2) { display: flex; flex-direction: column; }
.role-member-list small { color: var(--muted); }

.import-source-banner { display: flex; flex-wrap: wrap; gap: .65rem; align-items: center; padding: .75rem .9rem; margin-bottom: .8rem; border: 1px solid rgba(14,165,233,.25); border-radius: .65rem; background: rgba(14,165,233,.06); }
.import-source-banner code { margin-left: auto; font-size: .65rem; }
.config-editor-toolbar { display: flex; gap: .7rem; align-items: center; margin-bottom: .8rem; }
.config-editor-toolbar input { flex: 1; }
.seven-days-config-toolbar { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: .7rem 1rem; align-items: center; margin: .8rem 0; }
.seven-days-config-toolbar .config-editor-toolbar { grid-column: 1 / -1; margin: 0; }
.seven-days-editor-tabs { display: inline-flex; flex: none; width: fit-content; max-width: 100%; min-height: 46px; gap: .25rem; padding: .25rem; border: 1px solid var(--border); border-radius: .65rem; background: var(--surface-2); overflow-x: auto; }
.seven-days-editor-tabs button { display: inline-flex; align-items: center; gap: .45rem; min-height: 36px; padding: .45rem .75rem; border: 0; border-radius: .45rem; color: var(--muted); background: transparent; cursor: pointer; white-space: nowrap; }
.seven-days-editor-tabs button:hover { color: var(--text); }
.seven-days-editor-tabs button.active { color: #fff; background: linear-gradient(145deg,var(--brand),var(--brand-strong)); }
.seven-days-editor-tabs button span { min-width: 1.35rem; padding: .08rem .35rem; border-radius: 999px; background: rgba(255,255,255,.12); font-size: .72rem; text-align: center; }
.nested-modal-backdrop { z-index: 380; }
.seven-days-sandbox-modal { width: min(980px,100%); max-height: min(88vh,940px); overflow: auto; }
.seven-days-admin-editor { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; gap: .8rem; overflow: auto; padding: .75rem .15rem; }
.seven-days-admin-add { display: grid; grid-template-columns: 190px minmax(260px,1fr) 180px auto; gap: .65rem; align-items: end; }
.seven-days-admin-add .btn,.seven-days-permission-add .btn { min-height: 44px; }
.seven-days-admin-hint { margin: -.25rem 0 0; }
.seven-days-admin-list,.seven-days-permission-list { display: grid; flex: none; gap: .45rem; }
.seven-days-admin-list article { display: grid; grid-template-columns: 140px minmax(220px,1fr) minmax(150px,auto) auto; gap: .7rem; align-items: center; padding: .65rem .75rem; border: 1px solid var(--border); border-radius: .6rem; background: var(--surface-2); }
.seven-days-admin-list code,.seven-days-permission-list code { overflow-wrap: anywhere; }
.seven-days-permission-add { display: grid; grid-template-columns: minmax(220px,1fr) 220px auto; gap: .65rem; align-items: end; }
.seven-days-permission-list article { display: grid; grid-template-columns: minmax(180px,1fr) 240px auto; gap: .7rem; align-items: center; padding: .6rem .75rem; border: 1px solid var(--border); border-radius: .6rem; background: var(--surface-2); }
.seven-days-permission-list label { display: flex; align-items: center; justify-content: flex-end; gap: .55rem; }
.seven-days-permission-list input { width: 110px; }
.template-commandline-manager { display: grid; gap: .8rem; }
.template-commandline-list { display: grid; gap: .55rem; }
.template-commandline-row { display: grid; grid-template-columns: minmax(170px,.35fr) minmax(300px,1fr) auto; gap: .8rem; align-items: center; padding: .75rem; border: 1px solid var(--border); border-radius: .65rem; background: var(--surface-2); }
.template-commandline-row > div { display: flex; flex-direction: column; gap: .2rem; }
.template-commandline-row small { color: var(--muted); }
.template-commandline-row code { max-height: 5.5rem; overflow: auto; overflow-wrap: anywhere; }
.service-nav-external { margin-left: auto; color: var(--muted); font-size: .75rem; }
.dynamic-config-grid, .template-field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem 1rem; }
.dynamic-config-field { padding: .7rem; margin: 0; border: 1px solid var(--border); border-radius: .6rem; background: rgba(255,255,255,.014); }
.dynamic-config-field small, .template-field-grid small { color: var(--muted); }
.editor-modal-shell > .pz-config-editor { flex: 1 1 auto; min-height: 0; }
.pz-config-editor { display: flex; flex-direction: column; gap: .7rem; min-height: 0; padding-top: .75rem; }
.pz-config-summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .72rem .85rem; border: 1px solid rgba(14,165,233,.24); border-radius: .65rem; background: linear-gradient(135deg,rgba(14,165,233,.075),rgba(37,99,235,.025)); }
.pz-config-summary strong { display: block; margin-bottom: .15rem; }
.pz-config-summary p { max-width: 850px; margin: 0; color: var(--muted); font-size: .72rem; line-height: 1.5; }
.pz-config-filter { flex: none; margin: 0; }
.pz-config-sections { display: flex; flex: none; flex-wrap: wrap; gap: .35rem; padding-bottom: .1rem; }
.pz-config-sections button { display: inline-flex; align-items: center; gap: .45rem; min-height: 34px; padding: .38rem .58rem; color: var(--muted); border: 1px solid var(--border); border-radius: .5rem; background: var(--surface-2); cursor: pointer; font-size: .68rem; transition: color .16s ease,border-color .16s ease,background .16s ease; }
.pz-config-sections button:hover { color: var(--text); border-color: rgba(56,189,248,.4); }
.pz-config-sections button.active { color: #eaf8ff; border-color: rgba(14,165,233,.58); background: linear-gradient(145deg,rgba(14,165,233,.32),rgba(37,99,235,.22)); }
.pz-config-sections button small { min-width: 1.45rem; padding: .08rem .3rem; color: inherit; border-radius: 999px; background: rgba(255,255,255,.08); text-align: center; }
.pz-config-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); align-content: start; gap: .6rem; min-height: 0; overflow: auto; padding: .05rem .25rem .75rem 0; }
.pz-config-field { min-width: 0; margin: 0; padding: .68rem .72rem; border: 1px solid var(--border); border-radius: .6rem; background: rgba(255,255,255,.014); }
.pz-config-field.wide { grid-column: 1 / -1; }
.pz-config-field-heading { display: flex; align-items: baseline; justify-content: space-between; gap: .75rem; min-width: 0; }
.pz-config-field-heading strong { color: var(--text); font-size: .77rem; }
.pz-config-field-heading code { overflow: hidden; color: #66c9f5; font-size: .6rem; text-overflow: ellipsis; white-space: nowrap; }
.pz-config-field > small { color: var(--muted); line-height: 1.45; }
.pz-config-field .form-control,.pz-config-field .brand-select { width: 100%; }
html[data-theme="light"] .pz-config-summary { border-color: rgba(2,132,199,.3); background: linear-gradient(135deg,rgba(14,165,233,.1),rgba(37,99,235,.035)); }
html[data-theme="light"] .pz-config-sections button { color: #3b5870; background: rgba(224,236,245,.92); }
html[data-theme="light"] .pz-config-sections button.active { color: #fff; background: linear-gradient(145deg,#0284c7,#2563eb); }
html[data-theme="light"] .pz-config-field { background: rgba(241,247,251,.95); }
html[data-theme="light"] .pz-config-field-heading code { color: #036f9e; }

.sandbox-generator { flex: 0 1 auto; max-height: min(530px, 54vh); overflow: auto; padding: .85rem; margin: .8rem 0; border: 1px solid rgba(14,165,233,.25); border-radius: .75rem; background: linear-gradient(145deg,rgba(14,165,233,.06),rgba(4,10,20,.72)); scrollbar-color: rgba(56,189,248,.5) rgba(4,10,20,.65); scrollbar-width: thin; }
.sandbox-generator-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: .75rem; }
.sandbox-generator-heading h3 { margin: .15rem 0 .2rem; }
.sandbox-generator-heading p { max-width: 780px; margin: 0; color: var(--muted); font-size: .74rem; }
.sandbox-code-import { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: .65rem; align-items: end; }
.sandbox-code-import .field-group { margin: 0; }
.sandbox-code-value { color: #7dd3fc; font-family: Consolas,"Cascadia Code",monospace; letter-spacing: .025em; }
.sandbox-toolbar { position: sticky; z-index: 2; top: -.85rem; display: grid; grid-template-columns: minmax(0,1fr) minmax(180px,300px); gap: .7rem; padding: .7rem 0; margin-top: .6rem; background: rgba(7,15,28,.97); }
.sandbox-category-tabs { display: flex; flex-wrap: wrap; gap: .3rem; }
.sandbox-category-tabs button { display: inline-flex; align-items: center; gap: .38rem; padding: .38rem .55rem; color: #94a3b8; border: 1px solid var(--border); border-radius: .45rem; background: rgba(255,255,255,.018); cursor: pointer; font-size: .68rem; transition: color .18s ease,border-color .18s ease,background .18s ease,transform .18s ease; }
.sandbox-category-tabs button:hover { color: white; border-color: rgba(56,189,248,.42); transform: translateY(-1px); }
.sandbox-category-tabs button.active { color: #e0f2fe; border-color: rgba(14,165,233,.52); background: rgba(14,165,233,.13); }
.sandbox-category-tabs button span { min-width: 20px; padding: .08rem .32rem; border-radius: 999px; background: rgba(255,255,255,.055); font-size: .58rem; text-align: center; }
.sandbox-option-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .55rem; }
.sandbox-option-card { display: grid; gap: .42rem; padding: .62rem; border: 1px solid var(--border); border-radius: .58rem; background: rgba(3,10,20,.52); transition: border-color .18s ease,background .18s ease; }
.sandbox-option-card.changed { border-color: rgba(34,197,94,.35); background: rgba(22,163,74,.055); }
.sandbox-option-card > span { display: flex; justify-content: space-between; gap: .5rem; align-items: center; min-height: 28px; }
.sandbox-option-card > span strong { font-size: .7rem; line-height: 1.25; }
.sandbox-option-card > span small { color: #86efac; font-size: .56rem; text-transform: uppercase; letter-spacing: .08em; }
.sandbox-option-card code { color: #62758b; font-size: .57rem; overflow-wrap: anywhere; }
.ark-identifier-editor { flex: 1 1 auto; min-height: 0; overflow: auto; padding: .8rem .2rem; }
.ark-identifier-help { display: grid; grid-template-columns: auto 1fr; gap: .75rem; padding: .8rem; border: 1px solid rgba(14,165,233,.28); border-radius: .65rem; background: rgba(14,165,233,.06); }
.ark-identifier-help > span { width: 28px; height: 28px; display: grid; place-items: center; color: #7dd3fc; border: 1px solid rgba(56,189,248,.3); border-radius: 50%; }
.ark-identifier-help p { margin: .2rem 0; color: #cbd5e1; }
.ark-identifier-help small { color: var(--muted); line-height: 1.45; }
.ark-identifier-add { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: .6rem; margin: .8rem 0; }
.ark-identifier-list { display: grid; gap: .4rem; }
.ark-identifier-list > div { display: flex; align-items: center; justify-content: space-between; gap: .7rem; padding: .55rem .65rem; border: 1px solid var(--border); border-radius: .5rem; background: rgba(255,255,255,.016); }
.ark-identifier-list code { color: #bdeaff; overflow-wrap: anywhere; }
.minecraft-operator-editor { flex: 1 1 auto; min-height: 0; overflow: auto; padding: .8rem .2rem; }
.minecraft-operator-list { display: grid; gap: .4rem; }
.minecraft-operator-list > div { display: grid; grid-template-columns: minmax(0,1fr) auto auto; align-items: center; gap: .8rem; padding: .62rem .7rem; border: 1px solid var(--border); border-radius: .55rem; background: rgba(255,255,255,.016); }
.minecraft-operator-list > div > span:first-child { min-width: 0; display: grid; gap: .1rem; }
.minecraft-operator-list small { color: var(--muted); font-family: Consolas,"Cascadia Code",monospace; overflow-wrap: anywhere; }
.operator-level { color: #7dd3fc; font-size: .7rem; font-weight: 800; }
.commandline-delete-modal { width: min(620px,100%); }

.template-editor-shell { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 1rem; align-items: start; }
.template-manage-menu { position: sticky; top: 90px; display: grid; gap: .25rem; padding: .65rem; border: 1px solid var(--border); border-radius: .75rem; background: rgba(8,14,26,.97); }
.template-manage-menu > span { padding: .45rem .55rem; }
.template-manage-menu button { display: flex; align-items: center; gap: .45rem; min-height: 40px; padding: .5rem .6rem; color: #aab7ca; border: 0; border-radius: .45rem; background: transparent; text-align: left; cursor: pointer; }
.template-manage-menu button b { margin-left: auto; color: #5c7188; font-size: .65rem; }
.template-manage-menu button:hover, .template-manage-menu button.active { color: white; background: rgba(14,165,233,.13); }
.template-feature-access-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem; margin: 1rem 0; }
.template-feature-access-row { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .7rem; align-items: start; padding: .8rem; border: 1px solid var(--border); border-radius: .65rem; background: rgba(255,255,255,.014); cursor: pointer; }
.template-feature-access-row:hover { border-color: rgba(56,189,248,.34); background: rgba(14,165,233,.035); }
.template-feature-access-row input { margin-top: .2rem; accent-color: var(--brand); }
.template-feature-access-row > span { min-width: 0; display: grid; gap: .25rem; }
.template-feature-access-row small { color: var(--muted); line-height: 1.4; }
.template-feature-access-row code { justify-self: start; color: #668096; font-size: .61rem; overflow-wrap: anywhere; }

/* Keep late-added commandline styles responsive; these rules intentionally live after their base declarations. */
@media (max-width: 1100px) {
    .commandline-layout { grid-template-columns: 1fr; }
    .commandline-profile-panel { position: static; }
    .commandline-profile-list { grid-template-columns: repeat(2, minmax(0, 1fr)); max-height: none; }
}

@media (max-width: 760px) {
    .commandline-profile-list, .commandline-profile-meta, .commandline-variable-grid, .template-feature-access-list { grid-template-columns: 1fr; }
    .commandline-actions { align-items: stretch; }
    .commandline-actions .action-spacer { display: none; }
}
.access-denied-panel { min-height: 360px; }
.template-tab-strip { display: flex; flex-wrap: wrap; gap: .25rem; padding: .4rem; margin-bottom: .7rem; border: 1px solid var(--border); border-radius: .65rem; background: rgba(6,11,20,.85); }
.template-tab-strip button { padding: .5rem .7rem; color: var(--muted); border: 1px solid transparent; border-radius: .4rem; background: transparent; cursor: pointer; font-size: .72rem; }
.template-tab-strip button.active { color: white; border-color: var(--border-strong); background: rgba(14,165,233,.11); }
.template-record-layout { display: grid; grid-template-columns: 290px minmax(0, 1fr); gap: .8rem; }
.template-record-list { display: grid; gap: .35rem; align-content: start; max-height: 72vh; overflow: auto; padding: .45rem; border: 1px solid var(--border); border-radius: .65rem; background: rgba(6,11,20,.75); }
.template-record-list button { display: flex; flex-direction: column; gap: .2rem; padding: .65rem; color: var(--text); border: 1px solid transparent; border-radius: .45rem; background: transparent; text-align: left; cursor: pointer; }
.template-record-list button:hover, .template-record-list button.active { border-color: var(--border); background: rgba(14,165,233,.08); }
.template-record-list small { color: var(--muted); overflow-wrap: anywhere; }
.template-record-list button:disabled { opacity: .5; cursor: not-allowed; }
.template-record-detail, .template-field-sections { display: grid; gap: .8rem; min-width: 0; }
.template-field-section { overflow: hidden; border: 1px solid var(--border); border-radius: .65rem; background: rgba(255,255,255,.012); }
.template-field-section > header { display: flex; justify-content: space-between; gap: .75rem; align-items: center; padding: .55rem .7rem; border-bottom: 1px solid var(--border); background: rgba(14,165,233,.045); }
.template-field-section > header h3 { margin: 0; color: #d7e7f8; font-size: .78rem; }
.template-field-section > header span { color: var(--muted); font-size: .62rem; }
.template-field-section .template-field-grid { padding: .75rem; }
.template-value-field { min-width: 0; }
.template-value-field.full-width { grid-column: 1 / -1; }
.template-value-field input[readonly] { color: #8192a8; background: #060d18; cursor: not-allowed; }
textarea.form-control.template-long-field { min-height: 180px; resize: vertical; font-family: Consolas, "Cascadia Code", monospace; line-height: 1.45; }
textarea.form-control.template-script-source { min-height: clamp(420px, 58vh, 720px); tab-size: 4; }

@media (max-width: 900px) {
  .resource-limit-grid { grid-template-columns: 1fr; }
  .catalog-search-row { grid-template-columns: 1fr; }
  .workshop-toolbar { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .workshop-search { grid-column: 1 / -1; }
  .workshop-browser-heading, .workshop-result-footer { align-items: stretch; flex-direction: column; }
  .workshop-catalog-stats { justify-content: flex-start; }
  .workshop-result-footer small { text-align: left; }
  .schedule-action-picker { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .steam-update-alert { grid-template-columns: auto minmax(0,1fr); }
  .steam-update-alert > .btn { grid-column: 1 / -1; }
  .steam-operation-actions { grid-template-columns: 1fr; }
}

.required-mark{color:#ff6b7d}
.support-attachment-picker{margin-top:1rem}
.support-upload-control{position:relative;min-height:82px;overflow:hidden;border:1px dashed rgba(56,189,248,.5);border-radius:.76rem;background:linear-gradient(135deg,rgba(14,165,233,.09),rgba(5,15,29,.82));transition:border-color .18s ease,background .18s ease,transform .18s ease,box-shadow .18s ease}
.support-upload-control:hover,.support-upload-control:focus-within{border-color:#7dd3fc;background:linear-gradient(135deg,rgba(14,165,233,.15),rgba(5,18,34,.94));box-shadow:0 0 0 3px rgba(14,165,233,.08);transform:translateY(-1px)}
.support-upload-content{display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:.75rem;min-height:82px;padding:.7rem .85rem;pointer-events:none}
.support-upload-icon{display:grid;width:44px;height:44px;place-items:center;color:#7dd3fc;border:1px solid rgba(56,189,248,.32);border-radius:.65rem;background:rgba(14,165,233,.12);font-size:1.35rem;font-weight:900}
.support-upload-copy{display:grid;gap:.12rem;min-width:0}.support-upload-copy strong{color:#eaf8ff;font-size:.82rem}.support-upload-copy small{color:var(--muted);font-size:.7rem}
.support-upload-count{padding:.3rem .55rem;color:#93c5fd;border:1px solid rgba(96,165,250,.22);border-radius:999px;background:rgba(30,64,175,.12);font-size:.68rem;font-weight:850;white-space:nowrap}
.support-upload-input{position:absolute;inset:0;z-index:2;width:100%;height:100%;opacity:0;cursor:pointer}
.support-selected-files{display:grid;gap:.45rem;margin:.7rem 0 0;padding:0;list-style:none}
.support-selected-files li{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.55rem .65rem;border:1px solid rgba(87,126,166,.22);border-radius:.65rem;background:rgba(4,14,28,.55)}
.support-selected-files li>span{min-width:0;overflow-wrap:anywhere}.support-selected-files small{color:var(--muted)}
.btn-compact{min-height:32px;padding:.32rem .6rem;font-size:.76rem}
.ticket-message-body{white-space:pre-wrap;overflow-wrap:anywhere}
.support-attachments{display:flex;flex-wrap:wrap;gap:.65rem;margin-top:.85rem;padding-top:.75rem;border-top:1px solid rgba(103,138,174,.18)}
.support-image-attachment,.support-file-attachment{color:var(--text);text-decoration:none;border:1px solid rgba(50,177,232,.25);border-radius:.7rem;background:rgba(5,24,42,.62);transition:border-color .18s ease,transform .18s ease}
.support-image-attachment:hover,.support-file-attachment:hover{border-color:rgba(50,190,246,.72);transform:translateY(-1px)}
.support-image-attachment{display:grid;overflow:hidden;width:min(220px,100%)}
.support-image-attachment img{display:block;width:100%;height:125px;object-fit:cover;background:#020814}
.support-image-attachment span{padding:.45rem .6rem;font-size:.75rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.support-file-attachment{display:flex;align-items:center;gap:.55rem;padding:.65rem .75rem;max-width:100%}.support-file-attachment span:last-child{display:grid;min-width:0;overflow-wrap:anywhere}.support-file-attachment small{color:var(--muted)}
@media (max-width: 560px) {
  .support-upload-content { grid-template-columns: 40px minmax(0,1fr); }
  .support-upload-icon { width: 40px; height: 40px; }
  .support-upload-count { grid-column: 2; justify-self: start; }
  .workshop-toolbar { grid-template-columns: 1fr; }
  .workshop-search { grid-column: auto; grid-template-columns: 1fr; }
  .mod-catalog-grid { grid-template-columns: repeat(auto-fill,minmax(170px,1fr)); }
  .mod-catalog-card { grid-template-rows: 125px minmax(0,1fr) auto; }
  .mod-catalog-card footer { align-items: stretch; flex-direction: column; }
  .service-route-loader { min-height: 60vh; }
}
.script-record-editor > .template-value-field { display: grid; gap: .45rem; }
.template-advanced-settings { margin-top: 1rem; border: 1px solid var(--border); border-radius: .75rem; background: rgba(5, 13, 25, .58); }
.template-advanced-settings > summary { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; padding: .9rem 1rem; cursor: pointer; color: var(--text); }
.template-advanced-settings > summary span { color: var(--muted); font-size: .82rem; font-weight: 400; }
.template-advanced-settings[open] > summary { border-bottom: 1px solid var(--border); }
.template-advanced-settings .template-field-sections { padding: 1rem; }
.query-script-bridge { display: flex; justify-content: space-between; gap: 1rem; align-items: center; padding: .85rem 1rem; margin-top: .8rem; border: 1px solid var(--border); border-radius: .7rem; background: rgba(8, 15, 28, .72); }
.query-script-bridge.active { border-color: rgba(14, 165, 233, .38); background: linear-gradient(110deg, rgba(14, 165, 233, .09), rgba(8, 15, 28, .78)); }
.query-script-bridge > div { display: flex; flex-direction: column; gap: .22rem; min-width: 0; }
.query-script-bridge h3 { margin: 0; font-size: .95rem; }
.query-script-bridge small { max-width: 850px; line-height: 1.45; }
.query-script-bridge code { align-self: flex-start; margin-top: .25rem; color: #7dd3fc; overflow-wrap: anywhere; }
.template-linked-divider { position: relative; display: flex; align-items: center; justify-content: center; margin: .2rem 0; color: #71849a; font-size: .64rem; letter-spacing: .08em; text-transform: uppercase; }
.template-linked-divider::before, .template-linked-divider::after { content: ""; flex: 1; height: 1px; background: var(--border); }
.template-linked-divider span { padding: 0 .7rem; }
.port-editor-toolbar { display: grid; grid-template-columns: minmax(220px, 1fr) minmax(180px, 280px) auto; gap: .7rem; align-items: end; padding: .75rem; margin-bottom: .7rem; border: 1px solid var(--border); border-radius: .65rem; background: rgba(14,165,233,.035); }
.port-editor-toolbar > div { display: flex; flex-direction: column; gap: .2rem; }
.port-editor-toolbar small { color: var(--muted); }
.active-port-chips { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: .7rem; }
.active-port-chips > span { display: inline-flex; gap: .5rem; align-items: center; padding: .35rem .45rem .35rem .65rem; color: #bdeaff; border: 1px solid rgba(14,165,233,.25); border-radius: 999px; background: rgba(14,165,233,.08); font-size: .68rem; }
.active-port-chips button { width: 20px; height: 20px; padding: 0; color: #8ca0b7; border: 0; border-radius: 50%; background: rgba(255,255,255,.06); cursor: pointer; }
.config-definition-layout { display: grid; grid-template-columns: 250px minmax(0, 1fr); min-height: 460px; border-top: 1px solid var(--border); }
.config-definition-layout > .template-record-list { max-height: 68vh; border: 0; border-right: 1px solid var(--border); border-radius: 0; }
.config-field-editor { min-width: 0; padding: .8rem; }
.config-field-editor > .panel-header { margin-bottom: .7rem; }
.raw-template-editor { margin: 0; }
.empty-state.compact { min-height: 260px; }

/* Game service inventory -------------------------------------------------- */
.services-heading { align-items: center; }
.services-heading-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .55rem; }
.services-heading-actions .btn { display: inline-flex; align-items: center; gap: .45rem; }
.services-summary-pill { display: inline-flex; align-items: baseline; gap: .34rem; padding: .45rem .68rem; color: #9fb3c8; border: 1px solid rgba(56,189,248,.16); border-radius: 999px; background: rgba(8,17,31,.8); font-size: .7rem; }
.services-summary-pill strong { color: #7dd3fc; font-size: .86rem; }
.services-summary-pill.update strong { color: #fbbf24; }
.services-loading { display: flex; align-items: center; gap: .7rem; }

.service-list { overflow: hidden; border: 1px solid rgba(56,189,248,.16); border-radius: 1rem; background: rgba(5,12,23,.86); box-shadow: 0 24px 70px rgba(0,0,0,.24); }
.service-list-header, .service-list-row { display: grid; grid-template-columns: minmax(260px,1.35fr) minmax(165px,.76fr) minmax(220px,1fr) minmax(130px,.62fr) minmax(250px,1.18fr); gap: .9rem; align-items: center; }
.service-list-header { padding: .72rem 1rem; color: #657b91; background: rgba(255,255,255,.018); font-size: .61rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.service-list-row { position: relative; isolation: isolate; min-height: 126px; padding: .9rem 1rem; border-top: 1px solid rgba(148,163,184,.12); transition: border-color .18s ease, background-color .18s ease, box-shadow .18s ease; }
.service-list-row:hover { z-index: 2; border-color: rgba(56,189,248,.27); background: rgba(14,165,233,.035); box-shadow: inset 3px 0 0 rgba(56,189,248,.65); }
.service-list-row.has-active-operation { background: linear-gradient(90deg, rgba(14,165,233,.055), rgba(5,12,23,.2)); }
.service-list-row > :not(.service-list-background) { position: relative; z-index: 1; min-width: 0; }
.service-list-background { position: absolute; z-index: 0; inset: 0 auto 0 0; width: min(38%, 560px); height: 100%; object-fit: cover; object-position: center 35%; opacity: .13; filter: saturate(.78) contrast(1.12); pointer-events: none; -webkit-mask-image: linear-gradient(90deg,#000 0%,rgba(0,0,0,.82) 42%,transparent 100%); mask-image: linear-gradient(90deg,#000 0%,rgba(0,0,0,.82) 42%,transparent 100%); }

.service-list-identity { display: flex; align-items: center; gap: .78rem; min-width: 0; }
.service-list-identity > div { display: grid; gap: .16rem; min-width: 0; }
.service-list-title-line { display: flex; align-items: center; gap: .45rem; min-width: 0; }
.service-list-game-icon { position: relative; flex: 0 0 auto; width: 52px; height: 52px; display: grid; place-items: center; overflow: hidden; color: #7dd3fc; border: 1px solid rgba(56,189,248,.3); border-radius: .82rem; background: linear-gradient(145deg,rgba(14,165,233,.2),rgba(37,99,235,.13)); box-shadow: 0 10px 24px rgba(0,0,0,.28), inset 0 0 22px rgba(56,189,248,.08); }
.service-list-game-icon img { width: 100%; height: 100%; object-fit: cover; }
.service-list-game-icon span { font-size: 1.35rem; }
.service-game-icon.voice { color: #fff; border-color: rgba(216,180,254,.66); background: linear-gradient(145deg,#7c3aed 0%,#db2777 52%,#0ea5e9 100%); box-shadow: 0 10px 26px rgba(168,85,247,.3), inset 0 1px rgba(255,255,255,.24); }
.service-list-game-icon.bot { color: #bbf7d0; border-color: rgba(74,222,128,.4); background: linear-gradient(145deg,rgba(22,163,74,.35),rgba(14,116,144,.28)); }
.service-list-game { overflow: hidden; color: #38bdf8; font-size: .61rem; font-weight: 800; letter-spacing: .09em; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.service-list-name { overflow: hidden; color: #f0f7ff; font-size: .91rem; font-weight: 820; text-overflow: ellipsis; white-space: nowrap; }
.service-number-badge { display: inline-flex; margin-right: .42rem; padding: .08rem .34rem; border: 1px solid rgba(56,189,248,.24); border-radius: .32rem; background: rgba(8,47,73,.42); color: #7dd3fc; font-size: .64rem; font-weight: 800; letter-spacing: .04em; vertical-align: .12rem; }
.service-list-name:hover { color: #7dd3fc; }
.service-list-owner { display: flex; align-items: center; gap: .3rem; overflow: hidden; color: #7f94a8; font-size: .66rem; text-overflow: ellipsis; white-space: nowrap; }
.service-list-owner i { color: #a78bfa; font-style: normal; }
.service-list-owner strong { overflow: hidden; color: #b9cadd; font-weight: 700; text-overflow: ellipsis; }
.service-list-owner small { overflow: hidden; color: #6f8498; font-size: .58rem; text-overflow: ellipsis; }
.service-list-owner small::before { content: "·"; margin-right: .3rem; color: #465d73; }

.service-list-facts { display: grid; gap: .4rem; margin: 0; }
.service-list-facts > div { display: grid; grid-template-columns: minmax(74px,.8fr) minmax(0,1.2fr); gap: .5rem; align-items: baseline; }
.service-list-facts dt { color: #60768b; font-size: .57rem; }
.service-list-facts dd { display: flex; align-items: center; gap: .35rem; margin: 0; overflow: hidden; color: #b8c8d8; font-size: .7rem; text-overflow: ellipsis; white-space: nowrap; }
.service-list-facts code { color: #7dd3fc; background: rgba(14,165,233,.07); }
.node-dot { width: 6px; height: 6px; flex: none; border-radius: 50%; background: #22c55e; box-shadow: 0 0 0 3px rgba(34,197,94,.11); }

.service-list-telemetry { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .38rem; }
.service-list-metric { position: relative; display: grid; gap: .16rem; min-width: 0; padding: .52rem .48rem .46rem; overflow: hidden; border: 1px solid rgba(148,163,184,.13); border-radius: .58rem; background: rgba(3,9,19,.62); }
.service-list-metric::before { content: ""; position: absolute; inset: 0 0 auto; height: 2px; background: #38bdf8; opacity: .75; }
.service-list-metric.ram::before { background: #8b5cf6; }
.service-list-metric.players::before { background: #22c55e; }
.service-list-metric span { color: #6d8399; font-size: .54rem; font-weight: 800; letter-spacing: .08em; }
.service-list-metric strong { overflow: hidden; color: #e5effa; font-size: .72rem; text-overflow: ellipsis; white-space: nowrap; }

.service-list-status { display: flex; flex-direction: column; align-items: flex-start; gap: .35rem; }
.service-list-status .state-badge { align-items: center; gap: .38rem; }
.state-badge.offline-danger { color: #fca5a5; background: rgba(239,68,68,.13); }
.billing-badge { display: inline-flex; align-items: center; padding: .22rem .46rem; border-radius: 999px; font-size: .58rem; font-weight: 750; }
.billing-badge.active { color: #79c7b0; background: rgba(20,184,166,.09); }
.billing-badge.suspended { color: #fdba74; background: rgba(249,115,22,.12); }
.service-update-bubble { display: inline-flex; align-items: center; gap: .4rem; max-width: 100%; padding: .3rem .5rem; color: #fde68a; border: 1px solid rgba(245,158,11,.25); border-radius: 999px; background: rgba(245,158,11,.1); font-size: .61rem; font-weight: 780; white-space: nowrap; }
.service-update-bubble:hover { color: #fff4c4; border-color: rgba(251,191,36,.5); background: rgba(245,158,11,.17); }
.update-pulse { width: 7px; height: 7px; flex: none; border-radius: 50%; background: #fbbf24; box-shadow: 0 0 0 0 rgba(251,191,36,.55); animation: service-update-pulse 1.65s ease-out infinite; }
@keyframes service-update-pulse { 0% { box-shadow: 0 0 0 0 rgba(251,191,36,.55); } 72%,100% { box-shadow: 0 0 0 7px rgba(251,191,36,0); } }

.service-list-control { display: grid; align-content: center; gap: .5rem; min-width: 0; }
.service-row-operation { display: grid; gap: .3rem; min-width: 0; padding: .5rem .58rem; border: 1px solid rgba(56,189,248,.2); border-radius: .58rem; background: rgba(14,165,233,.055); }
.service-row-operation.complete { border-color: rgba(34,197,94,.24); background: rgba(34,197,94,.06); }
.service-row-operation.failed { border-color: rgba(248,113,113,.28); background: rgba(239,68,68,.07); }
.service-row-operation-heading { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: .38rem; min-width: 0; }
.service-row-operation-heading strong { overflow: hidden; color: #dceafb; font-size: .68rem; text-overflow: ellipsis; white-space: nowrap; }
.service-row-operation-heading > span:last-child { color: #7dd3fc; font-size: .61rem; }
.service-row-operation.complete .service-row-operation-heading > span:last-child { color: #6ee7a0; }
.service-row-operation.failed .service-row-operation-heading > span:last-child { color: #fca5a5; }
.operation-state-icon { width: 19px; height: 19px; display: grid; place-items: center; color: #38bdf8; border-radius: 50%; background: rgba(56,189,248,.12); font-size: .65rem; }
.service-row-operation.active .operation-state-icon { animation: operation-spin 1.1s linear infinite; }
.service-row-operation.complete .operation-state-icon { color: #6ee7a0; background: rgba(34,197,94,.12); }
.service-row-operation.failed .operation-state-icon { color: #fca5a5; background: rgba(239,68,68,.12); animation: none; }
@keyframes operation-spin { to { transform: rotate(360deg); } }
.service-row-progress { height: 3px; overflow: hidden; border-radius: 999px; background: rgba(148,163,184,.13); }
.service-row-progress i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg,#0ea5e9,#2563eb); transition: width .25s ease; }
.service-row-operation.complete .service-row-progress i { background: #22c55e; }
.service-row-operation.failed .service-row-progress i { background: #ef4444; }
.service-row-operation small { overflow: hidden; color: #8296aa; font-size: .59rem; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }

.service-row-actions { display: flex; flex-wrap: nowrap; justify-content: flex-end; gap: .35rem; white-space: nowrap; }
.service-row-action { min-width: 32px; height: 32px; display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; gap: .36rem; padding: 0 .5rem; color: #a8bacd; border: 1px solid rgba(148,163,184,.16); border-radius: .55rem; background: rgba(12,23,39,.88); font: inherit; cursor: pointer; transition: color .16s ease,border-color .16s ease,background .16s ease,transform .16s ease,box-shadow .16s ease; }
.service-row-action:hover { transform: translateY(-1px); }
.service-row-action b { font-size: .6rem; font-weight: 760; }
.service-action-glyph { width: 19px; height: 19px; display: inline-grid; place-items: center; flex: none; border-radius: .38rem; font-size: .72rem; font-weight: 900; line-height: 1; }
.service-row-action.manage { color: #7dd3fc; border-color: rgba(56,189,248,.2); }.service-row-action.manage .service-action-glyph { background: rgba(14,165,233,.13); }
.service-row-action.update { color: #c4b5fd; border-color: rgba(139,92,246,.24); }.service-row-action.update .service-action-glyph { background: rgba(139,92,246,.14); }
.service-row-action.start { color: #86efac; border-color: rgba(34,197,94,.24); }.service-row-action.start .service-action-glyph { background: rgba(34,197,94,.13); }
.service-row-action.restart { color: #67e8f9; border-color: rgba(6,182,212,.25); }.service-row-action.restart .service-action-glyph { background: rgba(6,182,212,.13); }
.service-row-action.stop { color: #fdba74; border-color: rgba(249,115,22,.28); }.service-row-action.stop .service-action-glyph { background: rgba(249,115,22,.14); }
.service-row-action:hover { border-color: currentColor; background: rgba(255,255,255,.045); box-shadow: 0 8px 18px rgba(0,0,0,.18); }
.service-action-glyph.create { background: rgba(255,255,255,.12); }

/* Sortable service data grid --------------------------------------------- */
.services-toolbar { position: relative; z-index: 5; display: grid; grid-template-columns: minmax(250px,1.45fr) minmax(180px,.8fr) minmax(170px,.72fr) 120px auto; gap: .7rem; align-items: end; margin-bottom: .8rem; padding: .78rem; border: 1px solid rgba(56,189,248,.16); border-radius: .9rem; background: rgba(5,12,23,.88); box-shadow: 0 18px 45px rgba(0,0,0,.18); }
.services-search-field,.services-filter-field { display: grid; gap: .35rem; min-width: 0; }
.services-search-field > span:first-child,.services-filter-field > span:first-child { color: #6d8399; font-size: .58rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.services-search-control { position: relative; display: block; }
.services-search-control > i { position: absolute; z-index: 1; top: 50%; left: .72rem; color: #38bdf8; font-size: 1rem; font-style: normal; transform: translateY(-52%); pointer-events: none; }
.services-search-control .form-control { height: 42px; padding-left: 2.15rem; }
.services-filter-field .brand-select-trigger { height: 42px; }
.services-filter-field.page-size .brand-select-menu { min-width: 120px; }
.services-toolbar-actions { display: flex; justify-content: flex-end; align-items: center; gap: .45rem; min-width: max-content; }
.services-toolbar-actions .btn { height: 42px; display: inline-flex; align-items: center; gap: .42rem; }
.button-glyph { width: 20px; height: 20px; display: inline-grid; place-items: center; flex: none; border-radius: .38rem; font-size: .72rem; font-style: normal; font-weight: 900; line-height: 1; }
.button-glyph.cyan { color: #a5f3fc; background: rgba(8,145,178,.24); }
.button-glyph.violet { color: #ddd6fe; background: rgba(109,40,217,.24); }
.button-glyph.green { color: #bbf7d0; background: rgba(21,128,61,.24); }

.service-data-scroll { overflow-x: auto; overflow-y: hidden; border: 1px solid rgba(56,189,248,.16); border-radius: 1rem; background: rgba(5,12,23,.88); box-shadow: 0 24px 70px rgba(0,0,0,.24); scrollbar-color: rgba(56,189,248,.46) rgba(8,17,31,.9); scrollbar-width: thin; }
.service-data-scroll::-webkit-scrollbar { height: 10px; }
.service-data-scroll::-webkit-scrollbar-track { background: rgba(8,17,31,.9); }
.service-data-scroll::-webkit-scrollbar-thumb { border: 2px solid rgba(8,17,31,.9); border-radius: 999px; background: linear-gradient(90deg,#0ea5e9,#4f46e5); }
.service-data-grid { min-width: var(--service-grid-min); }
.service-data-header,.service-data-row { display: grid; grid-template-columns: var(--service-columns); gap: .75rem; align-items: center; }
.service-data-header { min-height: 44px; padding: 0 .82rem; color: #657b91; background: rgba(255,255,255,.018); border-bottom: 1px solid rgba(148,163,184,.12); }
.service-data-heading { min-width: 0; font-size: .59rem; font-weight: 800; letter-spacing: .085em; text-transform: uppercase; }
.service-sort-header { width: 100%; min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: .35rem; padding: .35rem 0; color: inherit; border: 0; background: transparent; font: inherit; letter-spacing: inherit; text-align: left; text-transform: inherit; cursor: pointer; }
.service-sort-header span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.service-sort-header i { width: 17px; height: 17px; display: grid; place-items: center; flex: none; color: #52687e; border-radius: .32rem; background: rgba(148,163,184,.06); font-size: .62rem; font-style: normal; transition: color .16s ease,background .16s ease,transform .16s ease; }
.service-sort-header:hover { color: #b9d8ee; }
.service-sort-header:hover i,.service-sort-header.active i { color: #7dd3fc; background: rgba(14,165,233,.13); }
.service-sort-header.active { color: #7dd3fc; }
.service-data-row { position: relative; isolation: isolate; min-height: 98px; padding: .72rem .82rem; border-top: 1px solid rgba(148,163,184,.105); transition: border-color .18s ease,background-color .18s ease,box-shadow .18s ease; }
.service-data-header + .service-data-row { border-top: 0; }
.service-data-row:hover { z-index: 2; border-color: rgba(56,189,248,.27); background: rgba(14,165,233,.035); box-shadow: inset 3px 0 0 rgba(56,189,248,.65); }
.service-data-row { cursor: pointer; }
.service-data-row:focus-visible { z-index: 2; outline: 2px solid rgba(56,189,248,.75); outline-offset: -2px; background: rgba(14,165,233,.05); box-shadow: inset 3px 0 0 #38bdf8; }
.service-data-row.has-active-operation { background: linear-gradient(90deg,rgba(14,165,233,.055),rgba(5,12,23,.2)); }
.service-data-row > :not(.service-list-background) { position: relative; z-index: 1; min-width: 0; }
.service-data-cell { min-width: 0; color: #b8c8d8; font-size: .69rem; }
.service-data-cell.actions { align-self: stretch; display: flex; align-items: center; }
.service-data-cell.actions .service-list-control { width: 100%; }
.service-connection-value { display: inline-block; max-width: 100%; overflow: hidden; padding: .28rem .4rem; color: #7dd3fc; border-radius: .38rem; background: rgba(14,165,233,.075); text-overflow: ellipsis; white-space: nowrap; }
.service-column-value { display: inline-flex; align-items: center; gap: .4rem; min-width: 0; max-width: 100%; overflow: hidden; color: #b8c8d8; text-overflow: ellipsis; white-space: nowrap; }
.service-billing-stack { display: grid; justify-items: start; gap: .3rem; min-width: 0; }
.service-billing-stack small { max-width: 100%; overflow: hidden; color: #8d7fc4; font-size: .57rem; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.service-column-metric { position: relative; display: grid; align-items: center; min-width: 0; min-height: 43px; padding: .46rem .4rem .4rem; overflow: hidden; color: #e5effa; border: 1px solid rgba(148,163,184,.13); border-radius: .58rem; background: rgba(3,9,19,.62); white-space: nowrap; }
.service-column-metric::before { content: ""; position: absolute; inset: 0 0 auto; height: 2px; background: #38bdf8; opacity: .78; }
.service-column-metric.ram::before { background: #8b5cf6; }
.service-column-metric.players::before { background: #22c55e; }
.service-column-metric strong { overflow: hidden; font-size: .7rem; text-overflow: ellipsis; }
.service-name-update { flex: none; min-width: 26px; height: 24px; justify-content: center; padding: .2rem .38rem; }

.service-data-grid.compact .service-data-row { min-height: 54px; padding-top: .4rem; padding-bottom: .4rem; }
.service-data-grid.compact .service-list-game { font-size: .54rem; }
.service-data-grid.compact .service-list-name { font-size: .76rem; }
.service-data-grid.compact .service-list-owner small { display: none; }
.service-data-grid.compact .service-column-metric { min-height: 34px; padding-top: .35rem; padding-bottom: .3rem; }
.service-data-grid.compact .service-row-action { width: 29px; min-width: 29px; height: 29px; padding: 0; }
.service-data-grid.compact .service-row-action b { display: none; }
.service-data-grid.compact .service-row-operation { padding: .35rem .42rem; }
.service-data-grid.compact .service-row-operation small,.service-data-grid.compact .service-row-progress { display: none; }

.service-pagination { display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); align-items: center; gap: .8rem; margin-top: .72rem; padding: .62rem .8rem; color: #73899d; border: 1px solid rgba(56,189,248,.12); border-radius: .78rem; background: rgba(5,12,23,.75); font-size: .65rem; }
.service-pagination > div { display: flex; align-items: center; gap: .3rem; }
.service-pagination > strong { justify-self: end; color: #9db0c3; font-size: .65rem; }
.service-pagination .icon-button,.service-page-number { width: 30px; height: 30px; display: inline-grid; place-items: center; padding: 0; color: #9eb1c4; border: 1px solid rgba(148,163,184,.16); border-radius: .48rem; background: rgba(12,23,39,.88); cursor: pointer; }
.service-pagination button:hover:not(:disabled) { color: #7dd3fc; border-color: rgba(56,189,248,.4); background: rgba(14,165,233,.1); }
.service-pagination button:disabled { opacity: .35; cursor: not-allowed; }
.service-page-number.active { color: #eaf8ff; border-color: rgba(56,189,248,.65); background: linear-gradient(135deg,rgba(14,165,233,.55),rgba(37,99,235,.55)); box-shadow: 0 0 18px rgba(14,165,233,.12); }
.services-filter-empty { margin-top: 0; border: 1px solid rgba(56,189,248,.13); border-radius: 1rem; background: rgba(5,12,23,.78); }

.modal-card.services-view-settings { width: min(720px,100%); }
.services-view-settings-body { display: grid; gap: 1rem; }
.services-view-settings-body > .switch-row { padding: .82rem; border: 1px solid rgba(56,189,248,.14); border-radius: .72rem; background: rgba(14,165,233,.04); }
.services-column-chooser { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .52rem; }
.services-column-chooser .switch-row { min-height: 48px; padding: .55rem .62rem; border: 1px solid rgba(148,163,184,.12); border-radius: .6rem; background: rgba(3,9,19,.45); }

@media (max-width: 1250px) {
    .services-toolbar { grid-template-columns: minmax(240px,1fr) minmax(180px,.72fr) minmax(170px,.68fr) 110px; }
    .services-toolbar-actions { grid-column: 1 / -1; }
}

@media (max-width: 820px) {
    .services-toolbar { grid-template-columns: 1fr 1fr; }
    .services-search-field,.services-toolbar-actions { grid-column: 1 / -1; }
    .services-toolbar-actions { justify-content: flex-start; }
    .service-pagination { grid-template-columns: 1fr auto; }
    .service-pagination > div { grid-column: 1 / -1; grid-row: 2; justify-content: center; }
    .services-column-chooser { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
    .services-toolbar { grid-template-columns: 1fr; }
    .services-search-field,.services-toolbar-actions { grid-column: auto; }
    .services-toolbar-actions { align-items: stretch; flex-direction: column; }
    .services-toolbar-actions .btn { justify-content: center; }
    .service-pagination { grid-template-columns: 1fr; text-align: center; }
    .service-pagination > strong { justify-self: center; }
}

@media (max-width: 1250px) {
    .service-list-header { display: none; }
    .service-list-row { grid-template-columns: minmax(270px,1.1fr) minmax(190px,.8fr) minmax(230px,1fr); }
    .service-list-status { align-items: flex-end; }
    .service-list-control { grid-column: 1 / -1; grid-template-columns: minmax(280px,1fr) auto; align-items: center; padding-top: .6rem; border-top: 1px solid rgba(148,163,184,.1); }
}

@media (max-width: 820px) {
    .services-heading { align-items: stretch; }
    .services-heading-actions { justify-content: flex-start; }
    .service-list-row { grid-template-columns: 1fr 1fr; }
    .service-list-identity { grid-column: 1 / -1; }
    .service-list-status { align-items: flex-start; }
    .service-list-control { grid-template-columns: 1fr; }
    .service-row-actions { justify-content: flex-start; }
}

@media (max-width: 560px) {
    .service-list-row { grid-template-columns: 1fr; }
    .service-list-identity, .service-list-control { grid-column: auto; }
    .service-list-background { width: 100%; opacity: .08; -webkit-mask-image: linear-gradient(180deg,#000,transparent); mask-image: linear-gradient(180deg,#000,transparent); }
    .service-list-telemetry { grid-template-columns: repeat(3,minmax(70px,1fr)); }
    .service-row-action b { display: none; }
}

@media (max-width: 1100px) {
    .backup-usage-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .backup-format-card { grid-column: 1 / -1; }
    .core-usage-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .permission-group > div { grid-template-columns: 1fr; }
    .permission-row:nth-child(even) { border-left: 0; }
}

@media (max-width: 760px) {
    .modal-backdrop { padding: .5rem; place-items: start center; }
    .modal-card { max-height: calc(100vh - 1rem); }
    .upload-drop-zone { min-height: 170px; }
    .upload-file-meta { align-items: flex-start; flex-direction: column; gap: .15rem; }
    .upload-file-message { text-align: left; }
    .file-browser-shell, .role-management-layout, .template-editor-shell, .template-record-layout { grid-template-columns: 1fr; }
    .file-clipboard-bar { align-items: flex-start; flex-wrap: wrap; }
    .file-clipboard-bar strong { max-width: calc(100vw - 6.5rem); }
    .file-clipboard-actions { width: 100%; margin-left: 2.68rem; }
    .config-definition-layout, .port-editor-toolbar { grid-template-columns: 1fr; }
    .file-tree-panel { max-height: 260px; border-right: 0; border-bottom: 1px solid var(--border); }
    .telemetry-chart-grid, .process-detail-strip, .node-live-grid, .dynamic-config-grid, .template-field-grid, .pz-config-fields { grid-template-columns: 1fr; }
    .pz-config-field.wide { grid-column: auto; }
    .pz-config-summary { align-items: flex-start; flex-direction: column; }
    .seven-days-config-toolbar,.seven-days-admin-add,.seven-days-permission-add,.seven-days-admin-list article,.seven-days-permission-list article,.template-commandline-row { grid-template-columns: 1fr; }
    .live-runtime-grid { grid-template-columns: 1fr; }
    .role-sidebar, .template-manage-menu { position: static; }
    .core-usage-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .node-meta-row { flex-direction: column; }
    .sandbox-code-import, .sandbox-toolbar, .ark-identifier-add { grid-template-columns: 1fr; }
    .minecraft-operator-list > div { grid-template-columns: minmax(0,1fr) auto; }
    .minecraft-operator-list .operator-level { grid-column: 1; }
    .sandbox-option-grid { grid-template-columns: 1fr; }
    .schedule-action-picker, .backup-scope-picker { grid-template-columns: 1fr; }
    .backup-usage-grid { grid-template-columns: 1fr; }
    .backup-format-card { grid-column: auto; }
}
/* MariaDB Manager and per-node SFTP foundation */
.database-settings-layout { align-items: start; }
.database-location-list { display: grid; gap: .65rem; margin: 1rem 0; }
.database-location-row {
    width: 100%; display: grid; grid-template-columns: 2.4rem minmax(0, 1fr) auto; align-items: center;
    gap: .8rem; padding: .8rem; color: var(--text); text-align: left; border: 1px solid var(--line);
    border-radius: 12px; background: rgba(5, 13, 26, .66); transition: border-color .18s ease, background .18s ease, transform .18s ease;
}
.database-location-row:hover, .database-location-row.active { border-color: rgba(0, 183, 255, .65); background: rgba(9, 39, 66, .78); transform: translateY(-1px); }
.database-location-row > span:nth-child(2) { min-width: 0; display: grid; gap: .15rem; }
.database-location-row small { color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.database-location-icon { display: grid; place-items: center; width: 2.4rem; height: 2.4rem; border-radius: 10px; color: #61dbff; background: rgba(0, 183, 255, .13); }
.database-limit-card { margin-top: 1.1rem; }
.database-settings-actions { display: flex; align-items: center; flex-wrap: wrap; gap: .65rem; }
.database-test-result { display: grid; gap: .22rem; margin-top: 1rem; padding: .9rem; border: 1px solid var(--line); border-radius: 12px; }
.database-test-result.success { border-color: rgba(45, 220, 142, .35); background: rgba(12, 86, 58, .15); }
.database-test-result.failure { border-color: rgba(255, 93, 116, .4); background: rgba(106, 20, 35, .18); }
.database-test-result span, .database-test-result small { color: var(--muted); }
.notice.notice-error { border-color: rgba(255, 93, 116, .48); background: rgba(104, 21, 37, .24); color: #ffbdc7; }

.panel-title-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.panel-title-row > div { min-width: 0; }
.table-scroll { max-width: 100%; overflow-x: auto; scrollbar-gutter: stable; }
.mysql-manager-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 320px); gap: 1rem; align-items: start; }
.mysql-database-list-panel { min-width: 0; }
.mysql-create-panel { position: sticky; top: 5.5rem; display: grid; gap: 1rem; }
.database-summary-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; margin-bottom: 1.1rem; }
.database-summary-grid article { display: grid; gap: .2rem; padding: .85rem; border: 1px solid var(--line); border-radius: 12px; background: rgba(5, 14, 27, .65); }
.database-summary-grid span { color: var(--muted); font-size: .75rem; text-transform: uppercase; letter-spacing: .08em; }
.database-summary-grid strong { color: #6ddcff; font-size: 1.35rem; }
.mysql-database-table { min-width: 880px; table-layout: fixed; }
.mysql-database-table th:nth-child(1) { width: 21%; }
.mysql-database-table th:nth-child(2) { width: 15%; }
.mysql-database-table th:nth-child(3) { width: 18%; }
.mysql-database-table th:nth-child(4) { width: 20%; }
.mysql-database-table th:nth-child(5) { width: 10%; }
.mysql-database-table th:nth-child(6) { width: 190px; text-align: right; }
.mysql-database-table td { overflow: hidden; }
.mysql-database-table td code { display: inline-block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle; }
.mysql-database-table td small { display: block; margin-top: .2rem; color: var(--muted); }
.database-row-actions { display: flex; flex-wrap: nowrap; justify-content: flex-end; gap: .45rem; }
.database-icon-button {
    width: 42px; height: 42px; flex: 0 0 42px; display: grid; place-items: center; padding: 0;
    color: var(--text); border: 1px solid var(--line); border-radius: 11px; background: rgba(9, 19, 34, .88);
    cursor: pointer; text-decoration: none; transition: border-color .18s ease, background .18s ease, transform .18s ease, box-shadow .18s ease;
}
.database-icon-button:hover:not(:disabled) { border-color: rgba(42, 192, 255, .58); background: rgba(14, 40, 65, .95); transform: translateY(-1px); box-shadow: 0 8px 20px rgba(0, 0, 0, .2); }
.database-icon-button.danger .action-icon { color: #fb7185; background: rgba(244,63,94,.13); }
.database-icon-button.danger:hover:not(:disabled) { border-color: rgba(255, 93, 116, .62); background: rgba(104, 21, 37, .3); }
.database-icon-button:focus-visible { outline: 2px solid rgba(42, 192, 255, .78); outline-offset: 2px; }
.database-icon-button:disabled { opacity: .45; cursor: not-allowed; }
.database-icon-button .action-icon { width: 30px; height: 30px; border-radius: 8px; font-size: 1rem; }
.database-name-composer { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; border: 1px solid var(--line); border-radius: 10px; background: rgba(5, 12, 24, .78); overflow: hidden; }
.database-name-composer > span { padding: 0 .7rem; color: #60d5ff; font-family: var(--font-mono, monospace); }
.database-name-composer .form-control { border: 0; border-left: 1px solid var(--line); border-radius: 0; }
.create-database-button { width: 100%; justify-content: center; }
.database-credential-reveal { margin-bottom: 1rem; border-color: rgba(51, 215, 149, .42); }
.database-credential-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; }
.database-credential-secret { color: #86ffc7 !important; font-family: var(--font-mono, monospace); }
.node-sftp-panel { margin-top: 1rem; }
.node-infrastructure-panel { margin-top: 1rem; }
.node-settings-tab { margin-top: 0; }
.node-infrastructure-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; margin: 1rem 0; }
.node-infrastructure-grid.single-column { grid-template-columns: 1fr; }
.node-infrastructure-card { min-width: 0; padding: 1rem; border: 1px solid rgba(56,189,248,.18); border-radius: .8rem; background: linear-gradient(145deg,rgba(8,19,34,.88),rgba(5,13,26,.74)); }
.node-infrastructure-card h3 { margin: .2rem 0 .85rem; }
.node-infrastructure-card > .field-group, .node-infrastructure-card > .switch-row, .node-infrastructure-card > .notice { margin-top: .8rem; }
.node-secret-card { margin-top: 1rem; padding: .9rem; border: 1px solid rgba(139,92,246,.24); border-radius: .72rem; background: rgba(7,13,27,.68); }
.node-secret-card h4 { margin: .15rem 0 .65rem; }
.node-secret-card .detail-list { margin: .7rem 0; }
.node-secret-card .detail-list > div { gap: .8rem; }
.node-secret-card .configuration-actions { justify-content: flex-start; flex-wrap: wrap; margin-top: .7rem; }
.legacy-secret-import { margin-top: .9rem; padding-top: .9rem; border-top: 1px solid rgba(148,163,184,.16); }
.legacy-secret-import .field-group { margin: .55rem 0 .7rem; }
.node-gateway-grid { grid-template-columns: minmax(0,1fr) minmax(120px,.35fr); margin-top: .8rem; }
.node-nat-grid { grid-template-columns: minmax(0,1.3fr) minmax(110px,.45fr) minmax(0,1fr) minmax(0,.75fr); margin-top: .8rem; }
.nat-lifecycle-contract { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .45rem; margin-top: .85rem; }
.nat-lifecycle-contract span { display: flex; align-items: center; justify-content: space-between; gap: .6rem; min-width: 0; padding: .55rem .65rem; color: var(--muted); border: 1px solid rgba(148,163,184,.14); border-radius: .55rem; background: rgba(2,8,18,.45); font-size: .7rem; }
.nat-lifecycle-contract strong { color: #7dd3fc; text-align: right; }
.sftp-settings-grid { margin-top: 1rem; }
.sftp-runtime-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .65rem; margin: 1rem 0; }
.sftp-runtime-grid article { display: grid; gap: .28rem; min-width: 0; padding: .78rem .85rem; border: 1px solid var(--line); border-radius: 11px; background: rgba(4, 13, 26, .66); }
.sftp-runtime-grid span { color: var(--muted); font-size: .68rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.sftp-runtime-grid strong { overflow-wrap: anywhere; }
.sftp-runtime-actions { flex-wrap: wrap; }
.sftp-service-grid { display: grid; grid-template-columns: minmax(300px, .75fr) minmax(500px, 1.25fr); gap: 1rem; }
.sftp-endpoint-card, .sftp-account-card { min-width: 0; }
.sftp-credential-grid { display: grid; grid-template-columns: minmax(180px, .7fr) minmax(260px, 1.3fr); gap: .8rem; margin: 1rem 0; }
.sftp-credential-grid .mono { font-family: var(--font-mono, monospace); }
.sftp-password-field { color: #86ffc7; }
.sftp-account-actions { display: flex; align-items: center; flex-wrap: wrap; gap: .65rem; margin-top: 1rem; }
.sftp-account-switch { flex: 1 1 280px; min-width: 260px; margin: 0; }
.sftp-empty-account { min-height: 250px; }
.sftp-account-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: .25rem 0 1rem; }
.sftp-access-overview { margin-top: 1rem; }
.sftp-access-list { display: grid; gap: .55rem; margin-top: 1rem; }
.sftp-access-row { display: grid; grid-template-columns: minmax(220px, 1.25fr) minmax(145px, .8fr) minmax(180px, .9fr) auto; align-items: center; gap: .8rem; padding: .72rem .8rem; border: 1px solid rgba(98, 127, 158, .2); border-radius: 11px; background: rgba(4, 13, 26, .58); }
.sftp-access-row > code { overflow: hidden; color: #78dfff; text-overflow: ellipsis; white-space: nowrap; }
.sftp-access-person { display: flex; align-items: center; gap: .65rem; min-width: 0; }
.sftp-access-person > div { display: grid; min-width: 0; gap: .12rem; }
.sftp-access-person strong, .sftp-access-person small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sftp-access-person small { color: var(--muted); }
.sftp-provision-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: .8rem; width: 100%; margin: .8rem 0; text-align: left; }
.sftp-reuse-note, .sftp-shared-note { width: 100%; margin: .8rem 0; text-align: left; border-color: rgba(35, 193, 255, .34); background: rgba(4, 45, 71, .38); }
.sftp-client-help { margin-top: 1rem; }
.sftp-client-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; margin-top: 1rem; }
.sftp-client-grid article { display: grid; grid-template-columns: 2.5rem minmax(0, 1fr); gap: .75rem; align-items: start; padding: .85rem; border: 1px solid var(--line); border-radius: 12px; background: rgba(4, 13, 26, .58); }
.sftp-client-grid article > span { display: grid; place-items: center; width: 2.35rem; height: 2.35rem; border: 1px solid rgba(52, 211, 153, .38); border-radius: 10px; color: #6ee7b7; background: rgba(6, 78, 59, .28); font-weight: 800; }
.sftp-client-grid article > div { display: grid; gap: .28rem; }
.sftp-client-grid small { color: var(--muted); line-height: 1.45; }
.sftp-help-footer { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: .85rem; padding: .85rem 1rem; border: 1px solid rgba(56, 189, 248, .22); border-radius: 12px; background: rgba(3, 31, 51, .38); }
.sftp-help-footer > div { display: grid; gap: .28rem; min-width: 0; }
.sftp-help-footer small { color: var(--muted); line-height: 1.45; }
.sftp-help-footer .btn { flex: none; }

/* Security center */
.security-heading .actions { justify-content: flex-end; }
.security-status-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .85rem; margin-bottom: 1rem; }
.security-status-grid article { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: .75rem; min-width: 0; padding: .9rem 1rem; border: 1px solid var(--line); border-radius: 13px; background: rgba(6, 17, 33, .82); }
.security-status-grid article > div { display: grid; gap: .18rem; min-width: 0; }
.security-status-grid small { color: var(--muted); line-height: 1.38; }
.security-settings-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.security-settings-grid.single-column { grid-template-columns: 1fr; }
.security-policy-card { min-width: 0; }
.security-policy-card .panel-title-row { margin-bottom: 1rem; }
.security-policy-card .panel-title-row p { max-width: 620px; margin: .22rem 0 0; color: var(--muted); }
.security-switch-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem; margin-top: .8rem; }
.security-switch-list .switch-row { min-height: 3.3rem; margin: 0; border: 1px solid rgba(98, 127, 158, .18); border-radius: 10px; background: rgba(4, 13, 26, .48); }
.security-number-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: .85rem; }
.security-network-list { min-height: 9rem; resize: vertical; font-family: var(--font-mono, monospace); }
.security-ban-panel, .security-roadmap-note { margin-top: 1rem; }
.security-ban-panel.section-tab-panel { margin-top: 0; }
.security-public-readiness { margin-top: 1rem; }
.security-ban-create { display: grid; grid-template-columns: minmax(170px, .7fr) minmax(260px, 1.35fr) minmax(180px, .7fr) auto; align-items: end; gap: .75rem; margin: 1rem 0; }
.security-ban-create .btn { min-height: 46px; }
.security-ban-list { display: grid; gap: .55rem; }
.security-ban-list article { display: grid; grid-template-columns: minmax(150px, .65fr) minmax(260px, 1.5fr) auto auto; align-items: center; gap: .8rem; padding: .75rem .8rem; border: 1px solid rgba(98, 127, 158, .2); border-radius: 11px; background: rgba(4, 13, 26, .58); }
.security-ban-list code { color: #78dfff; }
.security-ban-list article > div { display: grid; gap: .14rem; }
.security-ban-list small { color: var(--muted); }
.security-boundary-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; margin-top: .9rem; }
.security-boundary-grid > div { display: flex; align-items: flex-start; gap: .7rem; padding: .85rem; border: 1px solid rgba(98, 127, 158, .18); border-radius: 11px; background: rgba(4, 13, 26, .48); }
.security-boundary-grid > div > div { display: grid; gap: .2rem; }
.security-boundary-grid small { color: var(--muted); line-height: 1.45; }
.maintenance-shell { display: grid; place-items: center; min-height: 100vh; padding: 1.5rem; }
.maintenance-card { display: grid; justify-items: center; width: min(100%, 560px); text-align: center; }
.maintenance-card .login-brand { justify-self: stretch; text-align: left; }
.maintenance-card .notice { width: 100%; text-align: left; }
.maintenance-icon { display: grid; place-items: center; width: 4.5rem; height: 4.5rem; margin: 1rem 0 .25rem; border: 1px solid rgba(56, 189, 248, .35); border-radius: 22px; color: #67e8f9; background: rgba(3, 105, 161, .2); box-shadow: 0 0 36px rgba(14, 165, 233, .16); font-size: 2rem; }

/* Per-service customer maintenance is a real access boundary, not a process state. */
.service-customer-maintenance {
    display: grid;
    justify-items: center;
    width: min(100%, 780px);
    margin: 1.25rem auto 0;
    padding: clamp(1.5rem, 4vw, 3rem);
    text-align: center;
    border: 1px solid rgba(245, 158, 11, .42);
    border-radius: 22px;
    background: radial-gradient(circle at 50% 0, rgba(245, 158, 11, .13), transparent 55%), rgba(8, 17, 31, .94);
    box-shadow: 0 26px 80px rgba(0, 0, 0, .28), inset 0 1px rgba(255, 255, 255, .025);
}
.service-customer-maintenance h1 { margin: .35rem 0 .65rem; font-size: clamp(1.7rem, 4vw, 2.55rem); }
.service-customer-maintenance > p { max-width: 640px; margin: 0; color: var(--muted); font-size: 1.03rem; line-height: 1.65; }
.service-customer-maintenance > small { max-width: 620px; margin-top: 1rem; color: rgba(159, 179, 204, .78); }
.service-maintenance-symbol { display: grid; place-items: center; width: 4.2rem; height: 4.2rem; margin-bottom: .8rem; color: #ffd166; border: 1px solid rgba(245, 158, 11, .42); border-radius: 18px; background: rgba(146, 82, 5, .26); box-shadow: 0 0 34px rgba(245, 158, 11, .14); font-size: 1.8rem; }
.service-maintenance-symbol.small { flex: 0 0 auto; width: 2.55rem; height: 2.55rem; margin: 0; border-radius: 11px; font-size: 1.05rem; }
.service-maintenance-ticket { display: inline-flex; align-items: center; gap: .65rem; margin-top: 1.15rem; padding: .65rem .85rem; border: 1px solid rgba(56, 189, 248, .25); border-radius: 11px; background: rgba(5, 28, 48, .75); }
.service-maintenance-ticket span { color: var(--muted); font-size: .78rem; text-transform: uppercase; letter-spacing: .07em; }
.service-maintenance-ticket strong { color: #a5e8ff; overflow-wrap: anywhere; }
.service-maintenance-ticket.compact { margin: 0 0 0 auto; padding: .45rem .65rem; }
.service-maintenance-client-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: .65rem; margin-top: 1.35rem; }
.service-maintenance-admin-banner { display: flex; align-items: center; gap: .8rem; margin: .85rem 0; padding: .8rem .9rem; border: 1px solid rgba(245, 158, 11, .36); border-radius: 14px; background: linear-gradient(90deg, rgba(120, 69, 5, .22), rgba(10, 22, 38, .9)); }
.service-maintenance-admin-banner > div { display: grid; min-width: 0; gap: .15rem; }
.service-maintenance-admin-banner > div small { color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.service-maintenance-settings { border-color: rgba(56, 189, 248, .2); transition: border-color .2s ease, box-shadow .2s ease; }
.service-maintenance-settings.enabled { border-color: rgba(245, 158, 11, .38); box-shadow: inset 3px 0 rgba(245, 158, 11, .68); }
.service-maintenance-switch { margin: .85rem 0 1rem; }
.service-maintenance-form { grid-template-columns: minmax(0, 1.7fr) minmax(250px, .8fr); }
.service-maintenance-message { grid-row: span 2; }
.service-maintenance-message textarea { min-height: 7rem; resize: vertical; }
.service-maintenance-metadata { display: flex; flex-wrap: wrap; gap: .5rem 1rem; margin-top: .85rem; color: var(--muted); font-size: .82rem; }
@media (max-width: 760px) {
    .service-maintenance-admin-banner { align-items: flex-start; flex-wrap: wrap; }
    .service-maintenance-admin-banner > div { flex: 1 1 calc(100% - 3.5rem); }
    .service-maintenance-admin-banner > div small { white-space: normal; }
    .service-maintenance-ticket.compact { margin-left: 0; }
    .service-maintenance-form { grid-template-columns: 1fr; }
}

@media (max-width: 1180px) {
    .mysql-manager-grid { grid-template-columns: 1fr; }
    .mysql-create-panel { position: static; }
    .database-credential-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sftp-runtime-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .sftp-service-grid { grid-template-columns: 1fr; }
    .security-status-grid { grid-template-columns: 1fr; }
    .security-ban-create { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
    .database-summary-grid, .database-credential-grid { grid-template-columns: 1fr; }
    .database-location-row { grid-template-columns: 2.4rem minmax(0, 1fr); }
    .database-location-row .state-badge { grid-column: 2; justify-self: start; }
    .sftp-runtime-grid, .sftp-client-grid, .sftp-credential-grid, .sftp-account-summary { grid-template-columns: 1fr; }
    .sftp-help-footer { align-items: stretch; flex-direction: column; }
    .sftp-help-footer .btn { justify-content: center; width: 100%; }
    .security-settings-grid, .security-switch-list, .security-number-grid, .security-boundary-grid, .security-ban-create { grid-template-columns: 1fr; }
    .security-ban-list article { grid-template-columns: 1fr auto; }
    .security-ban-list article > div { grid-column: 1 / -1; grid-row: 2; }
    .security-ban-list .state-badge { justify-self: start; }
    .sftp-access-row { grid-template-columns: 1fr; align-items: start; }
    .sftp-access-row .state-badge { justify-self: start; }
    .sftp-account-actions > .btn { width: 100%; justify-content: center; }
}

@media (max-width: 1050px) {
    .node-infrastructure-grid { grid-template-columns: 1fr; }
    .node-nat-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 620px) {
    .node-gateway-grid, .node-nat-grid, .nat-lifecycle-contract { grid-template-columns: 1fr; }
}
/* Delegated customer accounts and service-scoped permissions */
.subusers-layout{display:grid;grid-template-columns:minmax(260px,.72fr) minmax(0,2fr);gap:18px;align-items:start}
.subusers-list-panel,.subuser-detail-panel{min-width:0}
.subuser-account-list{display:grid;gap:8px;margin-top:16px}
.subuser-account-row{width:100%;display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:12px;padding:11px 12px;border:1px solid var(--line);border-radius:12px;background:rgba(4,12,25,.7);color:var(--text);text-align:left;transition:border-color .18s ease,background .18s ease,transform .18s ease}
.subuser-account-row:hover,.subuser-account-row.active{border-color:rgba(32,190,255,.68);background:rgba(8,42,69,.8);transform:translateY(-1px)}
.subuser-account-row>span:nth-child(2){display:grid;min-width:0}.subuser-account-row strong,.subuser-account-row small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.subuser-account-row small{color:var(--muted)}
.subuser-avatar{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:linear-gradient(145deg,#0c86d4,#4b62ef);font-weight:800;box-shadow:0 0 20px rgba(38,165,255,.2)}
.subuser-detail-heading{align-items:flex-start}.subuser-detail-heading p{margin:.2rem 0 0;color:var(--muted)}
.subuser-account-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.subuser-account-actions .switch-row{min-width:170px}
.subuser-safety-note{margin:16px 0}
.subuser-service-permissions{display:grid;gap:14px}
.subuser-service-card{border:1px solid var(--line);border-radius:14px;background:rgba(5,13,26,.72);overflow:hidden;transition:border-color .2s ease,box-shadow .2s ease}
.subuser-service-card.enabled{border-color:rgba(23,187,246,.42);box-shadow:inset 3px 0 0 rgba(24,181,238,.9)}
.subuser-service-card>header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px 17px;border-bottom:1px solid rgba(113,139,168,.16)}
.subuser-service-card h3{margin:.2rem 0 0}.subuser-service-card>footer{display:flex;justify-content:flex-end;padding:13px 17px;border-top:1px solid rgba(113,139,168,.14)}
.subuser-service-identity{display:grid;min-width:0;gap:2px}.subuser-service-identity h3,.subuser-service-identity small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.subuser-service-identity small{color:var(--muted)}
.subuser-service-header-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap;min-width:0}.subuser-permission-toggle{display:inline-flex;align-items:center;gap:7px;min-height:38px;padding:6px 10px;color:#c6d8e9;border:1px solid rgba(139,92,246,.25);border-radius:9px;background:rgba(76,29,149,.12);font:inherit;font-size:.72rem;font-weight:800;cursor:pointer;transition:border-color .18s ease,background .18s ease,transform .18s ease}.subuser-permission-toggle:hover:not(:disabled),.subuser-permission-toggle.active{border-color:rgba(167,139,250,.65);background:rgba(109,40,217,.22);transform:translateY(-1px)}.subuser-permission-toggle:disabled{opacity:.45;cursor:wait}
.subuser-permission-group{padding:16px 17px}.subuser-permission-group+.subuser-permission-group{border-top:1px solid rgba(113,139,168,.12)}
.subuser-permission-grid,.subuser-permission-grid.actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:9px;margin-top:10px}
.subuser-sftp-permission-row{display:grid;grid-template-columns:minmax(280px,1.2fr) minmax(240px,.8fr);align-items:end;gap:12px;margin-top:10px}.subuser-sftp-permission-row>.field-group{margin:0}.sftp-permission-profile{background:linear-gradient(90deg,rgba(7,56,82,.22),transparent)}
.permission-check{display:flex;min-width:0;gap:10px;align-items:flex-start;padding:11px;border:1px solid rgba(107,136,169,.2);border-radius:10px;background:rgba(10,23,41,.68);cursor:pointer;transition:border-color .17s ease,background .17s ease}.permission-check:hover{border-color:rgba(33,182,239,.5);background:rgba(9,42,66,.72)}.permission-check.sensitive{border-color:rgba(160,120,255,.25)}.permission-check.disabled{opacity:.43;cursor:not-allowed}.permission-check input{margin-top:3px;accent-color:#19b9f4}.permission-check span{display:grid;min-width:0;gap:3px}.permission-check strong,.permission-check small{overflow-wrap:anywhere;word-break:break-word}.permission-check small{color:var(--muted);line-height:1.35}
.subuser-modal{width:min(760px,calc(100vw - 32px))}.subuser-modal form,.confirmation-modal form{display:grid;gap:18px}.subuser-modal footer,.confirmation-modal form footer{display:flex;justify-content:flex-end;gap:10px}
.sftp-permission-editor{display:grid;grid-template-columns:minmax(260px,1fr) auto;align-items:end;gap:12px;margin:14px 0}.sftp-access-mode-field{width:min(100%,480px)}
@media(max-width:1050px){.subusers-layout{grid-template-columns:1fr}}
@media(max-width:720px){.subuser-permission-grid,.subuser-permission-grid.actions,.subuser-sftp-permission-row{grid-template-columns:1fr}.subuser-service-card>header,.subuser-detail-heading{align-items:stretch;flex-direction:column}.subuser-service-header-actions{justify-content:flex-start}.subuser-account-actions{justify-content:flex-start}.sftp-permission-editor{grid-template-columns:1fr}}

.notification-bell{position:relative;display:grid;place-items:center;width:42px;height:42px;border:1px solid var(--line);border-radius:10px;background:rgba(13,31,50,.75);text-decoration:none;font-size:1.05rem}.notification-bell strong{position:absolute;right:-6px;top:-7px;min-width:20px;height:20px;padding:0 5px;display:grid;place-items:center;border-radius:999px;background:#ef4444;color:white;font-size:.65rem;box-shadow:0 0 0 3px #07101d}.mandatory-notification-stack{position:fixed;z-index:1200;right:24px;top:78px;width:min(520px,calc(100vw - 32px));display:grid;gap:10px}.mandatory-notification{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:18px;border:1px solid rgba(56,189,248,.45);border-left:5px solid #38bdf8;border-radius:12px;background:rgba(5,18,31,.98);box-shadow:0 20px 55px rgba(0,0,0,.45)}.mandatory-notification.warning{border-left-color:#f59e0b}.mandatory-notification.critical{border-left-color:#ef4444}.mandatory-notification div{display:grid;gap:5px}.mandatory-notification span{color:#79d8ff;font-size:.67rem;font-weight:900;letter-spacing:.13em}.mandatory-notification strong{font-size:1rem}.mandatory-notification p{margin:0;color:#c6d5e4;white-space:pre-wrap}.notification-list{display:grid;gap:14px}.notification-card{padding:20px;border:1px solid var(--line);border-left:4px solid #38bdf8;border-radius:12px;background:rgba(10,24,40,.72)}.notification-card.unread{box-shadow:0 0 0 1px rgba(56,189,248,.15),0 12px 32px rgba(0,0,0,.18)}.notification-card.warning{border-left-color:#f59e0b}.notification-card.critical{border-left-color:#ef4444}.notification-card.success{border-left-color:#10b981}.notification-card header{display:flex;justify-content:space-between;color:#8195aa;font-size:.72rem;font-weight:800;text-transform:uppercase}.notification-card h2{margin:8px 0;font-size:1.1rem}.notification-card p{white-space:pre-wrap;color:#c5d4e2}.broadcast-editor{display:grid;gap:22px}.choice-row{display:flex;flex-wrap:wrap;gap:12px 24px}.choice-row label,.filter-columns label{display:flex;align-items:center;gap:8px}.filter-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.filter-columns fieldset{display:grid;align-content:start;gap:8px;max-height:280px;overflow:auto;padding:16px;border:1px solid var(--line);border-radius:10px}.filter-columns legend{padding:0 7px;font-weight:800}.audience-preview{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:14px;border:1px solid rgba(56,189,248,.3);border-radius:10px;background:rgba(14,69,98,.2)}.audience-preview small{width:100%;color:#8da4ba}.login-help-link{display:block;margin-top:14px;text-align:center;color:#63c8ff}.authenticator-qr svg{max-width:100%;height:auto}
@media(max-width:720px){.filter-columns{grid-template-columns:1fr}.mandatory-notification{flex-direction:column}.mandatory-notification-stack{right:16px;top:70px}}
.backup-run-list{display:grid;gap:10px}.backup-run-row{display:grid;grid-template-columns:minmax(220px,1.2fr) minmax(160px,2fr) 60px auto auto;align-items:center;gap:14px;padding:14px;border:1px solid var(--line);border-radius:10px;background:rgba(8,20,35,.55)}.backup-run-row>div:first-child{display:grid}.backup-run-row small{color:#8da4ba}.backup-run-row p{grid-column:1/-1;margin:0}.backup-progress{height:8px;overflow:hidden;border-radius:99px;background:#17283c}.backup-progress span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#16a5e9,#3b82f6)}@media(max-width:900px){.backup-run-row{grid-template-columns:1fr auto}.backup-progress{grid-column:1/-1;grid-row:2}.backup-run-row p{grid-column:1/-1}}
.notification-settings{display:grid;gap:22px}.notification-rule-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.notification-rule{display:flex;align-items:flex-start;gap:10px;padding:14px;border:1px solid var(--line);border-radius:10px;background:rgba(8,22,38,.5)}.notification-rule span{display:grid;gap:3px}.notification-rule small{color:#849cb2}@media(max-width:720px){.notification-rule-grid{grid-template-columns:1fr}}
@media(max-width:720px){.service-kind-cards{grid-template-columns:1fr}.service-kind-card{min-height:82px}}
.runtime-policy-editor{display:grid;gap:1rem}
.runtime-policy-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem}
.runtime-policy-grid>.field-group{margin:0}
.runtime-links-heading{display:flex;align-items:end;justify-content:space-between;gap:1rem;padding-top:.25rem;border-top:1px solid rgba(98,127,158,.16)}
.runtime-links-heading h3{margin:.2rem 0}
.runtime-links-heading small{color:var(--muted)}
.runtime-link-list{display:grid;gap:.65rem}
.runtime-link-row{display:grid;grid-template-columns:minmax(180px,.9fr) minmax(260px,1.5fr) minmax(150px,.55fr) minmax(165px,.65fr) 42px;align-items:end;gap:.65rem;padding:.75rem;border:1px solid rgba(56,189,248,.14);border-radius:.75rem;background:rgba(3,10,20,.46)}
.runtime-link-row .field-group{margin:0}
.runtime-create-target{min-height:46px;padding:.38rem .2rem}
.runtime-link-row>.template-rule-remove{width:42px;height:42px;align-self:end}
.runtime-policy-editor>.notice{margin:0}
.runtime-policy-editor>.notice p{margin:.35rem 0 0}
.runtime-policy-editor code{color:#7dd3fc}
.template-path-rules{display:grid;gap:1rem;margin-top:1rem;padding-top:1rem;border-top:1px solid rgba(98,127,158,.16)}
.template-path-rule-list{display:grid;gap:.7rem}
.template-path-rule-row{display:grid;grid-template-columns:minmax(250px,1.25fr) minmax(190px,.7fr) minmax(210px,.85fr) minmax(210px,.85fr) minmax(165px,.55fr) 42px;align-items:end;gap:.65rem;padding:.8rem;border:1px solid rgba(139,92,246,.22);border-radius:.8rem;background:linear-gradient(135deg,rgba(45,23,88,.18),rgba(3,10,20,.52))}
.template-path-rule-row .field-group{margin:0}.template-path-rule-row>.template-rule-remove{width:42px;height:42px;align-self:end}.template-path-rule-row .switch-row{min-height:46px}
@media(max-width:1450px){.template-path-rule-row{grid-template-columns:repeat(2,minmax(0,1fr))}.template-path-rule-row>.template-rule-remove{justify-self:end}}
@media(max-width:720px){.template-path-rule-row{grid-template-columns:1fr}.template-path-rule-row>.template-rule-remove{justify-self:start}}
@media(max-width:1180px){.runtime-link-row{grid-template-columns:repeat(2,minmax(0,1fr))}.runtime-link-row>.template-rule-remove{justify-self:end}.runtime-create-target{align-self:end}}
@media(max-width:720px){.runtime-policy-grid,.runtime-link-row{grid-template-columns:1fr}.runtime-links-heading{align-items:stretch;flex-direction:column}.runtime-links-heading .btn{align-self:flex-start}.runtime-link-row>.template-rule-remove{justify-self:start}}
.node-enrollment-panel {
    display: grid;
    gap: 1rem;
}

.node-enrollment-callout {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid rgba(27, 184, 255, .34);
    border-radius: 14px;
    background: rgba(7, 38, 58, .58);
}

.node-enrollment-callout > div {
    display: grid;
    gap: .3rem;
}

.node-enrollment-callout span {
    color: var(--muted);
}

.node-enrollment-history table {
    min-width: 760px;
}

@media (max-width: 900px) {
    .node-enrollment-callout {
        align-items: stretch;
        flex-direction: column;
    }
}

/* Account security */
.account-manage-shell { display: grid; gap: 1rem; }
.account-manage-heading { margin-bottom: .25rem; }
.account-manage-grid { display: grid; grid-template-columns: minmax(190px,.28fr) minmax(0,1.72fr); gap: 1rem; align-items: start; }
.account-manage-navigation { position: sticky; top: 90px; padding: .65rem; border: 1px solid var(--border); border-radius: .85rem; background: rgba(8,14,26,.94); box-shadow: var(--shadow); }
.account-manage-navigation .nav { gap: .2rem; }
.account-manage-navigation .nav-link { min-height: 40px; font-size: .77rem; }
.account-manage-content { min-width: 0; }
.account-security-card {
    width: min(100%, 1040px);
    display: grid;
    gap: 1.1rem;
    padding: clamp(1.1rem, 2.5vw, 1.75rem);
    border: 1px solid rgba(56,189,248,.28);
    border-radius: 1rem;
    background: linear-gradient(145deg,rgba(12,25,43,.96),rgba(6,14,27,.96));
    box-shadow: var(--shadow), inset 0 1px 0 rgba(255,255,255,.025);
}
.account-security-heading { display: flex; align-items: flex-start; gap: 1rem; padding-bottom: 1rem; border-bottom: 1px solid var(--border); }
.account-security-heading > div:last-child { min-width: 0; display: grid; gap: .28rem; }
.account-security-heading h3,.account-security-heading p { margin: 0; }
.account-security-heading h3 { font-size: clamp(1.25rem,2vw,1.7rem); }
.account-security-heading p { color: var(--muted); line-height: 1.5; }
.account-security-mark { width: 3.15rem; height: 3.15rem; flex: 0 0 3.15rem; display: grid; place-items: center; border: 1px solid rgba(56,189,248,.42); border-radius: .9rem; color: #dff7ff; background: linear-gradient(145deg,rgba(14,165,233,.34),rgba(37,99,235,.28)); box-shadow: 0 0 24px rgba(14,165,233,.16); font-size: .76rem; font-weight: 950; letter-spacing: .06em; }
.account-security-mark.recovery { color: #e9ddff; border-color: rgba(167,139,250,.4); background: linear-gradient(145deg,rgba(124,58,237,.3),rgba(76,29,149,.24)); font-size: 1.35rem; }
.account-security-mark.danger { color: #ffe4e6; border-color: rgba(251,113,133,.42); background: linear-gradient(145deg,rgba(225,29,72,.3),rgba(127,29,29,.24)); font-size: 1.25rem; }
.authenticator-enrollment-grid { display: grid; grid-template-columns: minmax(0,1.15fr) minmax(300px,.85fr); gap: 1rem; align-items: stretch; }
.account-security-steps { display: grid; align-content: start; gap: .7rem; }
.account-security-step { display: grid; grid-template-columns: 2rem minmax(0,1fr); gap: .8rem; padding: .9rem; border: 1px solid rgba(98,127,158,.18); border-radius: .8rem; background: rgba(3,10,20,.42); }
.account-security-step-number { width: 2rem; height: 2rem; display: grid; place-items: center; border-radius: 50%; color: #07111e; background: #38bdf8; box-shadow: 0 0 16px rgba(56,189,248,.22); font-size: .75rem; font-weight: 950; }
.account-security-step h4,.account-security-step p { margin: 0; }
.account-security-step h4 { font-size: .9rem; }
.account-security-step p { margin-top: .28rem; color: var(--muted); font-size: .78rem; line-height: 1.5; }
.authenticator-store-links,.account-security-actions { display: flex; align-items: center; flex-wrap: wrap; gap: .6rem; }
.authenticator-store-links { margin-top: .65rem; }
.authenticator-manual-key { margin-top: .65rem; padding: .65rem .7rem; border: 1px dashed rgba(56,189,248,.28); border-radius: .65rem; background: rgba(14,165,233,.05); }
.authenticator-manual-key summary { color: #7dd3fc; cursor: pointer; font-size: .76rem; font-weight: 800; }
.authenticator-manual-key code { display: block; margin-top: .55rem; overflow-wrap: anywhere; letter-spacing: .08em; }
.authenticator-verification-card { display: grid; align-content: center; gap: .8rem; padding: 1rem; border: 1px solid rgba(56,189,248,.24); border-radius: .9rem; background: linear-gradient(155deg,rgba(3,12,24,.8),rgba(8,24,42,.72)); }
.authenticator-verification-card .authenticator-qr { margin: 0 auto; box-shadow: 0 16px 44px rgba(0,0,0,.28); }
.account-security-form { display: grid; gap: .7rem; }
.account-security-form .field-group { margin: 0; }
.two-factor-code-input,.recovery-code-input { font-family: Consolas,"Cascadia Code",monospace; font-size: 1.1rem; font-weight: 800; letter-spacing: .14em; text-align: center; }
.account-security-required,.account-security-warning { display: grid; gap: .25rem; margin: 0; }
.account-security-required { color: #c8edff; border-color: rgba(56,189,248,.35); background: rgba(14,165,233,.09); }
.account-security-warning { color: #fde8b4; border-color: rgba(245,158,11,.34); background: rgba(245,158,11,.08); }
.account-security-summary { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .75rem; }
.account-security-summary article { display: grid; gap: .3rem; padding: .9rem 1rem; border: 1px solid var(--border); border-radius: .8rem; background: rgba(3,10,20,.42); }
.account-security-summary span { color: var(--muted); font-size: .68rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.security-state-enabled { color: #6ee7a0; }.security-state-disabled { color: #fda4af; }
.account-security-action-grid { display: grid; gap: .75rem; }
.account-security-action-grid > article { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem; border: 1px solid var(--border); border-radius: .8rem; background: rgba(3,10,20,.42); }
.account-security-action-grid h4,.account-security-action-grid p { margin: 0; }
.account-security-action-grid h4 { margin-top: .18rem; }.account-security-action-grid p { margin-top: .25rem; color: var(--muted); font-size: .78rem; }
.account-security-action-grid .account-security-actions { justify-content: flex-end; }
.account-security-action-grid form { margin: 0; }
.recovery-code-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .55rem; }
.recovery-code-grid .recovery-code { display: block; padding: .7rem .8rem; color: #bae6fd; border: 1px solid rgba(56,189,248,.2); border-radius: .55rem; background: rgba(2,8,18,.62); font-size: .88rem; letter-spacing: .07em; text-align: center; }
.two-factor-login-card { width: min(100%,480px); }
.two-factor-login-card .login-brand { margin-bottom: 1.3rem; }
.two-factor-login-card .account-security-mark { margin-bottom: .8rem; }
.two-factor-login-card .account-security-form { margin-top: .45rem; }
.account-security-alternative { display: grid; gap: .2rem; margin-top: 1rem; padding-top: 1rem; border-top: 1px solid rgba(148,163,184,.18); color: #9fb1c5; font-size: .78rem; text-align: center; }
.account-security-alternative a { font-weight: 800; }

@media (max-width: 820px) {
    .account-manage-grid { grid-template-columns: 1fr; }
    .account-manage-navigation { position: static; }
    .account-manage-navigation .nav { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
    .authenticator-enrollment-grid { grid-template-columns: 1fr; }
    .authenticator-verification-card { justify-items: stretch; }
    .account-security-action-grid > article { align-items: stretch; flex-direction: column; }
    .account-security-action-grid .account-security-actions { justify-content: flex-start; }
}
@media (max-width: 620px) {
    .account-manage-navigation .nav { grid-template-columns: 1fr; }
    .account-security-heading { align-items: center; }
    .account-security-summary,.recovery-code-grid { grid-template-columns: 1fr; }
}

/* Coherent light theme: blue-grey canvas, tinted surfaces, and readable game artwork. */
html[data-theme="light"] body {
    background-color: var(--bg);
    background-image:
        radial-gradient(circle at 50% 0,rgba(14,165,233,.13),transparent 42rem),
        linear-gradient(90deg,rgba(30,64,100,.045) 1px,transparent 1px),
        linear-gradient(rgba(30,64,100,.035) 1px,transparent 1px);
    background-size: auto,64px 64px,64px 64px;
}
html[data-theme="light"] .sidebar { background: rgba(211,226,237,.98); border-right-color: rgba(30,64,95,.25); scrollbar-color: rgba(2,132,199,.5) rgba(199,218,232,.88); }
html[data-theme="light"] .sidebar::-webkit-scrollbar-track { background: rgba(199,218,232,.88); }
html[data-theme="light"] .sidebar::-webkit-scrollbar-thumb { border-color: rgba(199,218,232,.88); }
html[data-theme="light"] .app-header { background: rgba(224,235,243,.94); border-bottom-color: rgba(30,64,95,.22); box-shadow: 0 8px 28px rgba(31,68,99,.08); }
html[data-theme="light"] .brand-block { background: rgba(224,235,243,.62); }
html[data-theme="light"] .nav-section { color: #60778b; }
html[data-theme="light"] .nav-link { color: #36516a; }
html[data-theme="light"] .nav-link:hover { color: #09233c; background: rgba(2,132,199,.09); }
html[data-theme="light"] .nav-link.active { color: #064f75; background: linear-gradient(90deg,rgba(14,165,233,.2),rgba(37,99,235,.05)); }
html[data-theme="light"] .language-selector,html[data-theme="light"] .notification-bell { background: rgba(237,244,248,.86); }
html[data-theme="light"] .language-option:hover { background: rgba(2,132,199,.08); }
html[data-theme="light"] .profile-menu-panel,html[data-theme="light"] .brand-select-menu { color: var(--text); background: linear-gradient(155deg,#edf4f8,#dce9f2); border-color: rgba(2,132,199,.32); box-shadow: 0 22px 60px rgba(31,78,121,.2); }
html[data-theme="light"] .brand-select-option { color: #304c65; }
html[data-theme="light"] .brand-select-option small { color: #647b90; }
html[data-theme="light"] .brand-select-option:hover:not(:disabled),html[data-theme="light"] .brand-select-option:focus-visible,html[data-theme="light"] .brand-select-option.selected { color: #0b2e49; background: rgba(14,165,233,.11); }

html[data-theme="light"] :where(.metric-card,.panel,.node-card,.template-card,.table-shell,.service-kind-card,.service-list,.ticket-message,.modal-card,.account-security-card) {
    color: var(--text);
    background: linear-gradient(145deg,rgba(237,244,248,.98),rgba(225,236,244,.98));
    border-color: rgba(30,64,95,.22);
    box-shadow: var(--shadow);
}
html[data-theme="light"] .account-manage-navigation { background: rgba(226,237,244,.96); border-color: rgba(30,64,95,.22); }
html[data-theme="light"] :where(.form-control,.styled-select,select.form-control,.brand-select-trigger) { color: var(--text); color-scheme: light; background-color: #f3f7fa; border-color: rgba(30,64,95,.24); }
html[data-theme="light"] :where(.styled-select,select.form-control) { background-image: linear-gradient(45deg,transparent 50%,#0369a1 50%),linear-gradient(135deg,#0369a1 50%,transparent 50%); }
html[data-theme="light"] :where(.styled-select option,select.form-control option) { color: var(--text); background: #edf4f8; }
html[data-theme="light"] .form-control:disabled { color: #50677c; background: #cfdee9; border-color: rgba(30,64,95,.2); -webkit-text-fill-color: #50677c; }
html[data-theme="light"] .field-group label { color: #38546d; }
html[data-theme="light"] .btn-secondary { color: #17344e; background: #d8e6ef; border-color: rgba(30,64,95,.23); }
html[data-theme="light"] .btn-secondary:hover { color: #064f75; background: #cbdde9; border-color: rgba(2,132,199,.42); }
html[data-theme="light"] code { color: #075985; background: rgba(2,132,199,.1); }
html[data-theme="light"] .notice,html[data-theme="light"] .loading-panel { color: #124b6b; background: rgba(186,230,253,.5); border-color: rgba(2,132,199,.28); }
html[data-theme="light"] .notice.notice-error,html[data-theme="light"] .notice-error { color: #8f2133; background: rgba(254,226,226,.72); border-color: rgba(190,24,93,.28); }
html[data-theme="light"] .account-security-warning { color: #7a4a07; background: rgba(254,243,199,.74); border-color: rgba(180,83,9,.26); }
html[data-theme="light"] .account-security-required { color: #0b4c6b; background: rgba(186,230,253,.64); border-color: rgba(2,132,199,.3); }

html[data-theme="light"] .data-table th { color: #536b80; background: rgba(30,64,95,.04); }
html[data-theme="light"] .data-table td { color: #314c64; }
html[data-theme="light"] .data-table td > small { color: #60778b; }
html[data-theme="light"] :where(.check-list label,.role-list>div,.connection-facts>div,.query-neutral,.query-summary-grid article,.account-security-step,.account-security-summary article,.account-security-action-grid>article) { background: rgba(214,229,239,.58); }
html[data-theme="light"] .switch-row > input[type="checkbox"] { background: #b9cbd8; border-color: rgba(30,64,95,.32); box-shadow: inset 0 1px 4px rgba(31,68,99,.16); }
html[data-theme="light"] .progress-track { background: #becfdb; }

html[data-theme="light"] .service-skin.has-game-background::before {
    background-image:
        linear-gradient(90deg,rgba(220,232,241,.97) 0%,rgba(220,232,241,.91) 48%,rgba(220,232,241,.82) 100%),
        linear-gradient(180deg,rgba(220,232,241,.34),rgba(220,232,241,.88)),
        var(--service-background-image);
    opacity: 1;
    filter: saturate(.72) brightness(1.06);
}
html[data-theme="light"] .service-breadcrumbs { color: #536b80; }
html[data-theme="light"] .service-titlebar { background: linear-gradient(90deg,rgba(14,165,233,.2),rgba(37,99,235,.07)); }
html[data-theme="light"] .service-titlebar small { color: #075985; }
html[data-theme="light"] .service-titlebar .service-title-runtime { color: #536b80; }
html[data-theme="light"] .service-navigation { background: rgba(226,237,244,.96); border-color: rgba(30,64,95,.22); }
html[data-theme="light"] .service-nav-link { color: #38546d; }
html[data-theme="light"] .service-nav-link:hover { color: #0b2e49; background: rgba(2,132,199,.08); }
html[data-theme="light"] .service-nav-link.active { color: #064f75; background: linear-gradient(90deg,rgba(14,165,233,.2),rgba(37,99,235,.05)); box-shadow: 0 8px 22px rgba(31,68,99,.09); }
html[data-theme="light"] .connection-card h2 { color: #075985; }
html[data-theme="light"] .windrose-invite-card { border-color: rgba(2,132,199,.5); background: linear-gradient(135deg,rgba(186,230,253,.78),rgba(204,251,241,.6)); }
html[data-theme="light"] .windrose-invite-code { color: #075985; }
html[data-theme="light"] :where(.connection-facts dt,.query-summary-grid span,.query-server-name span) { color: #507067; }
html[data-theme="light"] .query-neutral { color: #38546d; }
html[data-theme="light"] .overview-console-output,html[data-theme="light"] .live-log-output,html[data-theme="light"] .console-panel { color: #d1f1ff; background: #01040a; border-color: rgba(30,64,95,.35); }
html[data-theme="light"] .overview-console-output .console-line { color: #75e69a; }

html[data-theme="light"] .service-kind-picker > h2,html[data-theme="light"] .settings-section > h2 { color: #29475f; }
html[data-theme="light"] .section-card-tab { color: #10283d; border-color: rgba(30,64,95,.2); background: linear-gradient(145deg,rgba(247,251,254,.96),rgba(224,236,244,.92)); box-shadow: inset 0 1px rgba(255,255,255,.8),0 8px 20px rgba(42,70,92,.08); }
html[data-theme="light"] .section-card-tab:hover { border-color: rgba(2,132,199,.38); background: linear-gradient(145deg,#f8fcff,#dcecf6); }
html[data-theme="light"] .section-card-tab.active { color: #071b2d; border-color: rgba(2,132,199,.55); background: linear-gradient(135deg,rgba(186,230,253,.88),rgba(219,234,254,.82)); box-shadow: inset 3px 0 #0284c7,0 10px 24px rgba(14,116,144,.12); }
html[data-theme="light"] .section-card-tab-copy small { color: #49677e; }
html[data-theme="light"] .section-card-tab-state { color: #0369a1; filter: none; }
html[data-theme="light"] .service-kind-card:hover { background: #d7e7f1; }
html[data-theme="light"] .service-kind-card.active { background: linear-gradient(135deg,rgba(14,165,233,.18),rgba(37,99,235,.08)); }
html[data-theme="light"] .service-create-start-switch,html[data-theme="light"] .bulk-create-box { background: rgba(186,230,253,.35); }
html[data-theme="light"] .service-list-header { color: #536b80; background: rgba(30,64,95,.045); }
html[data-theme="light"] .service-list-row { border-top-color: rgba(30,64,95,.14); }
html[data-theme="light"] .service-list-row:hover { background: rgba(14,165,233,.06); }
html[data-theme="light"] .service-list-row.has-active-operation { background: linear-gradient(90deg,rgba(14,165,233,.09),rgba(220,232,241,.25)); }
html[data-theme="light"] .service-list-name,html[data-theme="light"] .service-list-metric strong { color: #102a42; }
html[data-theme="light"] .service-list-owner,html[data-theme="light"] .service-list-owner small,html[data-theme="light"] .service-list-facts dt,html[data-theme="light"] .service-list-metric span { color: #60788e; }
html[data-theme="light"] .service-list-owner strong,html[data-theme="light"] .service-list-facts dd { color: #375269; }
html[data-theme="light"] .service-list-metric { background: rgba(200,218,230,.72); border-color: rgba(30,64,95,.18); }

html[data-theme="light"] :where(.ticket-message,.workshop-browser,.node-infrastructure-card,.node-secret-card,.template-advanced-settings,.runtime-link-row,.template-path-rule-row,.notification-card,.backup-run-row,.notification-rule,.subuser-account-row,.subuser-service-card,.database-location-row,.database-summary-grid article,.database-name-composer,.sftp-runtime-grid article,.sftp-access-row,.sftp-client-grid article,.security-status-grid article,.security-switch-list .switch-row,.security-ban-list article,.security-boundary-grid>div,.teamspeak-security-grid>div,.teamspeak-channel) {
    color: var(--text);
    background: rgba(226,237,244,.86);
    border-color: rgba(30,64,95,.2);
}
html[data-theme="light"] .ticket-message.internal { background: rgba(233,224,255,.56); }
html[data-theme="light"] .ticket-message > div { color: #2d485f; }
html[data-theme="light"] .ticket-message header,html[data-theme="light"] .workshop-toolbar { background: rgba(30,64,95,.04); }
html[data-theme="light"] .workshop-kind-switch { background: rgba(205,222,234,.86); }
html[data-theme="light"] .workshop-kind-switch button { color: #536b80; }
html[data-theme="light"] .workshop-kind-switch button:hover:not(:disabled) { color: #0b2e49; background: rgba(14,165,233,.1); }
html[data-theme="light"] .workshop-kind-switch button.active { color: #064f75; }
html[data-theme="light"] .workshop-catalog-stats strong,html[data-theme="light"] .workshop-stat-link:hover { color: #17344e; }
html[data-theme="light"] .schedule-action-picker > button { color: #38546d; background: rgba(220,232,241,.8); }
html[data-theme="light"] .schedule-action-picker > button:hover,html[data-theme="light"] .schedule-action-picker > button.selected { color: #0b2e49; }
html[data-theme="light"] .schedule-days label { background: rgba(220,232,241,.82); }
html[data-theme="light"] .mandatory-notification { color: #eaf8ff; background: rgba(5,18,31,.98); }

/* Login and reset flows intentionally remain a dark security surface in either theme. */
html[data-theme="light"] .login-shell .login-card { color: #f8fafc; background: linear-gradient(145deg,rgba(8,14,26,.94),rgba(4,10,20,.88)); border-color: rgba(56,189,248,.3); }
html[data-theme="light"] .login-shell .muted,html[data-theme="light"] .login-shell .account-security-alternative { color: #9aa8bc; }
html[data-theme="light"] .login-shell .field-group label { color: #adc0b9; }
html[data-theme="light"] .login-shell .form-control { color: #f8fafc; background: #08111f; border-color: rgba(148,163,184,.22); }
html[data-theme="light"] .login-shell .btn-secondary { color: #f8fafc; background: #101827; border-color: rgba(148,163,184,.2); }
html[data-theme="light"] .login-shell .btn-secondary:hover { color: #effbff; background: #142238; }
html[data-theme="light"] .authenticator-verification-card { background: linear-gradient(155deg,rgba(203,220,232,.84),rgba(216,231,240,.88)); }
html[data-theme="light"] .authenticator-manual-key summary { color: #075985; }
html[data-theme="light"] .recovery-code-grid .recovery-code { color: #075985; background: rgba(207,224,235,.84); }
.teamspeak-security-grid,.teamspeak-live-facts{display:flex;gap:1rem;flex-wrap:wrap}.teamspeak-security-grid>div{display:grid;gap:.25rem;min-width:220px;padding:.8rem 1rem;border:1px solid var(--border);border-radius:10px;background:rgba(7,17,31,.55)}.teamspeak-security-grid span{color:var(--muted);font-size:.78rem}.teamspeak-reset-zone{display:grid;gap:.85rem;margin-top:1.15rem;padding-top:1.1rem;border-top:1px solid rgba(248,113,113,.18)}.teamspeak-reset-copy{display:grid;gap:.32rem}.teamspeak-reset-copy p,.teamspeak-reset-copy small{margin:0}.teamspeak-reset-copy p{color:#cbd5e1;line-height:1.5}.teamspeak-reset-copy small{color:var(--muted)}.teamspeak-reset-confirmation{display:grid;gap:.42rem;margin:0}.teamspeak-reset-confirmation>span{font-size:.74rem;font-weight:750}.teamspeak-reset-actions{display:flex;align-items:center;flex-wrap:wrap;gap:.75rem;margin-top:.1rem}.teamspeak-reset-actions small{color:#fbbf24}.teamspeak-live-facts{justify-content:flex-end;color:var(--muted)}.teamspeak-browser{display:grid;gap:.45rem}.teamspeak-channel{margin-left:calc(var(--channel-depth) * 1.25rem);border:1px solid var(--border);border-radius:10px;background:rgba(5,14,27,.58);overflow:hidden}.teamspeak-channel-heading{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.65rem;padding:.65rem .8rem}.teamspeak-channel-heading>div{display:grid}.teamspeak-channel-heading small{color:var(--muted)}.teamspeak-channel-icon{color:var(--cyan)}.teamspeak-client-list{display:grid;gap:.25rem;padding:.2rem .8rem .65rem 2.5rem}.teamspeak-client-list>div{display:flex;align-items:center;gap:.5rem}.teamspeak-client-list small{color:var(--muted)}.teamspeak-client-state{width:.48rem;height:.48rem;border-radius:50%;background:#36db8b;box-shadow:0 0 8px rgba(54,219,139,.65)}.teamspeak-client-state.away{background:#f2b84b;box-shadow:0 0 8px rgba(242,184,75,.55)}

/* Notification cleanup confirmation. */
.notification-clear-confirmation { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; padding: .9rem 1rem; border: 1px solid rgba(248,113,113,.28); border-radius: .8rem; background: rgba(127,29,29,.12); }
.notification-clear-confirmation > div:first-child { display: grid; gap: .22rem; }
.notification-clear-confirmation small { color: var(--muted); }
.notification-clear-confirmation .button-row { flex: none; margin: 0; }

/* Light inventory and settings surfaces: no dark islands on the light canvas. */
html[data-theme="light"] :where(.form-section-card,.template-api-credential,.api-clear-switch,.services-toolbar,.service-data-scroll,.service-pagination,.services-filter-empty) {
    color: #102a42;
    border-color: rgba(30,64,95,.22);
    background: linear-gradient(145deg,rgba(232,240,246,.98),rgba(215,229,238,.98));
    box-shadow: 0 16px 42px rgba(31,68,99,.11);
}
html[data-theme="light"] .api-clear-switch { background: rgba(202,220,232,.72); box-shadow: none; }
html[data-theme="light"] .api-secret-card header { border-bottom-color: rgba(30,64,95,.2); }
html[data-theme="light"] .api-secret-card header small { color: #587086; }
html[data-theme="light"] .services-summary-pill { color: #38546d; border-color: rgba(30,64,95,.2); background: rgba(221,233,241,.9); }
html[data-theme="light"] .services-summary-pill strong { color: #0369a1; }
html[data-theme="light"] .services-search-field > span:first-child,html[data-theme="light"] .services-filter-field > span:first-child { color: #506b82; }
html[data-theme="light"] .service-data-scroll { scrollbar-color: rgba(2,132,199,.5) rgba(200,218,230,.85); }
html[data-theme="light"] .service-data-scroll::-webkit-scrollbar-track { background: rgba(200,218,230,.85); }
html[data-theme="light"] .service-data-scroll::-webkit-scrollbar-thumb { border-color: rgba(200,218,230,.85); }
html[data-theme="light"] .service-data-header { color: #526b80; background: rgba(30,64,95,.055); border-bottom-color: rgba(30,64,95,.17); }
html[data-theme="light"] .service-sort-header:hover,html[data-theme="light"] .service-sort-header.active { color: #075985; }
html[data-theme="light"] .service-sort-header i { color: #526b80; background: rgba(30,64,95,.07); }
html[data-theme="light"] .service-data-row { border-top-color: rgba(30,64,95,.14); }
html[data-theme="light"] .service-data-row:hover,html[data-theme="light"] .service-data-row:focus-visible { background: rgba(14,165,233,.08); }
html[data-theme="light"] .service-data-row.has-active-operation { background: linear-gradient(90deg,rgba(14,165,233,.1),rgba(220,232,241,.32)); }
html[data-theme="light"] .service-data-cell,html[data-theme="light"] .service-column-value { color: #304c65; }
html[data-theme="light"] .service-connection-value { color: #075985; background: rgba(2,132,199,.1); }
html[data-theme="light"] .service-column-metric { color: #102a42; border-color: rgba(30,64,95,.18); background: rgba(198,216,228,.82); }
html[data-theme="light"] .service-row-operation { background: rgba(196,224,240,.66); }
html[data-theme="light"] .service-row-operation-heading strong { color: #17344e; }
html[data-theme="light"] .service-row-operation small { color: #536b80; }
html[data-theme="light"] .service-row-action { background: rgba(237,244,248,.92); box-shadow: 0 5px 14px rgba(31,68,99,.08); }
html[data-theme="light"] .service-row-action.manage { color: #0369a1; }
html[data-theme="light"] .service-row-action.update { color: #6d28d9; }
html[data-theme="light"] .service-row-action.start { color: #15803d; }
html[data-theme="light"] .service-row-action.restart { color: #0e7490; }
html[data-theme="light"] .service-row-action.stop { color: #c2410c; }
html[data-theme="light"] .service-row-action:hover { background: #f5f9fb; box-shadow: 0 8px 18px rgba(31,68,99,.13); }
html[data-theme="light"] .service-pagination { color: #506b82; }
html[data-theme="light"] .service-pagination > strong { color: #38546d; }
html[data-theme="light"] .service-pagination .icon-button,html[data-theme="light"] .service-page-number { color: #38546d; border-color: rgba(30,64,95,.2); background: rgba(232,240,246,.92); }
html[data-theme="light"] .services-column-chooser .switch-row { background: rgba(207,224,235,.74); }
html[data-theme="light"] .notification-clear-confirmation { color: #6f1d2d; background: rgba(254,226,226,.72); }

html[data-theme="light"] .network-packet-field { --packet-tail: rgba(2,132,199,.14); --packet-mid: rgba(3,105,161,.72); --packet-head: rgba(7,89,133,.96); --packet-glow: rgba(2,132,199,.34); }
body:has(.service-skin.has-game-background) {
    background-image: radial-gradient(circle at 88% -10%,rgba(14,165,233,.11),transparent 34rem);
    background-size: auto;
}
body:has(.service-skin.has-game-background) .network-packet-field { display: none; }
html[data-theme="light"] body:has(.service-skin.has-game-background) {
    background-image: radial-gradient(circle at 50% 0,rgba(14,165,233,.13),transparent 42rem);
}

@media (max-width: 700px) {
    .notification-clear-confirmation { align-items: stretch; flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) {
    .network-packet-field { display: none; }
}

/* Shared operational warnings and modern scrollbars. */
.warning-box { display: grid; gap: .22rem; padding: .85rem 1rem; margin: .8rem 0; color: #fde68a; border: 1px solid rgba(245,158,11,.3); border-radius: .7rem; background: rgba(245,158,11,.08); }
.warning-box :where(p,small) { margin: 0; color: #d8c99d; }
:where(.code-editor,.console-output,.live-log-output,.overview-console-output,.steam-live-output,.log-stream pre,.dynamic-config-grid,.pz-config-fields,.editor-modal-message,.modal-card) { scrollbar-width: thin; scrollbar-color: rgba(56,189,248,.58) rgba(3,9,18,.72); }
:where(.code-editor,.console-output,.live-log-output,.overview-console-output,.steam-live-output,.log-stream pre,.dynamic-config-grid,.pz-config-fields,.editor-modal-message,.modal-card)::-webkit-scrollbar { width: 10px; height: 10px; }
:where(.code-editor,.console-output,.live-log-output,.overview-console-output,.steam-live-output,.log-stream pre,.dynamic-config-grid,.pz-config-fields,.editor-modal-message,.modal-card)::-webkit-scrollbar-track { background: rgba(3,9,18,.72); }
:where(.code-editor,.console-output,.live-log-output,.overview-console-output,.steam-live-output,.log-stream pre,.dynamic-config-grid,.pz-config-fields,.editor-modal-message,.modal-card)::-webkit-scrollbar-thumb { border: 2px solid rgba(3,9,18,.72); border-radius: 999px; background: linear-gradient(#0ea5e9,#2563eb); }
:where(.code-editor,.console-output,.live-log-output,.overview-console-output,.steam-live-output,.log-stream pre,.dynamic-config-grid,.pz-config-fields,.editor-modal-message,.modal-card)::-webkit-scrollbar-thumb:hover { background: #38bdf8; }

/* Light operational surfaces: readable consoles, editors, warnings and status badges. */
html[data-theme="light"] :where(.code-editor,.console-panel,.console-output,.live-log-output,.overview-console-output,.steam-live-output,.log-stream pre) { color: #15344c; border-color: rgba(30,64,95,.25); background: #e8f1f6; box-shadow: inset 0 1px rgba(255,255,255,.72); }
html[data-theme="light"] .code-editor { caret-color: #0369a1; }
html[data-theme="light"] .code-editor::selection { color: #082f49; background: rgba(56,189,248,.32); }
html[data-theme="light"] :where(.code-editor,.console-output,.live-log-output,.overview-console-output,.steam-live-output,.log-stream pre,.dynamic-config-grid,.pz-config-fields,.editor-modal-message,.modal-card) { scrollbar-color: rgba(2,132,199,.66) rgba(199,218,232,.9); }
html[data-theme="light"] :where(.code-editor,.console-output,.live-log-output,.overview-console-output,.steam-live-output,.log-stream pre,.dynamic-config-grid,.pz-config-fields,.editor-modal-message,.modal-card)::-webkit-scrollbar-track { background: rgba(199,218,232,.9); }
html[data-theme="light"] :where(.code-editor,.console-output,.live-log-output,.overview-console-output,.steam-live-output,.log-stream pre,.dynamic-config-grid,.pz-config-fields,.editor-modal-message,.modal-card)::-webkit-scrollbar-thumb { border-color: rgba(199,218,232,.9); background: linear-gradient(#0284c7,#2563eb); }
html[data-theme="light"] .editor-modal-actions { color: #17344e; background: #e3edf4; border-top-color: rgba(30,64,95,.2); }
html[data-theme="light"] .console-input { color: #17344e; border-top-color: rgba(30,64,95,.24); background: #d8e6ef; }
html[data-theme="light"] .console-input input { color: #102a42; }
html[data-theme="light"] .console-input input::placeholder { color: #60778b; }
html[data-theme="light"] .console-input button { color: #fff; border-left-color: rgba(30,64,95,.22); background: #0369a1; }
html[data-theme="light"] .console-input button:disabled { color: #61778a; background: #c4d5e0; }
html[data-theme="light"] .console-muted,html[data-theme="light"] .console-entry small { color: #61788c; }
html[data-theme="light"] .console-entry code { color: #075985; }
html[data-theme="light"] .console-entry pre { color: #1e3a52; }
html[data-theme="light"] :where(.overview-console-output,.steam-live-output) .console-line { color: #166534; }
html[data-theme="light"] :where(.overview-console-output,.steam-live-output) .console-line.warning { color: #92400e; }
html[data-theme="light"] :where(.overview-console-output,.steam-live-output) .console-line.error { color: #b91c1c; }
html[data-theme="light"] .steam-console-activity { color: #075985; border-top-color: rgba(2,132,199,.24); background: rgba(211,228,238,.97); box-shadow: 0 -8px 18px rgba(31,68,99,.12); }
html[data-theme="light"] :where(.commandline-executable .form-control,.commandline-fixed-summary,.commandline-variable-card) { color: #17344e; border-color: rgba(30,64,95,.22); background: rgba(215,229,238,.82); }
html[data-theme="light"] .commandline-managed-runtime { color: #17344e; border-color: rgba(2,132,199,.28); background: linear-gradient(135deg,rgba(186,230,253,.72),rgba(219,234,254,.62)); }
html[data-theme="light"] .commandline-variable-heading code { color: #075985; }

html[data-theme="light"] .state-badge { color: #334155; border: 1px solid rgba(51,65,85,.17); background: rgba(203,213,225,.74); }
html[data-theme="light"] .state-badge.online { color: #126136; border-color: rgba(21,128,61,.25); background: #ccebd9; }
html[data-theme="light"] .state-badge.pending { color: #7c4308; border-color: rgba(180,83,9,.28); background: #f8dfad; }
html[data-theme="light"] :where(.state-badge.error,.state-badge.offline-danger) { color: #991b1b; border-color: rgba(185,28,28,.26); background: #f5c9cc; }
html[data-theme="light"] .state-badge.complete { color: #075985; border-color: rgba(2,132,199,.25); background: #c9e7f5; }
html[data-theme="light"] .service-nav-link .service-nav-badge { color: #422006; border: 1px solid #ca8a04; background: #facc15; box-shadow: 0 0 0 3px rgba(202,138,4,.16); }
html[data-theme="light"] :where(.service-update-bubble,.mod-update-badge,.workshop-stat-link.has-update) { color: #713f12; border-color: rgba(180,83,9,.45); background: #f8dda4; }
html[data-theme="light"] :where(.service-update-bubble,.workshop-stat-link.has-update):hover { color: #5b2d0a; border-color: #b45309; background: #f4ca72; }
html[data-theme="light"] .workshop-catalog-stats .has-update strong { color: #713f12; }
html[data-theme="light"] :where(.service-update-bubble,.mod-update-badge,.workshop-stat-link.has-update) .update-pulse-dot { background: #b45309; }
html[data-theme="light"] .steam-update-alert { color: #5b2d0a; border-color: rgba(180,83,9,.52); background: linear-gradient(105deg,#f5ddb0,#ecd0a0); box-shadow: 0 12px 30px rgba(92,52,10,.14),inset 3px 0 #d97706; }
html[data-theme="light"] .steam-update-alert strong { color: #5b2d0a; }
html[data-theme="light"] .steam-update-alert p { color: #784712; }
html[data-theme="light"] .steam-update-alert-icon { color: #92400e; background: rgba(180,83,9,.13); }
html[data-theme="light"] .steam-update-alert-icon i { background: #b45309; }
html[data-theme="light"] .btn-warning { color: #fff; border-color: #92400e; background: linear-gradient(145deg,#b45309,#92400e); }
html[data-theme="light"] .btn-danger { color: #fff; border-color: #991b1b; background: #b91c1c; }
html[data-theme="light"] .btn-danger:hover { color: #fff; background: #991b1b; }

html[data-theme="light"] :where(.backup-usage-card,.backup-format-card) { color: #17344e; border-color: rgba(30,64,95,.22); background: linear-gradient(135deg,#e4eef4,#d5e5ee); }
html[data-theme="light"] .backup-usage-card strong { color: #102a42; }
html[data-theme="light"] .backup-usage-card p { color: #536b80; }
html[data-theme="light"] .backup-usage-meter { background: #b9cbd8; }
html[data-theme="light"] .backup-scope-picker legend { color: #29475f; }
html[data-theme="light"] .backup-scope-picker > button { color: #38546d; border-color: rgba(30,64,95,.22); background: rgba(222,234,242,.92); }
html[data-theme="light"] .backup-scope-picker > button.selected { color: #0b2e49; background: rgba(186,230,253,.62); }
html[data-theme="light"] :where(.backup-warning,.warning-box) { color: #713f12; border-color: rgba(180,83,9,.35); background: #f8e5bd; }
html[data-theme="light"] :where(.backup-warning,.warning-box) :where(span,p,small) { color: #784712; }
html[data-theme="light"] .clean-reinstall-action { border-color: rgba(185,28,28,.36); background: linear-gradient(145deg,#f3e5e7,#ead7db); }
html[data-theme="light"] .clean-reinstall-action .action-icon { color: #991b1b; background: rgba(185,28,28,.13); }
html[data-theme="light"] .reinstall-safety-summary { color: #17344e; border-color: rgba(2,132,199,.25); background: linear-gradient(110deg,rgba(186,230,253,.62),rgba(215,229,238,.84)); }
html[data-theme="light"] .reinstall-safety-summary p { color: #536b80; }
html[data-theme="light"] .brand-checkbox > span { border-color: rgba(2,132,199,.48); background: #f3f7fa; }

/* Final light-theme surface contract. Keep exact selectors here so legacy dark
   component rules cannot win through higher specificity. */
html[data-theme="light"] .file-browser-shell { color: #17344e; border-color: rgba(30,64,95,.24); background: #e5eef4; }
html[data-theme="light"] .file-tree-panel { color: #29475f; border-right-color: rgba(30,64,95,.22); background: #d5e4ee; scrollbar-color: rgba(2,132,199,.55) rgba(194,214,227,.9); }
html[data-theme="light"] .file-tree-row { color: #29475f; }
html[data-theme="light"] .file-tree-row:hover { color: #0b2e49; background: rgba(2,132,199,.09); }
html[data-theme="light"] .file-tree-row.selected { color: #064f75; background: rgba(14,165,233,.17); box-shadow: inset 3px 0 #0284c7; }
html[data-theme="light"] .file-tree-row.root { color: #17344e; }
html[data-theme="light"] .file-list-panel { color: #17344e; background: #edf4f8; }
html[data-theme="light"] .file-page-navigation { background: #e5eef4; border-color: rgba(30,64,95,.2); }
html[data-theme="light"] .file-list-panel .data-table td { color: #29475f; }
html[data-theme="light"] .file-list-panel .data-table td > small { color: #5b7287; }
html[data-theme="light"] .file-context-hint { color: #536b80; }
html[data-theme="light"] .file-entry-row:hover, html[data-theme="light"] .file-entry-row.context-selected { background: rgba(2,132,199,.08); }
html[data-theme="light"] .file-entry-row.clipboard-source { background: rgba(109,40,217,.075); box-shadow: inset 3px 0 #7c3aed; }
html[data-theme="light"] .file-clipboard-bar { color: #264861; border-color: rgba(30,64,95,.22); background: linear-gradient(90deg, rgba(186,230,253,.58), rgba(238,245,249,.96) 52%, rgba(221,214,254,.38)); }
html[data-theme="light"] .file-clipboard-icon { color: #0e7490; border-color: rgba(14,116,144,.2); background: rgba(14,116,144,.1); }
html[data-theme="light"] .file-clipboard-icon.cut { color: #6d28d9; border-color: rgba(109,40,217,.2); background: rgba(109,40,217,.1); }
html[data-theme="light"] .file-clipboard-bar small { color: #03698f; }
html[data-theme="light"] .file-clipboard-bar strong { color: #102a42; }
html[data-theme="light"] .file-overflow-button { color: #47647b; }
html[data-theme="light"] .file-overflow-button:hover, html[data-theme="light"] .file-overflow-button:focus-visible { color: #075985; border-color: rgba(2,132,199,.38); background: rgba(2,132,199,.1); }
html[data-theme="light"] .file-context-menu { color: #29475f; border-color: rgba(2,132,199,.34); background: linear-gradient(155deg, rgba(248,251,253,.995), rgba(226,237,244,.995)); box-shadow: 0 22px 55px rgba(31,68,99,.24), inset 0 1px #fff; }
html[data-theme="light"] .file-context-menu-heading { color: #102a42; border-bottom-color: rgba(30,64,95,.16); }
html[data-theme="light"] .file-context-menu > button { color: #29475f; }
html[data-theme="light"] .file-context-menu > button span { color: #0369a1; }
html[data-theme="light"] .file-context-menu > button:hover, html[data-theme="light"] .file-context-menu > button:focus-visible { color: #0b2e49; background: rgba(2,132,199,.11); }
html[data-theme="light"] .file-context-menu > button.danger { color: #b91c1c; }
html[data-theme="light"] .file-context-menu > button.danger span { color: #b91c1c; }
html[data-theme="light"] .file-context-menu > button.danger:hover, html[data-theme="light"] .file-context-menu > button.danger:focus-visible { background: rgba(185,28,28,.1); }
html[data-theme="light"] .file-context-menu-separator { background: rgba(30,64,95,.15); }
html[data-theme="light"] .file-link { color: #17344e; }
html[data-theme="light"] .path-bar { color: #29475f; background: rgba(211,226,237,.82); }

html[data-theme="light"] .log-viewer-tabs { border-color: rgba(30,64,95,.22); background: #d7e5ee; box-shadow: inset 0 1px rgba(255,255,255,.72),0 10px 24px rgba(31,68,99,.08); }
html[data-theme="light"] .log-viewer-tabs button { color: #49647a; }
html[data-theme="light"] .log-viewer-tabs button:hover { color: #0b2e49; border-color: rgba(2,132,199,.22); background: rgba(2,132,199,.09); }
html[data-theme="light"] .log-viewer-tabs button.active { color: #064f75; border-color: rgba(2,132,199,.34); background: rgba(186,230,253,.58); }
html[data-theme="light"] .log-tab-glyph-server { color: #1d4ed8; }
html[data-theme="light"] .log-tab-glyph-administration { color: #6d28d9; }
html[data-theme="light"] .log-tab-glyph-service { color: #0f766e; }
html[data-theme="light"] .log-viewer-tabs button.active .log-tab-glyph { color: #075985; background: rgba(2,132,199,.13); }
html[data-theme="light"] .log-filter-panel { border-color: rgba(30,64,95,.22); background: #dce8f1; box-shadow: inset 0 1px rgba(255,255,255,.72); }
html[data-theme="light"] .date-filter-chips { border-color: rgba(30,64,95,.2); background: #cbdde8; }
html[data-theme="light"] .date-filter-chips button { color: #49647a; }
html[data-theme="light"] .date-filter-chips button:hover { color: #0b2e49; background: rgba(2,132,199,.09); }
html[data-theme="light"] .date-filter-chips button.active { color: #064f75; border-color: rgba(2,132,199,.36); background: #e6f3f9; }
html[data-theme="light"] .log-search-field { color: #0369a1; border-color: rgba(30,64,95,.26); background: #f3f7fa; }
html[data-theme="light"] .log-search-field input { color: #102a42; }
html[data-theme="light"] .log-search-field input::placeholder { color: #60778b; }
html[data-theme="light"] .log-filter-count,html[data-theme="light"] .audit-identity-hint { color: #536b80; }

html[data-theme="light"] .activity-range-tabs { border-color: rgba(30,64,95,.24); background: #cbdce7; }
html[data-theme="light"] .activity-range-tabs button { color: #49647a; }
html[data-theme="light"] .activity-range-tabs button:hover { color: #0b2e49; background: rgba(2,132,199,.1); }
html[data-theme="light"] .activity-range-tabs button.active { color: #064f75; background: #e8f3f8; box-shadow: inset 0 0 0 1px rgba(2,132,199,.3); }
html[data-theme="light"] .empty-state { color: #29475f; border-color: rgba(30,64,95,.24); background: rgba(220,232,241,.68); }
html[data-theme="light"] .empty-state p { color: #536b80; }

html[data-theme="light"] .console-panel,
html[data-theme="light"] .console-output,
html[data-theme="light"] .live-log-output,
html[data-theme="light"] .overview-console-output,
html[data-theme="light"] .steam-live-output,
html[data-theme="light"] .log-stream pre,
html[data-theme="light"] .code-editor { color: #15344c; border-color: rgba(30,64,95,.25); background: #e8f1f6; box-shadow: inset 0 1px rgba(255,255,255,.72); }
html[data-theme="light"] .console-offline { color: #536b80; }
html[data-theme="light"] .console-offline strong { color: #29475f; }
html[data-theme="light"] .console-offline small { color: #60778b; }
html[data-theme="light"] .overview-console-output .console-line,
html[data-theme="light"] .steam-live-output .console-line { color: #166534; }
html[data-theme="light"] .overview-console-output .console-line.warning,
html[data-theme="light"] .steam-live-output .console-line.warning { color: #92400e; }
html[data-theme="light"] .overview-console-output .console-line.error,
html[data-theme="light"] .steam-live-output .console-line.error { color: #b91c1c; }

html[data-theme="light"] .detail-list dt { color: #49647a; }
html[data-theme="light"] .detail-list dd { color: #17344e; }
html[data-theme="light"] .service-settings-links > a { color: #17344e; border-color: rgba(30,64,95,.22); background: linear-gradient(140deg,#e5eef4,#d7e6ef); box-shadow: 0 8px 20px rgba(31,68,99,.08); }
html[data-theme="light"] .service-settings-links > a:hover { color: #064f75; border-color: rgba(2,132,199,.42); background: #d9eaf3; }
html[data-theme="light"] .service-settings-links > a > span { color: #0369a1; background: rgba(2,132,199,.12); }
html[data-theme="light"] .service-settings-links small { color: #536b80; }
html[data-theme="light"] .settings-master-switch { color: #17344e; border-color: rgba(30,64,95,.22); background: #d3e2eb; }
html[data-theme="light"] .settings-master-switch small { color: #536b80; }
html[data-theme="light"] .service-path-grid span { color: #536b80; }
html[data-theme="light"] .service-path-grid code { color: #075985; }
html[data-theme="light"] .cpu-affinity-fieldset { border-color: rgba(30,64,95,.22); background: rgba(214,229,239,.72); }
html[data-theme="light"] .cpu-affinity-heading legend { color: #17344e; }
html[data-theme="light"] .cpu-affinity-heading small { color: #536b80; }
html[data-theme="light"] .cpu-affinity-option { color: #38546d; border-color: rgba(30,64,95,.2); background: #edf4f8; }
html[data-theme="light"] .cpu-affinity-option:has(input:checked) { color: #064f75; border-color: rgba(2,132,199,.4); background: rgba(186,230,253,.58); }

html[data-theme="light"] .database-summary-grid strong { color: #075985; }
html[data-theme="light"] .database-icon-button { color: #17344e; border-color: rgba(30,64,95,.24); background: #d9e7ef; box-shadow: 0 5px 14px rgba(31,68,99,.08); }
html[data-theme="light"] .database-icon-button:hover:not(:disabled) { color: #064f75; border-color: rgba(2,132,199,.46); background: #edf5f9; box-shadow: 0 8px 18px rgba(31,68,99,.13); }
html[data-theme="light"] .database-icon-button.danger .action-icon { color: #b91c1c; background: rgba(185,28,28,.11); }
html[data-theme="light"] .database-icon-button.danger:hover:not(:disabled) { border-color: rgba(185,28,28,.45); background: #f9e5e7; }
html[data-theme="light"] .database-name-composer { border-color: rgba(30,64,95,.24); background: #e2edf3; }
html[data-theme="light"] .database-name-composer > span { color: #075985; }
html[data-theme="light"] .database-name-composer .form-control { border-left-color: rgba(30,64,95,.2); }
html[data-theme="light"] .btn-primary:disabled { color: #536b80; border-color: rgba(30,64,95,.2); background: #c4d5e0; box-shadow: none; filter: none; opacity: 1; }

html[data-theme="light"] .btn-editor { color: #075985; border-color: rgba(2,132,199,.34); background: linear-gradient(145deg,#d7e8f1,#c9dce8); box-shadow: inset 0 1px rgba(255,255,255,.7); }
html[data-theme="light"] .btn-editor:hover { color: #064f75; border-color: rgba(2,132,199,.55); background: #e7f2f7; box-shadow: 0 8px 18px rgba(31,68,99,.12); }
html[data-theme="light"] .action-icon { color: #0369a1; background: rgba(2,132,199,.12); }
html[data-theme="light"] .update-action .action-icon { color: #6d28d9; background: rgba(109,40,217,.1); }
html[data-theme="light"] .backup-action .action-icon { color: #15803d; background: rgba(21,128,61,.1); }
html[data-theme="light"] .save-action .action-icon { color: #0f766e; background: rgba(15,118,110,.1); }
html[data-theme="light"] .file-toolbar-icon.refresh { color: #0e7490; background: rgba(14,116,144,.11); }
html[data-theme="light"] .file-toolbar-icon.folder { color: #a16207; background: rgba(161,98,7,.11); }
html[data-theme="light"] .file-toolbar-icon.file { color: #6d28d9; background: rgba(109,40,217,.1); }
html[data-theme="light"] .file-toolbar-icon.upload { color: #15803d; background: rgba(21,128,61,.1); }
html[data-theme="light"] .file-toolbar-icon.download { color: #0369a1; background: rgba(2,132,199,.11); }
html[data-theme="light"] .file-toolbar-icon.restore { color: #a21caf; background: rgba(162,28,175,.1); }

html[data-theme="light"] .service-nav-link .service-nav-icon { text-shadow: none; }
html[data-theme="light"] .service-nav-link .service-nav-icon-overview { color: #0369a1; }
html[data-theme="light"] .service-nav-link .service-nav-icon-settings { color: #475569; }
html[data-theme="light"] .service-nav-link .service-nav-icon-watchdog { color: #be123c; }
html[data-theme="light"] .service-nav-link .service-nav-icon-configs { color: #6d28d9; }
html[data-theme="light"] .service-nav-link .service-nav-icon-commandline { color: #0e7490; }
html[data-theme="light"] .service-nav-link .service-nav-icon-mods { color: #7e22ce; }
html[data-theme="light"] .service-nav-link .service-nav-icon-steam-workshop { color: #1d4ed8; }
html[data-theme="light"] .service-nav-link .service-nav-icon-curseforge-workshop { color: #c2410c; }
html[data-theme="light"] .service-nav-link .service-nav-icon-files { color: #854d0e; }
html[data-theme="light"] .service-nav-link .service-nav-icon-sftp { color: #047857; }
html[data-theme="light"] .service-nav-link .service-nav-icon-logs { color: #1d4ed8; }
html[data-theme="light"] .service-nav-link .service-nav-icon-steam { color: #0369a1; }
html[data-theme="light"] .service-nav-link .service-nav-icon-console { color: #15803d; }
html[data-theme="light"] .service-nav-link .service-nav-icon-scripts { color: #c2410c; }
html[data-theme="light"] .service-nav-link .service-nav-icon-tasks { color: #854d0e; }
html[data-theme="light"] .service-nav-link .service-nav-icon-activity { color: #0f766e; }
html[data-theme="light"] .service-nav-link .service-nav-icon-backups { color: #4338ca; }

/* Light-theme details discovered by the signed-in full-page audit. */
html[data-theme="light"] .nav-icon { color: #075985; }
html[data-theme="light"] .path-bar button { color: #075985; }
html[data-theme="light"] .path-bar button:disabled { color: #60778b; }
html[data-theme="light"] .folder-icon,
html[data-theme="light"] .file-link span { color: #854d0e; }
html[data-theme="light"] .infrastructure-node-context { color: #17344e; border-color: rgba(2,132,199,.25); background: rgba(186,230,253,.46); }
html[data-theme="light"] .infrastructure-node-context span { color: #536b80; }
html[data-theme="light"] .infrastructure-node-context strong { color: #17344e; }
html[data-theme="light"] .infrastructure-node-context p { color: #29475f; }
html[data-theme="light"] .service-port-row { color: #17344e; border-color: rgba(30,64,95,.2); background: #e1ecf2; }
html[data-theme="light"] .service-port-row > div span,
html[data-theme="light"] .service-port-row label > span { color: #536b80; }
html[data-theme="light"] .service-port-row > div strong { color: #075985; }
html[data-theme="light"] .service-delete-zone { color: #51202c; border-color: rgba(185,28,28,.3); background: #f6e4e7; }
html[data-theme="light"] .action-icon.red { color: #b91c1c; background: rgba(185,28,28,.11); }
html[data-theme="light"] .button-glyph.green { color: #166534; background: rgba(21,128,61,.14); }
html[data-theme="light"] .file-toolbar-icon.refresh { color: #075985; }
html[data-theme="light"] .file-toolbar-icon.folder { color: #713f12; }
html[data-theme="light"] .file-toolbar-icon.upload { color: #166534; }
html[data-theme="light"] .path-bar button:disabled { color: #475569; }
html[data-theme="light"] .service-nav-link .service-nav-icon-console { color: #166534; }
html[data-theme="light"] .service-nav-link .service-nav-icon-scripts { color: #9a3412; }
html[data-theme="light"] .service-breadcrumbs { color: #496176; }

/* Light-theme coverage for workshop catalogs, SFTP guidance, scheduled-task
   controls and durable-operation results. These components own dark surfaces,
   so they need exact overrides instead of inheriting only from their panels. */
html[data-theme="light"] .mod-catalog-grid { background: #d8e6ef; }
html[data-theme="light"] .mod-catalog-card { color: #17344e; border-color: rgba(30,64,95,.22); background: linear-gradient(180deg,#f3f7fa,#e6eff4); box-shadow: 0 7px 18px rgba(31,68,99,.08); }
html[data-theme="light"] .mod-catalog-card:hover { background: linear-gradient(180deg,#ffffff,#eaf3f7); box-shadow: 0 12px 28px rgba(31,68,99,.15),inset 0 0 0 1px rgba(2,132,199,.26); }
html[data-theme="light"] .mod-catalog-card h3 { color: #102a42; }
html[data-theme="light"] .mod-catalog-meta { color: #0369a1; }
html[data-theme="light"] .mod-catalog-meta span:last-child { color: #536b80; }
html[data-theme="light"] .mod-catalog-card p { color: #496176; }
html[data-theme="light"] .mod-catalog-card footer { border-top: 1px solid rgba(30,64,95,.12); background: rgba(218,232,241,.56); }
html[data-theme="light"] .mod-catalog-card .btn-ghost { color: #075985; }
html[data-theme="light"] .mod-catalog-card .btn-ghost:hover { color: #064f75; border-color: rgba(2,132,199,.28); background: rgba(2,132,199,.1); }
html[data-theme="light"] .catalog-installed-badge { color: #166534; border-color: rgba(21,128,61,.34); background: rgba(220,252,231,.94); box-shadow: 0 4px 14px rgba(31,68,99,.13); }
html[data-theme="light"] .workshop-toolbar label > span { color: #496176; }
html[data-theme="light"] .workshop-result-footer { color: #075985; background: #e2edf3; }
html[data-theme="light"] .workshop-result-footer small { color: #496176; }

html[data-theme="light"] .sftp-client-grid article { color: #17344e; background: #e5eef4; }
html[data-theme="light"] .sftp-client-grid article > span { color: #047857; border-color: rgba(4,120,87,.34); background: #d1fae5; }
html[data-theme="light"] .sftp-client-grid small { color: #496176; }
html[data-theme="light"] .sftp-help-footer { color: #17344e; border-color: rgba(2,132,199,.28); background: #d5e5ee; }
html[data-theme="light"] .sftp-help-footer strong { color: #17344e; }
html[data-theme="light"] .sftp-help-footer small { color: #496176; }
html[data-theme="light"] .sftp-help-footer .btn-secondary { color: #17344e; border-color: rgba(30,64,95,.24); background: #edf4f8; }
html[data-theme="light"] .sftp-help-footer .btn-secondary:hover { color: #064f75; border-color: rgba(2,132,199,.42); background: #f8fbfd; }

html[data-theme="light"] .schedule-row-action { color: #29475f; border-color: rgba(30,64,95,.25); background: #d8e6ef; box-shadow: 0 4px 12px rgba(31,68,99,.07); }
html[data-theme="light"] .schedule-row-action.edit { color: #075985; border-color: rgba(2,132,199,.34); }
html[data-theme="light"] .schedule-row-action.edit span { background: rgba(2,132,199,.12); }
html[data-theme="light"] .schedule-row-action.delete { color: #b91c1c; border-color: rgba(185,28,28,.35); }
html[data-theme="light"] .schedule-row-action.delete span { background: rgba(185,28,28,.11); }
html[data-theme="light"] .schedule-row-action:hover { background: #f3f8fa; box-shadow: 0 8px 18px rgba(31,68,99,.13); }
html[data-theme="light"] .schedule-row-action.delete:hover { background: #f9e5e7; }
html[data-theme="light"] .schedule-enable-switch strong { color: #29475f; }

html[data-theme="light"] .data-table .success-cell { color: #166534 !important; font-weight: 700; }
html[data-theme="light"] .data-table .error-cell { color: #b91c1c !important; font-weight: 700; }
html[data-theme="light"] .data-table .warning-cell { color: #92400e !important; font-weight: 700; }

.service-metric-chart-shell { position: relative; min-height: 280px; }
.service-metric-chart-plot { display: grid; grid-template-columns: 46px minmax(0, 1fr); min-width: 0; }
.service-metric-chart-axis { position: relative; height: 250px; color: #7890a6; font-size: .67rem; font-weight: 750; font-variant-numeric: tabular-nums; }
.service-metric-chart-axis span { position: absolute; right: 9px; transform: translateY(-50%); white-space: nowrap; }
.service-metric-chart-canvas { position: relative; min-width: 0; height: 250px; }
.service-metric-chart { width: 100%; height: 250px; display: block; overflow: visible; }
.service-metric-chart .metric-line { fill: none; stroke-width: 3; vector-effect: non-scaling-stroke; }
.service-metric-chart .metric-line.cpu { stroke: #38bdf8; }
.service-metric-chart .metric-line.ram { stroke: #a78bfa; }
.service-metric-chart .metric-line.players { stroke: #34d399; }
.service-metric-chart-legend { display: flex; gap: 18px; margin: 0 0 8px; font-weight: 800; }
.service-metric-chart-legend span::before { content: ""; display: inline-block; width: 20px; height: 3px; margin-right: 7px; vertical-align: middle; border-radius: 3px; }
.service-metric-chart-legend .cpu::before { background: #38bdf8; }
.service-metric-chart-legend .ram::before { background: #a78bfa; }
.service-metric-chart-legend .players::before { background: #34d399; }
.service-metric-chart-tooltip { position: absolute; z-index: 4; display: none; transform: translateX(-50%); min-width: 190px; padding: 10px 12px; border: 1px solid var(--border-strong); border-radius: 10px; background: var(--surface-strong); box-shadow: var(--shadow-md); pointer-events: none; }
.service-metric-chart-tooltip strong, .service-metric-chart-tooltip span { display: block; white-space: nowrap; }
.service-metric-chart-tooltip .cpu { color: #38bdf8; }
.service-metric-chart-tooltip .ram { color: #a78bfa; }
.service-metric-chart-tooltip .players { color: #34d399; }
.service-metric-chart-shell.metric-hover .service-metric-chart-tooltip { display: block; }
.service-metric-chart-shell.metric-hover .spark-crosshair { opacity: 1; }
html[data-theme="light"] .service-metric-chart-axis { color: #49657b; }
.combined-telemetry-card { width: 100%; }
.combined-telemetry-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.combined-telemetry-summary > div { display: flex; justify-content: space-between; gap: 12px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface-subtle); }
@media (max-width: 760px) { .combined-telemetry-summary { grid-template-columns: 1fr; } }
.service-resource-warning { display: inline-grid; place-items: center; width: 20px; height: 20px; margin-left: 6px; border-radius: 999px; color: #160c00; background: #f59e0b; box-shadow: 0 0 0 3px rgba(245,158,11,.16); font-size: 12px; font-weight: 950; vertical-align: middle; }

/* Dedicated CPU inventory and customer-owned node provisioning. */
.dedicated-thread-details summary { color: #7dd3fc; font-weight: 850; }
.thread-allocation-summary { display: flex; flex-wrap: wrap; gap: .45rem; padding: .7rem .7rem 0; }
.thread-capacity-pill { display: inline-flex; align-items: center; min-height: 25px; padding: .2rem .58rem; border: 1px solid var(--border); border-radius: 999px; font-size: .68rem; font-weight: 850; }
.thread-capacity-pill.free { color: #86efac; border-color: rgba(34,197,94,.3); background: rgba(22,101,52,.19); }
.thread-capacity-pill.reserved { color: #7dd3fc; border-color: rgba(56,189,248,.3); background: rgba(3,105,161,.18); }
.thread-capacity-pill.overlap { color: #fda4af; border-color: rgba(244,63,94,.38); background: rgba(159,18,57,.2); }
.thread-affinity-warning { margin: .65rem .7rem 0; }
.thread-allocation-grid { grid-template-columns: repeat(4,minmax(0,1fr)); padding-top: .7rem; }
.thread-core-card { min-width: 0; transition: border-color .16s ease,background .16s ease; }
.thread-allocation-grid .thread-core-card.free { border-color: rgba(34,197,94,.22); background: rgba(22,101,52,.09); }
.thread-allocation-grid .thread-core-card.reserved { border-color: rgba(56,189,248,.28); background: rgba(3,105,161,.1); }
.thread-allocation-grid .thread-core-card.overlap { border-color: rgba(244,63,94,.5); background: repeating-linear-gradient(135deg,rgba(159,18,57,.18) 0,rgba(159,18,57,.18) 7px,rgba(127,29,29,.08) 7px,rgba(127,29,29,.08) 14px); }
.thread-core-heading { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.thread-core-heading strong { margin: 0; font-variant-numeric: tabular-nums; }
.thread-owner-list { display: grid; gap: .28rem; margin-top: .42rem; }
.thread-free-label { color: #86efac; font-size: .64rem; font-weight: 800; }
.thread-service-tag { --allocation-color:#38bdf8; display: block; min-width: 0; overflow: hidden; padding: .27rem .32rem .22rem; border-radius: .28rem; border-bottom: 3px solid var(--allocation-color); color: #e5f6ff; background: rgba(2,8,23,.52); font-size: .61rem!important; font-weight: 800; line-height: 1.25; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; }
.thread-service-tag:hover { color: white; background: rgba(14,165,233,.13); }
.allocation-color-0{--allocation-color:#38bdf8}.allocation-color-1{--allocation-color:#a78bfa}.allocation-color-2{--allocation-color:#34d399}.allocation-color-3{--allocation-color:#fbbf24}.allocation-color-4{--allocation-color:#fb7185}.allocation-color-5{--allocation-color:#22d3ee}.allocation-color-6{--allocation-color:#c084fc}.allocation-color-7{--allocation-color:#f97316}.allocation-color-8{--allocation-color:#4ade80}.allocation-color-9{--allocation-color:#60a5fa}
.dedicated-node-assignment-card { margin-top: 1rem; padding: 1rem; border: 1px solid rgba(56,189,248,.2); border-radius: .85rem; background: linear-gradient(135deg,rgba(3,105,161,.09),rgba(15,23,42,.4)); }
.dedicated-node-assignment-card p { margin: .3rem 0 0; color: var(--muted); }
.dedicated-node-assignment-controls { margin-top: .9rem; }
.dedicated-template-picker { display: grid; gap: .65rem; margin-top: 1rem; }
.dedicated-template-picker > div:first-child { display: grid; gap: .2rem; }
.dedicated-template-picker small { color: var(--muted); }
.dedicated-template-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .5rem; }
.dedicated-template-option { display: flex; align-items: center; gap: .65rem; min-width: 0; min-height: 54px; padding: .6rem .68rem; border: 1px solid var(--border); border-radius: .6rem; background: rgba(2,8,23,.28); cursor: pointer; }
.dedicated-template-option > span:last-child { display: grid; min-width: 0; gap: .12rem; }
.dedicated-template-option strong,.dedicated-template-option small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.service-create-locked-owner { min-height: 72px; padding: .62rem .75rem; border: 1px solid var(--border); border-radius: .55rem; background: var(--surface-subtle); }
.service-create-locked-owner strong { color: var(--text); }
html[data-theme="light"] .thread-capacity-pill.free,html[data-theme="light"] .thread-free-label { color: #166534; }
html[data-theme="light"] .thread-capacity-pill.reserved,html[data-theme="light"] .dedicated-thread-details summary { color: #075985; }
html[data-theme="light"] .thread-capacity-pill.overlap { color: #be123c; }
html[data-theme="light"] .thread-service-tag { color: #17344e; background: rgba(255,255,255,.72); }
html[data-theme="light"] .dedicated-node-assignment-card { background: linear-gradient(135deg,rgba(186,230,253,.42),rgba(241,245,249,.82)); }
html[data-theme="light"] .dedicated-template-option { color: #17344e; background: rgba(241,245,249,.88); }
@media (max-width:980px){.dedicated-template-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.thread-allocation-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:620px){.dedicated-template-grid,.thread-allocation-grid{grid-template-columns:1fr 1fr}}

/* Minecraft distribution, version and Java manager. */
.minecraft-heading { align-items: center; }
.minecraft-current-panel,.minecraft-manager-panel,.minecraft-job-panel { margin-bottom: 1rem; }
.minecraft-current-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(170px,1fr)); gap: .65rem; }
.minecraft-current-grid > div { display: grid; gap: .22rem; min-width: 0; padding: .72rem .78rem; border: 1px solid var(--border); border-radius: .65rem; background: rgba(2,8,23,.3); }
.minecraft-current-grid span { color: var(--muted); font-size: .68rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.minecraft-current-grid strong { overflow: hidden; color: var(--text); text-overflow: ellipsis; white-space: nowrap; }
.minecraft-current-grid code { color: inherit; font-size: .75rem; }
.minecraft-category-tabs { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: .9rem; padding: .35rem; width: fit-content; max-width: 100%; border: 1px solid var(--border); border-radius: .68rem; background: rgba(2,8,23,.24); }
.minecraft-category-tabs button { display: inline-flex; align-items: center; gap: .42rem; min-height: 36px; padding: .42rem .72rem; border: 0; border-radius: .48rem; color: var(--muted); background: transparent; font: inherit; font-size: .78rem; font-weight: 850; cursor: pointer; }
.minecraft-category-tabs button:hover:not(:disabled) { color: var(--text); background: rgba(56,189,248,.08); }
.minecraft-category-tabs button.active { color: #eaf9ff; background: linear-gradient(135deg,#0284c7,#2563eb); box-shadow: 0 5px 16px rgba(2,132,199,.2); }
.minecraft-distribution-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .72rem; margin-top: .8rem; }
.minecraft-distribution-card { position: relative; display: grid; grid-template-columns: 52px minmax(0,1fr) 24px; align-items: center; gap: .72rem; min-height: 82px; padding: .72rem; border: 1px solid var(--border); border-radius: .72rem; color: var(--text); background: rgba(2,8,23,.32); text-align: left; cursor: pointer; transition: transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease; }
.minecraft-distribution-card:not(:disabled):hover { transform: translateY(-2px); border-color: rgba(56,189,248,.42); background: rgba(14,165,233,.08); }
.minecraft-distribution-card.selected { border-color: rgba(56,189,248,.78); background: linear-gradient(135deg,rgba(14,165,233,.17),rgba(37,99,235,.08)); box-shadow: inset 3px 0 #38bdf8,0 12px 30px rgba(14,165,233,.1); }
.minecraft-distribution-card:disabled { cursor: default; opacity: .66; }
.minecraft-distribution-logo { width: 52px; height: 52px; display: grid; place-items: center; overflow: hidden; border: 0; border-radius: .65rem; background: transparent; }
.minecraft-distribution-logo img { width: 100%; height: 100%; padding: 0; object-fit: contain; box-sizing: border-box; filter: drop-shadow(0 5px 8px rgba(0,0,0,.22)); }
.minecraft-distribution-copy { display: grid; min-width: 0; gap: .25rem; }
.minecraft-distribution-copy strong { font-size: .94rem; }
.minecraft-distribution-copy small { color: var(--muted); line-height: 1.35; }
.minecraft-radio-mark { width: 22px; height: 22px; display: grid; place-items: center; border: 1px solid var(--border); border-radius: 50%; color: #041018; background: transparent; font-size: .72rem; font-weight: 950; }
.minecraft-distribution-card.selected .minecraft-radio-mark { border-color: #7dd3fc; background: #38bdf8; box-shadow: 0 0 0 4px rgba(56,189,248,.12); }
.minecraft-version-grid { margin-top: 1rem; }
.minecraft-catalog-loading { display: flex; align-items: center; justify-content: center; gap: .65rem; min-height: 58px; margin-top: .8rem; color: var(--muted); }
.minecraft-geyser-option { display: grid; grid-template-columns: auto 38px minmax(0,1fr) auto; align-items: center; gap: .7rem; margin-top: .85rem; padding: .68rem .78rem; border: 1px solid rgba(56,189,248,.28); border-radius: .68rem; color: var(--text); background: rgba(14,165,233,.07); cursor: pointer; }
.minecraft-geyser-option > input { width: 17px; height: 17px; accent-color: var(--brand); }
.minecraft-geyser-symbol { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; color: #67e8f9; background: rgba(8,145,178,.16); font-size: 1.1rem; font-weight: 950; }
.minecraft-geyser-option > span:nth-child(3) { display: grid; gap: .14rem; }
.minecraft-geyser-option small { color: var(--muted); line-height: 1.35; }
.minecraft-job-title { display: flex; align-items: center; gap: .55rem; }
.spinner.small { width: 13px; height: 13px; border-width: 2px; }
.minecraft-switch-warning { margin: 1rem 0 0; }
.minecraft-switch-warning p { margin: .25rem 0 0; }
.minecraft-update-summary { display: flex; align-items: center; gap: .65rem; margin-top: .75rem; padding: .68rem .78rem; border: 1px solid rgba(34,197,94,.25); border-radius: .68rem; background: rgba(34,197,94,.07); }
.minecraft-update-summary.has-update { border-color: rgba(245,158,11,.38); background: rgba(245,158,11,.09); }.minecraft-update-symbol { width: 30px; height: 30px; flex: none; display: grid; place-items: center; color: #86efac; border-radius: 50%; background: rgba(34,197,94,.12); font-weight: 950; }.minecraft-update-summary.has-update .minecraft-update-symbol { color: #fcd34d; background: rgba(245,158,11,.14); }.minecraft-update-summary > span:last-child { display: grid; gap: .15rem; }.minecraft-update-summary small { color: var(--muted); line-height: 1.35; }
.minecraft-manager-actions { margin-top: 1rem; }
.minecraft-job-panel .job-progress-heading { margin-top: .75rem; }
html[data-theme="light"] .minecraft-current-grid > div,html[data-theme="light"] .minecraft-distribution-card { background: rgba(255,255,255,.68); }
html[data-theme="light"] .minecraft-distribution-card.selected { background: linear-gradient(135deg,rgba(186,230,253,.72),rgba(219,234,254,.62)); }
html[data-theme="light"] .minecraft-distribution-copy small { color: #425c70; }
html[data-theme="light"] .minecraft-category-tabs { background: rgba(255,255,255,.58); }
html[data-theme="light"] .minecraft-category-tabs button.active { color: white; }
html[data-theme="light"] .minecraft-geyser-option { background: rgba(224,242,254,.72); }
html[data-theme="light"] .minecraft-update-summary { color: #14532d; background: rgba(220,252,231,.74); }
html[data-theme="light"] .minecraft-update-summary.has-update { color: #713f12; background: rgba(254,243,199,.78); }
@media (max-width:1080px){.minecraft-current-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.minecraft-distribution-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:680px){.minecraft-current-grid,.minecraft-distribution-grid{grid-template-columns:1fr}.minecraft-manager-actions{align-items:stretch}.minecraft-manager-actions .btn{width:100%}}

/* Minecraft manager sections and CurseForge browser. */
.minecraft-manager-switch { margin: 0 0 1rem; padding: .82rem; border: 1px solid rgba(56,189,248,.28); border-radius: .9rem; background: linear-gradient(135deg,rgba(8,47,73,.34),rgba(15,23,42,.48)); box-shadow: 0 12px 30px rgba(2,8,23,.16); }
.minecraft-manager-switch-heading { display: flex; align-items: baseline; justify-content: space-between; gap: .8rem; margin: 0 .12rem .7rem; }
.minecraft-manager-switch-heading strong { font-size: .92rem; }
.minecraft-primary-tabs { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .7rem; margin: 0; }
.minecraft-primary-tabs > a { position: relative; display: grid; grid-template-columns: 44px minmax(0,1fr) auto; align-items: center; gap: .75rem; min-height: 78px; padding: .82rem .9rem; overflow: hidden; border: 1px solid var(--border); border-radius: .78rem; color: var(--text); background: rgba(2,8,23,.3); text-align: left; text-decoration: none; cursor: pointer; transition: transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease; }
.minecraft-primary-tabs > a:hover { transform: translateY(-1px); border-color: rgba(56,189,248,.54); background: rgba(14,165,233,.09); }
.minecraft-primary-tab-glyph { display: grid; place-items: center; width: 44px; height: 44px; border-radius: .68rem; color: #67e8f9; background: rgba(14,165,233,.14); font-size: 1.15rem; }
.minecraft-primary-tab-glyph.curseforge { color: #fb923c; background: rgba(249,115,22,.14); }
.minecraft-primary-tab-copy { display: grid; gap: .14rem; min-width: 0; }
.minecraft-primary-tab-copy strong { font-size: .9rem; }.minecraft-primary-tab-copy small { color: var(--muted); }
.minecraft-primary-tab-state { justify-self: end; padding: .3rem .5rem; border: 1px solid rgba(148,163,184,.2); border-radius: 999px; color: var(--muted); font-size: .67rem; font-weight: 850; white-space: nowrap; }
.minecraft-primary-tabs > a.active { border-color: rgba(56,189,248,.85); background: linear-gradient(135deg,rgba(14,165,233,.24),rgba(37,99,235,.12)); box-shadow: inset 4px 0 #38bdf8,0 8px 22px rgba(2,132,199,.13); }
.minecraft-primary-tabs > a.active .minecraft-primary-tab-state { border-color: rgba(103,232,249,.32); color: #cffafe; background: rgba(8,145,178,.22); }
.minecraft-installed-modpack-panel { margin-bottom: 1rem; }
.minecraft-installed-modpack-card { display: grid; grid-template-columns: 72px minmax(0,1fr) auto; align-items: center; gap: .9rem; padding: .85rem; border: 1px solid rgba(56,189,248,.25); border-radius: .75rem; background: linear-gradient(135deg,rgba(14,165,233,.08),rgba(37,99,235,.04)); }
.minecraft-installed-modpack-image { display: grid; place-items: center; width: 72px; height: 72px; overflow: hidden; border-radius: .72rem; color: #67e8f9; background: rgba(14,165,233,.13); font-size: 1.45rem; }
.minecraft-installed-modpack-image img { width: 100%; height: 100%; object-fit: cover; }
.minecraft-installed-modpack-copy { display: grid; min-width: 0; gap: .22rem; }
.minecraft-installed-modpack-copy > strong { overflow: hidden; color: var(--text); font-size: 1rem; text-overflow: ellipsis; white-space: nowrap; }
.minecraft-installed-modpack-copy > small { color: var(--muted); }
.minecraft-installed-modpack-facts { display: flex; flex-wrap: wrap; gap: .42rem; margin-top: .24rem; }
.minecraft-installed-modpack-facts span { display: inline-flex; gap: .28rem; padding: .22rem .42rem; border: 1px solid var(--border); border-radius: .42rem; color: var(--muted); background: rgba(2,8,23,.24); font-size: .69rem; }
.minecraft-installed-modpack-facts b { color: var(--text); }
.minecraft-installed-modpack-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .5rem; }
.minecraft-modpack-uninstall-modal { width: min(680px,100%); }
.minecraft-curseforge-browser,.minecraft-cf-selection,.minecraft-cf-installed { margin-bottom: 1rem; }
.minecraft-content-tabs { margin-top: 0; }
.minecraft-curseforge-toolbar { grid-template-columns: 1fr; margin-top: .8rem; }
.minecraft-cf-project-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .72rem; margin-top: .85rem; }
.minecraft-cf-project-card { position: relative; display: grid; grid-template-columns: 56px minmax(0,1fr); gap: .7rem; min-height: 94px; padding: .72rem; border: 1px solid var(--border); border-radius: .72rem; color: var(--text); background: rgba(2,8,23,.3); text-align: left; cursor: pointer; }
.minecraft-cf-project-card:hover:not(:disabled),.minecraft-cf-project-card.selected { border-color: rgba(56,189,248,.62); background: rgba(14,165,233,.09); transform: translateY(-1px); }
.minecraft-cf-project-image { width: 56px; height: 56px; display: grid; place-items: center; overflow: hidden; border-radius: .62rem; color: #67e8f9; background: rgba(14,165,233,.1); font-size: 1.2rem; }
.minecraft-cf-project-image img { width: 100%; height: 100%; object-fit: cover; }
.minecraft-cf-project-copy { display: grid; min-width: 0; gap: .2rem; }.minecraft-cf-project-copy strong,.minecraft-cf-project-copy small { overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }.minecraft-cf-project-copy small { color: var(--muted); line-height: 1.3; }.minecraft-cf-project-copy > span { color: #7dd3fc; font-size: .68rem; font-weight: 800; }
.minecraft-cf-project-card > .state-badge { position: absolute; top: .42rem; right: .42rem; font-style: normal; }
.minecraft-cf-project-card > .state-badge + .state-badge { top: auto; bottom: .42rem; }
.minecraft-cf-release-grid { margin-top: .8rem; grid-template-columns: repeat(3,minmax(0,1fr)); }
.minecraft-modpack-confirm { margin-top: .8rem; }
.commandline-custom-jar { display: grid; gap: .75rem; margin-top: .85rem; padding: .8rem; border: 1px solid rgba(56,189,248,.24); border-radius: .7rem; background: rgba(14,165,233,.06); }
html[data-theme="light"] .minecraft-manager-switch { border-color: rgba(2,132,199,.28); background: linear-gradient(135deg,rgba(224,242,254,.86),rgba(239,246,255,.82)); box-shadow: 0 12px 30px rgba(31,68,99,.09); }
html[data-theme="light"] .minecraft-primary-tabs > a,html[data-theme="light"] .minecraft-cf-project-card { background: rgba(255,255,255,.82); }
html[data-theme="light"] .minecraft-primary-tabs > a.active,html[data-theme="light"] .minecraft-cf-project-card.selected { background: linear-gradient(135deg,rgba(186,230,253,.76),rgba(219,234,254,.7)); }
html[data-theme="light"] .minecraft-primary-tab-state { color: #49677e; border-color: rgba(30,64,95,.2); background: rgba(255,255,255,.56); }
html[data-theme="light"] .minecraft-primary-tabs > a.active .minecraft-primary-tab-state { color: #075985; border-color: rgba(2,132,199,.32); background: rgba(255,255,255,.72); }
html[data-theme="light"] .minecraft-installed-modpack-card { background: linear-gradient(135deg,rgba(224,242,254,.8),rgba(239,246,255,.82)); }
html[data-theme="light"] .minecraft-installed-modpack-facts span { color: #49657b; background: rgba(255,255,255,.72); }
html[data-theme="light"] .minecraft-cf-project-copy > span { color: #0369a1; }
html[data-theme="light"] .commandline-custom-jar { background: rgba(224,242,254,.66); }
@media (max-width:1050px){.minecraft-cf-project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.minecraft-cf-release-grid{grid-template-columns:1fr 1fr}}
@media (max-width:800px){.minecraft-installed-modpack-card{grid-template-columns:64px minmax(0,1fr)}.minecraft-installed-modpack-image{width:64px;height:64px}.minecraft-installed-modpack-actions{grid-column:1 / -1;justify-content:flex-start}}
@media (max-width:680px){.minecraft-primary-tabs,.minecraft-cf-project-grid,.minecraft-cf-release-grid{grid-template-columns:1fr}.minecraft-installed-modpack-actions .btn{flex:1 1 100%}}

/* Readable syntax overlay for every raw game-configuration editor. */
.config-editor-context { flex: none; }
.config-editor-context p { margin: .25rem 0 0; color: var(--muted); }
.config-syntax-legend { display: flex; flex: none; flex-wrap: wrap; gap: .8rem; margin: .7rem .15rem -.15rem; font: 700 .68rem/1.3 Inter,system-ui,sans-serif; }
.config-syntax-legend > span::before { content: ""; display: inline-block; width: .48rem; height: .48rem; margin-right: .34rem; border-radius: 50%; background: currentColor; vertical-align: .02rem; }
.config-syntax-editor { position: relative; width: 100%; min-height: 390px; box-sizing: border-box; overflow: hidden; border: 1px solid var(--border); border-radius: .6rem; background: #030711; }
.config-syntax-editor:focus-within { border-color: var(--brand); outline: 2px solid rgba(14,165,233,.2); }
.config-syntax-highlight,.config-syntax-input.code-editor { position: absolute; inset: 0; width: 100%; height: 100%; min-height: 0; box-sizing: border-box; margin: 0; padding: 1rem; border: 0; border-radius: 0; font: .78rem/1.55 Consolas,"Cascadia Code",monospace; tab-size: 4; white-space: pre; overflow: auto; overflow-wrap: normal; }
.config-syntax-highlight { z-index: 0; color: #d8f3ff; background: transparent; pointer-events: none; }
.config-syntax-highlight code { color: inherit; font: inherit; }
.config-syntax-input.code-editor { z-index: 1; resize: none; color: transparent !important; background: transparent !important; box-shadow: none !important; caret-color: #e0f2fe; -webkit-text-fill-color: transparent; }
.config-syntax-input.code-editor:focus { border: 0; outline: 0; }
.config-syntax-input.code-editor::selection { color: transparent; background: rgba(56,189,248,.28); -webkit-text-fill-color: transparent; }
.syntax-key { color: #38bdf8; font-weight: 800; }
.syntax-attribute { color: #c4b5fd; }
.syntax-operator { color: #f472b6; }
.syntax-value { color: #fbbf24; }
.syntax-comment { color: #6ee7a0; }
.syntax-section { color: #f0abfc; font-weight: 800; }
.editor-modal-shell > .config-syntax-editor { flex: 1 1 auto; min-height: 0; height: 100%; margin-top: .8rem; }
html[data-theme="light"] .config-syntax-editor { border-color: rgba(30,64,95,.25); background: #e8f1f6; box-shadow: inset 0 1px rgba(255,255,255,.72); }
html[data-theme="light"] .config-syntax-highlight { color: #15344c; }
html[data-theme="light"] .config-syntax-input.code-editor { color: transparent !important; background: transparent !important; caret-color: #075985; -webkit-text-fill-color: transparent; }
html[data-theme="light"] .syntax-key { color: #0369a1; }
html[data-theme="light"] .syntax-attribute { color: #6d28d9; }
html[data-theme="light"] .syntax-operator { color: #be185d; }
html[data-theme="light"] .syntax-value { color: #9a5805; }
html[data-theme="light"] .syntax-comment { color: #187447; }
html[data-theme="light"] .syntax-section { color: #8b1c8f; }
@media (forced-colors:active) {
    .config-syntax-highlight { display: none; }
    .config-syntax-input.code-editor { color: CanvasText !important; background: Canvas !important; -webkit-text-fill-color: CanvasText; }
}