/* HH_PRODUCTION_PRESET_RANK_V1 */
:root {
  --arena-black: #050d14;
  --broadcast-navy: #081722;
  --panel-navy: #0d2230;
  --raised-navy: #122d3d;
  --tournament-blue: #2f7cf6;
  --signal-cyan: #55d6e8;
  --champion-gold: #f2c94c;
  --silver: #b8c6cc;
  --bronze: #c4825a;
  --frost-white: #f5f8fa;
  --text-secondary: #a9bcc5;
  --divider: #294453;
  --danger: #ff8f8f;
  --body-font: "Microsoft YaHei", "PingFang SC", "Noto Sans CJK SC", sans-serif;
  --data-font: Bahnschrift, "Arial Narrow", Arial, sans-serif;
  color-scheme: dark;
  font-family: var(--body-font);
  background: var(--arena-black);
  color: var(--frost-white);
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }

.champion-settings { margin: 20px 0; padding: 18px; border: 1px solid var(--divider); border-radius: 6px; background: var(--broadcast-navy); }
.champion-settings h4 { margin: 0; font-size: 15px; }
.champion-field-hint { margin: 6px 0 16px; color: var(--text-secondary); font-size: 12px; line-height: 1.7; }
.champion-photo-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; }
.champion-photo-preview { display: block; width: 160px; height: 180px; object-fit: contain; background: var(--arena-black); border: 1px solid var(--divider); border-radius: 4px; }
.champion-photo-count { color: var(--text-secondary); font-size: 13px; }
.champion-photo-gallery { display: grid; gap: 8px; max-width: 100%; }
.champion-photo-gallery label { margin: 0; }
.champion-photo-navigation { display: flex; align-items: center; gap: 10px; }
.champion-photo-navigation span { min-width: 76px; text-align: center; font-size: 13px; }

html { min-width: 320px; min-height: 100%; background: var(--arena-black); }

body {
  min-width: 320px;
  min-height: 100vh;
  margin: 0;
  background:
    radial-gradient(circle at 18% 0%, rgba(47, 124, 246, 0.11), transparent 30rem),
    radial-gradient(circle at 92% 5%, rgba(85, 214, 232, 0.055), transparent 24rem),
    var(--arena-black);
  color: var(--frost-white);
}

button, input, select, textarea, output, a { font: inherit; }

button, input, select, textarea {
  border: 1px solid var(--divider);
  border-radius: 6px;
}

button {
  min-height: 44px;
  padding: 0.68rem 0.95rem;
  background: var(--broadcast-navy);
  color: var(--frost-white);
  font-weight: 650;
  cursor: pointer;
  transition: border-color 160ms ease, background-color 160ms ease, color 160ms ease, transform 160ms ease;
}

