/* Aether Story tool pages (2026-10-26 redesign): leaderboards, character search, character and dungeon pages, skill trees.
   Restyles the old markup with the shared tokens; the pages keep their own data queries and scripts.
   Every rule is scoped to .at-page / .at-hero so the inline <style> blocks in the pages lose on specificity. */
.at-hero .pxg-eyebrow a{color:var(--pxg-accent);text-decoration:none}
.at-hero .pxg-eyebrow a:hover{text-decoration:underline}
.at-hero .pxg-h1{font-family:var(--pxg-display);font-weight:400;color:var(--pxg-text)}
.at-hero{padding:72px 0 80px;background:linear-gradient(90deg,rgba(11,16,24,.82) 0%,rgba(11,16,24,.45) 45%,rgba(11,16,24,.1) 100%),linear-gradient(180deg,rgba(11,16,24,0) 60%,var(--pxg-bg) 100%),url('../images/alpha2.png') center 30%/cover no-repeat;background-color:var(--pxg-bg);image-rendering:pixelated}
/* The old leaderboard header's pixel camp scene, back as the hero [H 2026-10-26: "Put back the leader board hero bg"]. */
.at-hero .pxg-h1{text-shadow:0 3px 14px rgba(0,0,0,.75)}
@media (max-width:767px){.at-hero{padding:32px 0 36px}}

.at-page,.at-page.callout{height:auto;min-height:200px}
.at-page{font-family:var(--pxg-body);color:var(--pxg-text);padding-bottom:56px}
.at-page .container{padding-top:8px}
.at-page h1,.at-page h2,.at-page h3,.at-page h4{font-family:var(--pxg-display);font-weight:400;color:var(--pxg-text)}
.at-page a{color:var(--pxg-brand-text)}
.at-page a:hover{color:var(--pxg-accent)}
.at-page .breadcrumb{background:none;padding:12px 0;margin:0 0 8px;font-family:var(--pxg-label);letter-spacing:.06em}
.at-page .breadcrumb>.active{color:var(--pxg-text-3)}
.at-page .breadcrumb>li+li:before{color:var(--pxg-text-3)}

/* Panels: the old gradient box becomes a .pxg-panel look */
.at-page .profile,.at-page #lb-tabs .ui-tabs-panel{border-radius:var(--pxg-radius);border:1px solid var(--pxg-border);background:linear-gradient(180deg,rgba(26,36,51,.92) 0%,rgba(18,26,38,.78) 45%,rgba(11,16,24,.55) 100%);box-shadow:0 18px 40px -24px rgba(0,0,0,.9),inset 0 1px 0 rgba(128,166,214,.12);color:var(--pxg-text)}
.at-page .profile{padding:16px 28px 28px!important;margin:8px 0!important}
.at-page .profile h1{font-size:clamp(28px,5vw,44px)!important;color:var(--pxg-text)}
.at-page .profile h4{color:var(--pxg-brand-text);font-size:20px;margin:32px 16px 16px}
.at-page .profile h4 i{color:var(--pxg-text-2)}
.at-page #lb-tabs .ui-tabs-panel{padding:24px 16px;color:var(--pxg-text)}
.at-page #lb-tabs h3{color:var(--pxg-text)!important;font-size:22px;margin:8px 0 12px}

