.hof-page { max-width: 1320px; }
.hof-header { display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;margin-bottom:1.2rem; }
.hof-header h1 { font-family:var(--font-display);font-size:clamp(2rem,5vw,3.6rem);color:var(--text-gold);margin:.2rem 0; }
.hof-header p { color:var(--text-secondary);margin:0; }
.hof-kicker,.hof-title span,.hof-champion>div>span,.hof-group>div>span { color:#d9a92e;font-size:.7rem;font-weight:800;letter-spacing:.18em; }
.hof-preview-note { margin-bottom:1.5rem; }
.hof-champion { display:grid;grid-template-columns:minmax(220px,390px) 1fr;align-items:center;gap:clamp(1rem,4vw,3rem);padding:clamp(1rem,3vw,2rem);margin-bottom:2rem;border:1px solid rgba(245,200,66,.45);border-radius:24px;background:radial-gradient(circle at 18% 45%,rgba(230,168,23,.18),transparent 35%),linear-gradient(135deg,#11192e,#080e1e);box-shadow:0 18px 50px rgba(0,0,0,.35);overflow:hidden; }
.hof-champion>img { width:100%;max-height:360px;object-fit:contain;filter:drop-shadow(0 0 22px rgba(245,200,66,.32)); }
.hof-champion h2 { font-family:var(--font-display);color:#fff;font-size:clamp(1.7rem,4vw,3rem);margin:.35rem 0; }
.hof-champion p { color:var(--text-secondary); }
.hof-stats { display:flex;gap:.7rem;flex-wrap:wrap;margin-top:1rem; }
.hof-stats b { min-width:105px;padding:.65rem .85rem;border:1px solid rgba(255,255,255,.08);border-radius:12px;background:rgba(255,255,255,.035);color:var(--text-gold);text-align:center; }
.hof-stats small { display:block;margin-top:.2rem;color:var(--text-secondary);font-size:.65rem;font-weight:500; }
.hof-section { margin:2.2rem 0; }
.hof-title { display:flex;justify-content:space-between;align-items:end;gap:1rem;margin-bottom:1rem; }
.hof-title h2 { font-family:var(--font-display);margin:.2rem 0 0;color:#eef2ff;font-size:1.25rem; }
.hof-title>small { color:var(--text-muted); }
.hof-grid { display:grid;gap:.85rem; }
.hof-ranking-grid { grid-template-columns:repeat(auto-fit,minmax(225px,1fr)); }
.hof-deity-grid { grid-template-columns:repeat(4,1fr); }
.hof-card { height:100%;display:flex;align-items:center;gap:.8rem;padding:.75rem;border:1px solid rgba(255,255,255,.08);border-radius:16px;background:linear-gradient(145deg,rgba(22,31,54,.96),rgba(9,15,31,.96));transition:.2s ease; }
.hof-card:hover { transform:translateY(-3px);border-color:var(--hof-deity,rgba(230,168,23,.45));box-shadow:0 12px 24px rgba(0,0,0,.25); }
.hof-card img { width:82px;height:82px;flex:0 0 82px;object-fit:cover;border-radius:15px; }
.hof-card-copy { min-width:0; }
.hof-card-copy>span { display:block;color:var(--text-secondary);font-size:.65rem;text-transform:uppercase;letter-spacing:.08em; }
.hof-card-copy strong { display:block;color:#fff;font-family:var(--font-display);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:.2rem 0; }
.hof-card-copy small { color:var(--text-muted);font-size:.68rem; }
.hof-group { display:grid;grid-template-columns:180px 1fr;gap:1.4rem;align-items:center;padding:1rem 1.4rem;border:1px solid rgba(194,46,46,.38);border-radius:20px;background:linear-gradient(120deg,rgba(78,14,22,.2),rgba(12,18,35,.98)); }
.hof-group>img { width:100%;max-height:180px;object-fit:contain;border-radius:18px; }
.hof-group h3 { font-family:var(--font-display);font-size:1.5rem;color:#fff;margin:.3rem 0; }
.hof-group p { color:var(--text-secondary);font-style:italic; }
.hof-locked { display:flex;flex-direction:column;align-items:center;gap:.45rem;text-align:center;padding:2.5rem;border:1px dashed rgba(255,255,255,.13);border-radius:18px;color:var(--text-secondary); }
.hof-locked:first-letter { font-size:1.5rem; }
.hof-badge-trigger { display:inline-flex;align-items:center;gap:.25rem;margin-left:.4rem;padding:.23rem .48rem;border:1px solid rgba(230,168,23,.42);border-radius:999px;background:rgba(230,168,23,.09);color:#f1ca58;font-size:.68rem;font-weight:800;line-height:1;vertical-align:middle;cursor:pointer;transition:.18s ease; }
.hof-badge-trigger:hover,.hof-badge-trigger:focus-visible { transform:translateY(-1px);border-color:#f1ca58;background:rgba(230,168,23,.18);box-shadow:0 0 12px rgba(230,168,23,.22); }
.hof-badge-trigger-compact { width:23px;height:23px;justify-content:center;padding:0;font-size:.72rem; }
.hof-badge-gallery { display:flex;gap:.65rem;flex-wrap:wrap;align-items:center; }
.hof-profile-badge { width:94px;padding:.4rem;border:1px solid rgba(230,168,23,.2);border-radius:13px;background:rgba(255,255,255,.025);text-align:center;cursor:pointer;transition:.18s ease; }
.hof-profile-badge:hover { transform:translateY(-2px);border-color:rgba(230,168,23,.55); }
.hof-profile-badge img { width:76px;height:76px;object-fit:contain;border-radius:10px;display:block;margin:auto;box-shadow:0 0 12px rgba(230,168,23,.18); }
.hof-profile-badge small { display:block;color:var(--text-secondary);font-size:.61rem;line-height:1.2;margin-top:.3rem; }
.hof-badge-viewer { position:fixed;inset:0;z-index:10050;display:flex;align-items:center;justify-content:center;padding:1rem;background:rgba(2,5,14,.88);backdrop-filter:blur(9px);animation:hofViewerIn .18s ease-out; }
.hof-badge-viewer-panel { position:relative;width:min(920px,96vw);max-height:92vh;overflow:auto;padding:1.4rem;border:1px solid rgba(230,168,23,.5);border-radius:24px;background:radial-gradient(circle at 50% 0,rgba(230,168,23,.14),transparent 38%),linear-gradient(145deg,#121b31,#070c19);box-shadow:0 24px 80px rgba(0,0,0,.7),0 0 35px rgba(230,168,23,.12);text-align:center; }
.hof-badge-viewer-close { position:absolute;top:.65rem;right:.75rem;width:38px;height:38px;border:1px solid rgba(255,255,255,.15);border-radius:50%;background:rgba(0,0,0,.28);color:#fff;font-size:1.6rem;line-height:1;cursor:pointer; }
.hof-badge-viewer-kicker { color:#d9a92e;font-size:.68rem;font-weight:900;letter-spacing:.2em; }
.hof-badge-viewer-panel h2 { margin:.35rem 2rem 1rem;color:#fff;font-family:var(--font-display);font-size:clamp(1.25rem,4vw,2rem); }
.hof-badge-viewer-grid { display:flex;justify-content:center;align-items:flex-start;gap:1.25rem;flex-wrap:wrap; }
.hof-badge-viewer-item { width:min(165px,46vw);margin:0;padding:.55rem;border:1px solid rgba(255,255,255,.09);border-radius:16px;background:rgba(255,255,255,.035); }
.hof-badge-viewer-item img { display:block;width:100%;aspect-ratio:1;object-fit:contain;border-radius:15px;filter:drop-shadow(0 0 16px rgba(230,168,23,.25)); }
.hof-badge-viewer-item figcaption { margin-top:.65rem;color:#f4d46f;font-family:var(--font-display);font-size:.9rem; }
@keyframes hofViewerIn { from { opacity:0 } to { opacity:1 } }
@media(max-width:900px){.hof-deity-grid{grid-template-columns:repeat(2,1fr)}.hof-champion{grid-template-columns:240px 1fr}}
@media(max-width:650px){.hof-header{align-items:flex-start;flex-direction:column}.hof-champion{grid-template-columns:1fr;text-align:center}.hof-champion>img{max-height:260px}.hof-stats{justify-content:center}.hof-deity-grid{grid-template-columns:1fr}.hof-group{grid-template-columns:110px 1fr;padding:.8rem}.hof-card img{width:72px;height:72px;flex-basis:72px}.hof-profile-badge{width:82px;padding:.32rem}.hof-profile-badge img{width:66px;height:66px}.hof-badge-viewer-panel{padding:1rem .65rem}.hof-badge-viewer-item{width:min(138px,42vw)}.hof-badge-viewer-grid{gap:.65rem}}