button:hover { border-color: #497080; background: var(--raised-navy); }
button:active { transform: translateY(1px); }
button:disabled { cursor: not-allowed; opacity: 0.48; transform: none; }

button.primary {
  border-color: #4f8df7;
  background: #2f7cf6;
  color: #050d14;
  font-weight: 750;
}

button.primary:hover { border-color: #75a7ff; background: #3d87ff; }
button.danger { border-color: #6c3f48; color: var(--danger); }
button.danger:hover { border-color: var(--danger); background: #28171d; }

button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[href]:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid var(--signal-cyan);
  outline-offset: 3px;
}

input,
select,
textarea {
  width: 100%;
  min-height: 44px;
  padding: 0.72rem 0.8rem;
  background: #06131c;
  color: var(--frost-white);
  transition: border-color 160ms ease, background-color 160ms ease;
}

input:hover,
select:hover { border-color: #3b5c6b; }
input:focus,
select:focus { border-color: var(--signal-cyan); background: #081a25; }
input::placeholder { color: #6f8792; }
input[type="file"] { padding: 0.57rem; color: var(--text-secondary); }
input[type="file"]::file-selector-button { margin-right: 0.7rem; border: 0; border-radius: 4px; padding: 0.35rem 0.55rem; background: var(--raised-navy); color: var(--frost-white); }

label { display: block; margin: 0.8rem 0 0.4rem; color: #c6d4da; font-size: 0.84rem; font-weight: 650; }
h1, h2, h3, p { overflow-wrap: anywhere; }
h1, h2, h3 { margin: 0; color: var(--frost-white); line-height: 1.18; }
h1 { font-size: clamp(2rem, 3.8vw, 4.5rem); letter-spacing: -0.04em; }
h2 { font-size: clamp(1.35rem, 2vw, 1.9rem); letter-spacing: -0.025em; }
h3 { font-size: 1rem; }

.ranking-shell { width: 100%; min-height: 100vh; }
.full-width { width: 100%; }
.utility-text, .utility-input, .count-badge, .credential-value { font-family: var(--data-font); font-variant-numeric: tabular-nums; }

.eyebrow, .brand-kicker, .section-kicker {
  margin: 0;
  color: var(--signal-cyan);
  font-family: var(--data-font);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.status-message { min-height: 1.3rem; margin: 0.65rem 0 0; color: var(--text-secondary); font-size: 0.82rem; line-height: 1.5; }
.status-message:empty { min-height: 0; margin-top: 0; }
.status-message[data-tone="error"] { color: var(--danger); }
.status-message[data-tone="success"] { color: var(--signal-cyan); }

/* Login */
.login-stage {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(340px, 0.65fr);
  width: min(100% - 48px, 1440px);
  min-height: calc(100vh - 48px);
  margin: 24px auto;
  overflow: hidden;
  border: 1px solid #1e3a48;
  border-radius: 10px;
  background: var(--broadcast-navy);
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.42);
}

.login-brand {
  position: relative;
  display: flex;
  min-width: 0;
  flex-direction: column;
  justify-content: space-between;
  padding: clamp(2rem, 5vw, 5.5rem);
  background:
    radial-gradient(circle at 78% 38%, rgba(47, 124, 246, 0.16), transparent 26rem),
    var(--panel-navy);
}

.login-brand::after { content: ""; position: absolute; right: 0; bottom: 0; left: 0; height: 3px; background: var(--tournament-blue); }
.brand-lockup { display: flex; align-items: center; gap: 0.85rem; min-width: 0; }
.brand-mark { display: inline-flex; width: 3rem; height: 3rem; flex: 0 0 auto; align-items: center; justify-content: center; border: 1px solid #39718a; border-radius: 8px; color: var(--signal-cyan); font: 800 0.95rem var(--data-font); letter-spacing: -0.05em; }
.brand-lockup strong { display: block; margin-top: 0.2rem; font-size: 1rem; }
.brand-kicker { color: #7da9ba; font-size: 0.62rem; }

.login-copy { max-width: 46rem; margin: clamp(3rem, 9vh, 7.5rem) 0 2.5rem; }
.login-copy .eyebrow { margin-bottom: 1rem; }
.login-copy h1 { max-width: 11em; }
.lede { max-width: 37rem; margin: 1.4rem 0 0; color: var(--text-secondary); font-size: clamp(1rem, 1.3vw, 1.2rem); line-height: 1.8; }

.login-preview, .admin-preview { width: min(100%, 45rem); border: 1px solid #254858; border-radius: 8px; padding: 0.8rem; background: #07151f; }
.preview-head { display: flex; justify-content: space-between; padding: 0.3rem 0.5rem 0.65rem; color: #7895a1; font: 750 0.62rem var(--data-font); letter-spacing: 0.14em; }
.preview-head span:last-child { color: var(--champion-gold); }
.preview-row { display: grid; grid-template-columns: 3rem minmax(0, 1fr) auto; align-items: center; gap: 0.8rem; min-height: 3rem; border-top: 1px solid #203744; padding: 0.35rem 0.6rem; }
.preview-row b { color: var(--text-secondary); font: 800 1.15rem var(--data-font); }
.preview-row span { color: #dce7eb; font: 700 0.84rem var(--data-font); letter-spacing: 0.04em; }
.preview-row strong { font: 800 1.05rem var(--data-font); font-variant-numeric: tabular-nums; }
.preview-first { background: #132c38; }
.preview-first b, .preview-first strong { color: var(--champion-gold); }

.login-proof { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin: 1.5rem 0 0; padding: 0; list-style: none; }
.login-proof li { display: grid; gap: 0.15rem; border-top: 1px solid #2a4a59; padding-top: 0.65rem; }
.login-proof strong { color: var(--signal-cyan); font: 800 1.15rem var(--data-font); }
.login-proof span { color: #849eaa; font-size: 0.72rem; }

.login-console { display: flex; min-width: 0; flex-direction: column; justify-content: center; padding: clamp(2rem, 4vw, 4rem); background: var(--broadcast-navy); }
.console-status { display: flex; align-items: center; gap: 0.5rem; margin-bottom: clamp(2rem, 7vh, 5rem); color: #91abb5; font-size: 0.74rem; }
.status-dot, .status-chip i, .signal-badge i { display: inline-block; width: 0.48rem; height: 0.48rem; border-radius: 50%; background: var(--signal-cyan); box-shadow: 0 0 0 3px rgba(85, 214, 232, 0.12); }
.login-console h2 { margin-top: 0.55rem; font-size: clamp(1.65rem, 2.4vw, 2.35rem); }
.console-note { margin: 0.75rem 0 1.2rem; color: var(--text-secondary); font-size: 0.9rem; line-height: 1.65; }
.login-console .primary { margin-top: 1rem; }
.login-divider { display: flex; align-items: center; gap: 0.8rem; margin: 1.4rem 0 0.9rem; color: #6f8994; font-size: 0.72rem; }
.login-divider::before, .login-divider::after { content: ""; height: 1px; flex: 1; background: var(--divider); }
.trial-button { border-color: #3b6172; background: transparent; color: var(--signal-cyan); }
.trial-note { margin: 0.55rem 0 0; color: #728b96; font-size: 0.7rem; line-height: 1.5; }
.apk-download-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1.5rem; border-top: 1px solid var(--divider); padding-top: 1.25rem; }
.apk-download-row strong, .apk-download-row span { display: block; }
.apk-download-row strong { font-size: 0.84rem; }
.apk-download-row span { margin-top: 0.2rem; color: #78919c; font-size: 0.68rem; }
.apk-download { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; border: 1px solid #3c6170; border-radius: 6px; padding: 0.55rem 0.75rem; color: #dfeaec; font-size: 0.75rem; font-weight: 700; text-decoration: none; transition: border-color 160ms ease, background-color 160ms ease; }
.apk-download:hover { border-color: var(--signal-cyan); background: var(--raised-navy); }
.security-note { display: flex; gap: 0.7rem; margin-top: 1.6rem; border-top: 1px solid var(--divider); padding-top: 1rem; color: #8199a4; font-size: 0.78rem; line-height: 1.55; }
.security-note > span { color: var(--signal-cyan); }
.security-note p { margin: 0; }
.admin-preview-row { display: flex; justify-content: space-between; gap: 1rem; border-top: 1px solid #203744; padding: 1rem 0.6rem; color: var(--text-secondary); font-size: 0.84rem; }
.admin-preview-row strong { color: var(--frost-white); }

/* Dashboard shell */
.dashboard { width: min(100%, 1920px); min-height: 100vh; margin: 0 auto; padding: 0 28px 36px; }
.command-header { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 78px; border-bottom: 1px solid var(--divider); background: rgba(5, 13, 20, 0.96); }
.compact-brand .brand-mark { width: 2.45rem; height: 2.45rem; border-radius: 6px; font-size: 0.78rem; }
.compact-brand h1 { margin-top: 0.1rem; font-size: 1.05rem; letter-spacing: 0; }
.dashboard .workspace-brand { display: flex; align-items: center; gap: 13px; min-width: 0; }
.dashboard .workspace-brand-symbol { display: block; position: relative; flex: 0 0 auto; width: 26px; aspect-ratio: 508 / 864; overflow: hidden; mix-blend-mode: screen; }
.dashboard .workspace-brand-symbol img { position: absolute; max-width: none; width: 246.8504%; height: auto; left: -73.4252%; top: -19.4444%; }
.dashboard .workspace-brand-copy { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 14px; min-width: 0; }
.dashboard .workspace-brand h1 { margin: 0; font-family: "Ranking Honghulu Brand", "Microsoft YaHei", sans-serif; font-size: 33px; font-weight: 400; font-synthesis: none; line-height: 1.25; letter-spacing: .02em; white-space: nowrap; }
.dashboard .workspace-brand p { margin: 0; color: var(--text-secondary); font-size: 12px; line-height: 1.6; white-space: nowrap; }
@media (max-width: 1190px) {
  .dashboard .workspace-brand h1 { font-size: 30px; }
}
@media (max-width: 860px) {
  .dashboard .workspace-brand { gap: 10px; }
  .dashboard .workspace-brand-symbol { width: 19px; }
  .dashboard .workspace-brand h1 { font-size: 28px; }
}
@media (max-width: 700px) {
  .dashboard .workspace-brand-symbol { width: 18px; }
  .dashboard .workspace-brand h1 { font-size: 27px; }
}
.account-strip { display: flex; align-items: center; gap: 0.85rem; color: var(--text-secondary); font-size: 0.76rem; }
.status-chip, .signal-badge { display: inline-flex; min-height: 30px; align-items: center; gap: 0.48rem; border: 1px solid #285566; border-radius: 999px; padding: 0.25rem 0.68rem; color: #bde8ef; font-size: 0.7rem; font-weight: 700; }
.status-chip i, .signal-badge i { width: 0.4rem; height: 0.4rem; box-shadow: none; }
.account-expiry-label { display: flex; align-items: center; gap: 0.45rem; }
.account-expiry-label strong { color: var(--frost-white); }
.quiet-button { min-height: 44px; padding: 0.4rem 0.65rem; background: transparent; font-size: 0.75rem; }
.global-message:not(:empty) { margin: 0; border-bottom: 1px solid var(--divider); padding: 0.7rem 0; }
.workspace-intro { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; padding: 32px 0 24px; }
.workspace-intro h2 { margin-top: 0.35rem; font-size: clamp(1.8rem, 2.6vw, 2.8rem); }
.workspace-intro > p { max-width: 38rem; margin: 0; color: var(--text-secondary); font-size: 0.84rem; line-height: 1.65; text-align: right; }

.workbench { display: grid; grid-template-columns: minmax(230px, 0.7fr) minmax(560px, 1.65fr) minmax(300px, 0.9fr); min-height: calc(100vh - 210px); border: 1px solid var(--divider); border-radius: 10px; overflow: hidden; background: var(--broadcast-navy); }
.board-bay, .editor-bay, .tv-bay { min-width: 0; padding: 1.4rem; }
.board-bay { background: #07151f; }
.editor-bay { border-inline: 1px solid var(--divider); background: var(--broadcast-navy); }
.tv-bay { background: #091923; }
.section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 1.25rem; }
.section-heading > div { position: relative; padding-left: 2.9rem; }
.step-number { position: absolute; top: 0; left: 0; color: #527181; font: 800 1.15rem var(--data-font); }
.section-kicker { margin-bottom: 0.25rem; color: #6f94a4; font-size: 0.58rem; }
.section-heading h2 { font-size: 1.2rem; letter-spacing: -0.01em; }
.count-badge { display: inline-flex; min-width: 3rem; min-height: 2rem; align-items: center; justify-content: center; border: 1px solid #2d5060; border-radius: 999px; color: var(--signal-cyan); font-size: 0.74rem; }
.section-hint { color: #6f8994; font-size: 0.7rem; }

.board-list, .playlist-list, .device-list, .admin-account-list, .security-event-list { display: grid; gap: 0.6rem; margin-top: 1rem; }
.board-item, .playlist-item, .device-item, .admin-account, .security-event { border: 1px solid #213c49; border-radius: 7px; padding: 0.9rem; background: #0a1b26; }
.board-item { transition: border-color 160ms ease, background-color 160ms ease; }
.board-item:hover { border-color: #3a6070; background: #0d2230; }
.board-item h3, .admin-account h3, .security-event h3 { margin: 0 0 0.35rem; font-size: 0.92rem; }
.board-meta, .account-meta, .security-meta, .section-description { margin: 0; color: var(--text-secondary); font-size: 0.72rem; line-height: 1.6; }
.compact-actions { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.7rem; }
.compact-actions button { min-height: 44px; padding: 0.35rem 0.55rem; font-size: 0.7rem; }
.compact-actions [data-action="download-portrait"] { flex: 0 0 auto; border-color: #315b6d; color: var(--signal-cyan); }
.compact-actions [data-action="download-portrait"]:hover { border-color: var(--signal-cyan); background: #0c2633; }
.compact-actions [data-portrait-mode="preview"] { border-color: #8a713b; color: #f0cf79; background: rgba(128, 94, 30, 0.09); }
.compact-actions [data-portrait-mode="preview"]:hover { border-color: #dfbd68; background: rgba(128, 94, 30, 0.18); }

body.portrait-preview-open { overflow: hidden; }
.portrait-preview-modal { position: fixed; inset: 0; z-index: 120; display: grid; place-items: center; padding: 1.25rem; background: rgba(0, 6, 12, 0.88); backdrop-filter: blur(12px); }
.portrait-preview-modal[hidden] { display: none; }
.portrait-preview-panel { width: min(760px, 100%); max-height: calc(100vh - 2.5rem); display: flex; flex-direction: column; overflow: hidden; border: 1px solid #355365; border-radius: 16px; background: #071620; box-shadow: 0 30px 100px rgba(0, 0, 0, 0.65); }
.portrait-preview-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding: 1.2rem 1.25rem 0.85rem; border-bottom: 1px solid var(--divider); }
.portrait-preview-header h2 { margin: 0.35rem 0 0; font-size: 1.2rem; }
.portrait-preview-badge { color: #e5c36d; font-size: 0.62rem; font-weight: 760; letter-spacing: 0.16em; }
.portrait-preview-close { width: 42px; min-width: 42px; height: 42px; padding: 0; border-radius: 50%; font-size: 1.35rem; line-height: 1; }
.portrait-preview-note { margin: 0; padding: 0.8rem 1.25rem; color: #a1b3bc; font-size: 0.75rem; line-height: 1.65; background: rgba(213, 174, 79, 0.05); }
.portrait-preview-stage { min-height: 0; flex: 1 1 auto; overflow: auto; display: grid; justify-items: center; padding: 1rem; background: #020b12; }
.portrait-preview-stage img { display: block; width: min(540px, 100%); height: auto; box-shadow: 0 18px 55px rgba(0, 0, 0, 0.55); user-select: none; -webkit-user-drag: none; }
.portrait-preview-actions { display: flex; justify-content: flex-end; padding: 0.9rem 1.25rem; border-top: 1px solid var(--divider); }
.portrait-preview-actions button { min-width: 120px; }

.profile-section, .board-editor, .broadcast-section { border-top: 1px solid var(--divider); padding-top: 1.2rem; }
.profile-section { border-top: 0; padding-top: 0; }
.subsection-title { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin-bottom: 0.25rem; }
.subsection-title h3 { font-size: 0.92rem; }
.subsection-title span { color: #78919c; font-size: 0.68rem; text-align: right; }
.profile-grid, .field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.8rem; }
.theme-field { grid-column: 1 / -1; }
.theme-field p { margin: 0.45rem 0 0; color: #78919c; font-size: 0.7rem; line-height: 1.5; }
.theme-field .display-effects-toggle { display: flex; align-items: center; gap: 0.6rem; margin: 0.9rem 0 0; cursor: pointer; }
.theme-field .display-effects-toggle input { flex: 0 0 auto; width: 20px; height: 20px; min-height: 20px; margin: 0; padding: 0; accent-color: #df1728; cursor: pointer; }
.section-action { display: flex; justify-content: flex-end; margin-top: 0.85rem; }
.board-description-label { display: flex; align-items: baseline; justify-content: space-between; gap: 0.5rem; }
.board-description-count { color: var(--text-secondary); font-size: 0.7rem; white-space: nowrap; }
.board-description-count[data-tone="error"] { color: var(--danger); }
#board-match-description { display: block; resize: vertical; line-height: 1.6; }
.board-editor { margin-top: 1.6rem; }
.editor-empty { display: flex; max-width: 35rem; align-items: center; gap: 1.1rem; margin: clamp(3rem, 12vh, 7rem) auto 0; border-top: 1px solid var(--divider); border-bottom: 1px solid var(--divider); padding: 1.4rem 0; color: var(--text-secondary); }
.editor-empty-number { color: #3e6576; font: 800 clamp(2.4rem, 4vw, 4.5rem) var(--data-font); line-height: 1; }
.editor-empty strong { color: var(--frost-white); font-size: 1rem; }
.editor-empty p { margin: 0.4rem 0 0; font-size: 0.76rem; line-height: 1.65; }
#board-editor:not([hidden]) + .editor-empty { display: none; }

.import-strip { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 0.6rem; margin-top: 1rem; border: 1px dashed #315463; border-radius: 7px; padding: 0.85rem; background: #071923; }
.import-copy strong, .import-copy span { display: block; }
.import-copy strong { font-size: 0.82rem; }
.import-copy span { margin-top: 0.2rem; color: #7f98a3; font-size: 0.68rem; line-height: 1.45; }
.import-strip label { margin: 0; }
.file-label { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; border: 1px solid var(--divider); border-radius: 6px; padding: 0.55rem 0.75rem; color: var(--frost-white); cursor: pointer; }
.import-strip input[type="file"] { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }

.import-review { margin-top: 0.9rem; border: 1px solid #315463; border-radius: 8px; padding: 1rem; background: linear-gradient(145deg, #0b202c, #071721 72%); box-shadow: inset 0 1px 0 rgba(117, 216, 255, 0.08); }
.import-review-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.import-review-heading h4 { margin: 0.15rem 0 0; font-size: 1rem; }
.confidence-badge { flex: 0 0 auto; border: 1px solid #315b6d; border-radius: 999px; padding: 0.35rem 0.6rem; color: var(--signal-cyan); font-size: 0.68rem; font-weight: 700; }
.confidence-badge[data-confidence="medium"] { border-color: #927236; color: var(--gold); }
.confidence-badge[data-confidence="low"] { border-color: #8b4b55; color: #ff9ca8; }
.import-summary { margin: 0.75rem 0 0; color: var(--text-secondary); font-size: 0.76rem; line-height: 1.65; }
.import-mapping-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.7rem; margin-top: 0.8rem; }
.import-count-field { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 0.75rem; margin-top: 0.75rem; border: 1px solid rgba(49, 84, 99, 0.72); border-radius: 7px; padding: 0.65rem 0.75rem; background: rgba(5, 18, 27, 0.48); }
.import-count-field > label { color: #a8c0ca; font-size: 0.7rem; font-weight: 700; }
.import-count-field > small { color: #78919c; font-size: 0.66rem; white-space: nowrap; }
.import-count-control { display: grid; grid-template-columns: 2.35rem 4.5rem 2.35rem auto; align-items: center; gap: 0.35rem; }
.import-count-control button { min-height: 36px; padding: 0; color: var(--signal-cyan); font-size: 1rem; }
.import-count-control input { width: 100%; min-width: 0; min-height: 36px; padding-inline: 0.4rem; color: var(--frost-white); font-weight: 800; text-align: center; font-variant-numeric: tabular-nums; }
.import-count-control input::-webkit-inner-spin-button,
.import-count-control input::-webkit-outer-spin-button { margin: 0; appearance: none; }
.import-count-control span { color: #a8c0ca; font-size: 0.7rem; }
.import-preview-block { margin-top: 0.85rem; border-top: 1px solid var(--divider); padding-top: 0.8rem; }
.import-preview-title { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; }
.import-preview-title strong { font-size: 0.8rem; }
.import-preview-title span { color: #78919c; font-size: 0.66rem; }
.import-preview { display: grid; max-height: 390px; overflow-y: auto; gap: 0.25rem; margin-top: 0.55rem; overscroll-behavior: contain; scrollbar-color: #315463 #071721; }
.import-preview-row { display: grid; grid-template-columns: 2.2rem minmax(0, 1fr) minmax(5rem, auto); align-items: center; min-height: 34px; border-bottom: 1px solid rgba(49, 84, 99, 0.55); padding: 0.25rem 0.35rem; font-size: 0.74rem; }
.import-preview-row:last-child { border-bottom: 0; }
.import-preview-rank { color: #78919c; font-variant-numeric: tabular-nums; }
.import-preview-name { overflow: hidden; color: var(--frost-white); font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.import-preview-points { color: var(--signal-cyan); font-weight: 800; text-align: right; font-variant-numeric: tabular-nums; }
.import-preview-row:nth-child(-n+3) .import-preview-rank,
.import-preview-row:nth-child(-n+3) .import-preview-points { color: var(--gold); }
.import-review-actions { justify-content: flex-end; }

.entry-table { overflow-x: auto; margin-top: 0.9rem; }
.entry-table table { width: 100%; border-collapse: collapse; }
.entry-table th { color: #77919c; font-size: 0.68rem; font-weight: 700; letter-spacing: 0.06em; }
.entry-table th, .entry-table td { border-bottom: 1px solid #203946; padding: 0.5rem; text-align: left; }
.entry-table th:first-child { width: 3rem; text-align: center; }
.entry-table th:last-child { width: 4.5rem; }
.entry-table input { min-width: 7rem; }
.entry-table .compact-actions { margin-top: 0; }
.dashboard .entry-table .entry-row { align-items: start; }
.dashboard .entry-table .entry-row td { vertical-align: top; }
.dashboard .entry-table input, .dashboard .entry-table .entry-delete-cell button { height: 48px; min-height: 48px; }
.dashboard .entry-table input { display: block; }
.dashboard .entry-table .entry-rank-preview { line-height: 48px; }
.dashboard .entry-table .entry-row-error { min-height: 0; }
.dashboard .entry-table .entry-row-error:empty { display: none; }
.entry-person { display: flex; align-items: center; gap: 0.5rem; min-width: 0; }
.entry-person input { flex: 1 1 auto; width: 0; }
.entry-avatar { position: relative; display: block; flex: 0 0 32px; width: 32px; height: 32px; overflow: hidden; border-radius: 50%; background: #dce5ec; color: #31495e; font: 700 16px/32px sans-serif; text-align: center; }
.entry-avatar-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.entry-avatar-image[hidden], .entry-avatar-fallback[hidden] { display: none; }
.podium-settings { margin: 1rem 0; padding: 0.75rem; border: 1px solid var(--divider); border-radius: 8px; }
.podium-settings legend { padding: 0 0.35rem; font-size: 0.85rem; font-weight: 700; }
.podium-toggles { display: flex; flex-wrap: wrap; gap: 0.75rem 1.25rem; }
.podium-toggles label { display: flex; align-items: center; gap: 0.4rem; margin: 0; }
.podium-toggles input { width: 1.1rem; height: 1.1rem; margin: 0; accent-color: var(--champion-gold); }
.entry-table .podium-entry-table th { white-space: nowrap; }
.entry-table .podium-count-cell input { min-width: 5.5rem; }
.podium-mobile-label { display: none; }
.import-preview-counts { grid-column: 2 / -1; margin-top: 0.2rem; color: var(--text-secondary); font-size: 0.7rem; }
.button-row { display: flex; flex-wrap: wrap; gap: 0.6rem; margin-top: 1rem; }
.device-name { margin: 0 0 0.45rem; font-weight: 700; overflow-wrap: anywhere; }
.device-item .button-row { margin-top: 0.7rem; }
.device-remark-dialog { width: min(500px, calc(100% - 2rem)); max-height: calc(100% - 2rem); overflow: auto; border: 1px solid #315566; border-radius: 10px; padding: 1.5rem; background: var(--broadcast-navy); color: var(--frost-white); box-shadow: 0 24px 64px rgba(0, 0, 0, 0.42); }
.device-remark-dialog::backdrop { background: rgba(0, 6, 12, 0.82); }
.device-remark-dialog h2 { font-size: 1.35rem; }
.device-remark-dialog .board-meta { margin-top: 0.7rem; line-height: 1.65; }
.device-remark-dialog .button-row { justify-content: flex-end; }
.editor-actions { justify-content: flex-end; }
.board-maintenance-actions { margin-top: 1rem; }
#board-editor[inert] { opacity: 0.65; }

.cumulative-panel { margin-top: 1.2rem; border-top: 1px solid var(--divider); padding-top: 1rem; }
.cumulative-panel h4 { margin: 0.6rem 0; }
.round-list { display: grid; gap: 0.5rem; margin-top: 0.8rem; }
.round-list .board-item { display: flex; align-items: center; justify-content: space-between; gap: 0.6rem; }
.round-list .compact-actions { margin: 0; }
.round-pagination { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; margin-top: 0.7rem; font-size: 0.72rem; color: var(--text-secondary); }
.round-pagination button { padding-inline: 0.55rem; font-size: 0.72rem; }
.round-editor { margin-top: 1rem; border: 1px solid #315463; border-radius: 7px; padding: 0.85rem; background: #071923; }
.round-entry-table, .round-import-preview { display: grid; gap: 0.5rem; margin-top: 0.8rem; max-height: 30rem; overflow-y: auto; }
.round-entry-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(5rem, 0.65fr) auto; gap: 0.5rem; align-items: center; }
.round-entry-row input { min-width: 0; }
.round-entry-row input[readonly] { background: transparent; border-color: transparent; }
.round-existing-controls { margin-top: 0.8rem; }
.round-existing-controls select { min-width: 0; }
.batch-import-rounds { display: grid; gap: 0.6rem; max-height: 24rem; overflow-y: auto; }
.batch-import-rounds summary { cursor: pointer; padding-block: 0.5rem; }
.batch-import-rounds table { width: 100%; }
.batch-import-rounds td, .batch-import-rounds th { padding: 0.3rem; text-align: left; }
.batch-import-player { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1fr) minmax(0, 1fr); }
.round-import-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 4rem; gap: 0.5rem; align-items: center; }
.round-import-row input, .round-import-row select { min-width: 0; }
.round-import-row span { color: var(--signal-cyan); text-align: right; font-variant-numeric: tabular-nums; }
.round-list .board-item h3 { overflow-wrap: anywhere; }

.broadcast-section { margin-top: 1.25rem; }
.broadcast-section:first-of-type { margin-top: 0; border-top: 0; padding-top: 0; }
.dwell-control { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 0.5rem; }
.dwell-control span { color: var(--text-secondary); font-size: 0.75rem; }
.playlist-mode-hint { margin: 0.5rem 0 1rem; color: var(--text-secondary); font-size: 0.75rem; line-height: 1.6; }
.playlist-preview { margin-top: 0.6rem; }
.playlist-item { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 0.55rem; cursor: grab; }
.playlist-item input { width: 1.1rem; min-height: 1.1rem; }
.playlist-item label { margin: 0; color: var(--frost-white); }
.playlist-item .compact-actions { margin: 0; flex-wrap: nowrap; }
.playlist-item[aria-grabbed="true"] { border-color: var(--signal-cyan); background: var(--raised-navy); }
.inline-control { display: grid; grid-template-columns: 1fr auto; gap: 0.5rem; }
.pairing-code { font-size: 1.15rem; font-weight: 800; letter-spacing: 0.18em; text-align: center; }

.entry-rank-preview { color: var(--champion-gold); font-weight: 800; text-align: center; }
.entry-row-error { min-height: 1rem; margin: 0.25rem 0 0; color: var(--danger); font-size: 0.68rem; line-height: 1.35; }
.entry-row[data-invalid="true"] input { border-color: #a95462; }

/* Admin */
.admin-grid { display: grid; grid-template-columns: minmax(280px, 0.72fr) minmax(560px, 1.55fr); gap: 1rem; }
.admin-create, .admin-accounts, .admin-events { min-width: 0; border: 1px solid var(--divider); border-radius: 10px; padding: 1.4rem; background: var(--broadcast-navy); }
.admin-create { align-self: start; }
.admin-create .primary { margin-top: 1rem; }
.admin-events { grid-column: 1 / -1; }
.admin-account { padding: 1rem; }
.admin-account > label { margin-top: 0.85rem; }
.security-event { display: grid; grid-template-columns: minmax(8rem, 0.4fr) minmax(0, 1.6fr); align-items: center; gap: 1rem; }
.security-event h3 { margin: 0; font-family: var(--data-font); }
.credential-modal { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 1.25rem; background: rgba(2, 8, 12, 0.84); }
.credential-dialog { width: min(100%, 500px); border: 1px solid #315566; border-radius: 10px; padding: 1.8rem; background: var(--broadcast-navy); box-shadow: 0 24px 64px rgba(0, 0, 0, 0.42); }
.credential-icon { display: inline-flex; width: 3rem; height: 3rem; align-items: center; justify-content: center; margin-bottom: 1rem; border: 1px solid var(--champion-gold); border-radius: 50%; color: var(--champion-gold); font: 800 0.9rem var(--data-font); }
.credential-dialog h2 { margin-top: 0.45rem; }
.credential-value { display: block; margin: 1rem 0; border: 1px solid #315566; border-radius: 6px; padding: 1rem; background: #06131c; color: var(--signal-cyan); font-size: 1.15rem; overflow-wrap: anywhere; }
.warning-text { color: var(--danger); line-height: 1.55; }

@media (min-width: 721px) {
  .entry-table .entry-delete-cell button { min-width: 3.5rem; padding-inline: 0.5rem; white-space: nowrap; }
}

@media (max-width: 1180px) {
  .workbench { grid-template-columns: minmax(230px, 0.72fr) minmax(500px, 1.45fr); }
  .tv-bay { grid-column: 1 / -1; border-top: 1px solid var(--divider); }
  .editor-bay { border-right: 0; }
  .broadcast-rail { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
  .broadcast-rail > .section-heading { grid-column: 1 / -1; }
  .broadcast-section { margin-top: 0; border-top: 0; border-left: 1px solid var(--divider); padding: 0 0 0 1rem; }
  .broadcast-section:first-of-type { border-left: 0; padding-left: 0; }
}

@media (max-width: 900px) {
  .login-stage { grid-template-columns: 1fr; width: min(100% - 28px, 760px); margin: 14px auto; }
  .login-brand { min-height: auto; padding: 2rem; }
  .login-copy { margin: 3.5rem 0 2rem; }
  .login-copy h1 br { display: none; }
  .login-console { padding: 2rem; }
  .console-status { margin-bottom: 2rem; }
  .workbench { grid-template-columns: 220px minmax(0, 1fr); }
  .tv-bay { grid-column: 1 / -1; }
  .broadcast-rail { grid-template-columns: 1fr; }
  .broadcast-section, .broadcast-section:first-of-type { border-top: 1px solid var(--divider); border-left: 0; padding: 1rem 0 0; }
  .admin-grid { grid-template-columns: 1fr; }
  .admin-events { grid-column: auto; }
}

@media (max-width: 720px) {
  body { background: var(--arena-black); }
  .login-stage { width: 100%; min-height: 100vh; margin: 0; border: 0; border-radius: 0; }
  .login-brand, .login-console { padding: 1.35rem; }
  .login-copy { margin: 3rem 0 1.6rem; }
  .login-copy h1 { font-size: clamp(2.2rem, 11vw, 3.25rem); }
  .login-preview, .admin-preview { display: none; }
  .login-proof { gap: 0.5rem; }
  .apk-download-row { align-items: flex-start; flex-direction: column; }
  .apk-download { width: 100%; min-height: 44px; }
  .dashboard { padding: 0 14px 24px; }
  .command-header { position: static; min-height: 70px; align-items: flex-start; flex-direction: column; padding: 0.9rem 0; }
  .account-strip { width: 100%; flex-wrap: wrap; }
  .account-expiry-label { order: 3; width: 100%; }
  .account-strip .quiet-button { margin-left: auto; }
  .workspace-intro { align-items: flex-start; flex-direction: column; padding: 24px 0 18px; }
  .workspace-intro > p { text-align: left; }
  .workbench { display: block; min-height: 0; border: 0; border-radius: 0; background: transparent; }
  .board-bay, .editor-bay, .tv-bay { border: 1px solid var(--divider); border-radius: 9px; margin-top: 0.75rem; padding: 1rem; }
  .editor-bay { border-inline: 1px solid var(--divider); }
  .profile-grid, .field-grid { grid-template-columns: 1fr; }
  .subsection-title { align-items: flex-start; flex-direction: column; gap: 0.25rem; }
  .subsection-title span { text-align: left; }
  .import-strip { grid-template-columns: 1fr 1fr; }
  .editor-empty { margin-top: 2rem; }
  .import-copy { grid-column: 1 / -1; }
  .import-mapping-grid { grid-template-columns: 1fr; }
  .import-count-field { grid-template-columns: 1fr auto; }
  .import-count-field > label { grid-column: 1 / -1; }
  .import-count-control { grid-template-columns: 2.5rem minmax(4rem, 1fr) 2.5rem auto; }
  .import-preview-title { align-items: flex-start; flex-direction: column; gap: 0.2rem; }
  .button-row > button { flex: 1 1 9rem; }
  .compact-actions button { min-height: 44px; }
  .entry-table { overflow-x: visible; }
  .entry-table table, .entry-table tbody { display: block; width: 100%; }
  .entry-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .entry-table tr { display: grid; grid-template-columns: 2rem minmax(0, 1fr) minmax(0, 0.75fr) auto; align-items: center; gap: 0.3rem; border-bottom: 1px solid var(--divider); }
  .entry-table td { min-width: 0; border: 0; padding: 0.45rem 0; }
  .entry-table input { width: 100%; min-width: 0; padding-inline: 0.4rem; }
  .entry-table button { min-width: 0; padding-inline: 0.45rem; }
  .entry-table .podium-entry-table tr { grid-template-columns: repeat(12, minmax(0, 1fr)); }
  .entry-table .podium-entry-table td:first-child { grid-column: 1; }
  .entry-table .podium-entry-table td:nth-child(2) { grid-column: 2 / 8; }
  .entry-table .podium-entry-table td:nth-child(3) { grid-column: 8 / 11; }
  .entry-table .podium-entry-table .entry-delete-cell { grid-column: 11 / 13; grid-row: 1; }
  .entry-table .podium-entry-table .podium-count-cell { grid-row: 2; grid-column: span 4; }
  .entry-table .podium-count-cell input { min-width: 0; }
  .podium-mobile-label { display: block; margin-bottom: 0.2rem; color: var(--text-secondary); font-size: 0.7rem; }
  .admin-create, .admin-accounts, .admin-events { padding: 1rem; }
  .security-event { grid-template-columns: 1fr; gap: 0.25rem; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}

/* Phone workspace: one task at a time, with the clock's persistent bottom navigation. */
.mobile-workspace-heading, .mobile-workspace-nav, .mobile-editor-back { display: none; }

/* Match the phone workspace palette without changing the desktop layout or TV themes. */
@media (min-width: 721px) {
  html[data-ranking-customer-auto] .dashboard,
  html[data-ranking-customer-auto] .device-remark-dialog,
  html[data-ranking-customer-auto] .portrait-preview-modal {
    --arena-black: #101010;
    --broadcast-navy: #171717;
    --panel-navy: #1d1b1b;
    --raised-navy: #292323;
    --tournament-blue: #df1728;
    --signal-cyan: #ffb8bf;
    --frost-white: #f4f2f2;
    --text-secondary: #aaa6a6;
    --divider: #343131;
    color: var(--frost-white);
  }
  html[data-ranking-customer-auto],
  html[data-ranking-customer-auto] body { background: #101010; }
  html[data-ranking-customer-auto] .dashboard .command-header { background: rgba(16, 16, 16, 0.96); }
  html[data-ranking-customer-auto] .dashboard .board-bay,
  html[data-ranking-customer-auto] .dashboard .tv-bay { background: var(--broadcast-navy); }
  html[data-ranking-customer-auto] .dashboard .brand-mark { border-color: #6b323a; background: #321a1e; color: #ffb8bf; }
  html[data-ranking-customer-auto] .dashboard .brand-kicker,
  html[data-ranking-customer-auto] .dashboard .section-kicker,
  html[data-ranking-customer-auto] .dashboard .step-number { color: #918787; }
  html[data-ranking-customer-auto] .dashboard .account-expiry-label strong { color: #c8bebe; }
  html[data-ranking-customer-auto] .dashboard .status-chip,
  html[data-ranking-customer-auto] .dashboard .signal-badge,
  html[data-ranking-customer-auto] .dashboard .count-badge { border-color: #49373a; background: #251c1e; color: #ffb8bf; }
  html[data-ranking-customer-auto] .dashboard .board-item,
  html[data-ranking-customer-auto] .dashboard .playlist-item,
  html[data-ranking-customer-auto] .dashboard .device-item { border-color: var(--divider); background: var(--broadcast-navy); }
  html[data-ranking-customer-auto] .dashboard .board-item:hover { border-color: #866067; background: var(--panel-navy); }
  html[data-ranking-customer-auto] .dashboard .playlist-item[aria-grabbed="true"] { border-color: var(--signal-cyan); background: var(--raised-navy); }
  html[data-ranking-customer-auto] .dashboard button,
  html[data-ranking-customer-auto] .device-remark-dialog button,
  html[data-ranking-customer-auto] .portrait-preview-panel button { border-color: #493d3d; background: #211d1d; }
  html[data-ranking-customer-auto] .dashboard button:hover,
  html[data-ranking-customer-auto] .device-remark-dialog button:hover,
  html[data-ranking-customer-auto] .portrait-preview-panel button:hover { border-color: #866067; background: #302427; }
  html[data-ranking-customer-auto] .dashboard button.primary,
  html[data-ranking-customer-auto] .dashboard #save-profile,
  html[data-ranking-customer-auto] .portrait-preview-panel button.primary,
  html[data-ranking-customer-auto] .device-remark-dialog button.primary { border-color: #df1728; background: #df1728; color: #fff; }
  html[data-ranking-customer-auto] .dashboard button.primary:hover,
  html[data-ranking-customer-auto] .dashboard #save-profile:hover,
  html[data-ranking-customer-auto] .portrait-preview-panel button.primary:hover,
  html[data-ranking-customer-auto] .device-remark-dialog button.primary:hover { background: #c91424; }
  html[data-ranking-customer-auto] .dashboard button.danger { border-color: #654149; color: var(--danger); }
  html[data-ranking-customer-auto] .dashboard .compact-actions [data-action="edit"] { border-color: #71343d; background: #321a1e; color: #ffb8bf; }
  html[data-ranking-customer-auto] .dashboard .compact-actions [data-action="download-portrait"] { border-color: #4c3b3e; color: #d6c5c7; }
  html[data-ranking-customer-auto] .dashboard .compact-actions [data-action="download-portrait"]:hover { border-color: #866067; background: #302427; }
  html[data-ranking-customer-auto] .dashboard input,
  html[data-ranking-customer-auto] .dashboard select,
  html[data-ranking-customer-auto] .dashboard textarea,
  html[data-ranking-customer-auto] .device-remark-dialog input { border-color: #433939; background: #191717; }
  html[data-ranking-customer-auto] .dashboard input:focus,
  html[data-ranking-customer-auto] .dashboard select:focus,
  html[data-ranking-customer-auto] .dashboard textarea:focus,
  html[data-ranking-customer-auto] .device-remark-dialog input:focus { border-color: #e7838d; background: #211a1b; }
  html[data-ranking-customer-auto] .dashboard input::placeholder,
  html[data-ranking-customer-auto] .dashboard textarea::placeholder,
  html[data-ranking-customer-auto] .device-remark-dialog input::placeholder { color: #817777; }
  html[data-ranking-customer-auto] .dashboard input[type="checkbox"] { accent-color: #df1728; }
  html[data-ranking-customer-auto] .dashboard .round-entry-row input[readonly] { border-color: transparent; background: transparent; }
  html[data-ranking-customer-auto] .dashboard .entry-row[data-invalid="true"] input { border-color: #a95462; }
  html[data-ranking-customer-auto] .dashboard label { color: #cbc4c4; }
  html[data-ranking-customer-auto] .dashboard .section-hint,
  html[data-ranking-customer-auto] .dashboard .subsection-title span,
  html[data-ranking-customer-auto] .dashboard .theme-field p,
  html[data-ranking-customer-auto] .dashboard .import-copy span,
  html[data-ranking-customer-auto] .dashboard .import-count-field > small,
  html[data-ranking-customer-auto] .dashboard .import-count-control span,
  html[data-ranking-customer-auto] .dashboard .import-preview-title span,
  html[data-ranking-customer-auto] .dashboard .import-preview-rank,
  html[data-ranking-customer-auto] .dashboard .entry-table th { color: var(--text-secondary); }
  html[data-ranking-customer-auto] .dashboard .editor-empty-number { color: #918787; }
  html[data-ranking-customer-auto] .dashboard .champion-settings,
  html[data-ranking-customer-auto] .dashboard .round-editor,
  html[data-ranking-customer-auto] .dashboard .import-review,
  html[data-ranking-customer-auto] .dashboard .import-strip { border-color: #443638; background: #191717; box-shadow: none; }
  html[data-ranking-customer-auto] .dashboard .import-count-field,
  html[data-ranking-customer-auto] .dashboard .import-preview { border-color: #443638; background: #171717; }
  html[data-ranking-customer-auto] .dashboard .import-preview { scrollbar-color: #443638 #171717; }
  html[data-ranking-customer-auto] .dashboard .confidence-badge { border-color: #71343d; color: #ffb8bf; }
  html[data-ranking-customer-auto] .dashboard .confidence-badge[data-confidence="medium"] { border-color: #927236; color: var(--gold); }
  html[data-ranking-customer-auto] .dashboard .confidence-badge[data-confidence="low"] { border-color: #8b4b55; color: #ff9ca8; }
  html[data-ranking-customer-auto] .dashboard .import-preview-row,
  html[data-ranking-customer-auto] .dashboard .entry-table th,
  html[data-ranking-customer-auto] .dashboard .entry-table td { border-bottom-color: var(--divider); }
  html[data-ranking-customer-auto] .device-remark-dialog,
  html[data-ranking-customer-auto] .portrait-preview-panel { border-color: #443638; background: #171717; }
  html[data-ranking-customer-auto] .device-remark-dialog::backdrop,
  html[data-ranking-customer-auto] .portrait-preview-modal { background: rgba(0, 0, 0, 0.88); }
  html[data-ranking-customer-auto] .portrait-preview-stage { background: #101010; }
  html[data-ranking-customer-auto] .portrait-preview-note { color: var(--text-secondary); }
}

@media (max-width: 720px) {
  html, body { min-width: 0; }
  .dashboard {
    --arena-black: #101010;
    --broadcast-navy: #171717;
    --panel-navy: #1d1b1b;
    --raised-navy: #292323;
    --tournament-blue: #df1728;
    --signal-cyan: #ffb8bf;
    --frost-white: #f4f2f2;
    --text-secondary: #aaa6a6;
    --divider: #343131;
    min-height: 100vh;
    min-height: 100dvh;
    padding: 0 max(16px, env(safe-area-inset-right)) calc(100px + env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
    background: var(--arena-black);
    color: var(--frost-white);
  }
  .dashboard .command-header {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    min-height: 0;
    padding: calc(22px + env(safe-area-inset-top)) 0 16px;
    border: 0;
    background: var(--arena-black);
  }
  .dashboard .compact-brand { gap: 9px; }
  .dashboard .compact-brand .brand-mark { width: 32px; height: 32px; border-color: #6b323a; background: #321a1e; color: #ffb8bf; }
  .dashboard .compact-brand h1 { font-size: 17px; }
  .dashboard .brand-kicker { color: #918787; font-size: 8px; letter-spacing: 0.1em; }
  .dashboard .account-strip { display: contents; }
  .dashboard .status-chip { display: none; }
  .dashboard .account-expiry-label { grid-column: 1 / -1; grid-row: 2; width: auto; font-size: 11px; }
  .dashboard .account-expiry-label strong { color: #c8bebe; }
  .dashboard .account-strip .quiet-button { grid-column: 2; grid-row: 1; margin: 0; border: 0; padding-inline: 4px; color: #b5aaaa; font-size: 12px; }
  .dashboard .workspace-intro { display: none; }
  .mobile-workspace-heading { display: block; padding: 12px 0 22px; }
  .mobile-workspace-heading h2 { font-size: 25px; line-height: 1.4; letter-spacing: 0; }
  .mobile-workspace-heading p { margin: 6px 0 0; color: var(--text-secondary); font-size: 13px; line-height: 1.6; }
  .dashboard .workbench { display: contents; }
  .dashboard .editor-bay, .dashboard .tv-bay { display: contents; }
  .dashboard .editor-heading, .dashboard .tv-bay > .section-heading, .dashboard .editor-empty { display: none; }
  .dashboard #mobile-pane-boards, .dashboard #mobile-pane-brand,
  .dashboard #mobile-pane-playlist, .dashboard #mobile-pane-tv, .dashboard #board-editor { display: none; }
  .dashboard[data-mobile-page="boards"] #mobile-pane-boards,
  .dashboard[data-mobile-page="brand"] #mobile-pane-brand,
  .dashboard[data-mobile-page="playlist"] #mobile-pane-playlist,
  .dashboard[data-mobile-page="tv"] #mobile-pane-tv,
  .dashboard[data-mobile-page="editor"] #board-editor:not([hidden]) { display: block; }
  .dashboard .board-bay, .dashboard .profile-section, .dashboard .board-editor,
  .dashboard .broadcast-section { margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; }
  .dashboard .board-bay > .section-heading { align-items: center; margin-bottom: 14px; }
  .dashboard .section-heading > div { padding: 0; }
  .dashboard .step-number, .dashboard .section-kicker { display: none; }
  .dashboard .section-heading h2 { font-size: 15px; color: #c8bebe; }
  .dashboard .count-badge { min-height: 26px; border-color: #49373a; background: #251c1e; color: #ffb8bf; }
  .dashboard .board-list { gap: 12px; margin-top: 16px; }
  .dashboard .board-item, .dashboard .playlist-item, .dashboard .device-item { padding: 16px; border-color: var(--divider); border-radius: 10px; background: var(--broadcast-navy); }
  .dashboard .board-item h3 { margin-bottom: 6px; font-size: 17px; line-height: 1.4; }
  .dashboard .board-meta, .dashboard .section-description { font-size: 12px; }
  .dashboard .compact-actions { gap: 8px; margin-top: 12px; }
  .dashboard .compact-actions button { flex: 1 1 auto; font-size: 12px; }
  .dashboard .compact-actions [data-action="edit"] { color: #ffb8bf; border-color: #71343d; background: #321a1e; }
  .dashboard .compact-actions [data-action="download-portrait"] { color: #d6c5c7; border-color: #4c3b3e; }
  .dashboard button { min-height: 46px; border-color: #493d3d; background: #211d1d; font-size: 14px; }
  .dashboard button:hover { border-color: #866067; background: #302427; }
  .dashboard button.primary, .dashboard #save-profile { border-color: #df1728; background: #df1728; color: #fff; }
  .dashboard button.primary:hover, .dashboard #save-profile:hover { background: #c91424; }
  .dashboard button.danger { color: var(--danger); border-color: #654149; }
  .dashboard input, .dashboard select, .dashboard textarea { min-width: 0; min-height: 48px; padding: 11px 12px; border-color: #433939; background: #191717; font-size: 16px; }
  .dashboard input:focus, .dashboard select:focus, .dashboard textarea:focus { border-color: #e7838d; background: #211a1b; }
  .dashboard input::placeholder, .dashboard textarea::placeholder { color: #817777; }
  .dashboard input[type="checkbox"] { min-height: 20px; width: 20px; height: 20px; accent-color: #df1728; }
  .dashboard input[type="file"] { font-size: 13px; }
  .dashboard label { margin-top: 18px; margin-bottom: 7px; color: #cbc4c4; font-size: 13px; }
  .dashboard .profile-grid, .dashboard .field-grid { gap: 0; }
  .dashboard .subsection-title { margin-bottom: 12px; }
  .dashboard .subsection-title h3 { font-size: 16px; }
  .dashboard .subsection-title span { color: var(--text-secondary); font-size: 12px; }
  .dashboard .section-action { margin-top: 24px; }
  .dashboard .section-action button { width: 100%; }
  .dashboard .playlist-list { margin: 20px 0; }
  .dashboard .playlist-item { padding: 12px; }
  .dashboard .playlist-item label { margin: 0; }
  .dashboard .device-list { margin-top: 24px; }
  .dashboard .pairing-section > .subsection-title h3 { font-size: 16px; }
  .dashboard .champion-settings, .dashboard .round-editor, .dashboard .import-review,
  .dashboard .import-strip { border-color: #443638; background: #191717; box-shadow: none; }
  .dashboard .champion-settings { padding: 14px; }
  .dashboard .champion-photo-navigation { flex-wrap: wrap; gap: 8px; }
  .dashboard .import-count-field, .dashboard .import-preview { background: #171717; border-color: #443638; }
  .dashboard .import-preview-points { color: #ffb8bf; }
  .dashboard .entry-table input { padding-inline: 5px; }
  .dashboard .entry-table button { padding-inline: 7px; }
  .dashboard .mobile-editor-back { display: inline-flex; align-items: center; margin-bottom: 18px; padding: 0 12px; color: #e0c9cc; }
  .dashboard #board-editor > .subsection-title { display: none; }
  .dashboard .editor-actions { position: sticky; bottom: calc(72px + env(safe-area-inset-bottom)); z-index: 10; margin: 20px -4px 0; padding: 10px 4px; border-top: 1px solid var(--divider); background: #101010; }
  .dashboard .editor-actions > button { flex: 1 1 0; padding: 8px 4px; font-size: 12px; }
  .mobile-workspace-nav {
    position: fixed; z-index: 30; inset: auto 0 0;
    display: flex; gap: 4px;
    padding: 7px max(12px, env(safe-area-inset-right)) calc(7px + env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));
    border-top: 1px solid #403737; background: #111;
  }
  .dashboard .mobile-workspace-nav button {
    position: relative; flex: 1; min-width: 0; min-height: 48px;
    padding: 10px 3px; border: 0; border-radius: 8px;
    background: transparent; color: #aaa6a6; font-size: 14px; font-weight: 500;
  }
  .dashboard .mobile-workspace-nav button[aria-current="page"] { background: #321a1e; color: #ffb8bf; }
  .dashboard #mobile-nav-members { padding-block: 7px; line-height: 1.2; }
  .dashboard #mobile-nav-members small { display: block; font-size: 10px; line-height: 1.3; }
  .mobile-workspace-nav button[aria-current="page"]::before { content: ""; position: absolute; top: 0; left: calc(50% - 10px); width: 20px; height: 2px; background: #ef5261; }
}

/* Keep account actions consistent with the clock settings header. */
.member-ranking-notice { margin: 16px 0; padding: 14px; border-left: 3px solid #df1728; background: #23191b; color: #d6c5c7; font-size: 13px; line-height: 1.6; }
.member-ranking-notice p { margin: 0 0 10px; }
.member-ranking-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px; }
.dashboard .member-ranking-toggle { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; margin: 0; white-space: nowrap; cursor: pointer; }
.dashboard .member-ranking-toggle input[type="checkbox"] { flex: 0 0 auto; width: 20px; height: 20px; min-height: 20px; margin: 0; padding: 0; accent-color: #df1728; cursor: pointer; }
.board-sort-controls { margin-bottom: 18px; }
.dashboard .account-strip { min-width: 0; gap: 12px; flex-wrap: nowrap; color: #aaa6a6; font-size: 12px; }
.dashboard .account-strip .quiet-button {
  display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; gap: 7px;
  min-height: 36px; margin: 0; padding: 7px 11px; border: 1px solid transparent; border-radius: 6px;
  background: transparent; color: #bfb8b8; font-size: 12px; font-weight: 500; line-height: 1.4;
  text-align: center; text-decoration: none; white-space: nowrap;
  transition: background 180ms ease, border-color 180ms ease, color 180ms ease;
}
.dashboard .account-strip .quiet-button:hover { border-color: transparent; background: #272323; color: #fff; }
.dashboard .account-strip .quiet-button:active { background: #383030; transform: none; }
.dashboard .account-strip .quiet-button svg { flex: 0 0 auto; }
.dashboard .account-strip .account-expiry-label { order: 0; width: auto; gap: 4px; font-weight: 400; white-space: nowrap; }
.dashboard .account-download-version { color: #aaa6a6; font-variant-numeric: tabular-nums; }
@media (max-width: 720px) {
  .dashboard .account-strip { display: flex; grid-column: 2; grid-row: 1; width: auto; flex-direction: column-reverse; align-items: flex-end; gap: 0; }
  .dashboard .account-strip .quiet-button { min-height: 44px; padding-inline: 6px; }
  .dashboard .account-strip .account-expiry-label { padding-right: 7px; font-size: 11px; }
  .dashboard #open-member-management { display: none; }
}
@media (max-width: 700px) and (orientation: portrait) {
  .dashboard #ranking-download-apk { display: none; }
}

/* Each workspace module owns the content area; navigation remains visible. */
.dashboard.workspace-layout { width: auto; max-width: none; margin: 0 0 0 208px; padding: 0 36px 48px; }
.workspace-sidebar { position: fixed; inset: 0 auto 0 0; z-index: 25; width: 208px; display: flex; flex-direction: column; gap: 40px; padding: 30px 16px 24px; border-right: 1px solid #292626; background: #0b0b0b; }
.workspace-layout .workspace-sidebar .workspace-brand { gap: 12px; padding: 0 10px; align-items: flex-start; }
.workspace-layout .workspace-sidebar .workspace-brand-copy { display: block; }
.workspace-layout .workspace-sidebar .workspace-brand h1 { font-size: 32px; }
.workspace-layout .workspace-sidebar .workspace-brand p { margin-top: 9px; font-size: 11px; }
.workspace-menu { display: grid; gap: 8px; }
html[data-ranking-customer-auto] .workspace-layout .workspace-menu button { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 5px; min-height: 52px; border: 1px solid transparent; border-radius: 6px; padding: 13px 14px; background: transparent; color: #b6b0b0; font-size: 15px; font-weight: 500; text-align: left; }
html[data-ranking-customer-auto] .workspace-layout .workspace-menu button:hover { background: #1c1717; color: #f4f2f2; }
html[data-ranking-customer-auto] .workspace-layout .workspace-menu button[aria-current="page"] { border-color: #4c282c; background: #301b1e; color: #ffb8bf; }
.workspace-sidebar-note { margin: auto 10px 0; color: #827b7b; font-size: 11px; line-height: 1.8; }
.workspace-current-title { color: #aaa6a6; font-size: 13px; }
.workspace-layout .command-header { min-height: 76px; }
.workspace-content { max-width: 1480px; margin: 36px auto 0; min-width: 0; }
.workspace-layout[data-mobile-page="members"] .workspace-content { max-width: none; }
.workspace-layout .mobile-workspace-heading { display: block; padding: 0 0 26px; }
.workspace-layout .mobile-workspace-heading h2 { font-size: 28px; letter-spacing: 0; }
.workspace-layout .mobile-workspace-heading p { margin: 10px 0 0; color: var(--text-secondary); font-size: 13px; line-height: 1.7; }
.workspace-layout .workbench { display: block; min-height: 0; border: 0; overflow: visible; background: transparent; }
.workspace-layout .editor-bay, .workspace-layout .tv-bay { display: contents; }
.workspace-layout .editor-heading, .workspace-layout .tv-bay > .section-heading, .workspace-layout .editor-empty { display: none; }
.workspace-layout .board-bay, .workspace-layout .profile-section, .workspace-layout .board-editor, .workspace-layout .broadcast-section { margin: 0; padding: 26px; border: 1px solid var(--divider); border-radius: 8px; background: var(--broadcast-navy); }
.workspace-layout .section-heading > div { padding-left: 0; }
.workspace-layout .board-header-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 12px; }
.workspace-layout .board-header-actions button { min-height: 44px; white-space: nowrap; }
.workspace-subpage-actions { display: flex; justify-content: flex-end; margin-bottom: 18px; }
.workspace-layout #mobile-pane-playlist > .subsection-title { flex-wrap: wrap; gap: 12px; }
.workspace-layout #new-board { width: auto; min-width: 160px; }
.workspace-layout .board-list { margin-top: 24px; gap: 0; }
.workspace-layout .board-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 28px; align-items: center; border: 0; border-top: 1px solid var(--divider); border-radius: 0; padding: 22px 0; }
.workspace-layout .board-item h3 { font-size: 17px; margin: 0; }
.workspace-layout .board-item .board-meta { grid-column: 1; font-size: 12px; }
.workspace-layout .board-item .compact-actions { grid-column: 2; grid-row: 1 / span 3; margin: 0; justify-content: flex-end; align-items: center; }
.workspace-layout .board-member-visibility { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; margin: 0 8px 0 0; color: var(--text-secondary); font-size: 12px; white-space: nowrap; cursor: pointer; }
.workspace-layout .board-member-visibility input { width: 18px; height: 18px; min-height: 18px; margin: 0; padding: 0; accent-color: #df1728; }
.workspace-layout .compact-actions button { font-size: 12px; padding-inline: 12px; }
.workspace-layout .mobile-editor-back { display: inline-flex; margin-bottom: 22px; }
.workspace-layout #mobile-pane-brand { max-width: 1020px; }
.workspace-layout #mobile-pane-playlist, .workspace-layout #mobile-pane-tv { max-width: 1120px; }
.workspace-layout .device-list { grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); gap: 16px; }
.workspace-layout .member-management { padding: 0; border: 0; background: transparent; }
.workspace-layout .member-management h2 { font-size: 28px; }
.workspace-layout .member-management .member-heading { margin-bottom: 26px; }
@media (min-width: 721px) and (max-width: 1100px) {
  .dashboard.workspace-layout { margin-left: 184px; padding-inline: 22px; }
  .workspace-sidebar { width: 184px; padding-inline: 12px; }
  .workspace-layout .account-strip { flex-wrap: wrap; justify-content: flex-end; gap: 4px 8px; }
  .workspace-layout .command-header { flex-direction: row; align-items: center; }
  .workspace-layout .board-item { display: block; }
  .workspace-layout .board-item .board-meta { margin-top: 8px; }
  .workspace-layout .board-item .compact-actions { margin-top: 14px; justify-content: flex-start; }
}
@media (max-width: 720px) {
  .dashboard.workspace-layout { margin-left: 0; padding: 0 max(16px, env(safe-area-inset-right)) calc(100px + env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left)); }
  .workspace-sidebar { display: none; }
  .workspace-layout .command-header { min-height: 0; }
  .workspace-current-title { color: #f4f2f2; font-size: 16px; font-weight: 650; }
  .workspace-content { margin-top: 20px; }
  .workspace-layout .mobile-workspace-heading h2, .workspace-layout .member-management h2 { font-size: 25px; }
  .workspace-layout .board-bay, .workspace-layout .profile-section, .workspace-layout .board-editor, .workspace-layout .broadcast-section { padding: 0; border: 0; background: transparent; }
  .workspace-layout .board-item { display: block; padding: 20px 0; }
  .workspace-layout .board-item .board-meta { margin-top: 8px; }
  .workspace-layout .board-item .compact-actions { margin-top: 14px; justify-content: flex-start; }
  .workspace-layout .device-list { grid-template-columns: minmax(0, 1fr); }
}

.workspace-layout #new-preset-board{margin-right:10px;min-height:46px}
.workspace-layout #new-board{background:transparent;border:1px solid var(--divider);color:var(--text-primary)}
#preset-ranking-panel{margin-top:24px;padding-top:22px;border-top:1px solid var(--divider)}
#preset-ranking-panel[hidden]{display:none}
#preset-ranking-panel:not([hidden])~#board-list{display:none}
.preset-heading,.preset-actions,.preset-search{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.preset-heading{justify-content:space-between;margin-bottom:18px}.preset-heading h3{font-size:21px;margin:0}
.preset-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-bottom:20px;max-width:900px}
.preset-wide{grid-column:1/-1}
.preset-field{display:grid;gap:8px;min-width:0}.preset-field>span{font-size:13px;color:var(--text-secondary)}
.preset-field input,.preset-field select{width:100%;min-height:44px;box-sizing:border-box}
.preset-dates[hidden],.preset-selection[hidden]{display:none}
.preset-columns{display:flex;align-items:center;flex-wrap:wrap;gap:18px;border:1px solid var(--divider);border-radius:6px;padding:16px;margin:0 0 14px}
.preset-columns legend{font-size:13px;padding:0 6px}.preset-check{display:flex;align-items:center;gap:7px;font-size:14px;cursor:pointer}
.preset-check input{width:18px;height:18px;min-height:0;accent-color:#d52d28;margin:0}
.preset-note,.preset-required{font-size:12px;color:var(--text-secondary);line-height:1.7}.preset-note{margin:10px 0 20px}
.preset-selection{border-top:1px solid var(--divider);padding:18px 0}.preset-search{align-items:flex-end}.preset-search .preset-field{flex:1;max-width:420px}
.preset-members{max-width:100%;overflow:auto;margin:20px 0}
.preset-members .member-table{width:max-content;min-width:100%;border-collapse:collapse;font-size:12px;text-align:left}
.preset-members .member-table :is(th,td){padding:9px 10px;border-bottom:1px solid var(--divider);white-space:nowrap;vertical-align:middle;line-height:1.5}
.preset-members .member-table th{font-weight:500;color:var(--text-secondary);background:#201b1c}
.preset-members .member-table td{color:var(--text-primary)}
.preset-members .member-table tbody tr:nth-child(even){background:#1b1718}
.preset-members input[type=checkbox]{width:18px;height:18px;min-height:0;accent-color:#d52d28;margin:0;cursor:pointer}
.preset-members .preset-check{font-size:12px;white-space:nowrap}
.preset-actions{margin:16px 0}.preset-result{max-width:100%;overflow:auto;margin-top:20px}.preset-result td,.preset-result th{white-space:nowrap}
.preset-result .member-table{width:100%;border-collapse:collapse;font-size:13px;text-align:left}
.preset-result :is(th,td){padding:12px 14px;border-bottom:1px solid var(--divider);line-height:1.5}
.preset-result th{font-weight:500;color:var(--text-secondary);background:#201b1c}.preset-result td{color:var(--text-primary)}
.preset-result tbody tr:nth-child(even){background:#1b1718}
@media(max-width:600px){.preset-grid{grid-template-columns:1fr;gap:14px}.preset-columns{gap:14px}.workspace-layout #new-preset-board,.workspace-layout #new-board{min-width:0;padding:12px;margin-bottom:10px}.preset-heading h3{font-size:18px}}

.rank-page-title{font-size:25px;font-weight:700;color:#f4eeee}
.rank-tabs{display:flex;gap:8px;margin:24px 0 8px;border-bottom:1px solid #392b2e;padding-bottom:12px}
.rank-tabs button{padding:10px 20px;min-height:44px}
.rank-tabs button[aria-current=page]{color:#ffd4d8;background:#411d24;border-color:#8b3e4b}
#rank-management-root .rank-section{margin-top:14px;padding:24px;border:1px solid #392b2e;border-radius:10px;background:#151213}
#rank-management-root .rank-section-heading{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
#rank-management-root .rank-section-heading h3{margin-right:auto}
#rank-management-root .rank-page-title{margin-right:auto}
#rank-management-root .rank-feature-toggle{cursor:pointer;white-space:nowrap}
#rank-management-root .rank-plan-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin-bottom:24px}
#rank-management-root .rank-plan-card{display:grid;grid-template-columns:1fr auto;align-items:center;gap:12px;text-align:left;padding:18px;border:1px solid #443236;background:#1b1718;border-radius:8px;min-width:0}
#rank-management-root .rank-plan-card strong{font-size:15px;overflow-wrap:anywhere}
#rank-management-root .rank-plan-card[aria-pressed=true]{background:#301c22;border-color:#b45268;box-shadow:inset 0 0 0 1px #b45268}
#rank-management-root .rank-plan-state{color:#e6bd79;font-size:12px;white-space:nowrap}
#rank-management-root .rank-plan-editor-heading{border-top:1px solid #392b2e;padding-top:16px}
#rank-management-root .rank-plan-name{width:min(100%,420px);margin-bottom:18px}
#rank-management-root .rank-field>span{display:block;font-size:12px;color:#b7aaae;margin:0 0 7px}
#rank-management-root .member-table .rank-field>span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
#rank-management-root .member-table input[type=text]{min-width:145px;width:100%;max-width:220px}
#rank-management-root .member-table input[type=number]{width:90px}
#rank-management-root .member-table td{padding:12px 10px}
#rank-management-root .member-table .rank-field{display:block;margin:0;padding:0}
#rank-management-root .member-table td:first-child{min-width:46px}
#rank-management-root .rank-section-heading .rank-field{display:flex;align-items:center;gap:12px;margin:0}
#rank-management-root .rank-section-heading .rank-field>span{margin:0}
#rank-management-root .rank-tabs button[aria-current=page]{background:#411d24;color:#ffd4d8;border-color:#8b3e4b}
#rank-management-root .member-table th{white-space:nowrap}
#rank-management-root .rank-field input[type=checkbox]{width:20px;height:20px;accent-color:#bb4e62}
#rank-management-root .rank-row-controls{display:flex;gap:5px;min-width:170px}
#rank-management-root .rank-row-controls button{min-width:48px;padding:7px}
#rank-management-root .rank-note{line-height:1.8;color:#ac9da2;font-size:13px;margin:10px 0 20px}
#rank-management-root .rank-sample{display:flex;align-items:center;gap:24px;padding:20px;margin:24px 0;background:#25191d;border-left:3px solid #b45268;border-radius:5px}
.rank-sample strong{color:#e6bd79;font-size:18px}
#rank-management-root details{margin:20px 0;line-height:1.7}
#rank-management-root summary{cursor:pointer;color:#d9bdc5;padding:8px 0}
#rank-management-root .button-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:16px 0}
#member-management-root #members-table .member-table{width:max-content;min-width:100%;font-size:12px}
#member-management-root #members-table .member-table :is(th,td){min-width:0;max-width:none;padding:10px 12px;white-space:nowrap;overflow-wrap:normal;vertical-align:middle}
#member-management-root #members-table .member-row-actions{flex-wrap:nowrap;gap:4px}
#member-management-root #members-table .member-row-actions button{min-height:32px;padding:5px 8px}
#member-management-root #members-table .member-select-all{gap:5px}
.member-current-rank{display:block;color:#e6bd79;font-size:12px}
.member-rank-value{position:relative}
.member-rank-controls{display:flex;align-items:center;gap:4px}
#member-management-root .member-rank-controls input{width:76px;min-width:76px;min-height:32px;padding:5px 6px;font-size:12px}
#member-management-root .member-rank-controls button{min-height:32px;padding:5px 7px;font-size:12px;white-space:nowrap}
.member-rank-error{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.member-rank-import .rank-field,.member-rank-history .rank-field{display:grid;gap:8px;margin:18px 0;max-width:480px}
.member-rank-import .rank-field>span,.member-rank-history .rank-field>span{font-size:13px;color:#b7aaae}
@media(max-width:720px){#rank-management-root .rank-section{padding:14px}.rank-sample{flex-direction:column;align-items:flex-start!important}.rank-tabs button{padding:10px 12px}}