/* Tab bar */
.at-page #lb-tabs{font-family:var(--pxg-label);padding:0}
.at-page #lb-tabs .ui-tabs-nav{margin:0 0 -1px;padding:0;flex-wrap:wrap;gap:6px}
@media (min-width:1200px){.at-page #lb-tabs .ui-tabs-nav.visible-lg{display:flex!important}}
.at-page #lb-tabs .ui-tabs-nav:before,.at-page #lb-tabs .ui-tabs-nav:after{display:none}
.at-page #lb-tabs .ui-tabs-nav li{float:none;margin:0;border:0;background:none;list-style:none}
.at-page #lb-tabs .ui-state-default{background:rgba(18,26,38,.7);border:1px solid var(--pxg-border);border-bottom:0;border-radius:var(--pxg-radius) var(--pxg-radius) 0 0}
.at-page #lb-tabs .ui-state-default a{display:block;padding:12px 26px;color:var(--pxg-text-2);font-family:var(--pxg-label);font-size:18px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;text-decoration:none}
.at-page #lb-tabs .ui-state-default a:hover{color:var(--pxg-accent)}
.at-page #lb-tabs .ui-state-active{background:rgba(26,36,51,.95);border-color:var(--pxg-border-strong);border-bottom:0}
.at-page #lb-tabs .ui-state-active a{padding:12px 26px;color:var(--pxg-accent);cursor:default!important}
.at-page #lb-tabs .ui-tabs-nav li:has(>a.hidden){display:none}

/* Mobile dropdown replacing the tab bar */
.at-page .btn-group .btn-default{background:var(--pxg-surface-2);border:1px solid var(--pxg-border-strong);color:var(--pxg-text);font-family:var(--pxg-label);font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.at-page .dropdown-menu{background:var(--pxg-surface-2);border:1px solid var(--pxg-border-strong)}
.at-page .dropdown-menu>li>a{color:var(--pxg-text)}
.at-page .dropdown-menu>li>a:hover{background:rgba(128,166,214,.14);color:var(--pxg-accent)}

/* Tables */
.at-page .leaderboard{display:table;border:0;margin:12px auto 48px;padding:0;width:100%;background:rgba(7,10,16,.55);border-radius:8px;font-family:var(--pxg-body)!important}
.at-page .leaderboard thead th{font-family:var(--pxg-label);font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:var(--pxg-text-3);border-bottom:1px solid var(--pxg-border)}
.at-page .leaderboard th,.at-page .leaderboard td{padding:8px 16px;text-align:right;border-top:0}
.at-page .leaderboard th:nth-child(2),.at-page .leaderboard td:nth-child(2){text-align:left}
.at-page .leaderboard tr{background:rgba(128,166,214,.06);color:var(--pxg-text)!important}
.at-page .leaderboard tr:nth-child(even){background:rgba(128,166,214,.02);color:var(--pxg-text)!important}
.at-page .leaderboard thead tr{background:none!important}
.at-page .leaderboard td a{color:var(--pxg-brand-text);text-decoration:none}
.at-page .leaderboard td a:hover{color:var(--pxg-accent);text-decoration:underline}
.at-page .pos1 a,.at-page .pos2 a,.at-page .pos3 a{color:var(--pxg-accent)!important}
.at-page .pos1{font-size:18px}
.at-page .pos2{font-size:17px}
.at-page .pos2 a{opacity:.85}
.at-page .pos3 a{opacity:.7}
.at-page .dungeons li{color:var(--pxg-text)}
.at-page .dungeons li a{color:var(--pxg-brand-text)}
.at-page .dungeons li a:hover{color:var(--pxg-accent)}
.at-page .stat-table{background:rgba(7,10,16,.55)}
.at-page .stat-table tbody tr:nth-child(odd){background:rgba(128,166,214,.07)}
.at-page .stat-table tbody tr:nth-child(even){background:rgba(128,166,214,.03)}
.at-page .table>thead>tr>th,.at-page .table>tbody>tr>td{border-color:var(--pxg-border)}

/* Character and dungeon stat boxes */
.at-page .stat-box{border-radius:var(--pxg-radius);border:1px solid var(--pxg-border);background:linear-gradient(180deg,#16202f 0%,#121a26 60%,#0f1620 100%);box-shadow:inset 0 1px 0 rgba(128,166,214,.10)}
.at-page .stat-box h2{font-family:var(--pxg-display);color:var(--pxg-accent)}
.at-page .stat-box-rank,.at-page .stat-box-rank:visited{color:var(--pxg-text-2);font-family:var(--pxg-label);letter-spacing:.06em}
.at-page .stat-box-rank:hover,.at-page .stat-box-rank:active{color:var(--pxg-accent)!important}
.at-page .stat-box-rank i{color:var(--pxg-text-3)}
.at-page .lb-header{background:rgba(0,0,0,.25);font-family:var(--pxg-label);letter-spacing:.14em}
.at-page .lb-boss-title{color:var(--pxg-brand-text);font-family:var(--pxg-display)}
.at-page .lb-timed-rows tr:nth-child(odd) td{color:var(--pxg-text-2)!important}
.at-page .lb-timed-rows tr:nth-child(even) td{color:var(--pxg-text)!important}
.at-page .dungeon-hm-selector a{color:var(--pxg-brand-text);font-size:16px}
.at-page .dungeon-hm-selector a:hover{color:var(--pxg-accent);font-size:16px}
.at-page .dungeon-hm-selector a.selected{color:var(--pxg-accent)!important}

/* Search forms: white field (global rule), steel-blue button */
.at-page .form-control{background-color:#fff;color:#1a2230;border:1px solid #9fb0c4;border-radius:6px 0 0 6px;height:44px}
.at-page .form-control:focus{border-color:var(--pxg-brand-text);box-shadow:0 0 0 3px rgba(128,214,255,.25)}
.at-page .btn-primary{background:var(--pxg-brand);border:1px solid var(--pxg-brand);color:#fff;height:44px;padding:0 20px;border-radius:0 6px 6px 0;font-weight:700}
.at-page .btn-primary:hover,.at-page .btn-primary:focus{background:var(--pxg-brand-hover);border-color:var(--pxg-brand-hover)}

@media (max-width:767px){
  .at-page .profile{padding:8px 14px 20px!important}
  .at-page #lb-tabs .ui-tabs-panel{padding:16px 6px}
  .at-page .leaderboard th,.at-page .leaderboard td{padding:8px 10px}
  .at-page form[style*="float: right"]{float:none!important;margin:0 0 16px!important}
}

/* Skill trees chrome: a back link and the class/element switcher in the site's colours (the tree itself is game UI, left as is) */
.at-skillnav .at-back{margin:14px 0 0;font-family:var(--pxg-label);font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-size:14px}
.at-skillnav .at-back a{color:var(--pxg-accent);text-decoration:none}
.at-skillnav .at-back a:hover{text-decoration:underline}
.at-skillnav .skillTreeNav a{background:var(--pxg-surface-2);border:1px solid var(--pxg-border);color:var(--pxg-brand-text);font-family:var(--pxg-label);font-weight:700;letter-spacing:.08em;text-transform:uppercase;border-radius:999px}
.at-skillnav .skillTreeNav a:hover{background:rgba(128,166,214,.2);color:var(--pxg-accent)}
.at-skillnav .skillTreeNav a.active{background:var(--pxg-accent)!important;border-color:var(--pxg-accent);color:#0b1018!important}
/* Phone: the search form spans the width with the field and button joined (the inline 150px width left a gap). */
@media (max-width:767px){.at-page form[action="search.php"]{float:none!important;margin:16px 0!important}.at-page form[action="search.php"] .form-control{width:100%!important}}
