/* Internal page composition; controls and navigation live in theme.css. */
.app-page { min-height: 100svh; display: flex; flex-direction: column; }
.app-page .app-shell { flex: 1; min-height: calc(100svh - var(--header-height) - 105px); width: 100%; padding: 32px max(var(--page-gutter),calc((100% - var(--content-width)) / 2)) 64px; }
.app-page .battle-shell { background: none; }
.app-page .battle-profile, .app-page .community-hub { width: 100%; max-width: var(--content-width); }
.app-page :is(.battle-grid,.community-results,.ranking-frame,.admin-grid,.result-grid) > * { min-width: 0; }
.app-page h1, .app-page h2, .app-page h3, .app-page p, .app-page dd, .app-page code { overflow-wrap: anywhere; }
.app-page h1 { font-size: clamp(2rem,3.2vw,3.6rem); line-height: 1.08; letter-spacing: -.04em; text-transform: none; }
.app-page .eyebrow { margin: 0 0 14px; font-size: .68rem; font-weight: 800; letter-spacing: .18em; color: var(--green); }
.app-page :is(.page-hero,.battle-identity) { position: relative; min-height: 250px; margin: 0 0 24px; padding: clamp(28px,3.5vw,52px); border: 1px solid var(--line); border-radius: var(--radius-lg); background: linear-gradient(90deg,rgba(3,9,18,.97),rgba(3,9,18,.79) 55%,rgba(3,9,18,.28)),url('/assets/profile-community-favela.webp') 65% 48% / cover; }
.app-page .page-hero { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; }
.app-page .page-hero h1 { max-width: 950px; margin: 0 0 14px; }
.app-page .page-hero p:last-child { margin: 0; max-width: 650px; color: var(--text-secondary); font-size: .97rem; line-height: 1.7; }
.app-page .page-hero .breadcrumb { color: var(--text-muted); font-size: .75rem; margin-bottom: 22px; }
.app-page .breadcrumb a:hover { color: var(--green); }
.app-page .battle-identity { display: grid; grid-template-columns: 116px minmax(0,1fr); align-items: center; gap: 28px; }
.app-page .battle-avatar { width: 116px; height: 116px; border: 1px solid rgba(0,230,118,.4); border-radius: var(--radius-md); background: var(--bg-primary); box-shadow: var(--shadow-card); }
.app-page .battle-player h1 { margin: 0 0 12px; line-height: 1.12; text-shadow: none; }
.app-page .battle-player p { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: .8rem; color: var(--text-secondary); font-weight: 400; }
.app-page .battle-player .eyebrow { color: var(--green); font-weight: 800; margin-bottom: 10px; }
.app-page .battle-player .button { margin-top: 16px; min-height: 40px; padding: 9px 15px; width: fit-content; }
.app-page .battle-tabs { display: flex; flex-wrap: wrap; gap: 5px; padding: 7px; margin: 0 0 24px; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--bg-secondary); }
.app-page .battle-tabs a { flex: 1 1 130px; min-height: 44px; padding: 10px 12px; border: 0; border-radius: var(--radius-sm); font-size: .72rem; color: var(--text-secondary); transform: none; }
.app-page .battle-tabs a::after { height: 2px; background: var(--green); }
.app-page .battle-tabs a:is(.is-active,:hover) { color: var(--green); background: rgba(0,230,118,.06); transform: none; }
.app-page :is(.battle-panel,.auth-card) { border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--bg-secondary); box-shadow: var(--shadow-card); }
.app-page .battle-panel { position: relative; min-height: 0; overflow: visible; padding: clamp(20px,2vw,28px); transition: border-color 180ms; }
.app-page .battle-panel h2 { position: static; display: block; min-height: 0; padding: 0; margin: 0 0 22px; border: 0; background: none; color: var(--ink); font-size: 1.02rem; font-weight: 800; line-height: 1.4; letter-spacing: -.015em; text-transform: none; }
.app-page .battle-grid { display: grid; grid-template-columns: repeat(12,minmax(0,1fr)); gap: 20px; border: 0; background: none; box-shadow: none; }
.app-page .stats-page > .battle-panel { grid-column: span 6; }
.app-page .stats-page > .stats-main, .app-page .stats-page > .audit-card, .app-page .stats-page > .ban-history-panel { grid-column: 1 / -1; }
.app-page .overview-grid > .battle-panel { grid-column: span 6; }
.app-page .overview-grid > .skill-panel, .app-page .overview-grid > .audit-card { grid-column: 1 / -1; }
.app-page .card-page > .battle-panel { grid-column: span 4; }
.app-page .card-page > .empty-panel { grid-column: 1 / -1; }
.app-page .stat-strip { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 10px; border: 0; margin: 16px 0 0; }
.app-page .stat-strip div, .app-page .stat-strip div:nth-child(3n) { min-height: 92px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 8px; padding: 16px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--bg-elevated); }
.app-page .stat-strip span { color: var(--text-muted); font-size: .66rem; font-weight: 700; }
.app-page .stat-strip strong { font-size: clamp(1rem,1.5vw,1.65rem); line-height: 1.3; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; max-width: 100%; }
.app-page .stat-strip div:first-child strong { color: var(--green); }
.app-page .xp-progress-card { padding: 18px; margin-bottom: 20px; border: 1px solid rgba(0,230,118,.18); border-radius: var(--radius-sm); background: rgba(0,230,118,.025); }
.app-page .xp-progress-head { flex-wrap: wrap; gap: 8px; font-size: .75rem; }
.app-page .xp-progress-head strong { color: var(--text-secondary); }
.app-page .xp-segmented-wrapper { grid-template-columns: auto minmax(0,1fr) auto; }
.app-page .xp-segmented-bar { min-width: 0; }
.app-page .xp-segment { box-shadow: none; }
.app-page .player-facts { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }
.app-page .player-facts div { display: grid; grid-template-columns: 1fr; align-content: start; gap: 7px; border: 0; padding: 0; }
.app-page .battle-list dd { color: var(--text-primary); font-weight: 500; }
.app-page .audit-list { margin: 0; padding: 0; }
.app-page .audit-list li { min-width: 0; padding: 15px 0; gap: 14px; border-bottom: 1px solid var(--line); background: transparent; font-size: .83rem; }
.app-page .audit-list li:nth-child(even) { background: rgba(255,255,255,.014); }
.app-page .audit-list li:last-child { border-bottom: 0; }
.app-page .audit-list :is(strong,time) { font-size: .76rem; font-weight: 500; color: var(--text-secondary); font-variant-numeric: tabular-nums; }
.app-page .audit-list span { overflow-wrap: anywhere; }
.app-page .ban-card { border-radius: var(--radius-sm); box-shadow: none; background: var(--bg-elevated); }
.app-page .ban-empty-card { background: rgba(0,230,118,.035); border-color: rgba(0,230,118,.18); border-radius: var(--radius-sm); min-height: 115px; }
.app-page .ban-empty-card svg { color: var(--green); }
.app-page .empty-panel { min-height: 220px; }
.empty-state { display: grid; justify-items: start; align-content: center; gap: 12px; min-height: 160px; padding: 22px; border: 1px dashed var(--line); border-radius: var(--radius-sm); background: rgba(255,255,255,.015); }
.empty-state > svg { color: var(--text-muted); width: 28px; height: 28px; }
.empty-state strong { font-size: .95rem; font-weight: 700; }
.empty-state p { margin: 0; color: var(--text-secondary); line-height: 1.7; font-size: .85rem; max-width: 540px; }
.empty-state .button { margin-top: 4px; }
.app-page .empty-copy { font-size: .9rem; line-height: 1.7; }
.app-page .empty-copy + :is(.button,.auth-form,.empty-copy) { margin-top: 18px; }
.app-page .community-search-top { width: 100%; gap: 20px; margin-bottom: 24px; }
.app-page .community-search { align-items: end; gap: 12px; margin: 0; padding: 20px; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--bg-secondary); }
.app-page .community-search label { display: grid; gap: 9px; color: var(--text-secondary); font-size: .75rem; font-weight: 700; }
.app-page .ranking-frame { width: 100%; grid-template-columns: minmax(0,1fr) 320px; gap: 20px; align-items: start; margin-bottom: 24px; }
.app-page .ranking-card { min-height: 0; }
.app-page .ranking-table { display: grid; gap: 4px; }
.app-page .ranking-table-head, .app-page .ranking-table-row { display: grid; grid-template-columns: 32px 44px minmax(100px,1.6fr) repeat(6,minmax(43px,.65fr)); gap: 9px; align-items: center; }
.app-page .ranking-table-head { padding: 10px 12px; min-height: 40px; font-size: .61rem; border-radius: var(--radius-sm); background: var(--bg-elevated); }
.app-page .ranking-table-row { padding: 12px; border: 1px solid transparent; border-bottom-color: var(--line); border-radius: var(--radius-sm); background: transparent; font-size: .75rem; font-variant-numeric: tabular-nums; transform: none; }
.app-page .ranking-table-row:nth-child(odd) { background: rgba(255,255,255,.018); }
.app-page .ranking-table-row:hover { border-color: var(--border-hover); background: rgba(0,230,118,.04); transform: none; }
.app-page .ranking-table-row > span:nth-of-type(n+3) { grid-column: auto; }
.app-page .ranking-table-row > img { width: 38px; height: 38px; border-radius: var(--radius-sm); }
.app-page .ranking-table-row > strong { font-size: .79rem; }
.app-page .ranking-table-row:nth-child(-n+4) > span:first-child { color: var(--green); font-weight: 800; }
.app-page .clan-podium { gap: 14px; }
.app-page .clan-podium li { grid-template-columns: 26px minmax(0,1fr); gap: 12px; }
.app-page .clan-podium .rank-number { min-height: 30px; border: 0; background: transparent; font-size: 1rem; }
.app-page .clan-podium a, .app-page .result-card { display: grid; grid-template-columns: 44px minmax(0,1fr); gap: 4px 14px; padding: 14px; border-radius: var(--radius-sm); background: var(--bg-elevated); }
.app-page .clan-podium a img, .app-page .result-card img { grid-row: 1 / 3; width: 44px; height: 44px; border-radius: var(--radius-sm); }
.app-page .clan-podium a span, .app-page .result-card span { white-space: normal; overflow: visible; overflow-wrap: anywhere; font-size: .88rem; }
.app-page .clan-podium a strong, .app-page .result-card strong { grid-column: 2; white-space: normal; overflow-wrap: anywhere; font-size: .73rem; font-weight: 400; }
.app-page .clan-podium a:hover, .app-page .result-card:hover { transform: none; background: rgba(0,230,118,.04); }
.app-page .community-results { gap: 20px; margin-bottom: 24px; }
.app-page .clan-register { margin-bottom: 0; }
.app-page .clan-form { margin-top: 24px; gap: 20px; }
.app-page .clan-banner { min-height: 200px; height: 240px; margin: 0; border-radius: var(--radius-lg) var(--radius-lg) 0 0; background: linear-gradient(90deg,rgba(3,9,18,.6),transparent),url('/assets/profile-community-favela.webp') center 35% / cover; }
.app-page .clan-banner img { width: 100%; height: 100%; object-fit: cover; }
.app-page .clan-banner + .battle-identity { border-top: 0; min-height: 170px; border-radius: 0 0 var(--radius-lg) var(--radius-lg); background: var(--bg-secondary); padding-block: 28px; }
.app-page .clan-join-form { margin: 0 0 24px; }

