/* Alastera account/ranking workspace. Loaded only on these routes.
   Controllers, field names, CSRF and submission behavior are unchanged. */
.workspace-page .hero { min-height: 224px; }
.workspace-page .hero-inner { padding: 24px 20px 42px; }
.workspace-page .hero h1 { font-size: 46px; }
.workspace-page .hero-emblem .site-icon { width: 38px; height: 38px; }
.workspace-page .hero-copy { margin: 8px 0 0; font-size: 13px; }
.workspace-page .hero-actions, .workspace-page .hero-note { display: none; }
.workspace-page .content-grid { grid-template-columns: 190px minmax(0, 1fr) 220px; }
.workspace-page .content-heading { padding: 20px 24px 16px; }
.workspace-page .content-body { padding: 20px 24px 26px; min-height: 0; }
.workspace-page .content-body h2 { font: 400 21px/1.35 Georgia, serif; color: var(--gold-light); margin: 22px 0 12px; }
.workspace-page .content-body :is(input,select,textarea) { max-width: 100%; min-width: 0; }
.workspace-page .content-body :is(button,input[type=submit],input[type=button]) { min-height: 38px; padding: 7px 13px; font-size: 12px; white-space: normal; }
.workspace-page .visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

/* One toolbar, followed by one full-width ranking. */
.highscores-toolbar { display: flex; align-items: end; flex-wrap: wrap; gap: 14px; margin-bottom: 18px; }
.highscores-filter { flex: 0 1 200px; min-width: 150px; }
.highscores-filter label { display: block; color: var(--muted); font-size: 12px; margin-bottom: 5px; }
.highscores-filter select { display: block; width: 100%; min-height: 40px; margin: 0; }
.highscores-world { margin: 0 0 3px auto !important; text-align: right; color: var(--gold-light); font: 16px/1.45 Georgia, serif; }
.highscores-world span { display: block; color: var(--muted); font: 12px/1.6 Arial, sans-serif; }
.highscores-table-scroll { max-width: 100%; overflow-x: auto; }
.content-body .highscores-table { width: 100%; border-collapse: collapse; table-layout: auto; margin: 0; }
.content-body .highscores-table :is(td,th) { padding: 10px 12px; border: 0; border-bottom: 1px solid #8b9dac26; text-align: left; vertical-align: middle; }
.content-body .highscores-table thead { background: #26323b; color: #e8d5a6; font-size: 12px; }
.content-body .highscores-table tbody tr { background: #171f25; }
.content-body .highscores-table tbody tr:nth-child(even) { background: #1c262e; }
.content-body .highscores-table tbody tr:hover { background: #293640; }
.content-body .highscores-table .rank-number { width: 60px; color: var(--gold); font-variant-numeric: tabular-nums; }
.content-body .highscores-table .rank-country { width: 30px; padding-right: 0; }
.content-body .highscores-table .rank-outfit { width: 62px; }
.content-body .highscores-table .rank-outfit > img { position: static !important; display: block; width: 64px !important; height: 64px !important; max-width: none !important; margin: 0 !important; object-fit: contain; image-rendering: pixelated; }
.content-body .highscores-table .rank-value { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.rank-character a { font-weight: 700; color: #e0d5b6; overflow-wrap: anywhere; }
.rank-character small { display: block; color: #b2bec9; line-height: 1.4; }
.player-presence { display: inline-block; width: 6px; height: 6px; margin: 0 0 2px 5px; border-radius: 50%; background: #788795; }
.player-presence.is-online { background: #8fc89a; }
.content-body .highscores-table .highscores-empty { padding: 30px 12px; text-align: center; color: var(--muted); }
.highscores-pagination { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; padding-top: 14px; font-size: 12px; }

/* Navigation is shared by overview and every logged-in account subpage. */
.account-navigation { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 0 17px; margin-bottom: 19px; border-bottom: 1px solid #8294a440; }
.account-navigation a { display: inline-flex; align-items: center; min-height: 38px; padding: 7px 12px; background: #1a242c; border: 1px solid #65778880; color: #d6dde3; font-size: 12px; line-height: 1.35; }
.account-navigation a:hover { background: #293640; color: #fff0c9; text-decoration: none; }
.account-navigation a[aria-current=page] { background: #35312a; border-color: #b4985d; color: #f3dfad; }
.account-content, #account-manage.account-overview { min-width: 0; max-width: 100%; margin: 0; padding: 0; }
.account-content { color: #d6dde3; font-size: 13px; }
.account-overview > p { color: #b2bec9; margin: 0 0 16px; }
.account-overview > br { display: none; }
.account-content table { width: 100% !important; max-width: 100%; border-collapse: collapse; table-layout: auto; margin: 0; }
.account-content :is(td,th) { padding: 9px 12px; vertical-align: top; border: 0; border-bottom: 1px solid #8b9dac26; }
.account-content table tr { background: #171f25 !important; }
.account-content table tr:nth-child(even) { background: #1c262e !important; }
.account-content th, .account-content .LabelH { background: #26323b !important; color: #e8d5a6; text-align: left; font-size: 12px; }
.account-content table :is(td,th) { background-color: transparent !important; }
.account-content .account-facts td:first-child, .account-content .LabelV { width: 165px !important; min-width: 165px; color: #b2bec9; font-weight: 400; }
.account-content .account-facts td:last-child { overflow-wrap: anywhere; }
.account-content .account-facts form { display: inline-block; margin: 5px 0 0 12px; vertical-align: middle; }
.account-content .account-badge { display: inline-block; padding: 2px 9px; border: 1px solid #7c8fa06b; background: #26323b; border-radius: 3px; color: #d6dde3; line-height: 1.6; }
.account-content .account-badge :is(b,span) { color: inherit !important; font-weight: 400; }
.account-content .account-badge a { color: var(--gold-light); }
.account-content .account-online { color: #9acd9e; }
.account-content .account-offline { color: #b2bec9; }
.account-count { font: 12px Arial, sans-serif; padding: 3px 7px; margin-left: 5px; color: #d6dde3; border: 1px solid #71859580; vertical-align: middle; }
.account-table-scroll { max-width: 100%; overflow: auto; }
.account-content .account-characters { min-width: 660px; }
.account-content .account-characters :is(td,th) { padding: 9px 8px; font-size: 12px; }
.account-content .account-characters td:first-child { min-width: 125px; }
.account-content .account-characters td:nth-child(5) { min-width: 112px; }
.account-activity { margin-top: 20px; padding-block: 10px; border-block: 1px solid #8294a440; }
.account-activity summary { cursor: pointer; color: #d0c198; font-size: 13px; }
.account-activity .account-table-scroll { margin-top: 10px; max-height: 240px; }
.account-content .account-log-table { min-width: 400px; font-size: 12px; }
.account-content .account-actions { margin-top: 12px; }
.account-content .account-actions :is(tbody,tr) { display: flex; flex-wrap: wrap; gap: 6px; background: transparent !important; }
.account-content .account-actions td { padding: 0; border: 0; }
.account-content .account-actions form { margin: 0; }
.account-content > form { margin-top: 12px; }

/* Stock subpage tables keep every original form/id/input and hook. Remove
   legacy decorative frames and give label/value pairs usable proportions. */
.account-content .TableContainer { margin: 14px 0 0; }
.account-content :is(.TableContentAndRightShadow,.TableContentContainer,.InnerTableContainer,.TableContainer,.CaptionContainer,.CaptionInnerContainer) { background: none !important; width: 100% !important; margin: 0; padding: 0; }
.account-content [class^=CaptionEdge], .account-content [class^=CaptionBorder], .account-content [class^=CaptionVertical], .account-content [class^=TableShadow] { display: none; }
.account-content .CaptionContainer .Text { padding: 10px 12px; color: var(--gold-light); background: #26323b; font: 18px/1.4 Georgia, serif; }
.account-content td:has(>table), .account-content td:has(>.InnerTableContainer), .account-content td:has(>.TableContentAndRightShadow), .account-content td:has(>.TableContentContainer) { padding: 0; border: 0; }
.account-content td:has(>input), .account-content td:has(>select), .account-content td:has(>textarea) { width: auto !important; }
.account-content input:not([type=submit]):not([type=button]):not([type=radio]):not([type=checkbox]), .account-content textarea { width: min(100%, 360px); }
.account-content textarea { min-height: 100px; }
.account-content :is(input[type=radio],input[type=checkbox]) { width: auto; }
.account-content form { max-width: 100%; }
.account-content .TableContainer + br { display: none; }

@media (max-width: 1000px) {
  .workspace-page .content-grid { grid-template-columns: minmax(0, 1fr) 220px; }
  .workspace-page .left-column { display: none; }
}
@media (max-width: 700px) {
  .workspace-page .hero { min-height: 164px; }
  .workspace-page .hero-inner { padding: 20px 14px 28px; }
  .workspace-page .hero h1 { font-size: 34px; }
  .workspace-page .hero-eyebrow, .workspace-page .hero-emblem { display: none; }
  .workspace-page .hero-copy { font-size: 12px; max-width: 260px; }
  .workspace-page .content-heading { padding: 17px 15px 13px; }
  .workspace-page .content-body { padding: 16px 15px 20px; }
  .highscores-toolbar { gap: 10px; margin-bottom: 13px; }
  .highscores-filter { flex: 1 1 120px; min-width: 0; }
  .highscores-world { flex: 1 0 100%; text-align: left; font-size: 14px; }
  .highscores-world span { display: inline; margin-left: 7px; }
  .content-body .highscores-table :is(td,th) { padding: 9px 7px; font-size: 12px; }
  .content-body .highscores-table .rank-number { width: 38px; }
  .content-body .highscores-table .rank-outfit { width: 45px; }
  .account-navigation { gap: 5px; }
  .account-navigation a { flex: 1 1 calc(50% - 5px); padding: 8px 9px; font-size: 12px; }
  .account-content .account-facts :is(tbody,tr,td) { display: block; width: 100% !important; min-width: 0; }
  .account-content .account-facts td:first-child { width: 100% !important; min-width: 0; padding: 8px 10px 0; border: 0; font-size: 11px; }
  .account-content .account-facts td:last-child { padding: 2px 10px 9px; }
  .account-content .account-facts form { display: block; margin: 7px 0 0; }
  .account-content tr:has(>.LabelV) { display: block; }
  .account-content tr:has(>.LabelV)>td { display: block; width: 100% !important; min-width: 0; padding: 5px 10px; }
  .account-content tr:has(>.LabelV)>td:first-child { padding-top: 10px; border: 0; }
  .account-content tr:has(>.LabelV)>td:last-child { padding-bottom: 10px; }
}

/* Chilled graphite for account/ranking only. Gold and online indicators retained. */
.workspace-page {
  --text: #d6dde3;
  --muted: #b2bec9;
  --line: #455361;
  --line-soft: #34424e;
}
.workspace-page .panel { border-color: #45515c; background: linear-gradient(135deg, #1c252ded, #141c23ec); }
.workspace-page .panel-heading { border-bottom-color: #45515c; background: linear-gradient(180deg, #2c394588, #24303a4d); }
.workspace-page .content-heading { border-bottom-color: #8192a13b; }
.workspace-page .begin-panel { background: linear-gradient(140deg, #28343eea, #18222aed); }
.workspace-page .menu-panel nav > a { color: #d6dde3; border-bottom-color: #adbcca12; }
.workspace-page .menu-panel nav > a:last-child { border-bottom-color: transparent; }
.workspace-page .menu-panel nav > a:hover { color: #f7e8bf; }
.workspace-page .menu-panel nav > a[aria-current] { color: #eed9a9; }
.workspace-page .menu-chevron { color: #9cabb9; }
.workspace-page .menu-panel nav > a[aria-current] .menu-chevron { color: #ddbc74; }
.workspace-page :is(.begin-panel p, .begin-download, .status-detail, .ranking-level, .save-countdown small) { color: #b2bec9; }
.workspace-page :is(.status-number, .save-label) { color: #c4cdd5; }
.workspace-page .status-number strong { color: #edf1f4; }
.workspace-page .ranking-name { color: #d6dde3; }
.workspace-page :is(.save-countdown, .status-link, .ranking-list li) { border-color: #8192a140; }
.workspace-page .status-link span { color: #b2bec9; }
.workspace-page .content-body input:not([type='checkbox']):not([type='radio']):not([type='submit']):not([type='button']),
.workspace-page .content-body select,
.workspace-page .content-body textarea { background: #111b23; border-color: #617485; color: #d6dde3; }
.workspace-page .content-body :is(input, select, textarea):focus { border-color: var(--gold-light); }
.workspace-page .content-body fieldset { border-color: #455361; }
.workspace-page .mobile-menu nav { background: #1a242c; border-color: #617485; }
.workspace-page .mobile-menu nav a { color: #d6dde3; border-bottom-color: #8b9dac26; }
.workspace-page .mobile-menu nav a:last-child { border-bottom-color: transparent; }
.workspace-page .mobile-menu nav a[aria-current] { color: #f0d8a0; }
