/* Native Prospector BP Tier List. */

.pph-bp-tier-list {
	--pbt-gold:var(--pph-gold,#ffd400);
	--pbt-panel:#071019;
	--pbt-panel-2:#0a1620;
	--pbt-line:rgba(134,166,198,.2);
	--pbt-muted:#91a3b2;
	--pph-ui-accent:var(--pbt-gold);
	--pph-ui-line:var(--pbt-line);
	--pph-ui-muted:var(--pbt-muted);
	--pbt-control:40px;
	container-type:inline-size;
}

.pph-bp-tier-list .pph-bp-tier-center { container:pbt-center / inline-size; }
.pph-bp-tier-list .pbtl-data { display:none!important; }

.pph-bp-tool { overflow:hidden; border:1px solid var(--pbt-line); border-radius:8px; background:rgba(7,15,23,.96); }
.pph-bp-heading { padding:14px 16px 15px; border-bottom:1px solid rgba(255,215,0,.18); background:linear-gradient(145deg,rgba(255,215,0,.035),transparent 42%); }
.pph-bp-heading > div { gap:10px; }
.pph-bp-heading h1 { font-family:var(--pph-font-display); font-size:clamp(24px,4cqw,32px); font-weight:900; letter-spacing:0; }
.pph-bp-heading i { background:linear-gradient(90deg,rgba(255,215,0,.42),transparent); }

.pph-bp-controls { display:grid; gap:11px; padding:13px 14px 14px; border-bottom:1px solid var(--pbt-line); background:rgba(5,12,18,.64); }
.pph-bp-controls--mobile { display:none; }
.pph-bp-mode-row { display:flex; align-items:center; justify-content:space-between; gap:13px; }
.pph-bp-mode-row p { margin:0; color:var(--pbt-muted); font-size:9px; font-weight:700; line-height:1.4; text-align:right; }
.pph-bp-my-heroes { display:inline-flex; min-height:var(--pbt-control); align-items:center; gap:7px; padding:7px 12px; border:1px solid rgba(255,215,0,.38); border-radius:5px; background:linear-gradient(180deg,rgba(255,215,0,.12),rgba(255,215,0,.035)); color:#f4df73; font-size:10px; font-weight:900; cursor:pointer; }
.pph-bp-my-heroes .dashicons { width:17px; height:17px; font-size:17px; }
.pph-bp-my-heroes small { padding-left:7px; border-left:1px solid rgba(255,215,0,.22); color:#b6c4ce; font-size:8px; font-weight:800; }
.pph-bp-my-heroes:hover,.pph-bp-my-heroes:focus-visible,.pph-bp-my-heroes.is-active { border-color:var(--pbt-gold); color:#111; background:linear-gradient(180deg,#ffe45a,#efc413); box-shadow:0 0 0 2px rgba(255,215,0,.1); }
.pph-bp-my-heroes.is-active small { border-color:rgba(0,0,0,.2); color:#3b3210; }

.pph-bp-search-row { display:flex; align-items:stretch; gap:8px; }
.pph-bp-search-row label { position:relative; flex:1 1 auto; min-width:0; }
.pph-bp-search-row input,.pph-bp-search-row button,.pph-bp-awakening-mobile select { box-sizing:border-box; height:var(--pbt-control); min-height:var(--pbt-control); margin:0; border:1px solid rgba(134,166,198,.26); border-radius:5px; background:#0a1520; color:#e5edf2; box-shadow:none; }
.pph-bp-search-row input { width:100%; padding:7px 10px; font-size:10px; }
.pph-bp-search-row button { flex:0 0 auto; padding:7px 13px; font-size:9px; font-weight:900; cursor:pointer; }
.pph-bp-search-row input:focus,.pph-bp-search-row button:focus-visible,.pph-bp-awakening-mobile select:focus { border-color:rgba(255,215,0,.62); outline:0; box-shadow:0 0 0 2px rgba(255,215,0,.09); }

.pph-bp-filter-strip { display:flex; align-items:center; justify-content:center; gap:7px; flex-wrap:wrap; min-height:38px; }
.pph-bp-filter-group { display:grid; gap:4px; }
.pph-bp-filter-group > span { color:var(--pbt-gold); font-size:8px; font-weight:900; letter-spacing:.09em; text-transform:uppercase; }
.pph-bp-filter-icon { display:grid; width:37px; height:37px; margin:0; padding:2px; place-items:center; overflow:hidden; border:1px solid transparent; border-radius:7px; background:transparent; color:#cbd6dd; cursor:pointer; }
.pph-bp-filter-icon img { display:block; width:100%; height:100%; object-fit:contain; }
.pph-bp-filter-icon > span { font-size:7px; line-height:1.1; text-align:center; }
.pph-bp-filter-icon:hover,.pph-bp-filter-icon:focus-visible { border-color:rgba(255,255,255,.35); background:rgba(255,255,255,.025); }
.pph-bp-filter-icon.is-active { border-color:var(--pbt-gold); background:rgba(255,215,0,.07); box-shadow:0 0 8px rgba(255,215,0,.24); }
.pph-bp-filter-icon--lord img { padding:2px; }

.pph-bp-awakening-mobile { display:none; }
.pph-bp-table { position:relative; padding:13px 12px 18px; }
.pph-bp-awakening-header,.pph-bp-row { display:grid; grid-template-columns:106px repeat(6,minmax(0,1fr)); gap:7px; align-items:stretch; }
.pph-bp-awakening-header { margin-bottom:8px; }
.pph-bp-awakening-header > span { display:grid; min-width:0; place-items:center; color:var(--pbt-gold); font-size:9px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.pph-bp-awakening-header button { min-width:0; min-height:38px; margin:0; padding:6px 3px; border:1px solid rgba(134,166,198,.2); border-radius:6px; background:linear-gradient(180deg,#10202c,#0a1620); color:#cbd7df; font-size:10px; font-weight:900; cursor:pointer; }
.pph-bp-awakening-header button:hover,.pph-bp-awakening-header button:focus-visible { border-color:rgba(255,215,0,.58); color:#fff; }
.pph-bp-awakening-header button.is-active { border-color:var(--pbt-gold); background:linear-gradient(180deg,#ffe45a,#efc413); color:#111; box-shadow:0 0 8px rgba(255,215,0,.18); }
[data-pbtl-root].is-roster-mode .pph-bp-awakening-header button { border-style:dashed; color:#9aaab6; background:#09131c; }

.pph-bp-results { display:grid; gap:7px; transition:opacity .12s ease; }
.pph-bp-row { min-width:0; }
.pph-bp-hero-card { position:relative; display:block; width:106px; height:106px; overflow:hidden; border:1px solid rgba(255,215,0,.6); border-radius:7px; background-color:#111a22; background-image:var(--pph-bp-rarity),radial-gradient(circle at top,rgba(255,215,0,.1),transparent 58%); background-position:center; background-size:cover; color:#fff; text-decoration:none; }
.pph-bp-hero-card:hover,.pph-bp-hero-card:focus-visible { border-color:var(--pbt-gold); box-shadow:0 0 10px rgba(255,215,0,.3); }
.pph-bp-portrait { display:block; width:100%; height:100%; object-fit:cover; object-position:center top; }
.pph-bp-hero-card strong { position:absolute; right:0; bottom:0; left:0; overflow:hidden; padding:17px 5px 5px; background:linear-gradient(transparent,rgba(0,0,0,.92)); color:#fff; font-size:9px; font-weight:900; line-height:1.1; text-align:center; text-overflow:ellipsis; white-space:nowrap; }
.pph-bp-rank { position:absolute; top:0; left:0; z-index:2; padding:3px 5px; border-radius:0 0 4px 0; background:#f6f8f9; color:#111; font-size:8px; font-weight:900; line-height:1; }
.pph-bp-values { display:contents; }
.pph-bp-value { display:flex; min-width:0; min-height:106px; flex-direction:column; align-items:center; justify-content:center; gap:5px; padding:5px 2px; border:1px solid rgba(134,166,198,.22); border-radius:7px; background:linear-gradient(180deg,rgba(18,34,46,.96),rgba(9,20,29,.96)); }
.pph-bp-value span { display:none; color:var(--pbt-gold); font-size:8px; font-weight:900; }
.pph-bp-value b { min-width:0; color:#f2f5f7; font-size:clamp(12px,1.32cqw,16px); font-weight:900; line-height:1; white-space:nowrap; }
.pph-bp-value.is-saved-awakening { border-color:var(--pbt-gold); background:linear-gradient(180deg,rgba(255,215,0,.11),rgba(9,20,29,.98)); box-shadow:0 0 8px rgba(255,215,0,.22),inset 0 0 0 1px rgba(255,215,0,.16); }

.pph-bp-empty { padding:34px 18px; }
.pph-bp-empty .dashicons { width:28px; height:28px; font-size:28px; }
.pph-bp-empty strong { font-size:14px; }
.pph-bp-load-more { display:flex; justify-content:center; padding-top:14px; }
.pph-bp-load-more button { min-height:38px; padding:8px 16px; border:1px solid rgba(255,215,0,.42); border-radius:5px; background:rgba(255,215,0,.07); color:#f4df73; font-size:9px; font-weight:900; letter-spacing:.05em; text-transform:uppercase; cursor:pointer; }
.pph-bp-loading { position:absolute; inset:13px 12px 18px; z-index:4; display:grid; align-content:start; justify-content:center; padding-top:54px; background:rgba(4,10,15,.48); }
.pph-bp-loading[hidden] { display:none; }
.pph-bp-loading > span { width:22px; height:22px; margin:0 auto 8px; border:2px solid rgba(255,255,255,.2); border-top-color:var(--pbt-gold); border-radius:50%; animation:pph-bp-spin .65s linear infinite; }
.pph-bp-loading b { padding:7px 10px; border:1px solid rgba(255,215,0,.22); border-radius:99px; background:rgba(7,15,23,.92); color:#e4edf2; font-size:9px; }
[data-pbtl-root].is-ranking .pph-bp-results { opacity:.3; }
@keyframes pph-bp-spin { to { transform:rotate(360deg); } }

@media (min-width:1101px) {
	.pph-bp-tier-list .pph-sticky-stack { top:82px; }
	.pph-bp-filter-widget { overflow:hidden; }
	.pph-bp-filter-widget > .pph-card-kicker { margin:0; border-bottom:1px solid var(--pbt-line); border-radius:8px 8px 0 0; background:#08121b; }
	.pph-bp-filter-widget .pph-bp-controls { gap:10px; padding:11px; border-bottom:0; background:transparent; }
	.pph-bp-filter-widget .pph-bp-mode-row { align-items:stretch; flex-direction:column; gap:6px; }
	.pph-bp-filter-widget .pph-bp-mode-row p { min-height:25px; font-size:8px; text-align:left; }
	.pph-bp-filter-widget .pph-bp-my-heroes { justify-content:center; width:100%; padding-right:7px; padding-left:7px; }
	.pph-bp-filter-widget .pph-bp-search-row { flex-direction:column; gap:6px; }
	.pph-bp-filter-widget .pph-bp-search-row button { width:100%; }
	.pph-bp-filter-widget .pph-bp-filter-strip { justify-content:flex-start; gap:5px; }
	.pph-bp-filter-widget .pph-bp-filter-icon { width:34px; height:34px; }
}

@media (max-width:1100px) {
	.pph-bp-filter-widget { display:none!important; }
	.pph-bp-controls--mobile { display:grid; }
}

@container pbt-center (max-width:720px) {
	.pph-bp-awakening-header,.pph-bp-row { grid-template-columns:96px repeat(6,minmax(0,1fr)); gap:5px; }
	.pph-bp-hero-card { width:96px; height:96px; }
	.pph-bp-value { min-height:96px; }
	.pph-bp-value b { font-size:12px; }
}

@media (max-width:760px) {
	body.pph-bp-tier-list-active .site-main,body.pph-bp-tier-list-active .entry-content { padding-right:0!important; padding-left:0!important; }
	.pph-bp-tier-list.pph-home.pph-blocksy-container-width { width:100vw!important; max-width:none!important; margin-right:calc(50% - 50vw)!important; margin-left:calc(50% - 50vw)!important; }
	/* The shared homepage CSS deliberately zeroes .pph-home .pph-center with
	 * !important for the activity feed. Beat that two-class rule here so this
	 * tool keeps a real viewport gutter instead of relying on table padding. */
	.pph-bp-tier-list.pph-home .pph-grid > .pph-bp-tier-center { box-sizing:border-box; padding-right:5px!important; padding-bottom:10px!important; padding-left:5px!important; }
	.pph-bp-tool { margin-right:0; margin-left:0; box-shadow:none; }
	.pph-bp-tool { border-radius:0 0 7px 7px; }
	.pph-bp-heading { padding:12px; }
	.pph-bp-controls { gap:9px; padding:10px 9px 11px; }
	.pph-bp-mode-row { align-items:stretch; flex-direction:column; gap:6px; }
	.pph-bp-mode-row p { min-height:13px; font-size:8px; text-align:left; }
	.pph-bp-my-heroes { justify-content:center; width:100%; }
	.pph-bp-search-row input { font-size:11px; }
	.pph-bp-filter-strip { gap:6px; }
	.pph-bp-filter-icon { width:35px; height:35px; }
	.pph-bp-awakening-mobile { display:grid; gap:5px; }
	.pph-bp-awakening-mobile label { color:var(--pbt-gold); font-size:8px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
	.pph-bp-awakening-mobile select { width:100%; padding:7px 28px 7px 10px; font-size:10px; font-weight:800; color-scheme:dark; }
	.pph-bp-awakening-header { display:none; }
	.pph-bp-table { padding:8px 7px 14px; }
	.pph-bp-results { gap:7px; }
	.pph-bp-row { display:flex; gap:7px; align-items:stretch; }
	.pph-bp-hero-card { flex:0 0 96px; width:96px; height:112px; }
	.pph-bp-values { display:grid; flex:1 1 auto; min-width:0; grid-template-columns:repeat(3,minmax(0,1fr)); grid-template-rows:repeat(2,minmax(0,1fr)); gap:5px; }
	.pph-bp-value { min-width:0; min-height:0; gap:3px; padding:3px 1px; }
	.pph-bp-value span { display:block; font-size:7px; }
	.pph-bp-value b { font-size:clamp(11px,3.15vw,15px); }
	.pph-bp-loading { inset:8px 7px 14px; }
}

@media (max-width:370px) {
	.pph-bp-table { padding-right:5px; padding-left:5px; }
	.pph-bp-row { gap:5px; }
	.pph-bp-hero-card { flex-basis:86px; width:86px; height:108px; }
	.pph-bp-values { gap:4px; }
	.pph-bp-value b { font-size:10px; letter-spacing:-.025em; }
	.pph-bp-hero-card strong { font-size:8px; }
	.pph-bp-filter-icon { width:33px; height:33px; }
}

@media (prefers-reduced-motion:reduce) {
	.pph-bp-tier-list *,.pph-bp-tier-list *::before,.pph-bp-tier-list *::after { scroll-behavior:auto!important; transition-duration:.01ms!important; animation-duration:.01ms!important; animation-iteration-count:1!important; }
}