/* Authentication keeps its uninterrupted left strip and existing providers. */
.app-page .auth-scene { padding: 0; background: linear-gradient(90deg,rgba(3,9,18,.06),rgba(3,9,18,.22)),url('/assets/login-favela-squad.webp') 75% center / cover no-repeat; }
.app-page .auth-scene .auth-shell { width: min(520px,100%); min-height: calc(100svh - var(--header-height)); display: flex; flex-direction: column; justify-content: center; align-items: stretch; padding: 44px clamp(24px,3.5vw,52px); background: var(--bg-secondary); border-right: 1px solid rgba(0,230,118,.2); }
.app-page .auth-scene .auth-card { width: 100%; min-height: 0; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; }
.app-page .auth-card h1 { font-size: clamp(2.1rem,3.4vw,3.25rem); margin: 0 0 16px; }
.app-page .auth-copy { font-size: .92rem; line-height: 1.7; }
.app-page .auth-form { gap: 18px; }
.app-page .auth-form label, .app-page .account-delete-form > label { gap: 8px; font-size: .8rem; color: var(--text-secondary); font-weight: 700; }
.app-page .field-hint { font-size: .78rem; color: var(--text-muted); line-height: 1.6; }
.app-page .auth-links { flex-wrap: wrap; gap: 12px; margin-top: 22px; font-size: .8rem; }
.app-page .auth-links a { display: inline-flex; align-items: center; min-height: 44px; padding-block: 6px; color: var(--green); }
.app-page .admin-login-box { padding-top: 26px; margin-top: 28px; border-top: 1px solid var(--line); }
.app-page .admin-login-box h2 { font-size: .85rem; color: var(--text-secondary); margin-bottom: 18px; }
.app-page .flash-list { max-width: var(--content-width); width: 100%; }
.app-page .auth-scene .flash-list { margin-bottom: 24px; }
.app-page .social-login-label { color: var(--text-muted); font-size: .72rem; }

/* Administration: compact navigation, readable data, no decorative overlays. */
.admin-page .app-shell { display: grid; grid-template-columns: 190px minmax(0,1fr); align-content: start; align-items: start; gap: 24px; }
.admin-page .admin-sidebar { position: sticky; top: calc(var(--header-height) + 24px); display: grid; gap: 5px; padding: 20px 12px; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--bg-secondary); }
.admin-sidebar .eyebrow { padding: 0 12px; margin-bottom: 14px; font-size: .6rem; }
.admin-sidebar a { display: block; min-height: 44px; padding: 12px; border-radius: var(--radius-sm); font-size: .78rem; color: var(--text-secondary); }
.admin-sidebar a:hover, .admin-sidebar a[aria-current] { color: var(--green); background: rgba(0,230,118,.06); }
.admin-page .app-shell > .flash-list { grid-column: 2; margin: 0; }
.admin-page .app-shell > :not(.admin-sidebar):not(.flash-list) { grid-column: 2; min-width: 0; }
.admin-page .page-hero { min-height: 220px; padding: 32px; background: radial-gradient(ellipse at right top,rgba(21,151,255,.12),transparent 70%),var(--bg-secondary); }
.admin-page .page-hero h1 { font-size: clamp(1.8rem,2.8vw,2.8rem); }
.admin-page .admin-stats-grid { gap: 12px; grid-template-columns: repeat(6,minmax(0,1fr)); margin-bottom: 24px; }
.app-page .admin-stat { padding: 22px 16px; min-height: 114px; }
.app-page .admin-stat strong { font-size: clamp(1.4rem,2vw,2.1rem); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.app-page .admin-stat span { font-size: .65rem; color: var(--text-secondary); }
.app-page .admin-stat:first-child strong { color: var(--green); }
.admin-page .admin-grid { display: grid; grid-template-columns: minmax(0,1fr); gap: 24px; }
.app-page .admin-filter-form { border-color: var(--line); border-radius: var(--radius-sm); background: var(--bg-elevated); padding: 18px; margin-bottom: 20px; }
.app-page .admin-filter-controls { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; align-items: end; }
.app-page .admin-filter-controls :is(label,.button) { min-width: 0; width: 100%; }
.app-page .admin-filter-controls label { font-size: .72rem; }
.app-page .admin-result-count { color: var(--text-muted); font-size: .8rem; margin-bottom: 16px; }
.app-page .admin-result-card { display: grid; grid-template-columns: 48px minmax(150px,1.2fr) minmax(125px,.9fr) minmax(100px,.7fr); gap: 18px; padding: 20px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: transparent; }
.app-page .admin-result-card:nth-child(even) { background: rgba(255,255,255,.018); }
.app-page .admin-result-card:hover { border-color: #344253; }
.app-page .admin-result-card > .admin-actions { grid-column: 2 / -1; }
.app-page .admin-clan-card > .admin-actions { grid-column: 2 / -1; }
.app-page .admin-avatar { width: 48px; height: 48px; border-radius: var(--radius-sm); }
.app-page :is(.admin-result-main,.admin-result-owner,.admin-metrics,.admin-badges) { min-width: 0; align-content: start; }
.app-page .admin-result-main strong, .app-page .admin-result-owner strong { font-size: .9rem; overflow-wrap: anywhere; }
.app-page :is(.admin-result-main,.admin-result-owner,.admin-metrics) span { font-size: .78rem; overflow-wrap: anywhere; }
.app-page .admin-result-owner code { white-space: normal; overflow-wrap: anywhere; font-size: .75rem; }
.app-page .admin-metrics { font-variant-numeric: tabular-nums; }
.app-page .admin-badges { display: flex; align-items: flex-start; }
.app-page .admin-actions { gap: 8px; flex-wrap: wrap; }
.app-page .admin-actions .button { min-height: 44px; padding: 10px 14px; font-size: .67rem; }
.app-page :is(.admin-pagination,.owner-pagination) { gap: 8px; flex-wrap: wrap; margin-top: 22px; }
.app-page :is(.admin-pagination a,.owner-pagination button,.owner-filter a) { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 10px 14px; border: 1px solid var(--line); border-radius: var(--radius-sm); font-size: .75rem; background: var(--bg-elevated); color: var(--text-secondary); }
.app-page .owner-filter { flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.app-page :is(.owner-filter a.active,.owner-pagination button.active) { color: var(--green); border-color: var(--border-hover); background: rgba(0,230,118,.05); }
.app-page :is(.owner-clan-list,.owner-candidate-list) { gap: 16px; }
.app-page :is(.owner-clan-card,.owner-candidate-card) { display: flex; align-items: center; flex-wrap: wrap; gap: 20px; }
.app-page :is(.owner-clan-card,.owner-candidate-card) > div { flex: 1 1 240px; min-width: 0; }
.app-page :is(.owner-clan-card,.owner-candidate-card) h2 { margin-bottom: 10px; }
.app-page :is(.owner-clan-card,.owner-candidate-card) p { margin: 5px 0; font-size: .84rem; color: var(--text-secondary); }
.app-page .owner-candidate-card img { flex-shrink: 0; width: 64px; height: 64px; border-radius: var(--radius-sm); }
.app-page #owner-search-results { min-height: 80px; }
.app-page #owner-search-status { margin: 18px 0; }
.app-page :is(.admin-row,.admin-member-row) { gap: 14px; padding: 16px; border: 1px solid var(--line); border-radius: var(--radius-sm); font-size: .83rem; background: var(--bg-elevated); }
.app-page .admin-row { grid-template-columns: repeat(3,minmax(0,1fr)); }
.app-page .admin-row .admin-actions { grid-column: 1 / -1; }
.app-page .admin-member-row { grid-template-columns: minmax(120px,1fr) minmax(140px,1fr) minmax(100px,1fr) auto; }
.app-page .admin-members { margin-top: 24px; }
.app-page .account-delete-panel { width: 100%; max-width: 850px; margin: 0; padding: clamp(24px,3vw,40px); }
.app-page .account-delete-panel h1 { font-size: clamp(1.8rem,3vw,2.8rem); margin: 0 0 26px; }
.app-page .account-delete-warning { color: #ffe0a1; background: rgba(255,210,31,.06); border: 1px solid rgba(255,210,31,.22); border-radius: var(--radius-sm); line-height: 1.7; font-size: .9rem; }
.app-page .account-delete-summary { border-color: var(--line); border-radius: var(--radius-sm); }
.app-page .account-delete-summary div { grid-template-columns: 150px minmax(0,1fr); }
.app-page .account-delete-form { gap: 12px; }
.app-page .confirmation-check { display: flex; align-items: center; min-height: 44px; gap: 12px; }
.admin-page .auth-shell { justify-items: start; }
.admin-page .auth-card { width: min(800px,100%); padding: 32px; }
.app-page .error-shell { display: grid; place-items: center; background: linear-gradient(90deg,rgba(3,9,18,.96),rgba(3,9,18,.7)),url('/assets/profile-community-favela.webp') center / cover; }
.error-card { width: min(680px,100%); padding: clamp(28px,5vw,64px); border: 1px solid var(--line); border-radius: var(--radius-lg); background: rgba(7,18,33,.95); }
.error-code { display: block; color: var(--green); font-size: clamp(4rem,8vw,7rem); font-weight: 900; letter-spacing: -.06em; line-height: 1; margin-bottom: 24px; }
.error-card h1 { margin: 0 0 20px; }

@media (max-width: 1440px) {
  .app-page .ranking-frame { grid-template-columns: minmax(0,1fr); }
  .app-page .clan-podium { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .admin-page .admin-stats-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 1100px) {
  .app-page .stat-strip { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .admin-page .app-shell { grid-template-columns: 1fr; gap: 20px; }
  .admin-page .admin-sidebar { position: static; display: flex; align-items: center; flex-wrap: wrap; gap: 4px; padding: 10px; }
  .admin-sidebar .eyebrow { margin: 0 10px 0 0; }
  .admin-page .app-shell > :not(.admin-sidebar), .admin-page .app-shell > .flash-list { grid-column: 1; }
}
@media (max-width: 980px) {
  .app-page .community-search-top, .app-page .community-results { grid-template-columns: minmax(0,1fr); }
  .app-page .ranking-table-head { display: none; }
  .app-page .ranking-table { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
  .app-page .ranking-table-row { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; padding: 18px; border-color: var(--line); background: var(--bg-elevated); }
  .app-page .ranking-table-row > img { grid-column: 2; }
  .app-page .ranking-table-row > strong { grid-column: 1 / -1; grid-row: 2; font-size: 1rem; }
  .app-page .ranking-table-row > span:nth-of-type(n+2) { grid-column: auto; display: grid; gap: 5px; }
  .app-page .ranking-table-row [data-label]::before { content: attr(data-label); font-size: .62rem; color: var(--text-muted); font-weight: 400; }
  .app-page .admin-filter-controls { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .app-page .admin-member-row { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .app-page .admin-result-card { grid-template-columns: 48px minmax(0,1fr) minmax(0,1fr); }
  .app-page .admin-result-card .admin-metrics { grid-column: 2 / -1; display: flex; flex-wrap: wrap; gap: 12px; }
  .app-page .card-page > .battle-panel { grid-column: span 6; }
}
@media (max-width: 760px) {
  .app-page .app-shell { padding-top: 22px; padding-bottom: 40px; }
  .app-page :is(.page-hero,.battle-identity) { min-height: 220px; padding: 26px; }
  .app-page .battle-identity { grid-template-columns: 76px minmax(0,1fr); gap: 20px; }
  .app-page .battle-avatar { width: 76px; height: 76px; }
  .app-page .battle-player h1 { font-size: 1.9rem; }
  .app-page .stat-strip { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .app-page .player-facts { grid-template-columns: 1fr; gap: 18px; }
  .app-page .xp-segmented-bar { gap: 1px; }
  .app-page .xp-segment { border: 0; height: 8px; }
  .app-page .clan-podium { grid-template-columns: 1fr; }
  .app-page .auth-scene { padding: 0; }
  .app-page .auth-scene .auth-shell { margin: 0 auto; border-inline: 1px solid var(--line); min-height: calc(100svh - var(--header-height)); padding-block: 36px; }
  .app-page .admin-filter-controls { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .app-page .stats-page > .battle-panel, .app-page .overview-grid > .battle-panel, .app-page .card-page > .battle-panel { grid-column: 1 / -1; }
  .app-page .audit-list li { align-items: flex-start; flex-direction: column; }
  .app-page .ban-card-grid { grid-template-columns: 1fr; }
  .app-page .clan-form { grid-template-columns: 1fr; }
  .app-page .clan-form label, .app-page .clan-form button { grid-column: 1; }
}
@media (max-width: 540px) {
  .app-page :is(.page-hero,.battle-identity) { padding: 24px; }
  .app-page .battle-identity { grid-template-columns: 1fr; gap: 20px; }
  .app-page .battle-player .button { width: 100%; }
  .app-page .stat-strip { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
  .app-page .stat-strip div { padding: 13px; }
  .app-page .community-search { grid-template-columns: 1fr; }
  .app-page .ranking-table { grid-template-columns: 1fr; }
  .app-page .admin-stats-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .app-page .admin-result-card { grid-template-columns: 40px minmax(0,1fr); padding: 16px; gap: 14px; }
  .app-page .admin-avatar { width: 40px; height: 40px; }
  .app-page .admin-result-card > :not(img):not(.admin-result-main) { grid-column: 1 / -1; }
  .app-page .admin-result-card .admin-metrics { grid-column: 1 / -1; }
  .app-page .admin-actions { align-items: stretch; width: 100%; }
  .app-page .admin-actions > :is(a,form) { flex: 1 1 100%; }
  .app-page .admin-filter-controls, .app-page .admin-member-row, .app-page .admin-row { grid-template-columns: minmax(0,1fr); }
  .app-page .account-delete-summary div { grid-template-columns: 1fr; gap: 6px; }
  .app-page .admin-sidebar .eyebrow { width: 100%; padding: 8px 12px; }
  .app-page .auth-scene .auth-shell { border-inline: 0; }
  .app-page .auth-card { padding: 24px; }
}
/* Profile ratios: real counts, with segment details on hover or keyboard focus. */
.app-page .stat-strip .stat-chart-card { grid-column: span 2; padding-block: 8px; }
.app-page .stat-donut { display: flex; align-items: center; gap: 12px; margin: 0; min-width: 0; }
.app-page .stat-donut-ring { width: 76px; height: 96px; flex: 0 0 76px; overflow: visible; }
.app-page .stat-donut-track, .app-page .stat-donut-arc { fill: none; stroke-width: 13; }
.app-page .stat-donut-track { stroke: #293340; }
.app-page .stat-donut-positive { stroke: var(--green); }
.app-page .stat-donut-negative { stroke: #e35b42; }
.app-page .stat-donut-segment { outline: none; cursor: default; }
.app-page .stat-donut-segment:is(:hover,:focus) .stat-donut-arc { stroke-width: 16; filter: brightness(1.15); }
.app-page .stat-donut-tooltip { opacity: 0; pointer-events: none; }
.app-page .stat-donut-segment:is(:hover,:focus) .stat-donut-tooltip { opacity: 1; }
.app-page .stat-donut-tooltip rect { fill: #05090e; stroke: #354453; }
.app-page .stat-donut-tooltip text { fill: #fff; font-size: 11px; font-weight: 700; }
.app-page .stat-donut-empty { fill: var(--text-muted); font-size: 13px; }
.app-page .stat-donut figcaption { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.app-page .stat-donut figcaption > span { color: var(--text-muted); font-size: .66rem; font-weight: 700; }
.app-page .stat-donut figcaption > strong { font-size: 1.4rem; font-variant-numeric: tabular-nums; }
.app-page .stat-donut figcaption > small { color: var(--text-muted); font-size: .7rem; overflow-wrap: anywhere; }.app-page .rival-list { list-style: none; }
.app-page .rival-list li { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 12px; }
.app-page .rival-position { color: var(--green); font-weight: 800; }
.app-page .rival-avatar { width: 42px; height: 42px; object-fit: cover; border-radius: 8px; }
.app-page .rival-name { flex: 1 1 140px; min-width: 0; overflow-wrap: anywhere; color: var(--text-primary); }
.app-page .rival-list strong { color: var(--green); white-space: nowrap; }